@arcgis/common-components 5.2.0-next.106 → 5.2.0-next.108

package/dist/components/arcgis-toolbar-action/customElement.js

@@ -1,25 +1,20 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as p } from "../../chunks/runtime.js";
 import { ref as u } from "lit/directives/ref.js";
-import { css as g, html as c } from "lit";
-import { LitElement as f, createEvent as l, nothing as n, safeClassMap as _ } from "@arcgis/lumina";
+import { css as g, html as o } from "lit";
+import { keyed as f } from "lit/directives/keyed.js";
+import { LitElement as b, createEvent as l, nothing as s, safeClassMap as _ } from "@arcgis/lumina";
 import { W as r } from "../../chunks/utils.js";
-import { g as b } from "../../chunks/utils2.js";
+import { g as $ } from "../../chunks/utils2.js";
 const v = g`:host([text-enabled][data-layout="vertical"]){.interaction-container>button{flex-direction:column;>.text-container{writing-mode:vertical-lr}}}`;
-class $ extends f {
+class x extends b {
   constructor() {
     super(...arguments), this.#e = (t) => {
-      if (t !== this._element) {
-        if (this.#t?.disconnect(), this._element = t, this._hydratedElement = void 0, this.isConnected && this.arcgisRenderedActionChanged.emit({ element: t }), !t) {
-          this._measuredWidth = 0, this._measuredHeight = 0;
-          return;
-        }
-        this._measureAction(), this.#t ??= new ResizeObserver((e) => {
-          !this.textEnabled || !this._element || this._measureAction(e);
-        }), this.#t.observe(t), t.componentOnReady().then(() => {
-          !this.isConnected || this._element !== t || (this._hydratedElement = t, t.shadowRoot?.adoptedStyleSheets.push(v.styleSheet));
-        });
-      }
+      t !== this._element && (this.#t?.disconnect(), this._element = t, this._hydratedElement = void 0, this.isConnected && this.arcgisRenderedActionChanged.emit({ element: t }), t && (this._measureAction(), this.#t ??= new ResizeObserver((e) => {
+        !this.textEnabled || !this._element || this._measureAction(e);
+      }), this.#t.observe(t), t.componentOnReady().then(() => {
+        !this.isConnected || this._element !== t || (this._hydratedElement = t, t.shadowRoot?.adoptedStyleSheets.push(v.styleSheet));
+      })));
     }, this._measuredWidth = 0, this._measuredHeight = 0, this.active = !1, this.tooltipText = "", this.labelText = "", this.disabled = !1, this.loading = !1, this.indicator = !1, this.textEnabled = !1, this.appearance = "transparent", this.iconFlipRtl = !1, this.arcgisRenderedActionChanged = l(), this.arcgisToolbarItemSelected = l();
   }
   static {
@@ -31,12 +26,12 @@ class $ extends f {
     return this._element;
   }
   measure({ layout: t, scale: e }) {
-    const a = r.actionPadding[e], i = r.action[e], s = t === "horizontal" ? this._measuredWidth : this._measuredHeight;
-    return [Math.max(i, s) + a];
+    const a = r.actionPadding[e], i = r.action[e], n = t === "horizontal" ? this._measuredWidth : this._measuredHeight;
+    return [Math.max(i, n) + a];
   }
   proxiedRender(t) {
-    const { tooltipAppearance: e, scale: a } = t, i = this.tooltipText || this.labelText, s = this._hydratedElement, o = e !== "native" && !!i && s, d = e === "calcite-dark" ? "calcite-mode-dark" : void 0, h = b(t);
-    return c`<calcite-action .active=${this.active} data-appearance=${this.appearance ?? n} data-kind=${this.kind ?? n} data-layout=${t.layout ?? n} .disabled=${this.disabled} .icon=${this.icon} .iconFlipRtl=${this.iconFlipRtl} .indicator=${this.indicator} .label=${i} .loading=${this.loading} @click=${(m) => this._handleActionClick(m)} .scale=${a} .text=${this.labelText} .textEnabled=${this.textEnabled} title=${(e === "native" ? i : void 0) ?? n} ${u(this.#e)}></calcite-action>${o ? c`<calcite-tooltip class=${_(d)} overlay-positioning=fixed .placement=${h} .referenceElement=${s} .scale=${a}><span>${i}</span></calcite-tooltip>` : void 0}`;
+    const { tooltipAppearance: e, scale: a } = t, i = this.tooltipText || this.labelText, n = this._hydratedElement, c = e !== "native" && !!i && n, d = e === "calcite-dark" ? "calcite-mode-dark" : void 0, h = $(t);
+    return o`${f(this, o`<calcite-action .active=${this.active} data-appearance=${this.appearance ?? s} data-kind=${this.kind ?? s} data-layout=${t.layout ?? s} .disabled=${this.disabled} .icon=${this.icon} .iconFlipRtl=${this.iconFlipRtl} .indicator=${this.indicator} .label=${i} .loading=${this.loading} @click=${(m) => this._handleActionClick(m)} .scale=${a} .text=${this.labelText} .textEnabled=${this.textEnabled} title=${(e === "native" ? i : void 0) ?? s} ${u(this.#e)}></calcite-action>`)}${c ? o`<calcite-tooltip class=${_(d)} overlay-positioning=fixed .placement=${h} .referenceElement=${n} .scale=${a}><span>${i}</span></calcite-tooltip>` : void 0}`;
   }
   disconnectedCallback() {
     this.#t?.disconnect(), super.disconnectedCallback();
@@ -51,7 +46,7 @@ class $ extends f {
     e && (this._measuredWidth = Math.round(e.width), this._measuredHeight = Math.round(e.height));
   }
 }
-p("arcgis-toolbar-action", $);
+p("arcgis-toolbar-action", x);
 export {
-  $ as ArcgisToolbarAction
+  x as ArcgisToolbarAction
 };

package/dist/components/arcgis-toolbar-group/customElement.js

@@ -1,43 +1,44 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as d } from "../../chunks/runtime.js";
 import { html as p } from "lit";
 import { LitElement as u, nothing as h } from "@arcgis/lumina";
-import { L as m, W as i, a as g, i as b } from "../../chunks/utils.js";
+import { W as i, a as m } from "../../chunks/utils.js";
+import { L as g, i as b } from "../../chunks/types.js";
 import { u as f } from "../../chunks/utils2.js";
 class C extends u {
   constructor() {
-    super(...arguments), this.#e = new MutationObserver(() => this.#r()), this.preferEndSlot = !1, this.priority = m.Default;
+    super(...arguments), this.#e = new MutationObserver(() => this.#t()), this.preferEndSlot = !1, this.priority = g.Default;
   }
   static {
     this.properties = { _children: 16, preferEndSlot: 5, priority: 9 };
   }
-  #t;
+  #r;
   #e;
   measure(e) {
-    const t = this._children;
-    if (!t?.length)
+    const r = this._children;
+    if (!r?.length)
       return [0];
-    const o = i.groupSeparator + i.groupPadding[e.scale], n = t.map((r) => r.measure(e)).reduce((r, s) => r.flatMap((a) => s.map((c) => a + c)), [0]);
-    return f(n.map((r) => o + r));
+    const o = i.groupSeparator + i.groupPadding[e.scale], n = r.map((t) => t.measure(e)).reduce((t, s) => t.flatMap((a) => s.map((c) => a + c)), [0]);
+    return f(n.map((t) => o + t));
   }
-  proxiedRender(e, t) {
+  proxiedRender(e, r) {
     const o = this._children;
     if (!o)
       return;
-    const l = this.preferEndSlot ? "actions-end" : void 0, n = t - i.groupPadding[e.scale] - i.groupSeparator, r = g(o, e, n);
-    return p`<calcite-action-group .scale=${e.scale} .layout=${e.layout} slot=${l ?? h}>${r.map(({ group: s, budget: a }) => s.proxiedRender(e, a))}</calcite-action-group>`;
+    const l = this.preferEndSlot ? "actions-end" : void 0, n = r - i.groupPadding[e.scale] - i.groupSeparator, t = m(o, e, n);
+    return p`<calcite-action-group .scale=${e.scale} .layout=${e.layout} slot=${l ?? h}>${t.map(({ group: s, budget: a }) => s.proxiedRender(e, a))}</calcite-action-group>`;
   }
   connectedCallback() {
-    super.connectedCallback(), this.#e.observe(this.el, { childList: !0 }), this.#r();
+    super.connectedCallback(), this.#e.observe(this.el, { childList: !0 }), this.#t();
   }
   disconnectedCallback() {
     this.#e.disconnect(), super.disconnectedCallback();
   }
-  #r() {
-    this.#t?.abort();
-    const e = Array.from(this.el.children).filter(b), t = new AbortController();
-    this.#t = t, Promise.all(e.map((o) => o.componentOnReady())).then(() => {
-      !this.isConnected || t.signal.aborted || (this._children = e);
+  #t() {
+    this.#r?.abort();
+    const e = Array.from(this.el.children).filter(b), r = new AbortController();
+    this.#r = r, Promise.all(e.map((o) => o.componentOnReady())).then(() => {
+      !this.isConnected || r.signal.aborted || (this._children = e);
     });
   }
 }

