How to use lit - 2 common examples
To help you get started, we’ve selected a few lit examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
dodona-edu / dodona / app / javascript / components / MetricLabel1.ts View on Github 
import { html, css, LitElement } from "lit";
import { customElement, property } from "lit/decorators.js";
@customElement("metric-label-1")
export class MetricLabel1 extends LitElement {
@property({ type: Number })
number: number;
@property()
label = "Somebody";
// don't use shadow dom
createRenderRoot(): Element {
return this;
}
render(): unknown {
return html`
<h1>${this.number}</h1>
${this.label}`;import { html, css, LitElement } from "lit";
import { customElement, property } from "lit/decorators.js";
@customElement("simple-greeting")
export class SimpleGreeting extends LitElement {
static styles = css`p { color: blue }`;
@property()
name = "Somebody";
render() {
return html`<p>Hello, ${this.name}!</p>`;
}
}lit
A library for building fast, lightweight web components
