@arcgis/charts-components 5.0.0-next.28 → 5.0.0-next.29

package/dist/components/arcgis-charts-config-format-popover/customElement.js

@@ -29,7 +29,7 @@ import { createRef as p, ref as c } from "lit/directives/ref.js";
 import { LitElement as m, createEvent as s, safeClassMap as h } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const g = {
   jsAppFlyout: "js-app-flyout"
 }, C = a``;

package/dist/components/arcgis-charts-config-general/customElement.js

@@ -29,7 +29,7 @@ import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/toolkit/dom";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const s = {
   textInput: "text-input",
   label: "label",
@@ -43,15 +43,15 @@ class y extends C {
     }, this.resetChartTitleToBeDynamic = () => {
       const e = this.model.generateChartTitle();
       this.model.titleText = e, this.disableResetButtonForChartTitle = !1;
-    }, this.resetXAxisTitleToBeDynamic = async () => {
+    }, this.resetXAxisTitleToBeDynamic = () => {
       if (n(this.model)) {
         const e = this.model.generateXAxisTitle();
         this.model.xAxisTitleText = e;
       }
       this.disableResetButtonForXAxisTitle = !1;
-    }, this.resetYAxisTitleToBeDynamic = async () => {
+    }, this.resetYAxisTitleToBeDynamic = () => {
       if (c(this.model)) {
-        const e = h(this.model) ? await this.model.getDefaultXAxisTitleText() : await this.model.generateYAxisTitle();
+        const e = h(this.model) ? this.model.getDefaultXAxisTitleText() : this.model.generateYAxisTitle();
         this.model.setAxisTitleText(e, 1);
       }
       this.disableResetButtonForYAxisTitle = !1;
@@ -66,13 +66,13 @@ class y extends C {
   load() {
     this.modelChange(this.model);
   }
-  async willUpdate(e) {
+  willUpdate(e) {
     e.has("model") && this.modelChange(this.model, e.get("model")), this.handleResetButtons();
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this.model.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
-  async handleResetButtons() {
+  handleResetButtons() {
     this.isPartialConfig = $(this.model.config);
     const e = this.model.generateChartTitle(), t = this.model.titleText;
     if (this.disableResetButtonForChartTitle = this.isPartialConfig || e === t, n(this.model)) {
@@ -80,7 +80,7 @@ class y extends C {
       this.disableResetButtonForXAxisTitle = this.isPartialConfig || o === d;
     }
     if (c(this.model)) {
-      const o = h(this.model) ? await this.model.getDefaultXAxisTitleText() : await this.model.generateYAxisTitle(), d = this.model.getAxisTitleText(1);
+      const o = h(this.model) ? this.model.getDefaultXAxisTitleText() : this.model.generateYAxisTitle(), d = this.model.getAxisTitleText(1);
       this.disableResetButtonForYAxisTitle = this.isPartialConfig || o === d;
     }
   }
@@ -136,10 +136,10 @@ class y extends C {
   }
   renderLegendPositions() {
     return r(this.model) ? [
-      a`<calcite-combobox-item .value=${l.Right} .textLabel=${this._messages.legendRightPosition} .selected=${this.model.legendPosition === l.Right} icon=right-edge></calcite-combobox-item>`,
-      a`<calcite-combobox-item .value=${l.Left} .textLabel=${this._messages.legendLeftPosition} .selected=${this.model.legendPosition === l.Left} icon=left-edge></calcite-combobox-item>`,
-      a`<calcite-combobox-item .value=${l.Top} .textLabel=${this._messages.legendTopPosition} .selected=${this.model.legendPosition === l.Top} icon=upload-to></calcite-combobox-item>`,
-      a`<calcite-combobox-item .value=${l.Bottom} .textLabel=${this._messages.legendBottomPosition} .selected=${this.model.legendPosition === l.Bottom} icon=download-to></calcite-combobox-item>`
+      a`<calcite-combobox-item .value=${l.Right} .heading=${this._messages.legendRightPosition} .selected=${this.model.legendPosition === l.Right} icon=right-edge></calcite-combobox-item>`,
+      a`<calcite-combobox-item .value=${l.Left} .heading=${this._messages.legendLeftPosition} .selected=${this.model.legendPosition === l.Left} icon=left-edge></calcite-combobox-item>`,
+      a`<calcite-combobox-item .value=${l.Top} .heading=${this._messages.legendTopPosition} .selected=${this.model.legendPosition === l.Top} icon=upload-to></calcite-combobox-item>`,
+      a`<calcite-combobox-item .value=${l.Bottom} .heading=${this._messages.legendBottomPosition} .selected=${this.model.legendPosition === l.Bottom} icon=download-to></calcite-combobox-item>`
     ] : [];
   }
   render() {

package/dist/components/arcgis-charts-config-guide/customElement.js

@@ -19,14 +19,14 @@ import { m as $, d as W, g as q, j as A, c as G } from "../../chunks/chart-ui-ut
 import { d as L } from "../../chunks/default.js";
 import { g as U } from "../../chunks/resource.js";
 import { u as Y } from "../../chunks/useT9n.js";
-import { css as H, html as c } from "lit";
+import { css as H, html as d } from "lit";
 import { createRef as h, ref as m } from "lit/directives/ref.js";
 import { LitElement as J, createEvent as K, renderElement as M, safeStyleMap as _, safeClassMap as o } from "@arcgis/lumina";
 import { G as S } from "../../chunks/common.js";
 import { j as Q, n as ee, o as te } from "../../chunks/type-guards.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const n = {
   row: "row",
   column: "column",
@@ -112,15 +112,15 @@ class se extends J {
     })), this.guidePopover?.open === !0 && this.removeGuidePopover();
   }
   setGuideDateTimeRange() {
-    const e = this.calculatedMinMaxBounds?.find((d) => d.isXAxis)?.minimum, t = this.calculatedMinMaxBounds?.find((d) => d.isXAxis)?.maximum, i = typeof e == "number" ? new Date(e) : /* @__PURE__ */ new Date(), a = typeof t == "number" ? new Date(t) : /* @__PURE__ */ new Date(), l = new window.Intl.DateTimeFormat().resolvedOptions().timeZone, s = Z(this.timeZone) ?? l, r = E(i, s), f = F(i, s), v = E(a, s), R = F(a, s), T = this.startDateCalciteInput.value?.value ?? "", x = T === "" ? r : T, D = this.startTimeCalciteInput.value?.value ?? "", w = D === "" ? f : D, C = this.endDateCalciteInput.value?.value ?? "", y = C === "" ? v : C, I = this.endTimeCalciteInput.value?.value ?? "", k = I === "" ? R : I;
+    const e = this.calculatedMinMaxBounds?.find((c) => c.isXAxis)?.minimum, t = this.calculatedMinMaxBounds?.find((c) => c.isXAxis)?.maximum, i = typeof e == "number" ? new Date(e) : /* @__PURE__ */ new Date(), a = typeof t == "number" ? new Date(t) : /* @__PURE__ */ new Date(), l = new window.Intl.DateTimeFormat().resolvedOptions().timeZone, s = Z(this.timeZone) ?? l, r = E(i, s), f = F(i, s), v = E(a, s), R = F(a, s), T = this.startDateCalciteInput.value?.value ?? "", x = T === "" ? r : T, D = this.startTimeCalciteInput.value?.value ?? "", w = D === "" ? f : D, C = this.endDateCalciteInput.value?.value ?? "", y = C === "" ? v : C, I = this.endTimeCalciteInput.value?.value ?? "", k = I === "" ? R : I;
     let b = !1;
     if (!Array.isArray(x) && x !== void 0 && w !== void 0) {
-      const d = `${x}T${w}`;
-      this.model.setGuideStart(d, this.index, this.orientation), b = !0;
+      const c = `${x}T${w}`;
+      this.model.setGuideStart(c, this.index, this.orientation), b = !0;
     }
     if (!Array.isArray(y) && y !== void 0 && k !== void 0) {
-      const d = C === "" ? void 0 : `${y}T${k}`;
-      this.model.setGuideEnd(d, this.index, this.orientation), b = !0;
+      const c = C === "" ? void 0 : `${y}T${k}`;
+      this.model.setGuideEnd(c, this.index, this.orientation), b = !0;
     }
     b && (this.symbolChange(), this.arcgisChartsConfigGuideChange.emit({
       index: this.index,
@@ -169,7 +169,7 @@ class se extends J {
     let l;
     p(i, a) === u.SLS ? l = g(t) ? t : void 0 : l = t?.color;
     const s = this.colorElement.value;
-    Array.isArray(t?.color) ? (this.guidePopover = M(c`<arcgis-charts-config-guide-popover .referenceElement=${s} open .selectedElement=${l} @arcgisChartsConfigGuidePopoverColorChange=${this.colorChange} @arcgisChartsConfigGuidePopoverSymbolChange=${this.symbolChange} @arcgisChartsConfigPopoverClose=${this.removeGuidePopover}></arcgis-charts-config-guide-popover>`), this.guidePopover !== void 0 && !document.body.contains(this.guidePopover) && document.body.appendChild(this.guidePopover)) : this.removeGuidePopover();
+    Array.isArray(t?.color) ? (this.guidePopover = M(d`<arcgis-charts-config-guide-popover .referenceElement=${s} open .selectedElement=${l} @arcgisChartsConfigGuidePopoverColorChange=${this.colorChange} @arcgisChartsConfigGuidePopoverSymbolChange=${this.symbolChange} @arcgisChartsConfigPopoverClose=${this.removeGuidePopover}></arcgis-charts-config-guide-popover>`), this.guidePopover !== void 0 && !document.body.contains(this.guidePopover) && document.body.appendChild(this.guidePopover)) : this.removeGuidePopover();
   }
   removeGuidePopover() {
     this.guidePopover !== null && this.guidePopover !== void 0 && (this.guidePopover = V(this.guidePopover));
@@ -208,7 +208,7 @@ class se extends J {
         i = this._messages.deleteGuide ?? "";
         break;
     }
-    this.tooltip = M(c`<calcite-tooltip style=${_({ opacity: 1, zIndex: "var(--calcite-floating-ui-z-index)" })} .referenceElement=${t} open placement=top>${i}</calcite-tooltip>`), document.body.appendChild(this.tooltip);
+    this.tooltip = M(d`<calcite-tooltip style=${_({ opacity: 1, zIndex: "var(--calcite-floating-ui-z-index)" })} .referenceElement=${t} open placement=top>${i}</calcite-tooltip>`), document.body.appendChild(this.tooltip);
   }
   toggleGuide() {
     const e = this.model.getGuideVisibility(this.index, this.orientation);
@@ -226,14 +226,14 @@ class se extends J {
   }
   renderColorElement() {
     const e = this.model.getGuideStyle(this.index, this.orientation), [t, i, a, l] = [...e?.color ?? [1, 1, 1, 255]], s = this.model.getGuideStart(this.index, this.orientation), r = this.model.getGuideEnd(this.index, this.orientation), f = g(e) ? q(e.style) : N.Solid, v = p(s, r) === u.SLS ? `line-${f}` : "square-f";
-    return c`<calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .value=${this._messages.style} class=${o(n.colorPicker)} .label=${this._messages.style} .selected=${this.guidePopover?.open} @click=${this.onColorElementSelect} ${m(this.colorElement)}><calcite-icon slot=content-end .icon=${v} style=${_({ color: `rgba(${t},${i},${a},${l / 255})` })}></calcite-icon></calcite-list-item></calcite-list>`;
+    return d`<calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .value=${this._messages.style} class=${o(n.colorPicker)} .label=${this._messages.style} .selected=${this.guidePopover?.open} @click=${this.onColorElementSelect} ${m(this.colorElement)}><calcite-icon slot=content-end .icon=${v} style=${_({ color: `rgba(${t},${i},${a},${l / 255})` })}></calcite-icon></calcite-list-item></calcite-list>`;
   }
   render() {
     const e = this.model.getGuideStart(this.index, this.orientation), t = this.model.getGuideEnd(this.index, this.orientation), i = this.model.getGuideName(this.index, this.orientation), a = this.model.getGuideLabelText(this.index, this.orientation), l = this.model.getGuideAbove(this.index, this.orientation), s = this.model.getGuideVisibility(this.index, this.orientation), r = this.isXAxisDateField;
-    return c`<calcite-block .heading=${i ?? ""} .open=${this.latestGuidePosition === U(this.index, this.orientation, this.model)} collapsible .messageOverrides=${{
+    return d`<calcite-block .heading=${i ?? ""} .expanded=${this.latestGuidePosition === U(this.index, this.orientation, this.model)} collapsible .messageOverrides=${{
       expand: this._messages.expand,
       collapse: this._messages.collapse
-    }}><calcite-action slot=control text .icon=${s ? "view-visible" : "view-hide"} @click=${this.toggleGuide} @mouseover=${this.createTooltip} @mouseout=${this.destroyTooltip}></calcite-action><calcite-action slot=control text icon=trash @click=${this.deleteGuide} @mouseover=${this.createTooltip} @mouseout=${this.destroyTooltip}></calcite-action><div class=${o(n.row)}><calcite-label class=${o(n.column)}>${this._messages.start}${r ? c`<calcite-input-date-picker .value=${this.getDateStringFromBound(e)} required scale=s placement=bottom-end @calciteInputDatePickerChange=${this.setGuideDateTimeRange} ${m(this.startDateCalciteInput)}></calcite-input-date-picker>` : c`<calcite-input type=number required @calciteInputInput=${this.setGuideStart} @keydown=${A} number-button-type=none .value=${e?.toString()} ${m(this.startCalciteInput)}></calcite-input>`}</calcite-label><calcite-label class=${o(n.column)}>${this._messages.end}${r ? c`<calcite-input-date-picker .value=${this.getDateStringFromBound(t)} scale=s placement=bottom-end @calciteInputDatePickerChange=${this.setGuideDateTimeRange} ${m(this.endDateCalciteInput)}></calcite-input-date-picker>` : c`<calcite-input type=number @calciteInputInput=${this.setGuideEnd} @keydown=${A} number-button-type=none .value=${t?.toString()} ${m(this.endCalciteInput)}></calcite-input>`}</calcite-label></div>${r ? X("time-picker-row", c`<div class=${o(n.row)}>${e != null ? c`<calcite-label class=${o(n.column)}><calcite-input-time-picker .value=${this.getTimeStringFromBound(e)} scale=s @calciteInputTimePickerChange=${this.setGuideDateTimeRange} ${m(this.startTimeCalciteInput)}></calcite-input-time-picker></calcite-label>` : null}${t != null ? c`<calcite-label class=${o(n.column)}><calcite-input-time-picker .value=${this.getTimeStringFromBound(t)} scale=s @calciteInputTimePickerChange=${this.setGuideDateTimeRange} ${m(this.endTimeCalciteInput)}></calcite-input-time-picker></calcite-label>` : null}</div>`) : null}<div class=${o(n.row)}><div class=${o(n.column)}>${this.renderColorElement()}</div></div><div class=${o(n.row)}><calcite-label class=${o(n.column)}>${this._messages.guideName}<calcite-input type=text .value=${i} @calciteInputInput=${this.setGuideName}></calcite-input></calcite-label></div><div class=${o(n.row)}><calcite-label class=${o(n.column)}>${this._messages.guideLabel}<calcite-input type=text .value=${a} @calciteInputInput=${this.setGuideLabel}></calcite-input></calcite-label></div><div class=${o(n.row)}><calcite-label class=${o(n.column)}>${this._messages.display}<calcite-segmented-control @calciteSegmentedControlChange=${this.setGuideRendered} scale=s><calcite-segmented-control-item .checked=${l} .value=${this._messages.inFront}>${this._messages.inFront}</calcite-segmented-control-item><calcite-segmented-control-item .checked=${!l} .value=${this._messages.inBack}>${this._messages.inBack}</calcite-segmented-control-item></calcite-segmented-control></calcite-label></div></calcite-block>`;
+    }}><calcite-action slot=control text .icon=${s ? "view-visible" : "view-hide"} @click=${this.toggleGuide} @mouseover=${this.createTooltip} @mouseout=${this.destroyTooltip}></calcite-action><calcite-action slot=control text icon=trash @click=${this.deleteGuide} @mouseover=${this.createTooltip} @mouseout=${this.destroyTooltip}></calcite-action><div class=${o(n.row)}><calcite-label class=${o(n.column)}>${this._messages.start}${r ? d`<calcite-input-date-picker .value=${this.getDateStringFromBound(e)} required scale=s placement=bottom-end @calciteInputDatePickerChange=${this.setGuideDateTimeRange} ${m(this.startDateCalciteInput)}></calcite-input-date-picker>` : d`<calcite-input type=number required @calciteInputInput=${this.setGuideStart} @keydown=${A} number-button-type=none .value=${e?.toString()} ${m(this.startCalciteInput)}></calcite-input>`}</calcite-label><calcite-label class=${o(n.column)}>${this._messages.end}${r ? d`<calcite-input-date-picker .value=${this.getDateStringFromBound(t)} scale=s placement=bottom-end @calciteInputDatePickerChange=${this.setGuideDateTimeRange} ${m(this.endDateCalciteInput)}></calcite-input-date-picker>` : d`<calcite-input type=number @calciteInputInput=${this.setGuideEnd} @keydown=${A} number-button-type=none .value=${t?.toString()} ${m(this.endCalciteInput)}></calcite-input>`}</calcite-label></div>${r ? X("time-picker-row", d`<div class=${o(n.row)}>${e != null ? d`<calcite-label class=${o(n.column)}><calcite-input-time-picker .value=${this.getTimeStringFromBound(e)} scale=s @calciteInputTimePickerChange=${this.setGuideDateTimeRange} ${m(this.startTimeCalciteInput)}></calcite-input-time-picker></calcite-label>` : null}${t != null ? d`<calcite-label class=${o(n.column)}><calcite-input-time-picker .value=${this.getTimeStringFromBound(t)} scale=s @calciteInputTimePickerChange=${this.setGuideDateTimeRange} ${m(this.endTimeCalciteInput)}></calcite-input-time-picker></calcite-label>` : null}</div>`) : null}<div class=${o(n.row)}><div class=${o(n.column)}>${this.renderColorElement()}</div></div><div class=${o(n.row)}><calcite-label class=${o(n.column)}>${this._messages.guideName}<calcite-input type=text .value=${i} @calciteInputInput=${this.setGuideName}></calcite-input></calcite-label></div><div class=${o(n.row)}><calcite-label class=${o(n.column)}>${this._messages.guideLabel}<calcite-input type=text .value=${a} @calciteInputInput=${this.setGuideLabel}></calcite-input></calcite-label></div><div class=${o(n.row)}><calcite-label class=${o(n.column)}>${this._messages.display}<calcite-segmented-control @calciteSegmentedControlChange=${this.setGuideRendered} scale=s><calcite-segmented-control-item .checked=${l} .value=${this._messages.inFront}>${this._messages.inFront}</calcite-segmented-control-item><calcite-segmented-control-item .checked=${!l} .value=${this._messages.inBack}>${this._messages.inBack}</calcite-segmented-control-item></calcite-segmented-control></calcite-label></div></calcite-block>`;
   }
 }
 B("arcgis-charts-config-guide", se);

package/dist/components/arcgis-charts-config-guide-popover/customElement.js

@@ -30,7 +30,7 @@ import { createRef as c, ref as m } from "lit/directives/ref.js";
 import { LitElement as h, createEvent as s, safeClassMap as g } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const C = {
   jsAppFlyout: "js-app-flyout"
 }, d = l``;

package/dist/components/arcgis-charts-config-guides/customElement.js

@@ -1,33 +1,29 @@
 import { c as p } from "../../chunks/runtime.js";
 import { cloneDeep as r } from "lodash-es";
 import { d as g } from "../../chunks/default.js";
-import { g as u, H as c } from "../../chunks/resource.js";
+import { g as l, H as m } from "../../chunks/resource.js";
 import { u as f } from "../../chunks/useT9n.js";
 import { css as A, html as a } from "lit";
 import { createRef as x, ref as C } from "lit/directives/ref.js";
-import { LitElement as b, renderElement as v, safeClassMap as m } from "@arcgis/lumina";
-import { G as o } from "../../chunks/common.js";
-import { n as l, o as h } from "../../chunks/type-guards.js";
+import { LitElement as v, renderElement as b, safeClassMap as c } from "@arcgis/lumina";
+import { G as s } from "../../chunks/common.js";
+import { n as h, o as u } from "../../chunks/type-guards.js";
 import "../../chunks/series-types.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const P = A`:host{display:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin)}.add-guide{display:flex;justify-content:center;padding:.5rem}.add-guide-btn{width:100%}.no-guides{border-radius:2rem}.no-messages{text-align:center}.guide-icon{padding-left:.5rem;padding-top:.5rem;width:1.5rem;height:1.5rem}`;
-class $ extends b {
+class $ extends v {
   constructor() {
     super(...arguments), this._messages = f(), this.addGuideButton = x(), this.guideTypePopover = null, this.addXGuide = (e) => {
-      if (l(this.model)) {
+      if (h(this.model)) {
         const t = this.getUniqueName(this._messages.xAxisGuide ?? ""), i = this.model.getXGuidesLength() ?? 0;
-        this.model.addXAxisGuide(t, i), this.model.setGuideStyle(r(g.style), i, o.X), this.latestGuidePosition = u(i, o.X, this.model), this.togglePopOver(e), (this.el.shadowRoot?.querySelectorAll("calcite-block") ?? []).forEach((d, n) => {
-          n !== this.latestGuidePosition && (d.open = !1);
-        });
+        this.model.addXAxisGuide(t, i), this.model.setGuideStyle(r(g.style), i, s.X), this.latestGuidePosition = l(i, s.X, this.model), this.togglePopOver(e);
       }
     }, this.addYGuide = (e) => {
-      if (h(this.model)) {
+      if (u(this.model)) {
         const t = this.getUniqueName(this._messages.yAxisGuide ?? ""), i = this.model.getYGuidesLength() ?? 0;
-        this.model.addYAxisGuide(t, i), this.model.setGuideStyle(r(g.style), i, o.Y), this.latestGuidePosition = u(i, o.Y, this.model), this.togglePopOver(e);
-        for (const s of this.el.shadowRoot?.querySelectorAll("calcite-block") ?? [])
-          s.open = !1;
+        this.model.addYAxisGuide(t, i), this.model.setGuideStyle(r(g.style), i, s.Y), this.latestGuidePosition = l(i, s.Y, this.model), this.togglePopOver(e);
       }
     }, this.togglePopOver = (e) => {
       e.stopImmediatePropagation(), this.enableXAxisGuide && this.enableYAxisGuide && (this.showAddButton = !this.showAddButton);
@@ -56,50 +52,50 @@ class $ extends b {
     t?.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange), e?.addEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
   getAllGuidesLength() {
-    const e = l(this.model) ? this.model.getXGuidesLength() ?? 0 : 0, t = h(this.model) ? this.model.getYGuidesLength() ?? 0 : 0;
+    const e = h(this.model) ? this.model.getXGuidesLength() ?? 0 : 0, t = u(this.model) ? this.model.getYGuidesLength() ?? 0 : 0;
     return e + t;
   }
   getUniqueName(e, t = 1) {
     const i = `${e} ${t}`;
-    let s = !1;
-    if (l(this.model)) {
-      const d = this.model.getXGuidesLength() ?? 0;
-      for (let n = 0; n < d && !s; n += 1)
-        this.model.getGuideName(n, o.X) === i && (s = !0);
-    }
+    let d = !1;
     if (h(this.model)) {
-      const d = this.model.getYGuidesLength() ?? 0;
-      for (let n = 0; n < d && !s; n += 1)
-        this.model.getGuideName(n, o.Y) === i && (s = !0);
+      const o = this.model.getXGuidesLength() ?? 0;
+      for (let n = 0; n < o && !d; n += 1)
+        this.model.getGuideName(n, s.X) === i && (d = !0);
     }
-    return s ? this.getUniqueName(e, t + 1) : i;
+    if (u(this.model)) {
+      const o = this.model.getYGuidesLength() ?? 0;
+      for (let n = 0; n < o && !d; n += 1)
+        this.model.getGuideName(n, s.Y) === i && (d = !0);
+    }
+    return d ? this.getUniqueName(e, t + 1) : i;
   }
   setChangedGuide(e) {
-    const { index: t, orientation: i, isDelete: s } = e.detail, d = u(t, i, this.model);
-    s && d !== void 0 && d <= this.latestGuidePosition && this.latestGuidePosition > 0 && (this.latestGuidePosition -= 1);
+    const { index: t, orientation: i, isDelete: d } = e.detail, o = l(t, i, this.model);
+    d && o !== void 0 && o <= this.latestGuidePosition && this.latestGuidePosition > 0 && (this.latestGuidePosition -= 1);
   }
   setupGuidePopover(e) {
     e.stopImmediatePropagation(), this.togglePopOver(e);
   }
   renderGuideTypePopover() {
     const e = this.getAllGuidesLength();
-    this.guideTypePopover = v(a`<arcgis-charts-config-guides-type-popover .enableXAxisGuide=${this.enableXAxisGuide} .enableYAxisGuide=${this.enableYAxisGuide} .referenceElement=${this.addGuideButton.value} .placement=${e === 0 ? "bottom" : "top"} .open=${!this.showAddButton} @arcgisChartsAddXAxisGuide=${this.addXGuide} @arcgisChartsAddYAxisGuide=${this.addYGuide} @arcgisChartsConfigPopoverClose=${this.closeAddPopOver}></arcgis-charts-config-guides-type-popover>`), !this.showAddButton && !document.body.contains(this.guideTypePopover) && this.guideTypePopover !== null && document.body.appendChild(this.guideTypePopover);
+    this.guideTypePopover = b(a`<arcgis-charts-config-guides-type-popover .enableXAxisGuide=${this.enableXAxisGuide} .enableYAxisGuide=${this.enableYAxisGuide} .referenceElement=${this.addGuideButton.value} .placement=${e === 0 ? "bottom" : "top"} .open=${!this.showAddButton} @arcgisChartsAddXAxisGuide=${this.addXGuide} @arcgisChartsAddYAxisGuide=${this.addYGuide} @arcgisChartsConfigPopoverClose=${this.closeAddPopOver}></arcgis-charts-config-guides-type-popover>`), !this.showAddButton && !document.body.contains(this.guideTypePopover) && this.guideTypePopover !== null && document.body.appendChild(this.guideTypePopover);
   }
   renderGuide(e, t) {
     let i;
-    return (this.enableXAxisGuide && t === o.X || this.enableYAxisGuide && t === o.Y) && (i = a`<arcgis-charts-config-guide .model=${this.model} .timeZone=${this.timeZone} .calculatedMinMaxBounds=${this.calculatedMinMaxBounds} .index=${e} .orientation=${t} .latestGuidePosition=${this.latestGuidePosition} @arcgisChartsConfigGuideChange=${this.setChangedGuide}></arcgis-charts-config-guide>`), i;
+    return (this.enableXAxisGuide && t === s.X || this.enableYAxisGuide && t === s.Y) && (i = a`<arcgis-charts-config-guide .model=${this.model} .timeZone=${this.timeZone} .calculatedMinMaxBounds=${this.calculatedMinMaxBounds} .index=${e} .orientation=${t} .latestGuidePosition=${this.latestGuidePosition} @arcgisChartsConfigGuideChange=${this.setChangedGuide}></arcgis-charts-config-guide>`), i;
   }
   renderGuides() {
     const e = [];
-    if (l(this.model)) {
+    if (h(this.model)) {
       const t = this.model.getXGuidesLength() ?? 0;
       for (let i = 0; i < t; i += 1)
-        e.push(this.renderGuide(i, o.X));
+        e.push(this.renderGuide(i, s.X));
     }
-    if (h(this.model)) {
+    if (u(this.model)) {
       const t = this.model.getYGuidesLength() ?? 0;
       for (let i = 0; i < t; i += 1)
-        e.push(this.renderGuide(i, o.Y));
+        e.push(this.renderGuide(i, s.Y));
     }
     return e;
   }
@@ -107,8 +103,8 @@ class $ extends b {
     return a`<calcite-fab slot=fab appearance=outline-fill kind=neutral text-enabled .text=${this._messages.addGuide} .label=${this._messages.addGuide} @click=${e} scale=s></calcite-fab>`;
   }
   render() {
-    const t = this.getAllGuidesLength() > 0, i = this.showAddButton && this.enableXAxisGuide && this.enableYAxisGuide, s = this.enableXAxisGuide && !this.enableYAxisGuide, d = !this.enableXAxisGuide && this.enableYAxisGuide;
-    return a`${this.renderGuideTypePopover()}${t ? this.renderGuides() : a`<div class=${m(c.noMessages)}>${this._messages.noGuidesMsg}</div>`}<div class=${m(c.addGuide)} ${C(this.addGuideButton)}>${i && this.renderAddGuideButton(this.setupGuidePopover) || ""}${s && this.renderAddGuideButton(this.addXGuide) || ""}${d && this.renderAddGuideButton(this.addYGuide) || ""}</div>`;
+    const t = this.getAllGuidesLength() > 0, i = this.showAddButton && this.enableXAxisGuide && this.enableYAxisGuide, d = this.enableXAxisGuide && !this.enableYAxisGuide, o = !this.enableXAxisGuide && this.enableYAxisGuide;
+    return a`${this.renderGuideTypePopover()}${t ? this.renderGuides() : a`<div class=${c(m.noMessages)}>${this._messages.noGuidesMsg}</div>`}<div class=${c(m.addGuide)} ${C(this.addGuideButton)}>${i && this.renderAddGuideButton(this.setupGuidePopover) || ""}${d && this.renderAddGuideButton(this.addXGuide) || ""}${o && this.renderAddGuideButton(this.addYGuide) || ""}</div>`;
   }
 }
 p("arcgis-charts-config-guides", $);

package/dist/components/arcgis-charts-config-guides-type-popover/customElement.js

@@ -28,7 +28,7 @@ import "@arcgis/toolkit/dom";
 import { e as p } from "../../chunks/popover-ui-utils.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 class l extends s {
   constructor() {
     super(...arguments), this._messages = o(), this.popoverElement = r(), this.onAddXGuide = () => {

package/dist/components/arcgis-charts-config-histogram/customElement.js

@@ -1,9 +1,9 @@
-import { c as n } from "../../chunks/runtime.js";
+import { c as l } from "../../chunks/runtime.js";
 import "@arcgis/toolkit/intl";
 import { isEqual as r } from "lodash-es";
 import "../../chunks/series-types.js";
 import "d3-array";
-import { g as l, bx as h } from "../../chunks/index.js";
+import { g as n, bx as h } from "../../chunks/index.js";
 import "@arcgis/core/renderers/support/jsonUtils.js";
 import "@arcgis/core/symbols/support/symbolUtils.js";
 import "@arcgis/core/Graphic.js";
@@ -20,20 +20,20 @@ import "@arcgis/core/rest/support/Query.js";
 import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/time/TimeExtent.js";
 import "@arcgis/core/core/promiseUtils.js";
-import { b as d, h as c } from "../../chunks/index3.js";
+import { b as c, h as m } from "../../chunks/index3.js";
 import "@arcgis/toolkit/dom";
-import { LitElement as m } from "@arcgis/lumina";
-import { css as g, html as t } from "lit";
+import { LitElement as d } from "@arcgis/lumina";
+import { css as g, html as i } from "lit";
 import { C as s } from "../../chunks/interfaces.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const f = g`:host{overflow-y:auto;overflow-x:hidden;margin-bottom:var(--arcgis-charts-intra-section-margin);margin-top:var(--arcgis-charts-intra-section-margin);height:100%}`;
-class p extends m {
+class p extends d {
   constructor() {
     super(...arguments), this.onModelConfigChange = async (e) => {
-      const i = e?.detail.config ?? this.model.config;
-      this.layer === void 0 && await this.updateFetchLayerFieldsInfo(i);
+      const t = e?.detail.config ?? this.model.config;
+      this.layer === void 0 && await this.updateFetchLayerFieldsInfo(t);
     };
   }
   static {
@@ -43,10 +43,11 @@ class p extends m {
     this.styles = f;
   }
   async load() {
-    this.layer !== void 0 && await this.layerChange(this.layer, void 0), this.seriesColor !== void 0 && this.seriesColorChange(this.seriesColor), this.usePopupTemplateFieldsInfo !== void 0 && await this.usePopupTemplateFieldsInfoChange(this.usePopupTemplateFieldsInfo, void 0), this.modelChange(this.model), this.onModelConfigChange();
+    this.seriesColor !== void 0 && this.seriesColorChange(this.seriesColor), await this.updateFetchLayerFieldsInfo(this.model?.config), this.modelChange(this.model);
   }
-  async willUpdate(e) {
-    e.has("model") && this.modelChange(this.model, e.get("model")), e.has("layer") && await this.layerChange(this.layer, e.get("layer")), e.has("usePopupTemplateFieldsInfo") && await this.usePopupTemplateFieldsInfoChange(this.usePopupTemplateFieldsInfo, e.get("usePopupTemplateFieldsInfo")), e.has("seriesColor") && this.seriesColorChange(this.seriesColor), this.layerFieldsInfo === void 0 && await this.updateFetchLayerFieldsInfo();
+  willUpdate(e) {
+    let a = !1;
+    e.has("model") && this.modelChange(this.model, e.get("model")), e.has("layer") && this.layer !== void 0 && !r(e.get("layer"), this.layer) && (a = !0), e.has("usePopupTemplateFieldsInfo") && this.usePopupTemplateFieldsInfo !== e.get("usePopupTemplateFieldsInfo") && (a = !0), e.has("seriesColor") && this.seriesColorChange(this.seriesColor), this.layerFieldsInfo === void 0 && (a = !0), a && this.updateFetchLayerFieldsInfo();
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this.model.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
@@ -54,43 +55,37 @@ class p extends m {
   modelChange(e, a) {
     a?.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange), e?.addEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
-  async layerChange(e, a) {
-    e !== void 0 && !r(a, e) && await this.updateFetchLayerFieldsInfo();
-  }
-  async usePopupTemplateFieldsInfoChange(e, a) {
-    e !== void 0 && e !== a && await this.updateFetchLayerFieldsInfo();
-  }
   seriesColorChange(e) {
     this.model.colorMatch && e?.forEach((a) => {
-      d(a) && e?.get(0) !== void 0 && !r(this.model.binSymbol, a) && (this.model.binSymbol = a);
+      c(a) && e?.get(0) !== void 0 && !r(this.model.binSymbol, a) && (this.model.binSymbol = a);
     });
   }
   async updateFetchLayerFieldsInfo(e) {
     const a = e ?? this.model.config;
-    let i = this.layer;
-    if (!i) {
-      const o = c(a) ? a.iLayer : void 0;
-      o && (i = await l(o));
+    let t = this.layer;
+    if (!t) {
+      const o = m(a) ? a.iLayer : void 0;
+      o && (t = await n(o));
     }
-    i && (this.layerFieldsInfo = await h(i, this.usePopupTemplateFieldsInfo));
+    t && (this.layerFieldsInfo = await h(t, this.usePopupTemplateFieldsInfo));
   }
   render() {
     let e;
     switch (this.page) {
       case s.Data:
-        e = t`<arcgis-charts-config-histogram-data .model=${this.model} .meanValue=${this.chartData?.mean} .medianValue=${this.chartData?.median} .standardDevValue=${this.chartData?.stddev} .minValue=${this.chartData?.min} .maxValue=${this.chartData?.max} .sumValue=${this.chartData?.sum} .nullsValue=${this.chartData?.nulls} .countValue=${this.chartData?.count} .layerFieldsInfo=${this.layerFieldsInfo}></arcgis-charts-config-histogram-data>`;
+        e = i`<arcgis-charts-config-histogram-data .model=${this.model} .meanValue=${this.chartData?.mean} .medianValue=${this.chartData?.median} .standardDevValue=${this.chartData?.stddev} .minValue=${this.chartData?.min} .maxValue=${this.chartData?.max} .sumValue=${this.chartData?.sum} .nullsValue=${this.chartData?.nulls} .countValue=${this.chartData?.count} .layerFieldsInfo=${this.layerFieldsInfo}></arcgis-charts-config-histogram-data>`;
         break;
       case s.Axes:
-        e = t`<arcgis-charts-config-axes .model=${this.model} show-max-y-bound-option .calculatedMinMaxBounds=${this.calculatedMinMaxBounds}></arcgis-charts-config-axes>`;
+        e = i`<arcgis-charts-config-axes .model=${this.model} show-max-y-bound-option .calculatedMinMaxBounds=${this.calculatedMinMaxBounds}></arcgis-charts-config-axes>`;
         break;
       case s.Guides:
-        e = t`<arcgis-charts-config-guides .model=${this.model} enable-y-axis-guide></arcgis-charts-config-guides>`;
+        e = i`<arcgis-charts-config-guides .model=${this.model} enable-y-axis-guide></arcgis-charts-config-guides>`;
         break;
       case s.Format:
-        e = t`<arcgis-charts-config-format .model=${this.model}></arcgis-charts-config-format>`;
+        e = i`<arcgis-charts-config-format .model=${this.model}></arcgis-charts-config-format>`;
         break;
       case s.General:
-        e = t`<arcgis-charts-config-general .model=${this.model}></arcgis-charts-config-general>`;
+        e = i`<arcgis-charts-config-general .model=${this.model}></arcgis-charts-config-general>`;
         break;
       default:
         e = "";
@@ -99,7 +94,7 @@ class p extends m {
     return e;
   }
 }
-n("arcgis-charts-config-histogram", p);
+l("arcgis-charts-config-histogram", p);
 export {
   p as ArcgisChartsConfigHistogram
 };

package/dist/components/arcgis-charts-config-histogram-data/customElement.d.ts

@@ -81,6 +81,11 @@ export declare class ArcgisChartsConfigHistogramData extends LitElement {
      * @default false
      */
     open?: boolean;
+    /**
+     * Event emitted upon catching an error in an async function.
+     *
+     * @event
+     */
     readonly arcgisChartsConfigDataChangeError: TargetedEvent<this, DataChangeErrorPayload>;
     /**
      * Event when there is change in histogram data popover.

package/dist/components/arcgis-charts-config-histogram-data/customElement.js

@@ -33,7 +33,7 @@ import { createRef as b, ref as v } from "lit/directives/ref.js";
 import { LitElement as A, createEvent as $, renderElement as U, safeStyleMap as w, safeClassMap as s } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const o = {
   label: "label",
   row: "row",
@@ -63,7 +63,7 @@ class R extends A {
       e.stopImmediatePropagation(), this.onColorElementSelect(this.model.standardDevSymbol, this._messages.standardDevStyle ?? "", this.standardDevOverlayElement);
     }, this.onModelConfigChange = () => {
       this.requestUpdate();
-    }, this.updateProps = async (e) => {
+    }, this.updateProps = (e) => {
       try {
         if (e.detail !== null && e.detail !== void 0) {
           const { contentKind: t } = e.detail, { value: i } = e.detail;
@@ -79,7 +79,7 @@ class R extends A {
           }
         }
       } catch (t) {
-        throw this.arcgisChartsConfigDataChangeError.emit({ error: t, model: this.model }), t;
+        throw t instanceof Error && this.arcgisChartsConfigDataChangeError.emit({ error: t, model: this.model }), t;
       }
       this.removeHistogramDataPopover(), this.requestUpdate();
     }, this.updateSymbolProps = (e) => {
@@ -333,7 +333,7 @@ class R extends A {
   }
   render() {
     const e = this.renderFieldSelect(), t = this.renderDataTransformationType();
-    return r`<div><div class=${s(o.sectionLabel)}>${this._messages.variables}</div><calcite-label class=${s(o.label)}>${this._messages.number}${e}</calcite-label><calcite-label class=${s(o.label)}>${this._messages.withTransformation}${t}</calcite-label><div class=${s(o.sectionLabel)}>${this._messages.bins}</div><p class=${s(o.binTextPadding)}>${this._messages.numberOfBins}</p>${this.renderBinsSection()}${this.renderBinColorElement()}<div class=${s(o.sectionLabel)}>${this._messages.overlays}</div>${this.renderOverlayList()}${this.renderShowDataLabels()}<div class=${s(o.sectionLabel)}>${this._messages.statistics}</div>${this.renderStats()}</div>`;
+    return r`<div class=${s(o.sectionLabel)}>${this._messages.variables}</div><calcite-label class=${s(o.label)}>${this._messages.number}${e}</calcite-label><calcite-label class=${s(o.label)}>${this._messages.withTransformation}${t}</calcite-label><div class=${s(o.sectionLabel)}>${this._messages.bins}</div><p class=${s(o.binTextPadding)}>${this._messages.numberOfBins}</p>${this.renderBinsSection()}${this.renderBinColorElement()}<div class=${s(o.sectionLabel)}>${this._messages.overlays}</div>${this.renderOverlayList()}${this.renderShowDataLabels()}<div class=${s(o.sectionLabel)}>${this._messages.statistics}</div>${this.renderStats()}`;
   }
 }
 k("arcgis-charts-config-histogram-data", R);

package/dist/components/arcgis-charts-config-histogram-popover/customElement.d.ts

@@ -80,6 +80,11 @@ export declare class ArcgisChartsConfigHistogramPopover extends LitElement {
      * @category Public
      */
     reposition(): Promise<void>;
+    /**
+     * Event emitted when the popover is closed.
+     *
+     * @event
+     */
     readonly arcgisChartsConfigHistogramPopoverChange: TargetedEvent<this, {
         contentKind: HistogramDataPopoverKinds | undefined;
         value: any;

package/dist/components/arcgis-charts-config-histogram-popover/customElement.js

@@ -32,7 +32,7 @@ import { createRef as h, ref as d } from "lit/directives/ref.js";
 import { LitElement as w, createEvent as p, safeClassMap as t } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const i = {
   symbolPropertyPopover: "symbol-property-popover",
   colorPicker: "color-picker",
@@ -56,8 +56,8 @@ class T extends w {
     await this.popoverElement.value?.reposition();
   }
   updated() {
-    setTimeout(async () => {
-      await this.picklist.value?.setFocus();
+    setTimeout(() => {
+      this.picklist.value?.setFocus();
     }, m.PopoverTimer), P(this.popoverElement.value, this.open), this.hasUpdated || setTimeout(() => {
       this.popoverElement.value?.reposition();
     }, m.PopoverTimer);

package/dist/components/arcgis-charts-config-invalid-input-message/customElement.js

@@ -4,7 +4,7 @@ import { c as a } from "../../chunks/chart-ui-utils2.js";
 import { LitElement as e, safeClassMap as l } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.28 */
+v5.0.0-next.29 */
 const n = {
   invalidMessageColor: "invalid-message-color"
 }, o = i`:host{display:block}.invalid-message-color{color:red}`;

package/dist/components/arcgis-charts-config-line-chart/customElement.d.ts

@@ -67,5 +67,10 @@ export declare class ArcgisChartsConfigLineChart extends LitElement {
      * @default false
      */
     usePopupTemplateFieldsInfo?: boolean;
+    /**
+     * Event indicating no series update should take place.
+     *
+     * @event
+     */
     readonly arcgisChartsConfigNoSeriesUpdate: TargetedEvent<this, void>;
 }