diff --git a/README.md b/README.md index 4343188c26..df6004032f 100644 --- a/README.md +++ b/README.md @@ -87,9 +87,8 @@ Basic syntax looks like this: // Extend Polymer.Element base class class MyElement extends Polymer.Element { static get is() { return 'my-element'; } - static get config() { - return { /* properties, observers meta data */ } - } + static get properties() { return { /* properties metadata */ } } + static get observers() { return [ /* observer descriptors */ ] } constructor() { super(); ... @@ -111,7 +110,8 @@ Users can then leverage native subclassing support provided by ES6 to extend and // Subclass existing element class MyElementSubclass extends MyElement { static get is() { return 'my-element-subclass'; } - static get config() { ... } + static get properties() { return { /* properties metadata */ } } + static get observers() { return [ /* observer descriptors */ ] } constructor() { super(); ... @@ -125,12 +125,11 @@ customElements.define(MyElementSubclass.is, MyElementSubclass); Below are the general steps for defining a custom element using this new syntax: -* Extend from `Polymer.Element`. This class provides the minimal surface area to integrate with 2.0's data binding system. It provides only standard custom element lifecycle with the addition of `ready`. (You can extend from `Polymer.LegacyElement` to get all of the Polymer 1.0 element api, but since most of this api was rarely used, this should not often be needed.) -* Implement "behaviors" as [mixins that return class expressions](http://justinfagnani.com/2015/12/21/real-mixins-with-javascript-classes/) -* Property metadata (`properties`) and multi-property/wildcard observers (`observers`) should be put on the class as a static in a property called `config` -* Element's `is` property should be defined as a static on the class -* Implement a static `template` getter to provide a template to stamp inside the element. By default the first `