https://github.com/deebloo/ts-custom-elements

Typescript interfaces and decorators for custom elements v1
https://github.com/deebloo/ts-custom-elements

Last synced: 3 months ago
JSON representation

Typescript interfaces and decorators for custom elements v1

• Host: GitHub
• URL: https://github.com/deebloo/ts-custom-elements
• Owner: deebloo
• License: mit
• Created: 2016-11-03T20:05:35.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2023-12-15T08:44:12.000Z (about 1 year ago)
• Last Synced: 2024-10-05T13:07:42.384Z (3 months ago)
• Language: JavaScript
• Homepage:
• Size: 223 KB
• Stars: 4
• Watchers: 3
• Forks: 0
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# ts-custom-elements

Typescript interfaces and decorators for custom elements v1

```bash

npm i --save ts-custom-elements

```

example:

```ts

import { CustomElement, OnConnected, OnDisconnected } from 'ts-custom-elements';

@CustomElement({

  tagName: 'foo-bar'

})

class TestElement extends HTMLElement implements OnConnected, OnDisconnected {

  connectedCallback() {

    this.innerHTML = 'I have been rendered!';

    this.addEventListener('click', this.onClick.bind(this));

  }

  disconnectedCallback() {

    this.removeEventListener('click', this.onClick);

  }

  onClick() {

    this.innerHTML = 'I was clicked!';

  }

}

```