UNPKG

@arcgis/map-components

Version:
56 lines (55 loc) 2.63 kB
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */ import { c as l } from "../../chunks/runtime.js"; import { LitElement as r } from "@arcgis/lumina"; import { css as n, html as a } from "lit"; import { usePropertyChange as o } from "@arcgis/lumina/controllers"; import { u as h } from "../../chunks/useT9n.js"; const u = n`:host{align-items:center;display:flex;flex:auto;min-width:300px;padding-inline:var(--calcite-space-sm);--calcite-color-border-input: var(--calcite-color-border-3)}calcite-combobox{flex:auto;width:var(--calcite-space-none)}`; class m extends r { constructor() { super(...arguments), this.messages = h({ blocking: !0 }), this.autoDestroyDisabled = !1, this.disabled = !1, this.canNext = !1, this.canPlay = !1, this.canPrevious = !1, this.arcgisPropertyChange = o()("canNext", "canPlay", "canPrevious", "currentValue"); } static { this.properties = { autoDestroyDisabled: 5, disabled: 5, items: 0, currentValue: 0, canNext: 5, canPlay: 5, canPrevious: 5 }; } static { this.styles = u; } async destroy() { await this.manager.destroy(); } reset() { this.currentValue = this.items?.[0]; } step(e) { if (!this.items || !this.currentValue) return; const s = this.items.findIndex(({ value: c }) => c === this.currentValue?.value) + (e === "next" ? 1 : -1); s >= this.items.length || s < 0 || (this.currentValue = this.items[s], this._checkState()); } connectedCallback() { super.connectedCallback(), this.el.hidden = !0; } willUpdate(e) { (e.has("currentValue") || e.has("items")) && this.items?.length && (this.currentValue ??= this.items[0]), this.el.hidden = !this.items?.length, this._checkState(); } _checkState() { if (!this.items?.length) { this.canPlay = !1, this.canNext = !1, this.canPrevious = !1; return; } this.canPlay = !0; const e = this.items.findIndex(({ value: t }) => t === this.currentValue?.value); this.canNext = e < this.items.length - 1, this.canPrevious = e > 0; } render() { return a`<calcite-combobox .disabled=${this.disabled} selection-mode=single .label=${this.messages.comboboxLabel} @calciteComboboxChange=${({ currentTarget: e }) => { const t = e.selectedItems[0]?.value; this.currentValue = this.items?.find(({ value: i }) => i === t), this._checkState(); }}>${this.items?.map((e) => a`<calcite-combobox-item .value=${e.value} .heading=${e.label} .selected=${e.value === this.currentValue?.value}></calcite-combobox-item>`)}</calcite-combobox>`; } } l("arcgis-value-picker-combobox", m); export { m as ArcgisValuePickerCombobox };