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

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

@@ -2,31 +2,29 @@ import { c as r } from "../../chunks/runtime.js";
 import { ref as c } from "lit-html/directives/ref.js";
 import { html as l } from "lit";
 import { LitElement as d, safeClassMap as m } from "@arcgis/lumina";
-import { c as h } from "../../chunks/observers.js";
-import { c as f, s as u, a as p } from "../../chunks/loadable.js";
-import { z as w } from "../../chunks/dom.js";
-import { css as g } 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
-*/
+import { c as f } from "../../chunks/observers.js";
+import { c as h } from "../../chunks/loadable.js";
+import { z as u } from "../../chunks/dom.js";
+import { css as p } 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 */
 const n = {
   frame: "frame",
   frameAdvancing: "frame--advancing",
   frameRetreating: "frame--retreating"
-}, b = g`:host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;align-items:stretch;overflow:hidden;background-color:transparent}:host .frame{position:relative;margin:0;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;padding:0;animation-name:none;animation-duration:var(--calcite-animation-timing)}:host ::slotted(*){display:none;block-size:100%}:host ::slotted(*[selected]){display:flex}:host ::slotted(.calcite-match-height:last-child){display:flex;flex:1 1 auto;overflow:hidden}:host .frame--advancing{animation-name:calcite-frame-advance}:host .frame--retreating{animation-name:calcite-frame-retreat}@keyframes calcite-frame-advance{0%{--tw-bg-opacity: .5;transform:translate3d(50px,0,0)}to{--tw-bg-opacity: 1;transform:translateZ(0)}}@keyframes calcite-frame-retreat{0%{--tw-bg-opacity: .5;transform:translate3d(-50px,0,0)}to{--tw-bg-opacity: 1;transform:translateZ(0)}}:host([hidden]){display:none}[hidden]{display:none}`;
-class v extends d {
+}, w = p`:host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;align-items:stretch;overflow:hidden;background-color:transparent}:host .frame{position:relative;margin:0;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;padding:0;animation-name:none;animation-duration:var(--calcite-animation-timing);background-color:var(--calcite-flow-background-color)}:host ::slotted(*){display:none;block-size:100%}:host ::slotted(*[selected]){display:flex}:host ::slotted(.calcite-match-height:last-child){display:flex;flex:1 1 auto;overflow:hidden}:host .frame--advancing{animation-name:calcite-frame-advance}:host .frame--retreating{animation-name:calcite-frame-retreat}@keyframes calcite-frame-advance{0%{--tw-bg-opacity: .5;transform:translate3d(50px,0,0)}to{--tw-bg-opacity: 1;transform:translateZ(0)}}@keyframes calcite-frame-retreat{0%{--tw-bg-opacity: .5;transform:translate3d(-50px,0,0)}to{--tw-bg-opacity: 1;transform:translateZ(0)}}:host([hidden]){display:none}[hidden]{display:none}`;
+class g extends d {
   // #endregion
   // #region Lifecycle
   constructor() {
-    super(), this.itemMutationObserver = h("mutation", () => this.handleMutationObserverChange()), this.selectedIndex = -1, this.flowDirection = "standby", this.items = [], this.listen("calciteInternalFlowItemChange", this.handleCalciteInternalFlowItemChange), this.listen("calciteFlowItemBack", this.handleItemBackClick);
+    super(), this.itemMutationObserver = f("mutation", () => this.updateItemsAndProps()), this.items = [], this.selectedIndex = -1, this.flowDirection = "standby", this.listen("calciteInternalFlowItemChange", this.handleCalciteInternalFlowItemChange), this.listen("calciteFlowItemBack", this.handleItemBackClick);
   }
   static {
-    this.properties = { flowDirection: 16, items: 16, customItemSelectors: 1 };
+    this.properties = { flowDirection: 16, customItemSelectors: 1 };
   }
   static {
-    this.styles = b;
+    this.styles = w;
   }
   // #endregion
   // #region Public Methods
@@ -53,21 +51,20 @@ class v extends d {
    * @returns Promise<void>
    */
   async setFocus() {
-    await f(this);
+    await h(this);
     const { items: e } = this;
     return e[this.selectedIndex]?.setFocus();
   }
   connectedCallback() {
-    super.connectedCallback(), this.itemMutationObserver?.observe(this.el, { childList: !0, subtree: !0 }), this.handleMutationObserverChange();
+    super.connectedCallback(), this.itemMutationObserver?.observe(this.el, { childList: !0, subtree: !0 });
   }
   load() {
-    u(this);
   }
   willUpdate(e) {
     e.has("flowDirection") && (this.hasUpdated || this.flowDirection !== "standby") && this.handleFlowDirectionChange(this.flowDirection);
   }
   loaded() {
-    p(this);
+    this.updateItemsAndProps();
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this.itemMutationObserver?.disconnect();
@@ -75,7 +72,7 @@ class v extends d {
   // #endregion
   // #region Private Methods
   async handleFlowDirectionChange(e) {
-    e !== "standby" && (await w(this.frameEl, e === "retreating" ? "calcite-frame-retreat" : "calcite-frame-advance"), this.resetFlowDirection());
+    e !== "standby" && (await u(this.frameEl, e === "retreating" ? "calcite-frame-retreat" : "calcite-frame-advance"), this.resetFlowDirection());
   }
   handleCalciteInternalFlowItemChange(e) {
     e.stopPropagation(), this.updateFlowProps();
@@ -91,7 +88,7 @@ class v extends d {
     const t = e > 0;
     return !(e > -1 && i > 0) && !t ? "standby" : i < e ? "retreating" : "advancing";
   }
-  handleMutationObserverChange() {
+  updateItemsAndProps() {
     const { customItemSelectors: e, el: i } = this, t = Array.from(i.querySelectorAll(`calcite-flow-item${e ? `,${e}` : ""}`)).filter((a) => a.closest("calcite-flow") === i);
     this.items = t, this.ensureSelectedFlowItemExists(), this.updateFlowProps();
   }
@@ -127,7 +124,7 @@ class v extends d {
     return l`<div class=${m(i)} ${c(this.setFrameEl)}><slot></slot></div>`;
   }
 }
-r("calcite-flow", v);
+r("calcite-flow", g);
 export {
-  v as Flow
+  g as Flow
 };

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

@@ -1,22 +1,20 @@
-import { c as B } from "../../chunks/runtime.js";
+import { c as w } from "../../chunks/runtime.js";
 import { ref as d } from "lit-html/directives/ref.js";
-import { keyed as w } from "lit-html/directives/keyed.js";
-import { html as h, nothing as C } from "lit";
-import { LitElement as I, createEvent as s, safeClassMap as y } from "@arcgis/lumina";
-import { g as v } from "../../chunks/dom.js";
-import { u as S, I as E } from "../../chunks/interactive.js";
-import { c as P, s as F, a as T } from "../../chunks/loadable.js";
+import { keyed as v } from "lit-html/directives/keyed.js";
+import { html as h, nothing as B } from "lit";
+import { LitElement as C, createEvent as c, safeClassMap as I } from "@arcgis/lumina";
+import { g as y } from "../../chunks/dom.js";
+import { u as x, I as S } from "../../chunks/interactive.js";
+import { c as E } from "../../chunks/loadable.js";
 import { S as t } from "../../chunks/resources3.js";
-import { u as x } from "../../chunks/useT9n.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 L = {
+import { u as P } from "../../chunks/useT9n.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 */
+const T = {
   backButton: "back-button"
-}, m = {
+}, f = {
   backLeft: "chevron-left",
   backRight: "chevron-right"
 }, o = {
@@ -33,16 +31,16 @@ const L = {
   footerActions: "footer-actions",
   footerEnd: "footer-end",
   footerStart: "footer-start"
-}, O = A`:host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}: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{position:relative;display:none;inline-size:100%;flex:1 1 auto;overflow:hidden}:host([selected]){display:flex}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);border-inline-end-width:1px}calcite-panel{--calcite-panel-footer-padding: var(--calcite-flow-item-footer-padding);--calcite-panel-header-border-block-end: var(--calcite-flow-item-header-border-block-end)}:host([hidden]){display:none}[hidden]{display:none}`;
-class R extends I {
+}, A = F`:host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}: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{position:relative;display:none;inline-size:100%;flex:1 1 auto;overflow:hidden}:host([selected]){display:flex}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.back-button{border-width:0px;border-style:solid;border-inline-end-width:1px;border-color:var(--calcite-flow-border-color, var(--calcite-color-border-3))}calcite-panel{--calcite-panel-background-color: var(--calcite-flow-background-color);--calcite-panel-border-color: var(--calcite-flow-border-color, var(--calcite-flow-item-header-border-block-end));--calcite-panel-corner-radius: var(--calcite-flow-corner-radius);--calcite-panel-description-text-color: var(--calcite-flow-description-text-color);--calcite-panel-footer-background-color: var(--calcite-flow-footer-background-color);--calcite-panel-footer-space: var(--calcite-flow-footer-space, var(--calcite-flow-item-footer-padding));--calcite-panel-header-action-background-color-hover: var(--calcite-flow-header-action-background-color-hover);--calcite-panel-header-action-background-color-press: var(--calcite-flow-header-action-background-color-press);--calcite-panel-header-action-background-color: var(--calcite-flow-header-action-background-color);--calcite-panel-header-action-indicator-color: var(--calcite-flow-header-action-indicator-color);--calcite-panel-header-action-text-color-press: var(--calcite-flow-header-action-text-color-press);--calcite-panel-header-action-text-color: var(--calcite-flow-header-action-text-color);--calcite-panel-header-background-color: var(--calcite-flow-header-background-color);--calcite-panel-header-content-space: var(--calcite-flow-header-content-space);--calcite-panel-heading-text-color: var(--calcite-flow-heading-text-color);--calcite-panel-space: var(--calcite-flow-space)}:host([hidden]){display:none}[hidden]{display:none}`;
+class L extends C {
   constructor() {
-    super(...arguments), this.closable = !1, this.closed = !1, this.collapseDirection = "down", this.collapsed = !1, this.collapsible = !1, this.disabled = !1, this.loading = !1, this.menuOpen = !1, this.messages = x(), this.overlayPositioning = "absolute", this.scale = "m", this.selected = !1, this.showBackButton = !1, this.calciteFlowItemBack = s(), this.calciteFlowItemClose = s({ cancelable: !1 }), this.calciteFlowItemScroll = s({ cancelable: !1 }), this.calciteFlowItemToggle = s({ cancelable: !1 }), this.calciteInternalFlowItemChange = s({ cancelable: !1 });
+    super(...arguments), this.closable = !1, this.closed = !1, this.collapseDirection = "down", this.collapsed = !1, this.collapsible = !1, this.disabled = !1, this.loading = !1, this.menuOpen = !1, this.messages = P(), this.overlayPositioning = "absolute", this.scale = "m", this.selected = !1, this.showBackButton = !1, this.calciteFlowItemBack = c(), this.calciteFlowItemClose = c({ cancelable: !1 }), this.calciteFlowItemScroll = c({ cancelable: !1 }), this.calciteFlowItemToggle = c({ cancelable: !1 }), this.calciteInternalFlowItemChange = c({ cancelable: !1 });
   }
   static {
     this.properties = { beforeBack: 0, beforeClose: 0, closable: 7, closed: 7, collapseDirection: 1, collapsed: 7, collapsible: 7, description: 1, disabled: 7, heading: 1, headingLevel: 11, loading: 7, menuOpen: 7, messageOverrides: 0, overlayPositioning: 3, scale: 3, selected: 7, showBackButton: 5 };
   }
   static {
-    this.styles = O;
+    this.styles = A;
   }
   // #endregion
   // #region Public Methods
@@ -67,7 +65,7 @@ class R extends I {
    * @returns promise.
    */
   async setFocus() {
-    await P(this);
+    await E(this);
     const { backButtonEl: e, containerEl: a } = this;
     if (e)
       return e.setFocus();
@@ -77,16 +75,14 @@ class R extends I {
   // #endregion
   // #region Lifecycle
   async load() {
-    F(this);
   }
   willUpdate(e) {
     e.has("selected") && (this.hasUpdated || this.selected !== !1) && this.calciteInternalFlowItemChange.emit();
   }
   updated() {
-    S(this);
+    x(this);
   }
   loaded() {
-    T(this);
   }
   // #endregion
   // #region Private Methods
@@ -111,15 +107,15 @@ class R extends I {
   // #endregion
   // #region Rendering
   renderBackButton() {
-    const { el: e } = this, a = v(e) === "rtl", { showBackButton: i, backButtonClick: c, messages: r } = this, l = r.back, n = a ? m.backRight : m.backLeft;
-    return i ? w("flow-back-button", h`<calcite-action .ariaLabel=${l} class=${y(L.backButton)} .icon=${n} @click=${c} scale=s slot=header-actions-start .text=${l} title=${l ?? C} ${d(this.setBackRef)}></calcite-action>`) : null;
+    const { el: e } = this, a = y(e) === "rtl", { showBackButton: n, backButtonClick: i, messages: r } = this, l = r.back, s = a ? f.backRight : f.backLeft;
+    return n ? v("flow-back-button", h`<calcite-action .ariaLabel=${l} class=${I(T.backButton)} .icon=${s} @click=${i} scale=s slot=header-actions-start .text=${l} title=${l ?? B} ${d(this.setBackRef)}></calcite-action>`) : null;
   }
   render() {
-    const { collapsed: e, collapseDirection: a, collapsible: i, closable: c, closed: r, description: l, disabled: n, heading: f, headingLevel: p, loading: b, menuOpen: $, messages: u, overlayPositioning: g, beforeClose: k } = this;
-    return E({ disabled: n, children: h`<calcite-panel .beforeClose=${k} .closable=${c} .closed=${r} .collapseDirection=${a} .collapsed=${e} .collapsible=${i} .description=${l} .disabled=${n} .heading=${f} .headingLevel=${p} .loading=${b} .menuOpen=${$} .messageOverrides=${u} @calcitePanelClose=${this.handleInternalPanelClose} @calcitePanelScroll=${this.handleInternalPanelScroll} @calcitePanelToggle=${this.handleInternalPanelToggle} .overlayPositioning=${g} .scale=${this.scale} ${d(this.setContainerRef)}>${this.renderBackButton()}<slot name=${o.actionBar} slot=${t.actionBar}></slot><slot name=${o.alerts} slot=${t.alerts}></slot><slot name=${o.headerActionsStart} slot=${t.headerActionsStart}></slot><slot name=${o.headerActionsEnd} slot=${t.headerActionsEnd}></slot><slot name=${o.headerContent} slot=${t.headerContent}></slot><slot name=${o.headerMenuActions} slot=${t.headerMenuActions}></slot><slot name=${o.fab} slot=${t.fab}></slot><slot name=${o.contentTop} slot=${t.contentTop}></slot><slot name=${o.contentBottom} slot=${t.contentBottom}></slot><slot name=${o.footerStart} slot=${t.footerStart}></slot><slot name=${o.footer} slot=${t.footer}></slot><slot name=${o.footerEnd} slot=${t.footerEnd}></slot><slot name=${o.footerActions} slot=${t.footerActions}></slot><slot></slot></calcite-panel>` });
+    const { collapsed: e, collapseDirection: a, collapsible: n, closable: i, closed: r, description: l, disabled: s, heading: p, headingLevel: b, loading: m, menuOpen: u, messages: g, overlayPositioning: $, beforeClose: k } = this;
+    return S({ disabled: s, children: h`<calcite-panel .beforeClose=${k} .closable=${i} .closed=${r} .collapseDirection=${a} .collapsed=${e} .collapsible=${n} .description=${l} .disabled=${s} .heading=${p} .headingLevel=${b} .loading=${m} .menuOpen=${u} .messageOverrides=${g} @calcitePanelClose=${this.handleInternalPanelClose} @calcitePanelScroll=${this.handleInternalPanelScroll} @calcitePanelToggle=${this.handleInternalPanelToggle} .overlayPositioning=${$} .scale=${this.scale} ${d(this.setContainerRef)}>${this.renderBackButton()}<slot name=${o.actionBar} slot=${t.actionBar}></slot><slot name=${o.alerts} slot=${t.alerts}></slot><slot name=${o.headerActionsStart} slot=${t.headerActionsStart}></slot><slot name=${o.headerActionsEnd} slot=${t.headerActionsEnd}></slot><slot name=${o.headerContent} slot=${t.headerContent}></slot><slot name=${o.headerMenuActions} slot=${t.headerMenuActions}></slot><slot name=${o.fab} slot=${t.fab}></slot><slot name=${o.contentTop} slot=${t.contentTop}></slot><slot name=${o.contentBottom} slot=${t.contentBottom}></slot><slot name=${o.footerStart} slot=${t.footerStart}></slot><slot name=${o.footer} slot=${t.footer}></slot><slot name=${o.footerEnd} slot=${t.footerEnd}></slot><slot name=${o.footerActions} slot=${t.footerActions}></slot><slot></slot></calcite-panel>` });
   }
 }
-B("calcite-flow-item", R);
+w("calcite-flow-item", L);
 export {
-  R as FlowItem
+  L as FlowItem
 };

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

@@ -1,58 +1,60 @@
-import { c as C } from "../../chunks/runtime.js";
-import { html as y, svg as m } from "lit-html";
-import { LitElement as O, nothing as $ } from "@arcgis/lumina";
+import { c as S } from "../../chunks/runtime.js";
+import { html as w, svg as m } from "lit-html";
+import { LitElement as O, safeClassMap as b, nothing as $ } from "@arcgis/lumina";
 import { g as Y } from "../../chunks/guid.js";
 import { c as Z } from "../../chunks/observers.js";
 import { css as j } 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
-*/
-function G(i, n, r) {
-  const s = n[0] - i[0], o = r[0] - n[0], h = n[1] - i[1], c = r[1] - n[1], a = h / (s || o < 0 && 0), e = c / (o || s < 0 && 0), t = (a * o + e * s) / (s + o);
-  return (Math.sign(a) + Math.sign(e)) * Math.min(Math.abs(a), Math.abs(e), 0.5 * Math.abs(t)) || 0;
+/*! 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(i, s, a) {
+  const n = s[0] - i[0], h = a[0] - s[0], c = s[1] - i[1], o = a[1] - s[1], r = c / (n || h < 0 && 0), e = o / (h || n < 0 && 0), t = (r * h + e * n) / (n + h);
+  return (Math.sign(r) + Math.sign(e)) * Math.min(Math.abs(r), Math.abs(e), 0.5 * Math.abs(t)) || 0;
 }
-function L(i, n, r) {
-  const s = n[0] - i[0], o = n[1] - i[1];
-  return s ? (3 * o / s - r) / 2 : r;
+function z(i, s, a) {
+  const n = s[0] - i[0], h = s[1] - i[1];
+  return n ? (3 * h / n - a) / 2 : a;
 }
-function w(i, n, r, s, o) {
-  const [h, c] = i, [a, e] = n, t = (a - h) / 3, l = o([h + t, c + t * r]).join(","), d = o([a - t, e - t * s]).join(","), g = o([a, e]).join(",");
-  return `C ${l} ${d} ${g}`;
+function C(i, s, a, n, h) {
+  const [c, o] = i, [r, e] = s, t = (r - c) / 3, l = h([c + t, o + t * a]).join(","), g = h([r - t, e - t * n]).join(","), d = h([r, e]).join(",");
+  return `C ${l} ${g} ${d}`;
 }
-function S({ width: i, height: n, min: r, max: s }) {
-  const o = s[0] - r[0], h = s[1] - r[1];
-  return (c) => {
-    const a = (c[0] - r[0]) / o * i, e = n - c[1] / h * n;
-    return [a, e];
+function H({ width: i, height: s, min: a, max: n }) {
+  const h = n[0] - a[0], c = n[1] - a[1];
+  return (o) => {
+    const r = (o[0] - a[0]) / h * i, e = s - o[1] / c * s;
+    return [r, e];
   };
 }
 function A(i) {
-  const [n, r] = i[0], s = [n, r], o = [n, r];
+  const [s, a] = i[0], n = [s, a], h = [s, a];
   return i.reduce(
-    ({ min: h, max: c }, [a, e]) => ({
-      min: [Math.min(h[0], a), Math.min(h[1], e)],
-      max: [Math.max(c[0], a), Math.max(c[1], e)]
+    ({ min: c, max: o }, [r, e]) => ({
+      min: [Math.min(c[0], r), Math.min(c[1], e)],
+      max: [Math.max(o[0], r), Math.max(o[1], e)]
     }),
-    { min: s, max: o }
+    { min: n, max: h }
   );
 }
-function B({ data: i, min: n, max: r, t: s }) {
+function B({ data: i, min: s, max: a, t: n }) {
   if (i.length === 0)
     return "";
-  const [o, h] = s(i[0]), [c, a] = s(n), [e] = s(r);
-  let t, l, d;
-  const g = i.reduce((x, M, p) => {
-    if (l = i[p - 2], d = i[p - 1], p > 1) {
-      const u = G(l, d, M), v = t === void 0 ? L(l, d, u) : t, k = w(l, d, v, u, s);
-      return t = u, `${x} ${k}`;
+  const [h, c] = n(i[0]), [o, r] = n(s), [e] = n(a);
+  let t, l, g;
+  const d = i.reduce((x, M, p) => {
+    if (l = i[p - 2], g = i[p - 1], p > 1) {
+      const u = G(l, g, M), v = t === void 0 ? z(l, g, u) : t, L = C(l, g, v, u, n);
+      return t = u, `${x} ${L}`;
     }
     return x;
-  }, `M ${c},${a} L ${c},${h} L ${o},${h}`), b = i[i.length - 1], f = w(d, b, t, L(d, b, t), s);
-  return `${g} ${f} L ${e},${a} Z`;
+  }, `M ${o},${r} L ${o},${c} L ${h},${c}`), y = i[i.length - 1], f = C(g, y, t, z(g, y, t), n);
+  return `${d} ${f} L ${e},${r} Z`;
 }
-const E = j`:host{display:block;block-size:100%}.svg{fill:currentColor;stroke:transparent;margin:0;display:block;block-size:100%;inline-size:100%;padding:0}.svg .graph-path--highlight{fill:var(--calcite-color-brand);opacity:.5}:host([hidden]){display:none}[hidden]{display:none}`;
+const E = j`:host{display:block;block-size:100%}.svg{fill:currentColor;stroke:transparent;margin:0;display:block;block-size:100%;inline-size:100%;padding:0}.svg .graph-path--highlight{fill:var(--calcite-graph-highlight-fill-color, var(--calcite-color-brand));opacity:.5}:host([hidden]){display:none}[hidden]{display:none}`, k = {
+  svg: "svg",
+  graphPath: "graph-path",
+  graphPathHighlight: "graph-path--highlight"
+};
 class I extends O {
   constructor() {
     super(...arguments), this.graphId = `calcite-graph-${Y()}`, this.resizeObserver = Z("resize", () => this.requestUpdate()), this.data = [];
@@ -74,14 +76,14 @@ class I extends O {
   // #endregion
   // #region Rendering
   render() {
-    const { data: n, colorStops: r, el: s, highlightMax: o, highlightMin: h, min: c, max: a } = this, e = this.graphId, { clientHeight: t, clientWidth: l } = s;
-    if (!n || n.length === 0)
-      return y`<svg aria-hidden=true class="svg" height=${t ?? $} preserveAspectRatio=none viewBox=${`0 0 ${l} ${t}`} width=${l ?? $}></svg>`;
-    const { min: d, max: g } = A(n);
-    let b = d, f = g;
-    (c < d[0] || c > d[0]) && (b = [c, 0]), (a > g[0] || a < g[0]) && (f = [a, g[1]]);
-    const x = S({ min: b, max: f, width: l, height: t }), [M] = x([h, f[1]]), [p] = x([o, f[1]]), u = B({ data: n, min: d, max: g, t: x }), v = r ? `url(#linear-gradient-${e})` : void 0;
-    return y`<svg aria-hidden=true class="svg" height=${t ?? $} preserveAspectRatio=none viewBox=${`0 0 ${l} ${t}`} width=${l ?? $}>${r ? m`<defs><linearGradient .id=${`linear-gradient-${e}`} x1=0 x2=1 y1=0 y2=0>${r.map(({ offset: k, color: z, opacity: X }) => m`<stop offset=${`${k * 100}%`} stop-color=${z ?? $} stop-opacity=${X ?? $} />`)}</linearGradient></defs>` : null}${h !== void 0 ? [
+    const { data: s, colorStops: a, el: n, highlightMax: h, highlightMin: c, min: o, max: r } = this, e = this.graphId, { clientHeight: t, clientWidth: l } = n;
+    if (!s || s.length === 0)
+      return w`<svg aria-hidden=true class=${b(k.svg)} height=${t ?? $} preserveAspectRatio=none viewBox=${`0 0 ${l} ${t}`} width=${l ?? $}></svg>`;
+    const { min: g, max: d } = A(s);
+    let y = g, f = d;
+    (o < g[0] || o > g[0]) && (y = [o, 0]), (r > d[0] || r < d[0]) && (f = [r, d[1]]);
+    const x = H({ min: y, max: f, width: l, height: t }), [M] = x([c, f[1]]), [p] = x([h, f[1]]), u = B({ data: s, min: g, max: d, t: x }), v = a ? `url(#linear-gradient-${e})` : void 0;
+    return w`<svg aria-hidden=true class=${b(k.svg)} height=${t ?? $} preserveAspectRatio=none viewBox=${`0 0 ${l} ${t}`} width=${l ?? $}>${a ? m`<defs><linearGradient .id=${`linear-gradient-${e}`} x1=0 x2=1 y1=0 y2=0>${a.map(({ offset: L, color: P, opacity: X }) => m`<stop offset=${`${L * 100}%`} stop-color=${P ?? $} stop-opacity=${X ?? $} />`)}</linearGradient></defs>` : null}${c !== void 0 ? [
       m`<mask height=100% .id=${`${e}1`} width=100% x=0% y=0%><path d=${`
             M 0,0
             L ${M - 1},0
@@ -103,13 +105,13 @@ class I extends O {
                 L ${p + 1}, ${t}
                 Z
               `} fill=white /></mask>`,
-      m`<path class="graph-path" d=${u ?? $} fill=${v ?? $} mask=${`url(#${e}1)`} />`,
-      m`<path class="graph-path--highlight" d=${u ?? $} fill=${v ?? $} mask=${`url(#${e}2)`} />`,
-      m`<path class="graph-path" d=${u ?? $} fill=${v ?? $} mask=${`url(#${e}3)`} />`
-    ] : m`<path class="graph-path" d=${u ?? $} fill=${v ?? $} />`}</svg>`;
+      m`<path class=${b(k.graphPath)} d=${u ?? $} fill=${v ?? $} mask=${`url(#${e}1)`} />`,
+      m`<path class=${b(k.graphPathHighlight)} d=${u ?? $} fill=${v ?? $} mask=${`url(#${e}2)`} />`,
+      m`<path class=${b(k.graphPath)} d=${u ?? $} fill=${v ?? $} mask=${`url(#${e}3)`} />`
+    ] : m`<path class=${b(k.graphPath)} d=${u ?? $} fill=${v ?? $} />`}</svg>`;
   }
 }
-C("calcite-graph", I);
+S("calcite-graph", I);
 export {
   I as Graph
 };

package/dist/components/calcite-graph/interfaces.d.ts

@@ -1,14 +1,10 @@
+import { Dimensions } from '../interfaces';
 /** x,y coordinate set */
 export type Point = [number, number];
 /** array of coordinates */
 export type DataSeries = Point[];
 /** Function that converts point from data space to pixels */
 export type Translator = (p: Point) => Point;
-/** Dimensions (in pixels) */
-export interface Dimensions {
-    width: number;
-    height: number;
-}
 /** Min/Max from all values of a given data set */
 export interface Extent {
     min: Point;

package/dist/components/calcite-graph/resources.d.ts

@@ -0,0 +1,5 @@
+export declare const CSS: {
+    svg: string;
+    graphPath: string;
+    graphPathHighlight: string;
+};

package/dist/components/calcite-handle/customElement.d.ts

@@ -5,6 +5,9 @@ import { LoadableComponent } from '../../utils/loadable';
 import { InteractiveComponent } from '../../utils/interactive';
 import { HandleChange, HandleNudge } from './interfaces';
 
+/**
+ * @deprecated Use the `calcite-sort-handle` component instead.
+ */
 export declare class Handle extends LitElement {
     /** When `true`, interaction is prevented and the component is displayed with lower opacity. */
     disabled: boolean;

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

@@ -2,15 +2,14 @@ import { c as d } from "../../chunks/runtime.js";
 import { html as h, nothing as n } from "lit";
 import { createRef as u, ref as b } from "lit-html/directives/ref.js";
 import { LitElement as p, createEvent as s, safeClassMap as f } from "@arcgis/lumina";
-import { c as m, s as g, a as v } from "../../chunks/loadable.js";
-import { u as y, I as x } from "../../chunks/interactive.js";
-import { u as C } from "../../chunks/useT9n.js";
+import { c as m } from "../../chunks/loadable.js";
+import { u as g, I as v } from "../../chunks/interactive.js";
+import { u as y } from "../../chunks/useT9n.js";
+import { l as x } from "../../chunks/logger.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 r = {
   handle: "handle",
   handleSelected: "handle--selected"
@@ -20,16 +19,16 @@ const r = {
   itemLabel: "{itemLabel}",
   position: "{position}",
   total: "{total}"
-}, S = k`: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{display:flex}.handle{display:flex;align-items:center;justify-content:center;align-self:stretch;border-style:none;outline-color:transparent;color:var(--calcite-handle-icon-color, var(--calcite-color-border-input));background-color:var(--calcite-handle-background-color, transparent);padding-block:.75rem;padding-inline:.25rem;line-height:0}.handle calcite-icon{color:inherit}:host(:not([disabled])) .handle{cursor:move}:host(:not([disabled])) .handle:hover{color:var(--calcite-handle-icon-color-hover, var(--calcite-color-text-1));background-color:var(--calcite-handle-background-color-hover, var(--calcite-color-foreground-2))}:host(:not([disabled])) .handle:focus{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))));color:var(--calcite-handle-icon-color-hover, var(--calcite-color-text-1))}:host(:not([disabled])) .handle--selected{color:var(--calcite-handle-icon-color-selected, var(--calcite-color-text-1));background-color:var(--calcite-handle-background-color-selected, var(--calcite-color-foreground-3))}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}`;
-class T extends p {
+}, C = k`: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{display:flex}.handle{display:flex;align-items:center;justify-content:center;align-self:stretch;border-style:none;outline-color:transparent;color:var(--calcite-handle-icon-color, var(--calcite-color-border-input));background-color:var(--calcite-handle-background-color, transparent);padding-block:.75rem;padding-inline:.25rem;line-height:0}.handle calcite-icon{color:inherit}:host(:not([disabled])) .handle{cursor:move}:host(:not([disabled])) .handle:hover{color:var(--calcite-handle-icon-color-hover, var(--calcite-color-text-1));background-color:var(--calcite-handle-background-color-hover, var(--calcite-color-foreground-2))}:host(:not([disabled])) .handle:focus{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))));color:var(--calcite-handle-icon-color-hover, var(--calcite-color-text-1))}:host(:not([disabled])) .handle--selected{color:var(--calcite-handle-icon-color-selected, var(--calcite-color-text-1));background-color:var(--calcite-handle-background-color-selected, var(--calcite-color-foreground-3))}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}`;
+class S extends p {
   constructor() {
-    super(...arguments), this.handleButton = u(), this.blurUnselectDisabled = !1, this.disabled = !1, this.messages = C({ blocking: !0 }), this.selected = !1, this.calciteHandleChange = s({ cancelable: !1 }), this.calciteHandleNudge = s({ cancelable: !1 }), this.calciteInternalAssistiveTextChange = s({ cancelable: !1 });
+    super(...arguments), this.handleButton = u(), this.blurUnselectDisabled = !1, this.disabled = !1, this.messages = y({ blocking: !0 }), this.selected = !1, this.calciteHandleChange = s({ cancelable: !1 }), this.calciteHandleNudge = s({ cancelable: !1 }), this.calciteInternalAssistiveTextChange = s({ cancelable: !1 });
   }
   static {
     this.properties = { blurUnselectDisabled: 5, disabled: 7, dragHandle: 3, label: 1, messageOverrides: 0, selected: 7, setPosition: 9, setSize: 9 };
   }
   static {
-    this.styles = S;
+    this.styles = C;
   }
   // #endregion
   // #region Public Methods
@@ -40,16 +39,19 @@ class T extends p {
   // #endregion
   // #region Lifecycle
   async load() {
-    g(this);
   }
   willUpdate(e) {
     (e.has("messages") || e.has("label") || e.has("selected") && (this.hasUpdated || this.selected !== !1) || e.has("setPosition") || e.has("setSize")) && this.handleAriaTextChange();
   }
   updated() {
-    y(this);
+    g(this);
   }
   loaded() {
-    v(this);
+    x.deprecated("component", {
+      name: "handle",
+      removalVersion: 4,
+      suggested: "sort-handle"
+    });
   }
   // #endregion
   // #region Private Methods
@@ -91,10 +93,10 @@ class T extends p {
   // #endregion
   // #region Rendering
   render() {
-    return x({ disabled: this.disabled, children: h`<span .ariaChecked=${this.disabled ? null : this.selected} .ariaDisabled=${this.disabled ? this.disabled : null} .ariaLabel=${this.disabled ? null : this.getAriaText("label")} class=${f({ [r.handle]: !0, [r.handleSelected]: !this.disabled && this.selected })} @blur=${this.handleBlur} @keydown=${this.handleKeyDown} role=radio tabindex=${(this.disabled ? null : 0) ?? n} title=${this.getTooltip() ?? n} ${b(this.handleButton)}><calcite-icon .icon=${H.drag} scale=s></calcite-icon></span>` });
+    return v({ disabled: this.disabled, children: h`<span .ariaChecked=${this.disabled ? null : this.selected} .ariaDisabled=${this.disabled ? this.disabled : null} .ariaLabel=${this.disabled ? null : this.getAriaText("label")} class=${f({ [r.handle]: !0, [r.handleSelected]: !this.disabled && this.selected })} @blur=${this.handleBlur} @keydown=${this.handleKeyDown} role=radio tabindex=${(this.disabled ? null : 0) ?? n} title=${this.getTooltip() ?? n} ${b(this.handleButton)}><calcite-icon .icon=${H.drag} scale=s></calcite-icon></span>` });
   }
 }
-d("calcite-handle", T);
+d("calcite-handle", S);
 export {
-  T as Handle
+  S as Handle
 };

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

@@ -1,41 +1,39 @@
 import { g as v, i as x, c as I } from "../../chunks/runtime.js";
-import { html as C, svg as u, nothing as p } from "lit";
+import { html as C, svg as f, nothing as p } from "lit";
 import { LitElement as z, safeClassMap as y } from "@arcgis/lumina";
 import { g as $, t as D } from "../../chunks/dom.js";
 import { c as k } from "../../chunks/observers.js";
-import { css as w } 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 N = {
-  icon: "icon",
+import { l as w } from "../../chunks/logger.js";
+import { css as N } 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 */
+const P = {
   flipRtl: "flip-rtl"
-}, f = {}, d = {}, m = {
+}, u = {}, d = {}, m = {
   s: 16,
   m: 24,
   l: 32
 };
 function b({ icon: e, scale: t }) {
-  const s = m[t], i = U(e), n = i.charAt(i.length - 1) === "F";
+  const s = m[t], i = L(e), n = i.charAt(i.length - 1) === "F";
   return `${n ? i.substring(0, i.length - 1) : i}${s}${n ? "F" : ""}`;
 }
-async function P(e) {
+async function O(e) {
   const t = b(e), s = g(t);
   if (s)
     return s;
-  d[t] || (d[t] = fetch(v(`./assets/icon/${t}.json`)).then((n) => n.json()).catch(() => (console.error(`"${t}" is not a valid calcite-ui-icon name`), "")));
+  d[t] || (d[t] = fetch(v(`./assets/icon/${t}.json`)).then((n) => n.json()).catch(() => (w.error(`${e.icon} (${e.scale}) icon failed to load`), "")));
   const i = await d[t];
-  return f[t] = i, i;
+  return u[t] = i, i;
 }
-function O(e) {
+function U(e) {
   return g(b(e));
 }
 function g(e) {
-  return f[e];
+  return u[e];
 }
-function U(e) {
+function L(e) {
   const t = !isNaN(Number(e.charAt(0))), s = e.split("-");
   if (s.length > 0) {
     const n = /[a-z]/i;
@@ -45,8 +43,8 @@ function U(e) {
   }
   return t ? `i${e}` : e;
 }
-const L = w`:host{display:inline-flex;color:var(--calcite-icon-color, var(--calcite-ui-icon-color, currentColor))}:host([scale=s]){inline-size:16px;block-size:16px;min-inline-size:16px;min-block-size:16px}:host([scale=m]){inline-size:24px;block-size:24px;min-inline-size:24px;min-block-size:24px}:host([scale=l]){inline-size:32px;block-size:32px;min-inline-size:32px;min-block-size:32px}.flip-rtl{transform:scaleX(-1)}.svg{display:block}:host([hidden]){display:none}[hidden]{display:none}`;
-class R extends z {
+const R = N`:host{display:inline-flex;color:var(--calcite-icon-color, var(--calcite-ui-icon-color, currentColor))}:host([scale=s]){inline-size:16px;block-size:16px;min-inline-size:16px;min-block-size:16px}:host([scale=m]){inline-size:24px;block-size:24px;min-inline-size:24px;min-block-size:24px}:host([scale=l]){inline-size:32px;block-size:32px;min-inline-size:32px;min-block-size:32px}.flip-rtl{transform:scaleX(-1)}.svg{display:block}:host([hidden]){display:none}[hidden]{display:none}`;
+class A extends z {
   constructor() {
     super(...arguments), this.visible = !1, this.flipRtl = !1, this.icon = null, this.preload = !1, this.scale = "m";
   }
@@ -54,7 +52,7 @@ class R extends z {
     this.properties = { pathData: 16, visible: 16, flipRtl: 7, icon: 3, preload: 7, scale: 3, textLabel: 1 };
   }
   static {
-    this.styles = L;
+    this.styles = R;
   }
   // #endregion
   // #region Lifecycle
@@ -79,7 +77,7 @@ class R extends z {
     const { icon: t, scale: s, visible: i } = this;
     if (!x() || !t || !i)
       return;
-    const n = { icon: t, scale: s }, o = O(n) || await P(n);
+    const n = { icon: t, scale: s }, o = U(n) || await O(n);
     t === this.icon && (this.pathData = o);
   }
   waitUntilVisible(t) {
@@ -98,12 +96,12 @@ class R extends z {
   render() {
     const { el: t, flipRtl: s, pathData: i, scale: n, textLabel: o } = this, r = $(t), l = m[n], a = !!o, h = [].concat(i || "");
     return this.el.ariaHidden = D(!a), this.el.ariaLabel = a ? o : null, this.el.role = a ? "img" : null, C`<svg aria-hidden=true class=${y({
-      [N.flipRtl]: r === "rtl" && s,
+      [P.flipRtl]: r === "rtl" && s,
       svg: !0
-    })} fill=currentColor height=100% viewBox=${`0 0 ${l} ${l}`} width=100% xmlns=http://www.w3.org/2000/svg>${h.map((c) => typeof c == "string" ? u`<path d=${c ?? p} />` : u`<path d=${c.d ?? p} opacity=${("opacity" in c ? c.opacity : 1) ?? p} />`)}</svg>`;
+    })} fill=currentColor height=100% viewBox=${`0 0 ${l} ${l}`} width=100% xmlns=http://www.w3.org/2000/svg>${h.map((c) => typeof c == "string" ? f`<path d=${c ?? p} />` : f`<path d=${c.d ?? p} opacity=${("opacity" in c ? c.opacity : 1) ?? p} />`)}</svg>`;
   }
 }
-I("calcite-icon", R);
+I("calcite-icon", A);
 export {
-  R as Icon
+  A as Icon
 };