@esri/calcite-components 3.0.0-next.98 → 3.0.0

package/dist/components/calcite-tip/customElement.js

@@ -7,11 +7,9 @@ import { l as f } from "../../chunks/logger.js";
 import { a as u } from "../../chunks/dom.js";
 import { u as b } from "../../chunks/useT9n.js";
 import { css as v } from "@lit/reactive-element/css-tag.js";
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v3.0.0-next.98
-*/
+/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+v3.0.0 */
 const e = {
   container: "container",
   header: "header",

package/dist/components/calcite-tip-group/customElement.js

@@ -3,11 +3,9 @@ import { html as o } from "lit-html";
 import { LitElement as t } from "@arcgis/lumina";
 import { l as r } from "../../chunks/logger.js";
 import { css as i } from "@lit/reactive-element/css-tag.js";
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v3.0.0-next.98
-*/
+/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+v3.0.0 */
 const s = i`:host{box-sizing:border-box;display:block;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-color-text-2)}::slotted(calcite-tip){margin:0;border-style:none;max-inline-size:var(--calcite-tip-max-width)}:host([hidden]){display:none}[hidden]{display:none}`;
 class l extends t {
   static {

package/dist/components/calcite-tip-manager/customElement.js

@@ -9,11 +9,9 @@ import { H as b } from "../../chunks/Heading.js";
 import { l as y } from "../../chunks/logger.js";
 import { u as T } from "../../chunks/useT9n.js";
 import { css as k } from "@lit/reactive-element/css-tag.js";
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v3.0.0-next.98
-*/
+/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+v3.0.0 */
 const i = {
   header: "header",
   heading: "heading",

package/dist/components/calcite-tooltip/customElement.js

@@ -1,23 +1,21 @@
-import { c as E } from "../../chunks/runtime.js";
-import { ref as h } from "lit-html/directives/ref.js";
-import { html as w } from "lit";
-import { LitElement as b, createEvent as r, setAttribute as k, safeClassMap as c } from "@arcgis/lumina";
-import { d as p, r as C, a as H, h as y, c as L, F as f } from "../../chunks/floating-ui.js";
-import { g as O } from "../../chunks/guid.js";
-import { o as d } from "../../chunks/openCloseComponent.js";
+import { c as T } from "../../chunks/runtime.js";
+import { ref as d } from "lit-html/directives/ref.js";
+import { html as E } from "lit";
+import { LitElement as w, createEvent as r, setAttribute as b, safeClassMap as c } from "@arcgis/lumina";
+import { d as h, r as k, a as C, h as H, c as y, F as p } from "../../chunks/floating-ui.js";
+import { g as L } from "../../chunks/guid.js";
+import { o as O } from "../../chunks/openCloseComponent.js";
 import { F as S } from "../../chunks/FloatingArrow.js";
 import { q as R, c as x } from "../../chunks/dom.js";
 import { css as A } from "@lit/reactive-element/css-tag.js";
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v3.0.0-next.98
-*/
-const u = {
+/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+v3.0.0 */
+const f = {
   positionContainer: "position-container",
   container: "container"
-}, I = 300, P = 500, m = "aria-describedby";
-function g(n) {
+}, P = 300, I = 500, u = "aria-describedby";
+function v(n) {
   const { referenceElement: e } = n;
   return (typeof e == "string" ? R(n, { id: e }) : e) || null;
 }
@@ -31,11 +29,13 @@ class z {
         const { activeTooltip: t } = this;
         if (t?.open) {
           this.clearHoverTimeout(), this.closeActiveTooltip();
-          const i = g(t), o = e.composedPath();
+          const i = v(t), o = e.composedPath();
           (i instanceof Element && o.includes(i) || o.includes(t)) && e.preventDefault();
         }
       }
     }, this.pointerMoveHandler = (e) => {
+      if (e.defaultPrevented)
+        return;
       const t = e.composedPath(), { activeTooltip: i } = this, o = this.queryTooltip(t);
       if (this.pathHasOpenTooltip(o, t)) {
         this.clearHoverTimeout();
@@ -43,6 +43,8 @@ class z {
       }
       o !== this.clickedTooltip && (o ? this.openHoveredTooltip(o) : i?.open && this.closeHoveredTooltip(), this.clickedTooltip = null);
     }, this.clickHandler = (e) => {
+      if (e.defaultPrevented)
+        return;
       this.clickedTooltip = null;
       const t = e.composedPath(), i = this.queryTooltip(t);
       if (this.pathHasOpenTooltip(i, t)) {
@@ -59,6 +61,8 @@ class z {
     }, this.blurHandler = () => {
       this.closeActiveTooltip();
     }, this.focusInHandler = (e) => {
+      if (e.defaultPrevented)
+        return;
       const t = e.composedPath(), i = this.queryTooltip(t);
       if (this.pathHasOpenTooltip(i, t)) {
         this.clearHoverTimeout();
@@ -70,12 +74,12 @@ class z {
         () => {
           this.hoverOpenTimeout !== null && (this.clearHoverCloseTimeout(), this.closeTooltipIfNotActive(e), this.toggleTooltip(e, !0));
         },
-        this.activeTooltip?.open ? 0 : I
+        this.activeTooltip?.open ? 0 : P
       );
     }, this.closeHoveredTooltip = () => {
       this.hoverCloseTimeout = window.setTimeout(() => {
         this.hoverCloseTimeout !== null && this.closeActiveTooltip();
-      }, P);
+      }, I);
     };
   }
   // --------------------------------------------------------------------------
@@ -142,10 +146,10 @@ class z {
     return e instanceof Element ? x(e) : null;
   }
 }
-const D = A`:host{position:relative;display:block;--calcite-floating-ui-z-index: var(--calcite-tooltip-z-index, var(--calcite-z-index-tooltip))}.position-container{inline-size:max-content;display:none;inset-block-start:0;left:0;z-index:var(--calcite-floating-ui-z-index)}.position-container .calcite-floating-ui-anim{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:inset,left,opacity;opacity:0;box-shadow:0 0 16px #00000029;z-index:var(--calcite-z-index);border-radius:.25rem}.position-container[data-placement^=bottom] .calcite-floating-ui-anim{inset-block-start:-5px}.position-container[data-placement^=top] .calcite-floating-ui-anim{inset-block-start:5px}.position-container[data-placement^=left] .calcite-floating-ui-anim{left:5px}.position-container[data-placement^=right] .calcite-floating-ui-anim{left:-5px}.position-container[data-placement] .calcite-floating-ui-anim--active{opacity:1;inset-block-start:0;left:0}.calcite-floating-ui-arrow{pointer-events:none;position:absolute;z-index:calc(var(--calcite-z-index) * -1);fill:var(--calcite-color-foreground-1)}.calcite-floating-ui-arrow__stroke{stroke:var(--calcite-color-border-3)}.container{position:relative;overflow:hidden;padding-block:.75rem;padding-inline:1rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-medium);border-radius:var(--calcite-tooltip-corner-radius, var(--calcite-corner-radius-round));color:var(--calcite-tooltip-text-color, var(--calcite-color-text-1));max-inline-size:20rem;max-block-size:20rem;text-align:start}.position-container .calcite-floating-ui-anim{border-width:1px;border-style:solid;background-color:var(--calcite-tooltip-background-color, var(--calcite-color-foreground-1));border-color:var(--calcite-tooltip-border-color, var(--calcite-color-border-3));border-radius:var(--calcite-tooltip-corner-radius, var(--calcite-corner-radius-round))}.calcite-floating-ui-arrow{fill:var(--calcite-tooltip-background-color, var(--calcite-color-foreground-1))}.calcite-floating-ui-arrow__stroke{stroke:var(--calcite-tooltip-border-color, var(--calcite-color-border-3))}:host([hidden]){display:none}[hidden]{display:none}`, v = new z();
-class U extends b {
+const D = A`:host{display:contents;--calcite-floating-ui-z-index: var(--calcite-tooltip-z-index, var(--calcite-z-index-tooltip))}.position-container{inline-size:max-content;display:none;inset-block-start:0;left:0;z-index:var(--calcite-floating-ui-z-index)}.position-container .calcite-floating-ui-anim{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:inset,left,opacity;opacity:0;box-shadow:0 0 16px #00000029;z-index:var(--calcite-z-index);border-radius:.25rem}.position-container[data-placement^=bottom] .calcite-floating-ui-anim{inset-block-start:-5px}.position-container[data-placement^=top] .calcite-floating-ui-anim{inset-block-start:5px}.position-container[data-placement^=left] .calcite-floating-ui-anim{left:5px}.position-container[data-placement^=right] .calcite-floating-ui-anim{left:-5px}.position-container[data-placement] .calcite-floating-ui-anim--active{opacity:1;inset-block-start:0;left:0}.calcite-floating-ui-arrow{pointer-events:none;position:absolute;z-index:calc(var(--calcite-z-index) * -1);fill:var(--calcite-color-foreground-1)}.calcite-floating-ui-arrow__stroke{stroke:var(--calcite-color-border-3)}.container{position:relative;overflow:hidden;padding:.75rem 1rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-medium);border-radius:var(--calcite-tooltip-corner-radius, var(--calcite-corner-radius-round));color:var(--calcite-tooltip-text-color, var(--calcite-color-text-1));max-inline-size:20rem;max-block-size:20rem;text-align:start}.position-container .calcite-floating-ui-anim{border-width:1px;border-style:solid;background-color:var(--calcite-tooltip-background-color, var(--calcite-color-foreground-1));border-color:var(--calcite-tooltip-border-color, var(--calcite-color-border-3));border-radius:var(--calcite-tooltip-corner-radius, var(--calcite-corner-radius-round))}.calcite-floating-ui-arrow{fill:var(--calcite-tooltip-background-color, var(--calcite-color-foreground-1))}.calcite-floating-ui-arrow__stroke{stroke:var(--calcite-tooltip-border-color, var(--calcite-color-border-3))}:host([hidden]){display:none}[hidden]{display:none}`, m = new z();
+class U extends w {
   constructor() {
-    super(...arguments), this.guid = `calcite-tooltip-${O()}`, this.openTransitionProp = "opacity", this.floatingLayout = "vertical", this.closeOnClick = !1, this.offsetDistance = p, this.offsetSkidding = 0, this.open = !1, this.overlayPositioning = "absolute", this.placement = "auto", this.calciteTooltipBeforeClose = r({ cancelable: !1 }), this.calciteTooltipBeforeOpen = r({ cancelable: !1 }), this.calciteTooltipClose = r({ cancelable: !1 }), this.calciteTooltipOpen = r({ cancelable: !1 });
+    super(...arguments), this.guid = `calcite-tooltip-${L()}`, this.transitionProp = "opacity", this.floatingLayout = "vertical", this.closeOnClick = !1, this.offsetDistance = h, this.offsetSkidding = 0, this.open = !1, this.overlayPositioning = "absolute", this.placement = "auto", this.calciteTooltipBeforeClose = r({ cancelable: !1 }), this.calciteTooltipBeforeOpen = r({ cancelable: !1 }), this.calciteTooltipClose = r({ cancelable: !1 }), this.calciteTooltipOpen = r({ cancelable: !1 });
   }
   static {
     this.properties = { floatingLayout: 16, referenceEl: 16, closeOnClick: 7, label: 1, offsetDistance: 11, offsetSkidding: 11, open: 7, overlayPositioning: 3, placement: 3, referenceElement: 1 };
@@ -161,9 +165,9 @@ class U extends b {
    * @param delayed
    */
   async reposition(e = !1) {
-    const { referenceEl: t, placement: i, overlayPositioning: o, offsetDistance: s, offsetSkidding: l, arrowEl: a, floatingEl: T } = this;
-    return C(this, {
-      floatingEl: T,
+    const { referenceEl: t, placement: i, overlayPositioning: o, offsetDistance: s, offsetSkidding: l, arrowEl: a, floatingEl: g } = this;
+    return k(this, {
+      floatingEl: g,
       referenceEl: t,
       overlayPositioning: o,
       placement: i,
@@ -176,24 +180,21 @@ class U extends b {
   // #endregion
   // #region Lifecycle
   connectedCallback() {
-    super.connectedCallback(), this.setUpReferenceElement(!0), this.open && d(this);
-  }
-  load() {
-    this.open && d(this);
+    super.connectedCallback(), this.setUpReferenceElement(!0);
   }
   willUpdate(e) {
-    (e.has("offsetDistance") && (this.hasUpdated || this.offsetDistance !== p) || e.has("offsetSkidding") && (this.hasUpdated || this.offsetSkidding !== 0) || e.has("overlayPositioning") && (this.hasUpdated || this.overlayPositioning !== "absolute") || e.has("placement") && (this.hasUpdated || this.placement !== "auto")) && this.reposition(!0), e.has("open") && (this.hasUpdated || this.open !== !1) && this.openHandler(), e.has("referenceElement") && this.setUpReferenceElement();
+    (e.has("offsetDistance") && (this.hasUpdated || this.offsetDistance !== h) || e.has("offsetSkidding") && (this.hasUpdated || this.offsetSkidding !== 0) || e.has("overlayPositioning") && (this.hasUpdated || this.overlayPositioning !== "absolute") || e.has("placement") && (this.hasUpdated || this.placement !== "auto")) && this.reposition(!0), e.has("open") && (this.hasUpdated || this.open !== !1) && this.openHandler(), e.has("referenceElement") && this.setUpReferenceElement();
   }
   loaded() {
     this.referenceElement && !this.referenceEl && this.setUpReferenceElement();
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.removeReferences(), H(this);
+    super.disconnectedCallback(), this.removeReferences(), C(this);
   }
   // #endregion
   // #region Private Methods
   openHandler() {
-    d(this), this.reposition(!0);
+    O(this), this.reposition(!0);
   }
   onBeforeOpen() {
     this.calciteTooltipBeforeOpen.emit();
@@ -205,7 +206,7 @@ class U extends b {
     this.calciteTooltipBeforeClose.emit();
   }
   onClose() {
-    this.calciteTooltipClose.emit(), y(this);
+    this.calciteTooltipClose.emit(), H(this);
   }
   setFloatingEl(e) {
     this.floatingEl = e, e && requestAnimationFrame(() => this.setUpReferenceElement());
@@ -214,7 +215,7 @@ class U extends b {
     this.transitionEl = e;
   }
   setUpReferenceElement(e = !0) {
-    this.removeReferences(), this.referenceEl = g(this.el), L(this);
+    this.removeReferences(), this.referenceEl = v(this.el), y(this);
     const { el: t, referenceElement: i, referenceEl: o } = this;
     e && i && !o && console.warn(`${t.tagName}: reference-element id "${i}" was not found.`, {
       el: t
@@ -228,23 +229,23 @@ class U extends b {
     if (!e)
       return;
     const t = this.getId();
-    "setAttribute" in e && e.setAttribute(m, t), v.registerElement(e, this.el);
+    "setAttribute" in e && e.setAttribute(u, t), m.registerElement(e, this.el);
   }
   removeReferences() {
     const { referenceEl: e } = this;
-    e && ("removeAttribute" in e && e.removeAttribute(m), v.unregisterElement(e));
+    e && ("removeAttribute" in e && e.removeAttribute(u), m.unregisterElement(e));
   }
   // #endregion
   // #region Rendering
   render() {
     const { referenceEl: e, label: t, open: i, floatingLayout: o } = this, s = e && i, l = !s;
-    return this.el.inert = l, this.el.ariaLabel = t, this.el.ariaLive = "polite", k(this.el, "id", this.getId()), this.el.role = "tooltip", w`<div class=${c(u.positionContainer)} ${h(this.setFloatingEl)}><div class=${c({
-      [f.animation]: !0,
-      [f.animationActive]: s
-    })} ${h(this.setTransitionEl)}>${S({ floatingLayout: o, ref: (a) => this.arrowEl = a })}<div class=${c(u.container)}><slot></slot></div></div></div>`;
+    return this.el.inert = l, this.el.ariaLabel = t, this.el.ariaLive = "polite", b(this.el, "id", this.getId()), this.el.role = "tooltip", E`<div class=${c(f.positionContainer)} ${d(this.setFloatingEl)}><div class=${c({
+      [p.animation]: !0,
+      [p.animationActive]: s
+    })} ${d(this.setTransitionEl)}>${S({ floatingLayout: o, ref: (a) => this.arrowEl = a })}<div class=${c(f.container)}><slot></slot></div></div></div>`;
   }
 }
-E("calcite-tooltip", U);
+T("calcite-tooltip", U);
 export {
   U as Tooltip
 };

package/dist/components/calcite-tree/customElement.js

@@ -3,11 +3,9 @@ import { html as y } from "lit";
 import { LitElement as E, createEvent as T, setAttribute as A } from "@arcgis/lumina";
 import { b, n as p, s as M, t as S } from "../../chunks/dom.js";
 import { css as C } from "@lit/reactive-element/css-tag.js";
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v3.0.0-next.98
-*/
+/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+v3.0.0 */
 function g(h) {
   return h?.tagName === "CALCITE-TREE-ITEM";
 }

package/dist/components/calcite-tree-item/customElement.js

@@ -7,11 +7,9 @@ import { f as T, s as P, a as q, g as L, t as m } from "../../chunks/dom.js";
 import { u as R, I as H } from "../../chunks/interactive.js";
 import { g as h } from "../../chunks/component.js";
 import { css as F } from "@lit/reactive-element/css-tag.js";
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v3.0.0-next.98
-*/
+/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+v3.0.0 */
 const i = {
   actionsEnd: "actions-end",
   bulletPointIcon: "bullet-point",
@@ -36,18 +34,22 @@ const i = {
   chevronRight: "chevron-right",
   minusSquareF: "minus-square-f",
   square: "square"
-}, D = F`:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host([scale=s]){--calcite-internal-tree-item-spacing-unit: .25rem;--calcite-internal-tree-item-padding-block: .25rem;--calcite-internal-tree-item-children-container-padding: 1.25rem;--calcite-internal-tree-item-line-left-position: .75rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=m]){--calcite-internal-tree-item-spacing-unit: .5rem;--calcite-internal-tree-item-padding-block: .5rem;--calcite-internal-tree-item-children-container-padding: 1.5rem;--calcite-internal-tree-item-line-left-position: 1rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]){--calcite-internal-tree-item-spacing-unit: .75rem;--calcite-internal-tree-item-padding-block: .625rem;--calcite-internal-tree-item-children-container-padding: 2.25rem;--calcite-internal-tree-item-line-left-position: 1.5rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host{display:block;max-inline-size:100%;cursor:pointer;color:var(--calcite-color-text-3)}:host .children-container ::slotted(*){padding-inline-start:var(--calcite-internal-tree-item-children-container-padding)}.node-actions-container{display:flex}.node-actions-container .node-container,.node-actions-container .checkbox-container{gap:var(--calcite-internal-tree-item-spacing-unit)}.node-actions-container .node-container{padding-inline:var(--calcite-internal-tree-item-spacing-unit);padding-block:var(--calcite-internal-tree-item-padding-block)}:host([calcite-hydrated-hidden]){visibility:hidden!important;pointer-events:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([lines]) .children-container:after{position:absolute;inset-block-start:0px;z-index:var(--calcite-z-index);inline-size:1px;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:background-color,block-size,border-color,box-shadow,color,inset-block-end,inset-block-start,inset-inline-end,inset-inline-start,inset-size,opacity,outline-color,transform;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out;block-size:100%;left:var(--calcite-internal-tree-item-line-left-position);content:"";background-color:var(--calcite-color-border-2)}:host(:not([lines])) .node-container:after{display:none}::slotted(*){min-inline-size:0px;max-inline-size:100%;overflow-wrap:break-word;color:inherit;text-decoration:none!important}::slotted(*):hover{text-decoration:none!important}::slotted(a){inline-size:100%;text-decoration-line:none}:host{outline:2px solid transparent;outline-offset:2px}:host .node-container{outline-color:transparent}:host:focus .node-container,:host:active .node-container{outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}:host(:focus:not([disabled])) .node-container{outline:2px solid transparent;outline-offset:2px;outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}:host(:focus:not([disabled])) .checkbox{outline:2px solid transparent;outline-offset:2px}.actions-end{display:flex;flex-direction:row;align-items:center;align-self:stretch}.checkbox-container{display:flex;align-items:center}.checkbox{line-height:0;color:var(--calcite-color-border-input)}.checkbox-label{pointer-events:none;display:flex;align-items:center}.children-container{position:relative;block-size:0px;transform-origin:top;overflow:hidden;opacity:0;transform:scaleY(0);transition:var(--calcite-animation-timing) cubic-bezier(.215,.44,.42,.88),opacity var(--calcite-animation-timing) cubic-bezier(.215,.44,.42,.88),all var(--calcite-animation-timing) ease-in-out}.item--expanded>.children-container{overflow:visible;opacity:1;transform:none;block-size:auto}.node-container{position:relative;display:flex;min-inline-size:0px;flex-grow:1;align-items:center}.node-container .checkmark,.node-container .bullet-point{opacity:0;transition-property:background-color,block-size,border-color,box-shadow,color,inset-block-end,inset-block-start,inset-inline-end,inset-inline-start,inset-size,opacity,outline-color,transform;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out;color:var(--calcite-color-border-1)}.node-container:hover .checkmark,.node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark,:host([selected]) .node-container:hover .bullet-point,:host(:focus:not([disabled])) .node-container .checkmark,:host(:focus:not([disabled])) .node-container .bullet-point{opacity:1}:host([selected]) .node-container,:host([selected]) .node-container:hover{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}:host([selected]) .node-container .bullet-point,:host([selected]) .node-container .checkmark,:host([selected]) .node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark{opacity:1;color:var(--calcite-color-brand)}:host([has-children]) .node-container .bullet-point,:host([has-children]) .node-container .checkmark{display:none}.chevron{position:relative;align-self:center;color:var(--calcite-color-text-3);transition-property:background-color,block-size,border-color,box-shadow,color,inset-block-end,inset-block-start,inset-inline-end,inset-inline-start,inset-size,opacity,outline-color,transform;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out;flex:0 0 auto;transform:rotate(0)}.calcite--rtl .chevron{transform:rotate(180deg)}.item--expanded .node-container>.chevron{transform:rotate(90deg)}:host([selected]) .checkmark,:host([selected]) .bullet-point{color:var(--calcite-color-brand)}:host([selected]) .checkbox{color:var(--calcite-color-brand)}:host([has-children][indeterminate]) .checkbox{color:var(--calcite-color-brand)}:host([hidden]){display:none}[hidden]{display:none}`;
-class U extends A {
+}, U = F`:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host([scale=s]){--calcite-internal-tree-item-spacing-unit: .25rem;--calcite-internal-tree-item-padding-block: .25rem;--calcite-internal-tree-item-children-container-padding: 1.25rem;--calcite-internal-tree-item-line-left-position: .75rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=m]){--calcite-internal-tree-item-spacing-unit: .5rem;--calcite-internal-tree-item-padding-block: .5rem;--calcite-internal-tree-item-children-container-padding: 1.5rem;--calcite-internal-tree-item-line-left-position: 1rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]){--calcite-internal-tree-item-spacing-unit: .75rem;--calcite-internal-tree-item-padding-block: .625rem;--calcite-internal-tree-item-children-container-padding: 2.25rem;--calcite-internal-tree-item-line-left-position: 1.5rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host{display:block;max-inline-size:100%;cursor:pointer;color:var(--calcite-color-text-3)}:host .children-container ::slotted(*){padding-inline-start:var(--calcite-internal-tree-item-children-container-padding)}.node-actions-container{display:flex}.node-actions-container .node-container,.node-actions-container .checkbox-container{gap:var(--calcite-internal-tree-item-spacing-unit)}.node-actions-container .node-container{padding-inline:var(--calcite-internal-tree-item-spacing-unit);padding-block:var(--calcite-internal-tree-item-padding-block)}:host([calcite-hydrated-hidden]){visibility:hidden!important;pointer-events:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([lines]) .children-container:after{position:absolute;inset-block-start:0px;z-index:var(--calcite-z-index);inline-size:1px;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:background-color,block-size,border-color,box-shadow,color,inset-block-end,inset-block-start,inset-inline-end,inset-inline-start,inset-size,opacity,outline-color,transform;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out;block-size:100%;inset-inline-start:var(--calcite-internal-tree-item-line-left-position);content:"";background-color:var(--calcite-color-border-2)}:host(:not([lines])) .node-container:after{display:none}::slotted(*){min-inline-size:0px;max-inline-size:100%;overflow-wrap:break-word;color:inherit;text-decoration:none!important}::slotted(*):hover{text-decoration:none!important}::slotted(a){inline-size:100%;text-decoration-line:none}:host{outline:2px solid transparent;outline-offset:2px}:host .node-container{outline-color:transparent}:host:focus .node-container,:host:active .node-container{outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}:host(:focus:not([disabled])) .node-container{outline:2px solid transparent;outline-offset:2px;outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}:host(:focus:not([disabled])) .checkbox{outline:2px solid transparent;outline-offset:2px}.actions-end{display:flex;flex-direction:row;align-items:center;align-self:stretch}.checkbox-container{display:flex;align-items:center}.checkbox{line-height:0;color:var(--calcite-color-border-input)}.checkbox-label{pointer-events:none;display:flex;align-items:center}.children-container{position:relative;block-size:0px;transform-origin:top;overflow:hidden;opacity:0;transform:scaleY(0);transition:var(--calcite-animation-timing) cubic-bezier(.215,.44,.42,.88),opacity var(--calcite-animation-timing) cubic-bezier(.215,.44,.42,.88),all var(--calcite-animation-timing) ease-in-out}.item--expanded>.children-container{overflow:visible;opacity:1;transform:none;block-size:auto}.node-container{position:relative;display:flex;min-inline-size:0px;flex-grow:1;align-items:center}.node-container .checkmark,.node-container .bullet-point{opacity:0;transition-property:background-color,block-size,border-color,box-shadow,color,inset-block-end,inset-block-start,inset-inline-end,inset-inline-start,inset-size,opacity,outline-color,transform;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out;color:var(--calcite-color-border-1)}.node-container:hover .checkmark,.node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark,:host([selected]) .node-container:hover .bullet-point,:host(:focus:not([disabled])) .node-container .checkmark,:host(:focus:not([disabled])) .node-container .bullet-point{opacity:1}:host([selected]) .node-container,:host([selected]) .node-container:hover{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}:host([selected]) .node-container .bullet-point,:host([selected]) .node-container .checkmark,:host([selected]) .node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark{opacity:1;color:var(--calcite-color-brand)}:host([has-children]) .node-container .bullet-point,:host([has-children]) .node-container .checkmark{display:none}.chevron{position:relative;align-self:center;color:var(--calcite-color-text-3);transition-property:background-color,block-size,border-color,box-shadow,color,inset-block-end,inset-block-start,inset-inline-end,inset-inline-start,inset-size,opacity,outline-color,transform;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out;flex:0 0 auto;transform:rotate(0)}.calcite--rtl .chevron{transform:rotate(180deg)}.item--expanded .node-container>.chevron{transform:rotate(90deg)}:host([selected]) .checkmark,:host([selected]) .bullet-point{color:var(--calcite-color-brand)}:host([selected]) .checkbox{color:var(--calcite-color-brand)}:host([has-children][indeterminate]) .checkbox{color:var(--calcite-color-brand)}:host([hidden]){display:none}[hidden]{display:none}`;
+class D extends A {
   // #endregion
   // #region Lifecycle
   constructor() {
-    super(), this.actionSlotWrapper = $(), this.userChangedValue = !1, this.hasEndActions = !1, this.updateAfterInitialRender = !1, this.depth = -1, this.disabled = !1, this.expanded = !1, this.hasChildren = null, this.indeterminate = !1, this.parentExpanded = !1, this.selected = !1, this.calciteInternalTreeItemSelect = z({ cancelable: !1 }), this.listen("click", this.onClick), this.listen("keydown", this.keyDownHandler);
+    super(), this.actionSlotWrapper = $(), this.userChangedValue = !1, this.hasEndActions = !1, this.updateAfterInitialRender = !1, this.depth = -1, this.disabled = !1, this.expanded = !1, this.indeterminate = !1, this.parentExpanded = !1, this.selected = !1, this.calciteInternalTreeItemSelect = z({ cancelable: !1 }), this.listen("click", this.onClick), this.listen("keydown", this.keyDownHandler);
   }
   static {
-    this.properties = { hasEndActions: 16, updateAfterInitialRender: 16, depth: 11, disabled: 7, expanded: 7, hasChildren: 7, iconFlipRtl: 3, iconStart: 3, indeterminate: 7, label: 1, lines: 7, parentExpanded: 5, scale: 3, selected: 7, selectionMode: 3 };
+    this.properties = { hasEndActions: 16, updateAfterInitialRender: 16, depth: 11, disabled: 7, expanded: 7, hasChildren: 39, iconFlipRtl: 3, iconStart: 3, indeterminate: 7, label: 1, lines: 7, parentExpanded: 5, scale: 3, selected: 7, selectionMode: 3 };
   }
   static {
-    this.styles = D;
+    this.styles = U;
+  }
+  /** @private */
+  get hasChildren() {
+    return !!this.childTree;
   }
   connectedCallback() {
     super.connectedCallback(), this.parentTreeItem = this.el.parentElement?.closest("calcite-tree-item");
@@ -118,7 +120,7 @@ class U extends A {
   }
   handleChildrenSlotChange(e) {
     const t = P(e).filter((o) => o.matches("calcite-tree"))[0];
-    this.childTree = t, this.updateChildTree();
+    this.childTree = t, this.requestUpdate("hasChildren"), this.updateChildTree();
   }
   isActionEndEvent(e) {
     return e.composedPath().includes(this.actionSlotWrapper.value);
@@ -147,7 +149,7 @@ class U extends A {
     this.hasEndActions = q(e);
   }
   preWillUpdate() {
-    this.hasChildren = !!this.el.querySelector("calcite-tree"), this.depth = 0;
+    this.depth = 0;
     let e = this.el.closest("calcite-tree");
     if (!e)
       return;
@@ -176,7 +178,7 @@ class U extends A {
     })} data-test-id=calcite-tree-children @click=${this.childrenClickHandler} .role=${this.hasChildren ? "group" : void 0}><slot name=${v.children} @slotchange=${this.handleChildrenSlotChange}></slot></div></div>` });
   }
 }
-I("calcite-tree-item", U);
+I("calcite-tree-item", D);
 export {
-  U as TreeItem
+  D as TreeItem
 };

package/dist/components/interfaces.d.ts

@@ -1,5 +1,9 @@
 export type Alignment = "start" | "center" | "end";
 export type Appearance = "solid" | "outline" | "outline-fill" | "transparent";
+export interface Dimensions {
+    width: number;
+    height: number;
+}
 export type FlipContext = "both" | "start" | "end";
 export type Height = Scale;
 export type Kind = "brand" | "danger" | "info" | "inverse" | "neutral" | "warning" | "success";

package/dist/controllers/useFocusTrap.d.ts

@@ -0,0 +1,67 @@
+import { makeGenericController } from '@arcgis/components-controllers';
+import { FocusTrap, Options as Options } from 'focus-trap';
+import { LitElement } from '@arcgis/lumina';
+export interface UseFocusTrap {
+    /**
+     * Activates the focus trap.
+     *
+     * @see https://github.com/focus-trap/focus-trap#trapactivate
+     */
+    activate: (options?: Parameters<FocusTrap["activate"]>[0]) => void;
+    /**
+     * Deactivates the focus trap.
+     *
+     * @see https://github.com/focus-trap/focus-trap#trapdeactivate
+     */
+    deactivate: (options?: Parameters<FocusTrap["deactivate"]>[0]) => void;
+    /**
+     * By default, the host element will be used as the focus-trap element, but if the focus-trap element needs to be a different element, use this method prior to activating to set the focus-trap element.
+     */
+    overrideFocusTrapEl: (el: HTMLElement) => void;
+    /**
+     * Updates focusable elements within the trap.
+     *
+     * @see https://github.com/focus-trap/focus-trap#trapupdatecontainerelements
+     */
+    updateContainerElements: (extraContainers?: FocusTrapOptions["extraContainers"]) => void;
+}
+interface UseFocusTrapOptions<T extends LitElement = LitElement> {
+    /**
+     * The name of the prop that will trigger the focus trap to activate.
+     */
+    triggerProp: keyof T;
+    /**
+     * Options to pass to the focus-trap library.
+     */
+    focusTrapOptions?: Options;
+}
+interface FocusTrapComponent extends LitElement {
+    focusTrapDisabled?: boolean;
+    /**
+     * When defined, provides a condition to disable focus trapping. When `true`, prevents focus trapping.
+     */
+    focusTrapDisabledOverride?: () => boolean;
+    /**
+     * Additional options to configure the focus trap.
+     */
+    focusTrapOptions?: Partial<FocusTrapOptions>;
+}
+export type FocusTrapOptions = 
+/**
+ * @see https://github.com/focus-trap/focus-trap#createoptions
+ */
+Pick<Options, "allowOutsideClick" | "initialFocus" | "returnFocusOnDeactivate"> & {
+    /**
+     * Additional elements to include in the focus trap. This is useful for including elements that may have related parts rendered outside the main focus-trap element.
+     */
+    extraContainers: Parameters<FocusTrap["updateContainerElements"]>[0];
+};
+/**
+ * A controller for managing focus traps.
+ *
+ * Note: traps will be deactivated automatically when the component is disconnected.
+ *
+ * @param options
+ */
+export declare const useFocusTrap: <T extends FocusTrapComponent>(options: UseFocusTrapOptions<T>) => ReturnType<typeof makeGenericController<UseFocusTrap, T>>;
+export {};

package/dist/custom-theme/block.d.ts

@@ -1,10 +1,9 @@
 export declare const blockTokens: {
     calciteBlockBorderColor: string;
-    calciteBlockContentStartColor: string;
     calciteBlockHeaderBackgroundColor: string;
-    calciteBlockHeaderDescriptionColor: string;
-    calciteBlockHeaderIconColor: string;
-    calciteBlockIconColorEnd: string;
-    calciteBlockIconColorStart: string;
+    calciteBlockHeaderBackgroundColorHover: string;
+    calciteBlockTextColor: string;
+    calciteBlockHeadingTextColor: string;
+    calciteBlockHeadingTextColorPress: string;
 };
 export declare const block: string;

package/dist/custom-theme/calcite-shell-panel.d.ts

@@ -0,0 +1,13 @@
+export declare const sliderTokens: {
+    calciteSliderTextColor: string;
+    calciteSliderTrackColor: string;
+    calciteSliderTrackFillColor: string;
+    calciteSliderHandleFillColor: string;
+    calciteSliderHandleExtensionColor: string;
+    calciteSliderAccentColor: string;
+    calciteSliderTickColor: string;
+    calciteSliderTickBorderColor: string;
+    calciteSliderTickSelectedColor: string;
+    calciteSliderGraphColor: string;
+};
+export declare const slider: string;

package/dist/custom-theme/date-picker.d.ts

@@ -1 +1,29 @@
+export declare const datePickerTokens: {
+    calciteDatePickerBorderColor: string;
+    calciteDatePickerCornerRadius: string;
+    calciteDatePickerRangeCalendarDividerColor: string;
+    calciteDatePickerWeekHeaderTextColor: string;
+    calciteDatePickerHeaderActionBackgroundColor: string;
+    calciteDatePickerHeaderActionBackgroundColorHover: string;
+    calciteDatePickerHeaderActionBackgroundColorPress: string;
+    calciteDatePickerHeaderActionTextColor: string;
+    calciteDatePickerHeaderActionTextColorPress: string;
+    calciteDatePickerYearTextColor: string;
+    calciteDatePickerMonthSelectFontSize: string;
+    calciteDatePickerMonthSelectTextColor: string;
+    calciteDatePickerMonthSelectIconColor: string;
+    calciteDatePickerMonthSelectIconColorHover: string;
+    calciteDatePickerDayBackgroundColor: string;
+    calciteDatePickerDayBackgroundColorHover: string;
+    calciteDatePickerDayTextColor: string;
+    calciteDatePickerDayTextColorHover: string;
+    calciteDatePickerCurrentDayTextColor: string;
+    calciteDatePickerDayBackgroundColorSelected: string;
+    calciteDatePickerDayTextColorSelected: string;
+    calciteDatePickerDayRangeTextColor: string;
+    calciteDatePickerDayRangeBackgroundColor: string;
+    calciteDatePickerDayOutsideRangeBackgroundColorHover: string;
+    calciteDatePickerDayOutsideRangeTextColorHover: string;
+};
 export declare const datePicker: string;
+export declare const datePickerRange: string;

package/dist/custom-theme/flow.d.ts

@@ -0,0 +1,21 @@
+export declare const flowTokens: {
+    calciteFlowBackgroundColor: string;
+    calciteFlowHeaderBackgroundColor: string;
+    calciteFlowFooterBackgroundColor: string;
+    calciteFlowSpace: string;
+    calciteFlowHeaderContentSpace: string;
+    calciteFlowFooterSpace: string;
+    calciteActionBackgroundColor: string;
+    calciteActionBackgroundColorHover: string;
+    calciteActionBackgroundColorPressed: string;
+    calciteActionTextColorHover: string;
+    calciteActionTextColorPressed: string;
+    calcitePopoverBorderColor: string;
+    calciteFlowHeaderActionBackgroundColorHover: string;
+    calciteFlowHeaderActionBackgroundColorPress: string;
+    calciteFlowHeaderActionBackgroundColor: string;
+    calciteFlowHeaderActionIndicatorColor: string;
+    calciteFlowHeaderActionTextColorPress: string;
+    calciteFlowHeaderActionTextColor: string;
+};
+export declare const flow: string;

package/dist/custom-theme/graph.d.ts

@@ -0,0 +1,4 @@
+export declare const graphTokens: {
+    calciteGraphHighlightFillColor: string;
+};
+export declare const graph: string;

package/dist/custom-theme/inline-editable.d.ts

@@ -0,0 +1,10 @@
+export declare const inlineEditableTokens: {
+    calciteInlineEditableBackgroundColor: string;
+    calciteInlineEditableBackgroundColorHover: string;
+    calciteInlineEditableButtonBackgroundColor: string;
+    calciteInlineEditableButtonCornerRadius: string;
+    calciteInlineEditableButtonLoaderColor: string;
+    calciteInlineEditableButtonShadowColor: string;
+    calciteInlineEditableButtonTextColor: string;
+};
+export declare const inlineEditable: string;

package/dist/custom-theme/segmented-control.d.ts

@@ -1 +1,8 @@
+export declare const segmentedControlTokens: {
+    calciteSegmentedControlColor: string;
+    calciteSegmentedControlBackgroundColor: string;
+    calciteSegmentedControlBorderColor: string;
+    calciteSegmentedControlShadow: string;
+    calciteSegmentedControlIconColor: string;
+};
 export declare const segmentedControl: string;