Miss any of our Open RFC calls?Watch the recordings here! »

web-component

1.0.26 • Public • Published

web-component

Build Status codecov npm version npm downloads license

Lightweight library providing interface for building web components.

Contribution

Is web-component library missing something ?

No problem! Simply fork this repository, add middleware and create pull request.

Installation

npm install --save web-component

Documentation

Package provides a decorator function that allows you to:

  • easy define Custom Elements
  • styling a custom element
  • creating elements from a template
  • encapsulate style and markup using Shadow DOM
  • extending other custom elements or even the browser's built-in HTML
import { WebComponent } from 'web-component'
 
@WebComponent('hello-world', {
  template: require('./hello-world.html'),// provide template
  styles: require('./hello-world.css'), //provide styles
  extends: 'button', //default does not extends any
  shadowDOM: true, //default false
  mode: "open" // default open, set to closed to block access to shadowDOM
})
export class HelloWorld extends HTMLElement {}

If shadowDOM option is set to true then template and styles will be attached to shadowRoot. If there is no shadowRoot, it will be created with mode open.

  1. Hello World Example
  2. web-components-webpack-es6-boilerplate

License

The code is available under the MIT license.

Install

npm i web-component

DownloadsWeekly Downloads

95

Version

1.0.26

License

MIT

Unpacked Size

26 kB

Total Files

29

Last publish

Collaborators

  • avatar