Buslowicz / twc

TypeScript based, boilerplate-less, Polymer toolbox friendly Polymer Modules
32 stars 1 forks source link

Optional options on the @CustomElement decorator #88

Closed nborelli closed 7 years ago

nborelli commented 7 years ago

This is just my opinion, but I think this might be better with less decorators but with decorators that take an optional options object that conform to an interface. For example:

interface CustomElementOptions {
 name?: string;
 template?: string;
 styles?: Array<string> | string;
}

Usage:

@CustomElement({
 template: '<h2>Hello World</h2>',
 styles: [':host {display: block}', 'styles.css'] 
})
export class MyElement extends Polymer.Element {
   name: string;
}

This would be more in line with the way Angular uses decorators and provides a nice way to add additional options to the custom element in the future without introducing new decorators.

The options are themselves optional, so the minimum decorator syntax is:

@CustomElement()
export class MyElement extends Polymer.Element {
   name: string;
}

Where the name is inferred from the class name and kebab cased and the template file must match the TypeScript filename.

Buslowicz commented 7 years ago

Sounds good to me, it's an easy task so I'll do it asap :).