package/dist/components/arcgis-toolbar-item/customElement.d.ts

@@ -33,7 +33,7 @@ export abstract class ArcgisToolbarItem extends LitElement {
    */
   accessor disabled: boolean;
   /**
-   * The icon to show in the rendered action. For best user experience, this should not be ommitted.
+   * The icon to show in the rendered action. For best user experience, this should not be omitted.
    *
    * @default "question-mark"
    */

package/dist/components/arcgis-toolbar-item/customElement.js

@@ -1,14 +1,14 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as p } from "../../chunks/runtime.js";
 import { html as n } from "lit";
 import { ref as f } from "lit/directives/ref.js";
-import { LitElement as $, createEvent as g, nothing as c, safeClassMap as v } from "@arcgis/lumina";
+import { LitElement as $, createEvent as v, nothing as c, safeClassMap as g } from "@arcgis/lumina";
 import { W as s } from "../../chunks/utils.js";
 import { E as b } from "../../chunks/element-reference-controller.js";
 import { g as u } from "../../chunks/utils2.js";
 class x extends $ {
   constructor() {
-    super(...arguments), this._active = !1, this._elementReferenceController = new b(this), this.icon = "question-mark", this.tooltipText = "", this.labelText = "", this.disabled = !1, this.loading = !1, this.iconFlipRtl = !1, this.arcgisItemSelected = g();
+    super(...arguments), this._active = !1, this._elementReferenceController = new b(this), this.icon = "question-mark", this.tooltipText = "", this.labelText = "", this.disabled = !1, this.loading = !1, this.iconFlipRtl = !1, this.arcgisItemSelected = v();
   }
   static {
     this.properties = { icon: 3, lastActivated: 0, active: 7, tooltipText: 1, labelText: 3, disabled: 7, loading: 7, iconFlipRtl: 7, actionElement: 32 };
@@ -26,14 +26,14 @@ class x extends $ {
     return [s.action[t] + s.actionPadding[t]];
   }
   proxiedRender(t, i, r) {
-    const l = t.tooltipAppearance, a = this._elementReferenceController.element, m = l !== "native" && i === "collapsed-action", d = l === "calcite-dark" ? "calcite-mode-dark" : void 0, h = u(t), e = this.tooltipText || this.labelText;
-    return i === "dropdown-item" ? n`<calcite-dropdown-item .disabled=${this.disabled} icon-start=${this.icon ?? c} .iconFlipRtl=${this.iconFlipRtl ? "both" : void 0} .label=${e} @click=${(o) => this._handleDropdownItemClick(o)} .selected=${this.active || r} title=${e ?? c}>${this.labelText}</calcite-dropdown-item>` : n`<calcite-action .active=${this.active} .disabled=${this.disabled} .icon=${this.icon} .iconFlipRtl=${this.iconFlipRtl} .label=${e} .loading=${this.loading} @click=${(o) => this._handleActionClick(o)} .scale=${t.scale} .text=${this.labelText} .textEnabled=${i === "expanded-action"} title=${(l === "native" ? e : void 0) ?? c} ${f(this._elementReferenceController.ref)}></calcite-action>${m && a ? n`<calcite-tooltip class=${v(d)} overlay-positioning=fixed .placement=${h} .referenceElement=${a}><span>${e}</span></calcite-tooltip>` : void 0}`;
+    const l = t.tooltipAppearance, a = this._elementReferenceController.element, d = l !== "native" && i === "collapsed-action", m = l === "calcite-dark" ? "calcite-mode-dark" : void 0, h = u(t), e = this.tooltipText || this.labelText;
+    return i === "dropdown-item" ? n`<calcite-dropdown-item .disabled=${this.disabled} icon-start=${this.icon ?? c} .iconFlipRtl=${this.iconFlipRtl ? "both" : void 0} .label=${e} @click=${(o) => this._handleDropdownItemClick(o)} .selected=${this.active || r} title=${e ?? c}>${this.labelText}</calcite-dropdown-item>` : n`<calcite-action .active=${this.active} .disabled=${this.disabled} .icon=${this.icon} .iconFlipRtl=${this.iconFlipRtl} .label=${e} .loading=${this.loading} @click=${(o) => this._handleActionClick(o)} .scale=${t.scale} .text=${this.labelText} .textEnabled=${i === "expanded-action"} title=${(l === "native" ? e : void 0) ?? c} ${f(this._elementReferenceController.ref)}></calcite-action>${d && a ? n`<calcite-tooltip class=${g(m)} close-on-click overlay-positioning=fixed .placement=${h} .referenceElement=${a}><span>${e}</span></calcite-tooltip>` : void 0}`;
   }
   _handleActionClick(t) {
-    this.isConnected && this.arcgisItemSelected?.emit({ element: t.currentTarget });
+    this.isConnected && (this.lastActivated = /* @__PURE__ */ new Date(), this.arcgisItemSelected?.emit({ element: t.currentTarget }));
   }
   _handleDropdownItemClick(t) {
-    this.isConnected && this.arcgisItemSelected?.emit({ element: t.currentTarget });
+    this.isConnected && (this.lastActivated = /* @__PURE__ */ new Date(), this.arcgisItemSelected?.emit({ element: t.currentTarget }));
   }
 }
 p("arcgis-toolbar-item", x);

package/dist/components/arcgis-toolbar-more-button/customElement.js

@@ -1,9 +1,9 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as A } from "../../chunks/runtime.js";
-import { ref as f } from "lit/directives/ref.js";
+import { ref as u } from "lit/directives/ref.js";
 import { html as m } from "lit";
 import { LitElement as C, nothing as v, safeClassMap as $ } from "@arcgis/lumina";
