atom-polymer
Develop for Polymer 1.0+ faster with Atom.
Snippets
Note: The majority of the initial snippets are borrowed from Rob Dodson's excellent polymer-snippets
package and adapted for a Polymer 1.0+ world.
HTML imports
[hii] Import Iron element
<link rel="import" href="${1:bower_components}/iron-$2/iron-$2.html">
[hip] Import Paper element
<link rel="import" href="${1:bower_components}/paper-$2/paper-$2.html">
[hi] Import generic element
<link rel="import" href="${1:bower_components}/${0}/${0}.html">
New element boilerplates
[pe] Polymer element with template and style
<link rel="import" href="${1:../bower_components}/polymer/polymer.html">
<dom-module id="$2">
<template>
<style>
:host {
$5
}
</style>
$4
</template>
<span>
Polymer({
is: '$2',
$3
});
</span>
</dom-module>
[pen] Polymer element without template
<link rel="import" href="${1:../bower_components}/polymer/polymer.html">
<span>
Polymer({
is: '$2',
$3
});
</span>
[pes] Polymer element with an external script source
<link rel="import" href="${1:../bower_components}/polymer/polymer.html">
<dom-module id="$2">
<template>
<style>
:host {
$5
}
</style>
$4
</template>
<span src="$3">
</span>
</dom-module>
[pet] Polymer element with a template only
This snippet also provides a wrapper div for <content>
and a style declaration.
<link rel="import" href="${1:../bower_components}/polymer/polymer.html">
<dom-module id="$2">
<template>
<style>
:host {
$4
}
.content-wrapper > ::content {
$5
}
</style>
$3
<div class="content-wrapper">
<content></content>
</div>
</template>
</dom-module>
dom-module
element
[dom-module] A blank This is handy if you need to add a visual presence to a Polymer element that did not necessarily need it before.
<dom-module id="$1">
<style>
:host {
display: block;
}
</style>
<template>
$2
</template>
</dom-module>
shortcuts
[tm] Template tag
<template>
$1
</template>
[tm-repeat] Repeating template
<template is="dom-repeat" items="{{$1}}">
$2
</template>
[tm-if] Conditional template
<template is="dom-if" if="$1">
$2
</template>
Paper elements
We include snippets of these Paper elements with sensible defaults:
paper-button
paper-checkbox
paper-dialog
paper-drawer-panel
paper-fab
paper-header-panel
paper-icon-button
paper-menu
paper-progress
paper-radio-button
paper-radio-group
paper-ripple
paper-scroll-header-panel
paper-slider
paper-spinner
paper-tabs
paper-toolbar
Iron elements
We include snippets of these Iron elements with sensible defaults:
iron-ajax
iron-collapse
iron-form
iron-icon
iron-iconset
iron-image
iron-input
iron-localstorage
iron-media-query
iron-pages
Gold elements
gold-cc-cvc-input
gold-cc-expiration-input
gold-cc-input
gold-email-input
gold-phone-input
gold-zip-input