UNPKG

v4web-components

Version:
107 lines (106 loc) 3.22 kB
import { h } from '@stencil/core'; export class LabDsBadge { constructor() { this.states = { success: { color: 'var(--lab-ds-semantic-placeholder-color-bg-dark-success)', icon: 'check_circle' }, error: { color: 'var(--lab-ds-semantic-placeholder-color-bg-dark-error)', icon: 'error' }, warning: { color: 'var(--lab-ds-semantic-placeholder-color-bg-dark-warning)', icon: 'warning' }, }; this.label = 'badge'; this.variant = 'outlined'; this.state = 'success'; this.size = 'medium'; } render() { return (h("div", { class: `${this.variant} ${this.state} ${this.size} badge` }, h("span", { class: "label" }, this.label), this.variant === 'dot' ? (h("lab-ds-icon-not-selectable", { class: `holder ${this.state}`, size: `${this.size === 'medium' ? 'x-small' : 'xx-small'}`, icon: "circle", color: this.states[this.state].color })) : (h("lab-ds-icon-not-selectable", { class: "holder", size: `small`, icon: this.states[this.state].icon, color: this.states[this.state].color })))); } static get is() { return "lab-ds-badge"; } static get encapsulation() { return "shadow"; } static get originalStyleUrls() { return { "$": ["lab-ds-badge.css"] }; } static get styleUrls() { return { "$": ["lab-ds-badge.css"] }; } static get properties() { return { "label": { "type": "string", "mutable": false, "complexType": { "original": "string", "resolved": "string", "references": {} }, "required": false, "optional": false, "docs": { "tags": [], "text": "" }, "attribute": "label", "reflect": false, "defaultValue": "'badge'" }, "variant": { "type": "string", "mutable": false, "complexType": { "original": "'outlined' | 'ghost' | 'dot'", "resolved": "\"dot\" | \"ghost\" | \"outlined\"", "references": {} }, "required": false, "optional": false, "docs": { "tags": [], "text": "" }, "attribute": "variant", "reflect": false, "defaultValue": "'outlined'" }, "state": { "type": "string", "mutable": false, "complexType": { "original": "'success' | 'error' | 'warning'", "resolved": "\"error\" | \"success\" | \"warning\"", "references": {} }, "required": false, "optional": false, "docs": { "tags": [], "text": "" }, "attribute": "state", "reflect": false, "defaultValue": "'success'" }, "size": { "type": "string", "mutable": false, "complexType": { "original": "'medium' | 'small'", "resolved": "\"medium\" | \"small\"", "references": {} }, "required": false, "optional": false, "docs": { "tags": [], "text": "" }, "attribute": "size", "reflect": false, "defaultValue": "'medium'" } }; } } //# sourceMappingURL=lab-ds-badge.js.map