@arcgis/charts-components 5.1.0-next.13 → 5.1.0-next.130

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

@@ -1,58 +1,40 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c } from "../../chunks/runtime.js";
-import { css as l, html as a } from "lit";
-import "@arcgis/toolkit/intl";
-import "lodash-es";
-import "luxon";
-import "d3-array";
-import "@arcgis/toolkit/type";
-import "../../chunks/series-types.js";
-import "../../chunks/index.js";
-import "@arcgis/core/Graphic.js";
-import "@arcgis/core/renderers/support/jsonUtils.js";
-import "@arcgis/core/symbols/support/symbolUtils.js";
-import "@esri/arcgis-html-sanitizer";
-import "@arcgis/core/intl.js";
-import "@arcgis/core/layers/support/FeatureFilter.js";
-import "@arcgis/core/smartMapping/statistics/histogram.js";
-import "@arcgis/core/smartMapping/statistics/summaryStatistics.js";
-import "simple-statistics";
-import "@arcgis/core/request.js";
-import "@arcgis/core/AttributeBinsGraphic.js";
-import "@arcgis/core/geometry/support/jsonUtils.js";
-import "@arcgis/core/rest/support/AttributeBinsQuery.js";
-import "@arcgis/core/rest/support/StatisticDefinition.js";
-import "@arcgis/core/time/TimeExtent.js";
-import "@arcgis/core/core/promiseUtils.js";
-import "@arcgis/toolkit/dom";
-import { e as r } from "../../chunks/popover-ui-utils.js";
-import { u as p } from "../../chunks/useT9n.js";
+import { css as o, html as i } from "lit";
+import { u as r } from "../../chunks/useT9n.js";
 import { createRef as n, ref as h } from "lit/directives/ref.js";
-import { LitElement as m, createEvent as s, safeClassMap as o } from "@arcgis/lumina";
+import { LitElement as p, createEvent as s, safeClassMap as l } from "@arcgis/lumina";
+import { e as m } from "../../chunks/popover-ui-utils.js";
+import { d } from "../../chunks/type-guards.js";
 import { M as e } from "../../chunks/common.js";
