UNPKG

@arcgis/map-components

Version:
35 lines (34 loc) 2.03 kB
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */ import { c as o } from "../../chunks/runtime.js"; import { ref as r } from "lit/directives/ref.js"; import { css as d, html as c } from "lit"; import { keyed as h } from "lit/directives/keyed.js"; import { LitElement as p, createEvent as m, safeClassMap as b } from "@arcgis/lumina"; const g = d`.label{--calcite-label-margin-bottom: 0}.label-content{display:flex;flex:1;gap:var(--calcite-spacing-sm);align-items:center;text-wrap:balance}.label-content>div{flex-grow:1}.icon{margin-top:-1px;&.info{color:var(--calcite-color-status-info)}&.warning{color:var(--calcite-color-status-warning)}}.tooltip{text-wrap:wrap}`; class f extends p { constructor() { super(...arguments), this.checked = !1, this.disabled = !1, this.hintKind = "info", this.arcgisCheckedChanged = m(); } static { this.properties = { checked: 7, disabled: 7, label: 1, hint: 1, hintIcon: 1, hintKind: 1 }; } static { this.styles = g; } async destroy() { await this.manager.destroy(); } _setIconRef(e) { this._icon = e, this.requestUpdate(); } render() { const { label: e, hint: i, hintKind: a, hintIcon: l, checked: s, disabled: n } = this; return c`<calcite-label class="label" layout=inline-space-between scale=s>${i ? h("label-content", c`<div class="label-content"><div>${e}</div><calcite-icon class=${b(a !== "warning" ? "icon info" : "icon warning")} .icon=${l ?? "information"} @click=${(t) => t.stopPropagation()} .textLabel=${i} scale=s tabindex=0 ${r(this._setIconRef)}></calcite-icon><calcite-tooltip id=labeledSwitchTooltip class="tooltip" overlay-positioning=fixed .referenceElement=${this._icon ?? void 0}>${i}</calcite-tooltip></div>`) : e}<calcite-switch .checked=${s} .disabled=${n} scale=s .name=${e} @calciteSwitchChange=${(t) => { this.checked = t.target.checked, this.arcgisCheckedChanged.emit(t.target.checked); }}></calcite-switch></calcite-label>`; } } o("arcgis-labeled-switch", f); export { f as LabeledSwitch };