-import { L as u } from "../../chunks/utils.js";
+import { L as f } from "../../chunks/types.js";
 import { E as w } from "../../chunks/element-reference-controller.js";
 import { a as g, u as _, g as y } from "../../chunks/utils2.js";
 import { b as L } from "../../chunks/utils3.js";
@@ -11,7 +11,7 @@ class R extends C {
   constructor() {
     super(...arguments), this._elementReferenceController = new w(this), this._childrenObserver = new MutationObserver(() => {
       this._syncChildren();
-    }), this.priority = u.Medium, this.menuAppearance = "action-menu", this.overflowActionLabel = "More actions";
+    }), this.priority = f.Medium, this.menuAppearance = "action-menu", this.overflowActionLabel = "More actions";
   }
   static {
     this.properties = { _children: 16, priority: 9, menuAppearance: 1, overflowActionLabel: 1 };
@@ -21,10 +21,10 @@ class R extends C {
     if (!t)
       return [0];
     const i = g(e), l = t * i;
-    if (!(this.priority < u.NeverCollapse && t > 2))
+    if (!(this.priority < f.NeverCollapse && t > 2))
       return [l];
     const s = Math.min(t, 2) * i, o = [s];
-    if (t <= 2 || this.priority <= u.ForceCollapse)
+    if (t <= 2 || this.priority <= f.ForceCollapse)
       return o;
     for (let n = 1; n < t - 1; n++)
       o.push(s + i * n);
@@ -34,8 +34,8 @@ class R extends C {
     const i = this._children;
     if (!i)
       return;
-    const { visible: l, hidden: r } = this._resolveActionsFromBudget(i, e, t), s = "hamburger", o = this.overflowActionLabel, n = e.tooltipAppearance, c = n !== "native", a = this._elementReferenceController.element, p = n === "calcite-dark" ? "calcite-mode-dark" : void 0, h = y(e), b = this.menuAppearance === "action-menu" ? m`<calcite-action-menu .label=${o} overlay-positioning=fixed .placement=${h}><calcite-action .icon=${s} .scale=${e.scale} slot=trigger .text=${o} title=${(n === "native" ? o : "") ?? v} ${f(this._elementReferenceController.ref)}></calcite-action>${r.map((d) => d.proxiedRender(e, "expanded-action"))}</calcite-action-menu>` : m`<calcite-dropdown overlay-positioning=fixed .placement=${h}><calcite-action .icon=${s} .scale=${e.scale} slot=trigger .text=${o} title=${(n === "native" ? o : "") ?? v} ${f(this._elementReferenceController.ref)}></calcite-action><calcite-dropdown-group selection-mode=none>${r.map((d) => d.proxiedRender(e, "dropdown-item"))}</calcite-dropdown-group></calcite-dropdown>`;
-    return m`${l.map((d) => d.proxiedRender(e, "collapsed-action"))}${r.length ? b : void 0}${r.length && c ? m`<calcite-tooltip class=${$(p)} overlay-positioning=fixed .placement=${h} .referenceElement=${a}><span>${o}</span></calcite-tooltip>` : void 0}`;
+    const { visible: l, hidden: r } = this._resolveActionsFromBudget(i, e, t), s = "hamburger", o = this.overflowActionLabel, n = e.tooltipAppearance, c = n !== "native", a = this._elementReferenceController.element, p = n === "calcite-dark" ? "calcite-mode-dark" : void 0, h = y(e), b = this.menuAppearance === "action-menu" ? m`<calcite-action-menu .label=${o} overlay-positioning=fixed .placement=${h}><calcite-action .icon=${s} .scale=${e.scale} slot=trigger .text=${o} title=${(n === "native" ? o : "") ?? v} ${u(this._elementReferenceController.ref)}></calcite-action>${r.map((d) => d.proxiedRender(e, "expanded-action"))}</calcite-action-menu>` : m`<calcite-action .icon=${s} .scale=${e.scale} .text=${o} title=${(n === "native" ? o : "") ?? v} ${u(this._elementReferenceController.ref)}></calcite-action><calcite-dropdown overlay-positioning=fixed .placement=${h} .referenceElement=${a}><calcite-dropdown-group selection-mode=none>${r.map((d) => d.proxiedRender(e, "dropdown-item"))}</calcite-dropdown-group></calcite-dropdown>`;
+    return m`${l.map((d) => d.proxiedRender(e, "collapsed-action"))}${r.length ? b : void 0}${r.length && c ? m`<calcite-tooltip class=${$(p)} close-on-click overlay-positioning=fixed .placement=${h} .referenceElement=${a}><span>${o}</span></calcite-tooltip>` : void 0}`;
   }
   connectedCallback() {
     super.connectedCallback(), this._childrenObserver.observe(this.el, { childList: !0 }), this._syncChildren();

package/dist/components/arcgis-toolbar-split-button/customElement.js

@@ -1,12 +1,13 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as y } from "../../chunks/runtime.js";
-import { ref as b } from "lit/directives/ref.js";
+import { ref as $ } from "lit/directives/ref.js";
 import { html as d } from "lit";
 import { LitElement as _, nothing as h, safeClassMap as a } from "@arcgis/lumina";
 import { E as L } from "../../chunks/element-reference-controller.js";
-import { L as f, W as R } from "../../chunks/utils.js";
-import { a as $, u as E, g as k } from "../../chunks/utils2.js";
-import { b as O } from "../../chunks/utils3.js";
+import { L as f } from "../../chunks/types.js";
+import { a as C, u as R, g as E } from "../../chunks/utils2.js";
+import { b as k } from "../../chunks/utils3.js";
+import { W as O } from "../../chunks/utils.js";
 class S extends _ {
   constructor() {
     super(...arguments), this._elementReferenceController = new L(this), this._childrenObserver = new MutationObserver(() => this._syncChildren()), this.priority = f.Medium, this.menuAppearance = "dropdown", this.overflowActionLabel = "More actions";
@@ -18,18 +19,18 @@ class S extends _ {
     const { priority: n, _children: i } = this, r = i?.length ?? 0;
     if (!r)
       return [0];
-    const o = $(e), s = r * o;
+    const o = C(e), s = r * o;
     if (!(n < f.NeverCollapse) || r <= 1)
       return [s];
-    const l = o + M(e);
-    return n <= f.ForceCollapse ? [l] : E([l, s]);
+    const l = o + W(e);
+    return n <= f.ForceCollapse ? [l] : R([l, s]);
   }
   proxiedRender(e, n) {
     const i = this._children;
     if (!i)
       return;
-    const { visible: r, hidden: o } = this._resolveActionsFromBudget(i, e, n, this.menuAppearance === "dropdown"), s = W(e), t = this.overflowActionLabel, l = e.tooltipAppearance, m = l !== "native", C = this._elementReferenceController.element, A = l === "calcite-dark" ? "calcite-mode-dark" : void 0, g = "split-anchor", v = o.length ? "split-menu" : "", u = k(e), w = this.menuAppearance === "action-menu" ? d`<calcite-action-menu .label=${t} overlay-positioning=fixed .placement=${u} class=${a(v)}><calcite-action .icon=${s} .scale=${e.scale} class=${a(g)} data-layout=${e.layout ?? h} slot=trigger title=${t ?? h} .label=${t} .text=${t} ${b(this._elementReferenceController.ref)}></calcite-action>${o.map((c) => c.proxiedRender(e, "expanded-action"))}</calcite-action-menu>` : d`<calcite-dropdown overlay-positioning=fixed .placement=${u} .scale=${e.scale} class=${a(v)}><calcite-action class=${a(g)} data-layout=${e.layout ?? h} .icon=${s} .label=${t} .scale=${e.scale} slot=trigger .text=${l === "native" ? t : ""} title=${t ?? h} ${b(this._elementReferenceController.ref)}></calcite-action><calcite-dropdown-group selection-mode=single>${o.map((c) => c.proxiedRender(e, "dropdown-item", c === r.at(0)))}</calcite-dropdown-group></calcite-dropdown>`;
-    return d`<div class="split-host">${r.map((c) => c.proxiedRender(e, "collapsed-action"))}${o.length ? w : void 0}${o.length && m ? d`<calcite-tooltip class=${a(A)} overlay-positioning=fixed .placement=${u} .referenceElement=${C}><span>${t}</span></calcite-tooltip>` : void 0}</div>`;
+    const { visible: r, hidden: o } = this._resolveActionsFromBudget(i, e, n, this.menuAppearance === "dropdown"), s = T(e), t = this.overflowActionLabel, l = e.tooltipAppearance, m = l !== "native", v = this._elementReferenceController.element, A = l === "calcite-dark" ? "calcite-mode-dark" : void 0, g = "split-anchor", b = o.length ? "split-menu" : "", u = E(e), w = this.menuAppearance === "action-menu" ? d`<calcite-action-menu class=${a(b)} .label=${t} overlay-positioning=fixed .placement=${u}><calcite-action class=${a(g)} data-layout=${e.layout ?? h} .icon=${s} .label=${t} .scale=${e.scale} slot=trigger .text=${t} title=${t ?? h} ${$(this._elementReferenceController.ref)}></calcite-action>${o.map((c) => c.proxiedRender(e, "expanded-action"))}</calcite-action-menu>` : d`<calcite-action class=${a(g)} data-layout=${e.layout ?? h} .icon=${s} .label=${t} .scale=${e.scale} .text=${l === "native" ? t : ""} title=${t ?? h} ${$(this._elementReferenceController.ref)}></calcite-action><calcite-dropdown class=${a(b)} overlay-positioning=fixed .placement=${u} .referenceElement=${v} .scale=${e.scale}><calcite-dropdown-group selection-mode=single>${o.map((c) => c.proxiedRender(e, "dropdown-item", c === r.at(0)))}</calcite-dropdown-group></calcite-dropdown>`;
+    return d`<div class="split-host">${r.map((c) => c.proxiedRender(e, "collapsed-action"))}${o.length ? w : void 0}${o.length && m ? d`<calcite-tooltip class=${a(A)} close-on-click overlay-positioning=fixed .placement=${u} .referenceElement=${v}><span>${t}</span></calcite-tooltip>` : void 0}</div>`;
   }
   connectedCallback() {
     super.connectedCallback(), this._childrenObserver.observe(this.el, { childList: !0 }), this._syncChildren();
@@ -38,8 +39,8 @@ class S extends _ {
     this._childrenObserver.disconnect(), super.disconnectedCallback();
   }
   _resolveActionsFromBudget(e, n, i, r) {
-    const o = e.find((m) => m.active) ?? e?.toSorted(O)?.at(0);
-    if (Math.floor(i / $(n)) >= e.length)
+    const o = e.find((m) => m.active) ?? e?.toSorted(k)?.at(0);
+    if (Math.floor(i / C(n)) >= e.length)
       return { visible: [...e], hidden: [] };
     if (r)
       return { visible: [o ?? e[0]], hidden: [...e] };
@@ -54,11 +55,11 @@ class S extends _ {
     });
   }
 }
-function W({ layout: p, relativePosition: e }) {
+function T({ layout: p, relativePosition: e }) {
   return p === "horizontal" ? e.startsWith("top") ? "chevron-down" : "chevron-up" : e.endsWith("left") ? "chevron-right" : "chevron-left";
 }
-function M({ layout: p, scale: e }) {
-  return R.splitButtonPart[p][e];
+function W({ layout: p, scale: e }) {
+  return O.splitButtonPart[p][e];
 }
 y("arcgis-toolbar-split-button", S);
 export {

package/dist/components/arcgis-toolbar-stack/customElement.d.ts

@@ -0,0 +1,48 @@
+/// <reference path="../../index.d.ts" />
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+
+/**
+ * Component to support laying out multiple toolbars.
+ *
+ * This is intended to be relatively simple; toolbars are 'stacked' vertically and horizontally
+ * according to layout, docking behavior, and available space.
+ *
+ * A single ruler element is shared across toolbars to simplify the calculations and avoid
+ * issues (e.g. if the toolbar is offset relative to another toolbar, that would affect the positioning of the ruler element).
+ *
+ * The general rule is the input order of the toolbar elements determines the semantic priority. Based on that priority,
+ * higher priority elements are stuck to the outside, with smaller/lower priority elements flowing towards the center.
+ *
+ * @internal
+ */
+export abstract class ArcgisToolbarStack extends LitElement {
+  /** Toolbar orientation */
+  accessor layout: "horizontal" | "vertical";
+  /**
+   * Relative position is used to control how popover element placement and directional arrows
+   * are chosen. This is used in conjunction with the layout property.
+   *
+   * This will affect how split buttons, overflow menus, and tooltips are displayed.
+   *
+   * @default "top-left"
+   */
+  accessor relativePosition: "bottom-end" | "bottom-left" | "bottom-right" | "bottom-start" | "top-end" | "top-left" | "top-right" | "top-start";
+  /**
+   * Action scale, will be applied to all rendered actions.
+   *
+   * @default "m"
+   */
+  accessor scale: "l" | "m" | "s";
+  /**
+   * Toolbar visual appearance - affects layout decisions.
+   *
+   * @default "floating"
+   */
+  accessor toolbarKind: "docked" | "floating";
+  /**
+   * Controls whether individual actions render native tooltips or Calcite tooltips.
+   *
+   * @default "native"
+   */
+  accessor tooltipAppearance: "calcite-dark" | "calcite" | "native";
+}

package/dist/components/arcgis-toolbar-stack/customElement.js

@@ -0,0 +1,174 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
+import { c as k } from "../../chunks/runtime.js";
+import { ref as _ } from "lit/directives/ref.js";
+import { css as C, render as w, nothing as P, html as p } from "lit";
+import { LitElement as z, nothing as v } from "@arcgis/lumina";
+import { useDirection as L } from "@arcgis/lumina/controllers";
+import { s as x, a as T, b as $, c as A } from "../../chunks/toolbar.js";
+import { AsyncDirective as R } from "lit/async-directive.js";
+import { directive as M, PartType as D } from "lit/directive.js";
+import { getCommittedValue as u, clearPart as E, insertPart as b, setCommittedValue as f } from "lit/directive-helpers.js";
+const V = C`:host{--calcite-internal-animation-timing-slow: 0}.toolbar-stack{align-items:stretch;display:flex;max-inline-size:min(100cqw,100vw);max-block-size:min(100cqh,100vh);min-inline-size:0;min-block-size:0;gap:8px}.stack{display:flex}.stack[data-horizontal-position=right]{justify-content:right}.stack[data-horizontal-position=left]{justify-content:left}.line{display:flex;flex:none;gap:8px}:host([layout="vertical"]) .line{flex-direction:column;max-height:min(100cqh - var(--arcgis-internal-attribution-space-top) - 2 * var(--calcite-space-lg),100vh - 2 * var(--calcite-space-lg))}:host([layout="horizontal"]) .line{flex-direction:row}.line[data-alignment=top]{justify-content:flex-start}.line[data-alignment=bottom]{justify-content:flex-end}.line[data-alignment=left]{justify-content:left}.line[data-alignment=right]{justify-content:right}:host([layout="vertical"]) .toolbar-stack{flex-direction:row}:host([layout="horizontal"]) .toolbar-stack{flex-direction:column}:host([toolbar-kind="docked"][layout="horizontal"]) .toolbar-stack{min-inline-size:100%;calcite-action-bar{min-width:auto}}:host([toolbar-kind="docked"][layout="vertical"]) .toolbar-stack{min-block-size:100%;calcite-action-bar{min-height:auto}}:host([toolbar-kind="floating"]) .toolbar-shadow-wrapper{box-shadow:var(--calcite-shadow-md);background-color:var(--calcite-action-bar-background-color, var(--calcite-color-foreground-1));border-radius:var(--calcite-action-bar-corner-radius, var(--calcite-corner-radius-round));min-inline-size:0;min-block-size:0}`;
+class j {
+  constructor(t = /* @__PURE__ */ new Map(), e = /* @__PURE__ */ new Set()) {
+    this.cachedParts = t, this.directives = e;
+  }
+  moveAllToCache() {
+    for (const t of this.directives)
+      t.moveToCache();
+  }
+}
+class S extends R {
+  #e;
+  #i;
+  #t;
+  constructor(t) {
+    if (super(t), t.type !== D.CHILD)
+      throw new Error("sharedCache() can only be used in child expressions");
+  }
+  /**
+   * @param _store Shared store backing this and other caching directives with the shared cache
+   * @param _key Uniquely identifies the element being rendered
+   * @param value The content to render
+   */
+  render(t, e, o) {
+    return [o];
+  }
+  update(t, [e, o, a]) {
+    this.#t !== e && (this.#t && this.#t.directives.delete(this), e.directives.add(this), this.#t = e), this.#e = t, this.#i = o;
+    const i = e.cachedParts.get(o), s = i ? u(i).pop() : void 0;
+    return s && (E(t), b(t, void 0, s), f(t, [s])), this.render(e, o, a);
+  }
+  /**
+   * During the update phase, a toolbar may need to be pulled from the cache in a situation
+   * where it was still on the page from the previous render.
+   *
+   * To work around this problem, during parent component render phase a pre-caching
+   * step moves all cacheable elements into the cache. This is the method called by
+   * that pre-caching step.
+   *
+   * @returns
+   */
+  moveToCache() {
+    const t = this.#e, e = this.#t;
+    if (!t || !e)
+      return;
+    const a = u(t).pop();
+    if (!a)
+      return;
+    let i = e.cachedParts.get(this.#i);
+    if (!i) {
+      const c = document.createDocumentFragment();
+      i = w(P, c), e.cachedParts.set(this.#i, i);
+    }
+    if (u(i).length > 0)
+      throw new Error("sharedCache() keys must be unique");
+    f(i, [a]), b(i, void 0, a);
+  }
+  disconnected() {
+    this.#t?.directives.delete(this);
+  }
+  reconnected() {
+    this.#t?.directives.add(this);
+  }
+}
+const q = M(S), O = 8;
+class K extends z {
+  constructor() {
+    super(), this.#e = new ResizeObserver((t) => this._updateMeasurement(t)), this.#i = new MutationObserver(() => this._syncToolbars()), this.#r = L(), this.#o = new j(), this._layout = "horizontal", this._availableLength = 0, this.scale = "m", this.tooltipAppearance = "native", this.relativePosition = "top-left", this.toolbarKind = "floating", this.listen("arcgisInternalLayoutUpdate", () => this.requestUpdate());
+  }
+  static {
+    this.properties = { _availableLength: 16, _toolbars: 16, effectiveRelativeDirection: 16, layout: 3, scale: 3, tooltipAppearance: 1, relativePosition: 1, toolbarKind: 3 };
+  }
+  static {
+    this.styles = [V, x, T, $, A];
+  }
+  #e;
+  #i;
+  #t;
+  #r;
+  #o;
+  #a;
+  get effectiveRelativeDirection() {
+    const [t, e] = this.relativePosition.split("-"), o = this.#r;
+    switch (e) {
+      case "left":
+      case "right":
+        return `${t}-${e}`;
+      case "end":
+        return `${t}-${o === "ltr" ? "right" : "left"}`;
+      case "start":
+        return `${t}-${o === "ltr" ? "left" : "right"}`;
+    }
+  }
+  get layout() {
+    return this._layout;
+  }
+  set layout(t) {
+    t !== this._layout && (this._layout = t, this._updateMeasurement());
+  }
+  connectedCallback() {
+    super.connectedCallback(), this._connectMeasurement(this.#a), this.#i.observe(this.el, { childList: !0 }), this._syncToolbars();
+  }
+  disconnectedCallback() {
+    this.#e.disconnect(), this.#i.disconnect(), super.disconnectedCallback();
+  }
+  _setRulerEl(t) {
+    this.#a !== t && (this.#a = t, this.isConnected && this._connectMeasurement(t));
+  }
+  _connectMeasurement(t) {
+    this.#e.disconnect(), t && (this.#e.observe(t), this._updateMeasurement());
+  }
+  _updateMeasurement(t) {
+    const e = t?.at(0)?.contentRect ?? this.#a?.getBoundingClientRect();
+    e && (this._availableLength = this.layout === "horizontal" ? e.width : e.height);
+  }
+  _syncToolbars() {
+    this.#t?.abort();
+    const t = Array.from(this.el.children).filter(W), e = new AbortController();
+    this.#t = e, Promise.all(t.map((o) => o.componentOnReady())).then(() => {
+      !this.isConnected || e.signal.aborted || (this._toolbars = t);
+    });
+  }
+  _arrangeToolbarLines(t, e) {
+    const o = t.map((r) => {
+      const d = r.allocate(e, this._availableLength);
+      return { toolbar: r, budget: d.reduce((g, y) => g + y.budget, 0) };
+    }), a = [];
+    let i = [], s = 0;
+    for (const r of o) {
+      const d = s + (i.length === 0 ? 0 : O) + r.budget;
+      i.length > 0 && d > this._availableLength ? (a.push(i), i = [r], s = r.budget) : (i.push(r), s = d);
+    }
+    i.length > 0 && a.push(i);
+    const [c, h] = e.relativePosition.split("-"), l = e.layout === "vertical";
+    return (l ? h === "right" : c === "bottom") && a.reverse(), (l ? c === "bottom" : h === "right") && a.forEach((r) => r.reverse()), a;
+  }
+  #s;
+  render() {
+    const t = this._toolbars;
+    if (!t?.length) {
+      this.#s?.length && (this.#o.moveAllToCache(), this.#s = []);
+      return;
+    }
+    const e = {
+      layout: this.layout,
+      relativePosition: this.effectiveRelativeDirection,
+      scale: this.scale,
+      tooltipAppearance: this.tooltipAppearance
+    }, o = this._arrangeToolbarLines(t, e);
+    U(this.#s, o) || (this.#o.moveAllToCache(), this.#s = o.map((h) => h.map(({ toolbar: l }) => l)));
+    const [a, i] = e.relativePosition.split("-"), s = this.layout === "vertical" ? a : i, c = this.#o;
+    return p`<div class="stack" data-horizontal-position=${i ?? v}><div class="ruler" ${_(this._setRulerEl)}></div><div class="toolbar-stack">${o.map((h) => p`<div class="line" data-alignment=${s ?? v}>${h.map(({ toolbar: l, budget: m }) => q(c, l, l.proxiedRender(e, m, this.toolbarKind)))}</div>`)}</div></div>`;
+  }
+}
+function W(n) {
+  return n.localName === "arcgis-toolbar";
+}
+function U(n, t) {
+  return n?.length === t.length && t.every((e, o) => e.length === n[o].length && e.every(({ toolbar: a }, i) => a === n[o][i]));
+}
+k("arcgis-toolbar-stack", K);
+export {
+  K as ArcgisToolbarStack
+};

package/dist/components/arcgis-toolbar-stack/index.d.ts

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-toolbar-stack/index.js

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-unique-values-list/customElement.js

@@ -1,4 +1,4 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as P } from "../../chunks/runtime.js";
 import { keyed as G } from "lit/directives/keyed.js";
 import { LitElement as J, createEvent as T } from "@arcgis/lumina";
@@ -185,8 +185,8 @@ class ce extends J {
   loaded() {
     this.layer && this.fieldInfo && (setTimeout(() => this.initialRender = !1, 800), this.listNode?.setFocus());
   }
-  async willUpdate(e) {
-    this.initialized && (e.has("layer") || e.has("visualizationSource") || e.has("fieldName") || e.has("uniqueValues")) && (await this.processProps(), this.requestUpdate()), e.has("maxHeight") && this.maxHeight && this.listNode?.setAttribute("style", `max-height: ${this.maxHeight || 400}px`);
+  willUpdate(e) {
+    this.initialized && (e.has("layer") || e.has("visualizationSource") || e.has("fieldName") || e.has("uniqueValues")) && this.processProps().then(() => this.requestUpdate()), e.has("maxHeight") && this.maxHeight && this.listNode?.setAttribute("style", `max-height: ${this.maxHeight || 400}px`);
   }
   async processProps() {
     const { layer: e, fieldName: s, view: t, visualizationSource: r } = this, a = (e ? O(e, r) : void 0)?.fields?.filter((u) => u.name === s)?.[0];

package/dist/components/arcgis-value-picker/customElement.js

@@ -1,4 +1,4 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as o } from "../../chunks/runtime.js";
 import { LitElement as n, createEvent as i, nothing as l, safeClassMap as h } from "@arcgis/lumina";
 import { getSlotAssignedElements as r } from "@arcgis/toolkit/dom/slots";

package/dist/components/arcgis-value-picker-collection/customElement.js

@@ -1,4 +1,4 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as s } from "../../chunks/runtime.js";
 import { LitElement as i } from "@arcgis/lumina";
 import { usePropertyChange as a } from "@arcgis/lumina/controllers";

package/dist/components/arcgis-value-picker-combobox/customElement.js

@@ -1,4 +1,4 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/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";

package/dist/components/arcgis-value-picker-label/customElement.js

@@ -1,4 +1,4 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as a } from "../../chunks/runtime.js";
 import { LitElement as r } from "@arcgis/lumina";
 import { css as n, html as c } from "lit";

package/dist/components/arcgis-value-picker-slider/customElement.js

@@ -1,4 +1,4 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+/* COPYRIGHT Esri - https://js.arcgis.com/1.0/LICENSE.txt */
 import { c as r } from "../../chunks/runtime.js";
 import { LitElement as c } from "@arcgis/lumina";
 import { css as l, html as s } from "lit";