-const i = {
+const a = {
   selectChartComponent: "select-chart-component",
   jsAppFlyout: "js-app-flyout",
   panel: "panel"
-}, d = l`.hide{display:none}.am5-html-container{z-index:101!important}.am5-layer-1000{z-index:1000!important}.am5-layer-30{z-index:100!important}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}.select-chart-component{width:var(--arcgis-charts-config-panel-width);height:var(--arcgis-charts-config-panel-height)}calcite-block{width:var(--arcgis-charts-config-calcite-block-default-width);height:var(--arcgis-charts-config-calcite-block-default-height);margin:var(--arcgis-charts-config-calcite-block-default-margin)}.label{display:flex;margin-left:1rem;margin-bottom:.5rem;justify-content:space-between}.header{margin:0}.panel{max-height:60vh}`;
-class g extends m {
+}, g = o`.hide{visibility:hidden}.am5-html-container{z-index:101!important}.am5-layer-1000{z-index:1000!important}.am5-layer-30{z-index:100!important}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}.select-chart-component{width:var(--arcgis-charts-config-panel-width);height:var(--arcgis-charts-config-panel-height)}calcite-block{width:var(--arcgis-charts-config-calcite-block-default-width);height:var(--arcgis-charts-config-calcite-block-default-height);margin:var(--arcgis-charts-config-calcite-block-default-margin)}.label{display:flex;margin-left:1rem;margin-bottom:.5rem;justify-content:space-between}.header{margin:0}.panel{max-height:60vh}`;
+class C extends p {
   constructor() {
-    super(...arguments), this._messages = p(), this.selectChartTypePopover = n(), this.arcgisChartsConfigPopoverClose = s(), this.arcgisChartsConfigSelectChartTypeChange = s();
+    super(...arguments), this._messages = r(), this.selectChartTypePopover = n(), this.open = !1, this.arcgisChartsConfigPopoverClose = s(), this.arcgisChartsConfigSelectChartTypeChange = s();
   }
   static {
-    this.properties = { messageOverrides: 0, headerTitle: 1, layerId: 1, open: 5, referenceElement: 0, popoverPlacement: 1, selectedModelType: 1 };
+    this.properties = { messageOverrides: 0, headerTitle: 1, layerId: 1, layerType: 1, isRasterBarChartSupported: 5, open: 5, referenceElement: 0, popoverPlacement: 1, selectedModelType: 1 };
   }
   static {
-    this.styles = d;
+    this.styles = g;
   }
   async reposition() {
     await this.selectChartTypePopover.value?.reposition();
   }
   updated() {
-    r(this.selectChartTypePopover.value, this.open);
+    m(this.selectChartTypePopover.value, this.open);
+  }
+  buildRasterChartTypesList() {
+    const t = this.isRasterBarChartSupported === !0;
+    return i`<calcite-list label @click=${this.onChartTypeClick}>${t ? i`<calcite-list-item .label=${this._messages.barChart} .value=${e.BarChart} .selected=${this.selectedModelType === e.BarChart}><calcite-icon slot=content-start icon=graph-bar></calcite-icon></calcite-list-item>` : null}<calcite-list-item .label=${this._messages.histogram} .value=${e.Histogram} .selected=${this.selectedModelType === e.Histogram}><calcite-icon slot=content-start icon=graph-histogram></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.scatterplot} .value=${e.Scatterplot} .selected=${this.selectedModelType === e.Scatterplot}><calcite-icon slot=content-start icon=graph-scatter-plot></calcite-icon></calcite-list-item></calcite-list>`;
   }
   buildChartTypesList() {
-    return a`<calcite-list label @click=${this.onChartTypeClick}><calcite-list-item .label=${this._messages.barChart} .value=${e.BarChart} .selected=${this.selectedModelType === e.BarChart}><calcite-icon slot=content-start icon=graph-bar></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.lineChart} .value=${e.LineChart} .selected=${this.selectedModelType === e.LineChart}><calcite-icon slot=content-start icon=graph-time-series></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.pieChart} .value=${e.PieChart} .selected=${this.selectedModelType === e.PieChart}><calcite-icon slot=content-start icon=pie-chart></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.histogram} .value=${e.Histogram} .selected=${this.selectedModelType === e.Histogram}><calcite-icon slot=content-start icon=graph-histogram></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.scatterplot} .value=${e.Scatterplot} .selected=${this.selectedModelType === e.Scatterplot}><calcite-icon slot=content-start icon=graph-scatter-plot></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.boxPlot} .value=${e.BoxPlot} .selected=${this.selectedModelType === e.BoxPlot}><calcite-icon slot=content-start icon=box-chart></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.calendarHeatChart} .value=${e.HeatChart} .selected=${this.selectedModelType === e.HeatChart}><calcite-icon slot=content-start icon=calendar-heat-chart></calcite-icon></calcite-list-item></calcite-list>`;
+    let t;
+    return d(this.layerType) ? t = this.buildRasterChartTypesList() : t = i`<calcite-list label @click=${this.onChartTypeClick}><calcite-list-item .label=${this._messages.barChart} .value=${e.BarChart} .selected=${this.selectedModelType === e.BarChart}><calcite-icon slot=content-start icon=graph-bar></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.lineChart} .value=${e.LineChart} .selected=${this.selectedModelType === e.LineChart}><calcite-icon slot=content-start icon=graph-time-series></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.pieChart} .value=${e.PieChart} .selected=${this.selectedModelType === e.PieChart}><calcite-icon slot=content-start icon=pie-chart></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.histogram} .value=${e.Histogram} .selected=${this.selectedModelType === e.Histogram}><calcite-icon slot=content-start icon=graph-histogram></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.scatterplot} .value=${e.Scatterplot} .selected=${this.selectedModelType === e.Scatterplot}><calcite-icon slot=content-start icon=graph-scatter-plot></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.boxPlot} .value=${e.BoxPlot} .selected=${this.selectedModelType === e.BoxPlot}><calcite-icon slot=content-start icon=box-chart></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.calendarHeatChart} .value=${e.HeatChart} .selected=${this.selectedModelType === e.HeatChart}><calcite-icon slot=content-start icon=calendar-heat-chart></calcite-icon></calcite-list-item></calcite-list>`, t;
   }
   onChartTypeClick(t) {
     t.target?.localName === "calcite-list-item" ? this.selectedModelType = t.target?.value : this.selectedModelType = t.target?.parentNode?.value, this.arcgisChartsConfigSelectChartTypeChange.emit();
@@ -68,13 +50,13 @@ class g extends m {
     }, 250);
   }
   render() {
-    return a`<div class=${o({
-      [i.selectChartComponent]: !0,
-      [i.jsAppFlyout]: !0
-    })}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.popoverPlacement} .flipPlacements=${["top", "bottom"]} @calcitePopoverOpen=${this.popoverOpen} @calcitePopoverClose=${this.popoverClose} .open=${this.open} auto-close label ${h(this.selectChartTypePopover)}><calcite-panel class=${o(i.panel)} .heading=${this.headerTitle ?? this._messages.chooseChartType} closable @calcitePanelClose=${this.popoverClose} .closed=${!this.open}>${this.buildChartTypesList()}</calcite-panel></calcite-popover></div>`;
+    return i`<div class=${l({
+      [a.selectChartComponent]: !0,
+      [a.jsAppFlyout]: !0
+    })}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.popoverPlacement} .flipPlacements=${["top", "bottom"]} @calcitePopoverOpen=${this.popoverOpen} @calcitePopoverClose=${this.popoverClose} .open=${this.open} auto-close label ${h(this.selectChartTypePopover)}><calcite-panel class=${l(a.panel)} .heading=${this.headerTitle ?? this._messages.chooseChartType} closable @calcitePanelClose=${this.popoverClose} .closed=${!this.open}>${this.buildChartTypesList()}</calcite-panel></calcite-popover></div>`;
   }
 }
