mirror of
https://github.com/shoelace-style/webawesome.git
synced 2026-01-12 04:09:12 +00:00
* initial attempt at not auto defining * add files with - * continued work on removing auto-define * fix component definitions * update with new tag stuff * fix lots of things * fix improper scoped elements * working through side effects * continued react wrapper work * update changelog * formatting * fixes * update changelog * lint / formatting * fix version injection * fix version injection, work on test * fix version injection, work on test * fix merge conflicts * fix jsdoc null issue * fix templates * use exports * working on tests * working on registration mocking * fix customElements test * linting * fix some test stuff * clean up test * clean up comment * rename scopedElements to dependencies * linting / formatting * linting / formatting * mark all packages external and still bundle * set bundle false * set bundle true * dont minify * fix merge conflicts * use built shoelace-element * fix lint errors * prettier * appease eslint * appease eslint gods * appease eslint gods * appease eslint gods * appease eslint gods * add shoelace-autoloader * move it all into 1 function * add exportmaps note * prettier * add jsdelivr entrypoint * read as utf8 * update docs with .component.js importS * prettier
49 lines
1.2 KiB
Handlebars
49 lines
1.2 KiB
Handlebars
import { property } from 'lit/decorators.js';
|
|
import { html } from 'lit';
|
|
import { LocalizeController } from '../../utilities/localize.js';
|
|
import { watch } from '../../internal/watch.js';
|
|
import ShoelaceElement from '../../internal/shoelace-element.js';
|
|
import styles from './{{ tagWithoutPrefix tag }}.styles.js';
|
|
import type { CSSResultGroup } from 'lit';
|
|
|
|
/**
|
|
* @summary Short summary of the component's intended use.
|
|
* @documentation https://shoelace.style/components/{{ tagWithoutPrefix tag }}
|
|
* @status experimental
|
|
* @since 2.0
|
|
*
|
|
* @dependency sl-example
|
|
*
|
|
* @event sl-event-name - Emitted as an example.
|
|
*
|
|
* @slot - The default slot.
|
|
* @slot example - An example slot.
|
|
*
|
|
* @csspart base - The component's base wrapper.
|
|
*
|
|
* @cssproperty --example - An example CSS custom property.
|
|
*/
|
|
export default class {{ properCase tag }} extends ShoelaceElement {
|
|
static styles: CSSResultGroup = styles;
|
|
|
|
private readonly localize = new LocalizeController(this);
|
|
|
|
/** An example attribute. */
|
|
@property() attr = 'example';
|
|
|
|
@watch('example')
|
|
handleExampleChange() {
|
|
// do something
|
|
}
|
|
|
|
render() {
|
|
return html` <slot></slot> `;
|
|
}
|
|
}
|
|
|
|
declare global {
|
|
interface HTMLElementTagNameMap {
|
|
'{{ tag }}': {{ properCase tag }};
|
|
}
|
|
}
|