https://github.com/enlight/polymer-typings
TypeScript type definitions for Polymer 1.0
https://github.com/enlight/polymer-typings
Last synced: 2 months ago
JSON representation
TypeScript type definitions for Polymer 1.0
- Host: GitHub
- URL: https://github.com/enlight/polymer-typings
- Owner: enlight
- License: mit
- Created: 2015-06-13T11:25:05.000Z (about 11 years ago)
- Default Branch: master
- Last Pushed: 2015-09-19T15:46:37.000Z (almost 11 years ago)
- Last Synced: 2025-01-27T07:43:19.078Z (over 1 year ago)
- Homepage:
- Size: 108 KB
- Stars: 0
- Watchers: 2
- Forks: 1
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# polymer-typings
These TypeScript type definitions for Polymer 1.0 are still a work in progress
and are subject to change. I'm still figuring out the best way to use Polymer
and TypeScript together. I've also written [some decorators](https://github.com/enlight/polymer-ts-decorators)
to eliminate the need to create a separate prototype object.
Usage
=====
```TypeScript
// my-element.ts
interface IAuthorProperty {
firstName: string;
lastName: string;
}
// This is the base behavior of the element, it could've been defined
// as part of the prototype we pass to Polymer() instead of separating it
// out into a behavior like this but then TypeScript wouldn't type check or
// auto-complete much.
class MyElement implements polymer.IBehavior {
isAwesome: boolean;
author: IAuthorProperty;
getAuthorFullName(): string {
return this.author.firstName + ' ' + this.author.lastName;
}
ready(): void {
console.log('MyElement is ready!');
console.log('Author: ' + this.getAuthorFullName());
if (this.isAwesome) {
console.log('^ is awesome!');
}
}
attached(): void {
console.log("MyElement has been attached!");
}
detached(): void {
console.log("MyElement has been detached!");
}
}
Polymer({
is: 'my-element',
behaviors: [ MyElement.prototype ],
properties: {
isAwesome: Boolean,
// Note the cast to polymer.IProperty is entirely optional,
// but it's the only way to get type checking and auto-completion for the
// property definition.
author: >{
type: Object,
value: () => {
return {
firstName: 'John',
lastName: 'Smith'
};
}
}
}
});
```
```html
my-element
```
```html
my-element Demo
Bob was here.
```