catalog/ts_web/elements/first-element.ts

47 lines
963 B
TypeScript
Raw Normal View History

2023-11-24 23:42:09 +00:00
import { DeesElement, property, html, customElement, TemplateResult, css, cssManager } from '@designestate/dees-element';
import * as domtools from '@designestate/dees-domtools';
declare global {
interface HTMLElementTagNameMap {
'first-element': FirstElement;
}
}
@customElement('first-element')
export class FirstElement extends DeesElement {
public static demo = () => html`
<first-element .aProp="${'test'}"></first-element>
`;
@property({
type: String
})
public aProp: string = 'loading...';
constructor() {
super();
domtools.DomTools.setupDomTools();
}
public static styles = [
domtools.elementBasic.staticStyles,
css`
:host {
display: block;
background: blue;
color: white;
padding: 10px;
text-align: center;
}
`
]
public render(): TemplateResult {
return html`
<div class="mainbox">
${this.aProp}
</div>
`;
}
}