mwui-stencil
houses the Web Component library of the MWUI and is built using StencilJs.
Stencil provides WebComponents as well as framework-specific integrations to leverage usage of WebComponents in React, Vue and Angular.
To create new components, run:
npm run generate
Alternatively you can manually create components by adding them to src/components
.
Custom Element names are written in kebab-case, prefixed with mw-
(e.g. mw-button
).
Name, stylesheet and whether a shadow-dom should be created is defined within @component
.
Individual props get defined within by using @Prop()
,
followed by the name of the prop and its type or the default value.
Operators such as !
or ?
can be used to mark a prop as optional or required.
The HTML structure of the component is defined within the render()
function. You can define slots
which can be inserted into the component.
To run the unit tests for the components, run:
npm test
Check stencil docs here for additional help.