-c("arcgis-charts-config-select-chart-type-popover", g);
+c("arcgis-charts-config-select-chart-type-popover", C);
 export {
-  g as ArcgisChartsConfigSelectChartTypePopover
+  C as ArcgisChartsConfigSelectChartTypePopover
 };

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

@@ -1,45 +1,21 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c as d } from "../../chunks/runtime.js";
 import { keyed as m } from "lit/directives/keyed.js";
-import "@arcgis/toolkit/intl";
-import "lodash-es";
-import "luxon";
-import "d3-array";
-import "@arcgis/toolkit/type";
-import "../../chunks/series-types.js";
-import "../../chunks/index.js";
-import "@arcgis/core/Graphic.js";
-import "@arcgis/core/renderers/support/jsonUtils.js";
-import "@arcgis/core/symbols/support/symbolUtils.js";
-import "@esri/arcgis-html-sanitizer";
-import "@arcgis/core/intl.js";
-import "@arcgis/core/layers/support/FeatureFilter.js";
-import "@arcgis/core/smartMapping/statistics/histogram.js";
-import "@arcgis/core/smartMapping/statistics/summaryStatistics.js";
-import "simple-statistics";
-import "@arcgis/core/request.js";
-import "@arcgis/core/AttributeBinsGraphic.js";
-import "@arcgis/core/geometry/support/jsonUtils.js";
-import "@arcgis/core/rest/support/AttributeBinsQuery.js";
-import "@arcgis/core/rest/support/StatisticDefinition.js";
-import "@arcgis/core/time/TimeExtent.js";
-import "@arcgis/core/core/promiseUtils.js";
-import "@arcgis/toolkit/dom";
-import { g as p } from "../../chunks/chart-ui-utils.js";
-import { r as C } from "../../chunks/popover-ui-utils.js";
-import { u as g } from "../../chunks/useT9n.js";
-import { css as f, html as a } from "lit";
-import { LitElement as v, createEvent as s, safeClassMap as c, renderElement as u } from "@arcgis/lumina";
-import { repeat as w } from "lit/directives/repeat.js";
+import { u as p } from "../../chunks/useT9n.js";
+import { css as C, html as r } from "lit";
+import { LitElement as g, createEvent as o, safeClassMap as c, renderElement as f } from "@arcgis/lumina";
+import { repeat as v } from "lit/directives/repeat.js";
+import { g as u } from "../../chunks/chart-ui-utils.js";
+import { r as w } from "../../chunks/popover-ui-utils.js";
 const n = {
   addChartContainer: "add-chart-container",
   viewChartComponent: "view-chart-component",
   header: "header",
   dropdownPopup: "dropdown-popup"
-}, I = f`.view-chart-component{width:var(--arcgis-charts-config-panel-width);height:var(--arcgis-charts-config-panel-height)}.add-chart-container{display:flex;justify-content:center;padding:2rem 0;background-color:var(--calcite-color-background)}.header{margin-left:1rem}.dropdown-popup{position:relative}`;
-class R extends v {
+}, I = C`.view-chart-component{width:var(--arcgis-charts-config-panel-width);height:var(--arcgis-charts-config-panel-height)}.add-chart-container{display:flex;justify-content:center;padding:2rem 0;background-color:var(--calcite-color-background)}.header{margin-left:1rem}.dropdown-popup{position:relative}`;
+class R extends g {
   constructor() {
-    super(...arguments), this._messages = g(), this.chartRenamePopover = null, this.popoverClose = () => {
+    super(...arguments), this._messages = p(), this.chartRenamePopover = null, this.popoverClose = () => {
       const e = this.modelList?.find((t) => t.chartId === this.selectedChartId);
       this.chartTitle = e?.titleText ?? "", this.selectedActionChartId = "", this.removeChartRenamePopover();
     }, this.onChartRename = (e) => {
@@ -54,11 +30,11 @@ class R extends v {
       if (e.detail !== null && e.detail !== void 0) {
         const { newIndex: t, oldIndex: i } = e.detail;
         if (this.modelList !== void 0 && this.modelList?.length > 0) {
-          const r = [...this.modelList], o = r?.[i], h = r?.[t];
-          o && h && (r.splice(i, 1), r.splice(t, 0, o)), this.chartsOrderReorderCounter += 1, this.arcgisChartsConfigModelListReorder.emit({ modelList: r });
+          const a = [...this.modelList], s = a?.[i], h = a?.[t];
+          s && h && (a.splice(i, 1), a.splice(t, 0, s)), this.chartsOrderReorderCounter += 1, this.arcgisChartsConfigModelListReorder.emit({ modelList: a });
         }
       }
-    }, this.isChartRenamePopoverOpen = !1, this.chartTitle = "", this.chartsOrderReorderCounter = 0, this.noGroup = !1, this.disableEditing = !1, this.arcgisChartsConfigModelListReorder = s(), this.arcgisChartsConfigViewChartAddChart = s(), this.arcgisChartsConfigViewChartDelete = s(), this.arcgisChartsConfigViewChartEdit = s(), this.arcgisChartsConfigViewChartSelect = s();
+    }, this.isChartRenamePopoverOpen = !1, this.chartTitle = "", this.chartsOrderReorderCounter = 0, this.noGroup = !1, this.disableEditing = !1, this.arcgisChartsConfigModelListReorder = o(), this.arcgisChartsConfigViewChartAddChart = o(), this.arcgisChartsConfigViewChartDelete = o(), this.arcgisChartsConfigViewChartEdit = o(), this.arcgisChartsConfigViewChartSelect = o();
   }
   static {
     this.properties = { isChartRenamePopoverOpen: 16, chartTitle: 16, selectedActionChartId: 16, chartsOrderReorderCounter: 16, messageOverrides: 0, selectedChartId: 1, layer: 0, modelList: 0, noGroup: 5, disableEditing: 5 };
@@ -82,15 +58,16 @@ class R extends v {
   onAddChartClick(e) {
     e.stopImmediatePropagation(), this.selectedActionChartId = void 0, this.isChartRenamePopoverOpen && this.removeChartRenamePopover(), this.arcgisChartsConfigViewChartAddChart.emit({
       referenceElement: e.target,
-      layerId: this.layer?.id.toString()
+      layerId: this.layer?.id.toString(),
+      layerType: this.layer?.type
     });
   }
   buildChartList() {
-    const e = this.modelList ? w(this.modelList, (t) => t.chartId, (t, i) => {
-      const r = t.chartId, o = t.titleText, h = p(t.config);
-      return a`<calcite-list-item .label=${o ?? r ?? this._messages.chartTitle} .selected=${this.selectedChartId === (r?.toString() ?? i.toString())} .value=${r ?? i.toString()} @click=${this.onChartSelect}><calcite-icon slot=content-start .icon=${h}></calcite-icon>${this.disableEditing ? null : a`<calcite-dropdown slot=actions-end overlay-positioning=fixed placement=bottom-end .open=${this.selectedActionChartId === r} @calciteDropdownClose=${() => this.chartActionClosed(r ?? "")} @calciteDropdownOpen=${() => this.chartActionOpened(r ?? "")} class=${c(n.dropdownPopup)}><calcite-action scale=l .text=${this._messages.chartActions ?? ""} slot=trigger .active=${r === this.selectedActionChartId}><calcite-icon icon=ellipsis></calcite-icon></calcite-action><calcite-dropdown-group selection-mode=none><calcite-dropdown-item accesskey=edit @calciteDropdownItemSelect=${this.chartEditSelect}>${this._messages.edit}</calcite-dropdown-item><calcite-dropdown-item accesskey=rename @click=${(l) => l.stopPropagation()} @calciteDropdownItemSelect=${this.chartRenameSelect}>${this._messages.rename}</calcite-dropdown-item><calcite-dropdown-item accesskey=delete @calciteDropdownItemSelect=${this.chartDeleteSelect}>${this._messages.delete}</calcite-dropdown-item></calcite-dropdown-group></calcite-dropdown>`}</calcite-list-item>`;
+    const e = this.modelList ? v(this.modelList, (t) => t.chartId, (t, i) => {
+      const a = t.chartId, s = t.titleText, h = u(t.config);
+      return r`<calcite-list-item .label=${s ?? a ?? this._messages.chartTitle} .selected=${this.selectedChartId === (a?.toString() ?? i.toString())} .value=${a ?? i.toString()} @click=${this.onChartSelect}><calcite-icon slot=content-start .icon=${h}></calcite-icon>${this.disableEditing ? null : r`<calcite-dropdown slot=actions-end overlay-positioning=fixed placement=bottom-end .open=${this.selectedActionChartId === a} @calciteDropdownClose=${() => this.chartActionClosed(a ?? "")} @calciteDropdownOpen=${() => this.chartActionOpened(a ?? "")} class=${c(n.dropdownPopup)}><calcite-action scale=l .text=${this._messages.chartActions ?? ""} slot=trigger .active=${a === this.selectedActionChartId}><calcite-icon icon=ellipsis></calcite-icon></calcite-action><calcite-dropdown-group selection-mode=none><calcite-dropdown-item accesskey=edit @calciteDropdownItemSelect=${this.chartEditSelect}>${this._messages.edit}</calcite-dropdown-item><calcite-dropdown-item accesskey=rename @click=${(l) => l.stopPropagation()} @calciteDropdownItemSelect=${this.chartRenameSelect}>${this._messages.rename}</calcite-dropdown-item><calcite-dropdown-item accesskey=delete @calciteDropdownItemSelect=${this.chartDeleteSelect}>${this._messages.delete}</calcite-dropdown-item></calcite-dropdown-group></calcite-dropdown>`}</calcite-list-item>`;
     }) : null;
-    return this.layer ? a`<div>${this.noGroup ? null : a`<p class=${c(n.header)}>${this.layer.title ?? this.layer.id.toString()}</p>`}${m(this.chartsOrderReorderCounter, a`<calcite-list label .dragEnabled=${!this.disableEditing} selection-mode=single selection-appearance=border @calciteListOrderChange=${this.onCalciteListOrderChange}>${e}${this.disableEditing ? null : a`<div class=${c(n.addChartContainer)}><calcite-fab slot=fab appearance=outline-fill kind=neutral text-enabled .text=${this._messages.addChart} .label=${this._messages.addChart} @click=${this.onAddChartClick} scale=s></calcite-fab></div>`}</calcite-list>`)}</div>` : null;
+    return this.layer ? r`<div>${this.noGroup ? null : r`<p class=${c(n.header)}>${this.layer.title ?? this.layer.id.toString()}</p>`}${m(this.chartsOrderReorderCounter, r`<calcite-list label .dragEnabled=${!this.disableEditing} selection-mode=single selection-appearance=border @calciteListOrderChange=${this.onCalciteListOrderChange}>${e}${this.disableEditing ? null : r`<div class=${c(n.addChartContainer)}><calcite-fab slot=fab appearance=outline-fill kind=neutral text-enabled .text=${this._messages.addChart} .label=${this._messages.addChart} @click=${this.onAddChartClick} scale=s></calcite-fab></div>`}</calcite-list>`)}</div>` : null;
   }
   onChartSelect(e) {
     const t = e.currentTarget;
@@ -104,10 +81,10 @@ class R extends v {
   }
   chartRenameSelect(e) {
     if (!this.disableEditing) {
-      const i = e.target.closest("calcite-list-item"), r = this.modelList?.find((o) => o.chartId === this.selectedActionChartId);
+      const i = e.target.closest("calcite-list-item"), a = this.modelList?.find((s) => s.chartId === this.selectedActionChartId);
       i !== null && (this.renameReferenceElement = i), this.arcgisChartsConfigViewChartSelect.emit({
         chartId: this.selectedActionChartId
-      }), this.chartTitle = r?.titleText ?? "", this.setupRenamePopover();
+      }), this.chartTitle = a?.titleText ?? "", this.setupRenamePopover();
     }
   }
   chartDeleteSelect() {
@@ -122,13 +99,13 @@ class R extends v {
     this.selectedActionChartId = e;
   }
   setupRenamePopover() {
-    this.isChartRenamePopoverOpen = !0, this.chartRenamePopover !== null && (this.chartRenamePopover.name = this.chartTitle, this.chartRenamePopover.referenceElement = this.renameReferenceElement), this.chartRenamePopover = u(a`<arcgis-charts-config-chart-rename-popover .name=${this.chartTitle} .referenceElement=${this.renameReferenceElement} .open=${this.isChartRenamePopoverOpen} @arcgisChartsConfigPopoverClose=${this.popoverClose} @arcgisChartsConfigChartRenamePopoverChange=${this.onChartRename}></arcgis-charts-config-chart-rename-popover>`), !document.body.contains(this.chartRenamePopover) && this.chartRenamePopover !== null && document.body.appendChild(this.chartRenamePopover);
+    this.isChartRenamePopoverOpen = !0, this.chartRenamePopover !== null && (this.chartRenamePopover.name = this.chartTitle, this.chartRenamePopover.referenceElement = this.renameReferenceElement), this.chartRenamePopover = f(r`<arcgis-charts-config-chart-rename-popover .name=${this.chartTitle} .referenceElement=${this.renameReferenceElement} .open=${this.isChartRenamePopoverOpen} @arcgisChartsConfigPopoverClose=${this.popoverClose} @arcgisChartsConfigChartRenamePopoverChange=${this.onChartRename}></arcgis-charts-config-chart-rename-popover>`), !document.body.contains(this.chartRenamePopover) && this.chartRenamePopover !== null && document.body.appendChild(this.chartRenamePopover);
   }
   removeChartRenamePopover() {
-    this.chartRenamePopover !== null && (this.isChartRenamePopoverOpen = !1, this.chartRenamePopover = C(this.chartRenamePopover));
+    this.chartRenamePopover !== null && (this.isChartRenamePopoverOpen = !1, this.chartRenamePopover = w(this.chartRenamePopover));
   }
   render() {
-    return a`<div class=${c(n.viewChartComponent)}>${this.buildChartList()}</div>`;
+    return r`<div class=${c(n.viewChartComponent)}>${this.buildChartList()}</div>`;
   }
 }
 d("arcgis-charts-config-view-charts", R);

package/dist/components/arcgis-charts-info-modal/customElement.js

@@ -1,65 +1,37 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import { c as s } from "../../chunks/runtime.js";
-import { css as n, html as i } from "lit";
-import { LitElement as c, safeClassMap as e, safeStyleMap as r } from "@arcgis/lumina";
-import { i as a } from "../../chunks/index6.js";
-import "@arcgis/toolkit/intl";
-import "lodash-es";
-import "luxon";
-import "d3-array";
-import "@arcgis/toolkit/type";
-import "../../chunks/series-types.js";
-import { d8 as d } from "../../chunks/index.js";
-import "@arcgis/core/Graphic.js";
-import "@arcgis/core/renderers/support/jsonUtils.js";
-import "@arcgis/core/symbols/support/symbolUtils.js";
-import "@arcgis/core/intl.js";
-import "@arcgis/core/layers/support/FeatureFilter.js";
-import "@arcgis/core/smartMapping/statistics/histogram.js";
-import "@arcgis/core/smartMapping/statistics/summaryStatistics.js";
-import "simple-statistics";
-import "@arcgis/core/request.js";
-import "@arcgis/core/AttributeBinsGraphic.js";
-import "@arcgis/core/geometry/support/jsonUtils.js";
-import "@arcgis/core/rest/support/AttributeBinsQuery.js";
-import "@arcgis/core/rest/support/StatisticDefinition.js";
-import "@arcgis/core/time/TimeExtent.js";
-import "@arcgis/core/core/promiseUtils.js";
-import "@arcgis/toolkit/dom";
-const h = n`.hide{display:none}.am5-html-container{z-index:101!important}.am5-layer-1000{z-index:1000!important}.am5-layer-30{z-index:100!important}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}:host{display:block;width:100%;height:100%;overflow:auto}.panel-children-container{display:flex;padding:0 1rem;margin-top:1rem}.panel-children-container calcite-label{flex:1 1 0px;display:flex;width:0px}.container{box-sizing:border-box;width:100%;height:100%;display:grid;place-items:center;align-content:center;justify-content:center;padding:1rem;background-color:var(--calcite-color-foreground-1);text-align:left}.container h3.heading-true{color:var(--calcite-color-text-1);margin-bottom:auto;background:#0000000d;height:30px;padding-left:.5rem;padding-top:.5rem;justify-self:stretch;text-align:left}.container h3.heading-false{background:var(--calcite-color-foreground-1);margin-bottom:auto}.container p{color:var(--calcite-color-text-1);justify-self:stretch;text-align:left}.chart-loader-overlay{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:1001;background:var(--calcite-color-foreground-1)}`, l = { Container: "container", ChartLoaderOverlay: "chart-loader-overlay" };
-class p extends c {
+import { c as d } from "../../chunks/runtime.js";
+import { css as c, html as r } from "lit";
+import { LitElement as h, safeClassMap as s, safeStyleMap as i } from "@arcgis/lumina";
+import { H as a } from "../../chunks/resources.js";
+import { at as g, au as m, e as l, ar as p } from "../../chunks/index.js";
+import { p as f, B as u } from "../../chunks/index3.js";
+const C = c`.hide{visibility:hidden}.am5-html-container{z-index:101!important}.am5-layer-1000{z-index:1000!important}.am5-layer-30{z-index:100!important}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}:host{display:block;width:auto;height:auto;overflow:auto}.panel-children-container{display:flex;padding:0 1rem;margin-top:1rem}.panel-children-container calcite-label{flex:1 1 0px;display:flex;width:0px}.info-modal-container{box-sizing:border-box;width:-webkit-fill-available;height:100%;display:grid;position:absolute;place-items:center;align-content:center;justify-content:center;padding:1rem;text-align:start}.info-modal-container h3.heading-true{display:flex;margin-bottom:auto;background:#0000000d;height:30px;padding:.5rem;justify-self:stretch;text-align:start;align-items:center}.info-modal-container h3.heading-false{background:#0000000d;margin-bottom:auto;text-align:start}.info-modal-container p{justify-self:stretch;text-align:start}.chart-loader-overlay{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:1001}`;
+class b extends h {
   constructor() {
-    super(...arguments), this.message = "", this.heading = "", this.showErrorModalInfo = !1;
+    super(...arguments), this.message = "", this.heading = "", this.showLoader = !1;
   }
   static {
-    this.properties = { message: 1, heading: 1, showErrorModalInfo: 5, showLoader: 5, loaderColors: 0, calciteThemeApplied: 1 };
+    this.properties = { message: 1, heading: 1, showLoader: 5, loaderColors: 0, calciteThemeColors: 0 };
   }
   static {
-    this.styles = h;
+    this.styles = C;
   }
   render() {
-    let t = null, o;
-    return this.loaderColors?.curtainColor && (this.calciteThemeApplied === "dark" ? o = a({
-      r: this.loaderColors.curtainColor[0],
-      g: this.loaderColors.curtainColor[1],
-      b: this.loaderColors.curtainColor[2],
-      a: this.loaderColors.curtainColor[3] / 255
-    }) ? "var(--calcite-color-text-inverse)" : "var(--calcite-color-text-1)" : o = a({
-      r: this.loaderColors.curtainColor[0],
-      g: this.loaderColors.curtainColor[1],
-      b: this.loaderColors.curtainColor[2],
-      a: this.loaderColors.curtainColor[3] / 255
-    }) ? "var(--calcite-color-text-1)" : "var(--calcite-color-text-inverse)"), this.showErrorModalInfo ? t = i`<div class=${e(l.Container)} style=${r(this.loaderColors?.curtainColor ? { background: `rgb(${this.loaderColors?.curtainColor.toString()})` } : void 0)}><h3 class=${e(this.heading !== "" ? "heading-true" : "heading-false")} style=${r(o ? { color: o } : void 0)}>${this.heading}</h3><p style=${r(o ? { color: o } : void 0)} .innerHTML=${d(this.message) ?? ""}></p></div>` : this.showLoader && (t = i`<div class=${e(l.ChartLoaderOverlay)} style=${r({
-      ...this.loaderColors?.curtainColor && {
-        background: `rgb(${this.loaderColors.curtainColor.toString()})`
-      },
-      ...this.loaderColors?.spinnerColor && {
-        "--calcite-loader-progress-color": `rgb(${this.loaderColors.spinnerColor.toString()})`
-      }
-    })}><calcite-loader scale=s label=Loading></calcite-loader></div>`), t;
+    let t = null;
+    const e = this.loaderColors?.curtainColor ?? this.calciteThemeColors?.backgroundColor ?? g, n = this.loaderColors?.spinnerColor ?? this.calciteThemeColors?.spinnerColor ?? m;
+    let o;
+    return this.loaderColors?.curtainColor ? o = f({
+      r: e[0],
+      g: e[1],
+      b: e[2],
+      a: e[3] / 255
+    }) ? l : p : o = this.calciteThemeColors?.textColor ?? l, this.showLoader ? t = r`<div class=${s(a.ChartLoaderOverlay)} style=${i({
+      background: `rgb(${e.toString()})`,
+      "--calcite-loader-progress-color": `rgb(${n.toString()})`
+    })}><calcite-loader scale=s label=Loading></calcite-loader></div>` : this.message !== void 0 ? t = r`<div class=${s(a.InfoModalContainer)} style=${i({ background: `rgb(${e.toString()})` })}><h3 class=${s(this.heading !== void 0 ? "heading-true" : "heading-false")} style=${i({ color: `rgb(${o.toString()})` })}>${this.heading}</h3><p style=${i({ color: `rgb(${o.toString()})` })} .innerHTML=${u(this.message) ?? ""}></p></div>` : t = r`<div class=${`${a.InfoModalContainer} ${a.Hide}`}></div>`, t;
   }
 }
-s("arcgis-charts-info-modal", p);
+d("arcgis-charts-info-modal", b);
 export {
-  p as ArcgisChartsInfoModal
+  b as ArcgisChartsInfoModal
 };