Decorators

Typed Polymer embraces the power od ES7/TypeScript decorators. There are 3 types of decorators used by Typed Polymer: Class, Property and Method (there is also parameter decorator, but so far not used in this project). Below is a list of available decorators. For more details on how to use them, see examples.

Class decorators

• @register(name?: string) - a way to register a component (has to go as a first decorator)
• @template(template: string) - add a template to the component
• @styles(styles: string[]) - add styles to the template
• @extend(baseElement: string) - provide the tag to extend
• @hostAttributes(map: {[name: string]: any}) - map of attributes to set on the host
• @behavior(behavior: Function|Object) - add a behavior (as a class or a simple object)

Property decorators

• @set(value: any, forceType?: polymer.PropConstructorType) - set a default value (this also sets a type)
• @reflectToAttribute - set reflectToAttribute to true
• @readOnly - set readOnly to true
• @notify - set notify to true

Method decorator

• @set(observed: string, type: polymer.PropConstructorType) - create a computed property (observed properties may be omitted, will then be taken from method arguments)
• @once(eventName: string) - triggers a decorated function when the provided event is received and removes the listener
• @on(eventName: string, selector: string = "*") - add an event listener with optional selector filter
• @observe(observed: string) - observe a property/properties or a path/paths and run decorated function once they change