lit-button
v4.2.0
Published
Dead simple lit-element button
Downloads
5
Readme
lit-button
Dead simple lit-element button
Installation
yarn add lit-button
Usage
Properties
disabled: boolean
indicates whether the button is disabled.autofocus: boolean
indicates whether the button is focused when the page loads.href: string
navigates to the given URL when clicked on.
CSS Shadow Parts
button
the underlying button.
lit-button.colored-border::part(button) {
border: 4px solid yellowgreen;
border-radius: 10px;
}
CSS Variables
lit-button also has some CSS variables for quick customization.
--button-outline-color
focus outline color, defaults to 8dc3eb
.
Examples
html`
<lit-button @click=${() => alert('Hello world')}>Default</lit-button>
<lit-button disabled>Disabled</lit-button>
<lit-button autofocus>Auto-focused</lit-button>
`;
Build Instructions
yarn dev
builds the project in dev modeyarn build
builds and lints the project in production modeyarn serve
runs a demo page in browser (you have to build the project first)yarn test
runs UI tests