@arcgis/charts-components 5.1.0-next.8 → 5.1.0-next.80

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

@@ -7,35 +7,43 @@ import L from "@arcgis/core/Color.js";
 import { LitElement as T, createEvent as h, safeClassMap as r, nothing as g, safeStyleMap as P } from "@arcgis/lumina";
 import { createRef as u, ref as p } from "lit/directives/ref.js";
 import { isEqual as S } from "lodash-es";
-import { br as A, cY as D, bM as E, bL as _, dj as b, ap as M } from "../../chunks/index.js";
+import { ax as A, bm as D, cM as E, d2 as _, ep as b, e4 as M } from "../../chunks/index.js";
 import { u as v } from "../../chunks/useT9n.js";
 import { d as c, W as $ } from "../../chunks/interfaces.js";
 import "@arcgis/toolkit/type";
-import { a as N, u as y, v as C } from "../../chunks/series-types.js";
+import { r as N, i as y, e as C } from "../../chunks/series-types.js";
 import { R as B } from "../../chunks/rest-js-object-literals.js";
 import "@arcgis/toolkit/intl";
 import "luxon";
-import "d3-array";
 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 "@amcharts/amcharts4/core.js";
+import "@amcharts/amcharts4/charts.js";
+import "@amcharts/amcharts4/.internal/charts/axes/Axis.js";
 import "@arcgis/core/layers/support/FeatureFilter.js";
 import "@arcgis/core/smartMapping/statistics/histogram.js";
 import "@arcgis/core/smartMapping/statistics/summaryStatistics.js";
+import "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/layers/support/CodedValueDomain.js";
+import "@arcgis/core/intl.js";
 import "simple-statistics";
 import "@arcgis/core/request.js";
-import "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/core/sql.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
+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 "@arcgis/core/applications/Components/imageryUtils.js";
+import "@arcgis/core/geometry/Extent.js";
+import "@arcgis/core/geometry/Point.js";
 import "@arcgis/toolkit/dom";
 import { e as H } from "../../chunks/popover-ui-utils.js";
-import { b as x, a as j, c as m } from "../../chunks/chart-ui-utils2.js";
-import { C as k, a as R } from "../../chunks/class-breaks.js";
-const O = F`.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)}.name{display:flex;flex-direction:column;margin:.5rem;padding:.5rem;background:#fff;min-width:250px}.header{margin:0;font-weight:bolder}.pick-list-item-label{font-size:small}.panel{max-height:60vh}.color-ramp-popover{display:flex;flex-direction:column;gap:.75rem;min-width:320px;max-width:480px}.color-ramp-toolbar{display:flex;gap:.5rem;align-items:center;padding:5px 5px 0}.ramp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.5rem;max-height:300px;overflow:auto;padding:.25rem}.ramp-item{display:flex;flex-direction:column;border:1px solid var(--calcite-color-foreground-3);background:var(--calcite-color-foreground-1);cursor:pointer;box-shadow:inset 0 0 0 1px transparent;transition:box-shadow .12s;border-radius:2px;min-height:56px;padding:4px}.ramp-item:hover{box-shadow:inset 0 0 0 1px var(--calcite-color-foreground-3)}.ramp-name{font-size:.625rem;line-height:1;padding:2px 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--calcite-color-text-3)}.ramp-item.selected{background-color:var(--calcite-color-brand)!important;border-color:var(--calcite-color-brand)!important;outline:2px solid var(--calcite-color-brand)!important;color:var(--calcite-color-foreground-1)}.ramp-item.selected .ramp-name{color:var(--calcite-color-foreground-1)}.ramp-item.selected .ramp-strip{box-shadow:none;border:none}.ramp-strips{display:flex;flex:1;height:28px;width:100%;overflow:hidden}.ramp-strip{flex:1;min-width:0}.ramp-strip-fallback{background:repeating-linear-gradient(45deg,var(--calcite-color-foreground-3) 0,var(--calcite-color-foreground-3) 5px,var(--calcite-color-foreground-2) 5px,var(--calcite-color-foreground-2) 10px)}.ramp-empty{grid-column:1/-1;font-size:.75rem;color:var(--calcite-color-text-3)}.panel-children-container{display:flex;padding:0 1rem;margin-top:1rem}.panel-children-container calcite-label{flex:1 1 0px;display:flex;width:0px}.color-ramp-popover-footer{display:flex;padding:.5rem}.color-ramp-popover-footer calcite-button{flex:1}`, s = {
+import { b as x, a as O, c as m } from "../../chunks/chart-ui-utils2.js";
+import { C as k, d as R } from "../../chunks/class-breaks.js";
+const j = F`.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)}.name{display:flex;flex-direction:column;margin:.5rem;padding:.5rem;background:#fff;min-width:250px}.header{margin:0;font-weight:bolder}.pick-list-item-label{font-size:small}.panel{max-height:60vh}.color-ramp-popover{display:flex;flex-direction:column;gap:.75rem;min-width:320px;max-width:480px}.color-ramp-toolbar{display:flex;gap:.5rem;align-items:center;padding:5px 5px 0}.ramp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.5rem;max-height:300px;overflow:auto;padding:.25rem}.ramp-item{display:flex;flex-direction:column;border:1px solid var(--calcite-color-foreground-3);background:var(--calcite-color-foreground-1);cursor:pointer;box-shadow:inset 0 0 0 1px transparent;transition:box-shadow .12s;border-radius:2px;min-height:56px;padding:4px}.ramp-item:hover{box-shadow:inset 0 0 0 1px var(--calcite-color-foreground-3)}.ramp-name{font-size:.625rem;line-height:1;padding:2px 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--calcite-color-text-3)}.ramp-item.selected{background-color:var(--calcite-color-brand)!important;border-color:var(--calcite-color-brand)!important;outline:2px solid var(--calcite-color-brand)!important;color:var(--calcite-color-foreground-1)}.ramp-item.selected .ramp-name{color:var(--calcite-color-foreground-1)}.ramp-item.selected .ramp-strip{box-shadow:none;border:none}.ramp-strips{display:flex;flex:1;height:28px;width:100%;overflow:hidden}.ramp-strip{flex:1;min-width:0}.ramp-strip-fallback{background:repeating-linear-gradient(45deg,var(--calcite-color-foreground-3) 0,var(--calcite-color-foreground-3) 5px,var(--calcite-color-foreground-2) 5px,var(--calcite-color-foreground-2) 10px)}.ramp-empty{grid-column:1/-1;font-size:.75rem;color:var(--calcite-color-text-3)}.panel-children-container{display:flex;padding:0 1rem;margin-top:1rem}.panel-children-container calcite-label{flex:1 1 0px;display:flex;width:0px}.color-ramp-popover-footer{display:flex;padding:.5rem}.color-ramp-popover-footer calcite-button{flex:1}`, s = {
   jsAppFlyout: "js-app-flyout",
   name: "bar-chart-data-popover",
   header: "header",
@@ -61,7 +69,7 @@ class q extends T {
     this.properties = { availableColorRamps: 16, selectedColorRampName: 16, selectedCategory: 16, aggregationLabels: 16, isFlipped: 5, model: 0, messageOverrides: 0, headingTitle: 1, referenceElement: 0, open: 5, contentKind: 1, layerFieldsInfo: 0, selectedContent: 1, colorRamps: 0 };
   }
   static {
-    this.styles = O;
+    this.styles = j;
   }
   async reposition() {
     await this.popoverElement.value?.reposition();
@@ -73,7 +81,7 @@ class q extends T {
   updated() {
     setTimeout(() => {
       this.picklist.value?.setFocus();
-    }, j.PopoverTimer), H(this.popoverElement.value, this.open);
+    }, O.PopoverTimer), H(this.popoverElement.value, this.open);
   }
   buildAggregationListItems() {
     return d(x.filter((e) => e !== N.NoAggregation), (e) => e, (e, t) => l`<calcite-list-item .label=${this.aggregationLabels[t]} .value=${e} .selected=${m(e, this.selectedContent)}></calcite-list-item>`);

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

@@ -3,33 +3,40 @@ import { c as l } from "../../chunks/runtime.js";
 import "@arcgis/toolkit/intl";
 import { isEqual as r } from "lodash-es";
 import "luxon";
-import "d3-array";
-import "@arcgis/toolkit/type";
 import "../../chunks/series-types.js";
-import { bF as n, bH as h } from "../../chunks/index.js";
+import "@arcgis/toolkit/type";
+import { db as n, cp as h, bx as m, a8 as c } from "../../chunks/index.js";
 import "@arcgis/core/Graphic.js";
 import "@arcgis/core/renderers/support/jsonUtils.js";
 import "@arcgis/core/symbols/support/symbolUtils.js";
+import "@amcharts/amcharts4/core.js";
+import "@amcharts/amcharts4/charts.js";
+import "@amcharts/amcharts4/.internal/charts/axes/Axis.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 "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/layers/support/CodedValueDomain.js";
+import "@arcgis/core/intl.js";
 import "simple-statistics";
 import "@arcgis/core/request.js";
-import "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/core/sql.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
+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 c, h as m } from "../../chunks/index4.js";
+import "@arcgis/core/applications/Components/imageryUtils.js";
+import "@arcgis/core/geometry/Extent.js";
+import "@arcgis/core/geometry/Point.js";
 import "@arcgis/toolkit/dom";
 import { LitElement as d } from "@arcgis/lumina";
-import { css as g, html as i } from "lit";
-import { C as s } from "../../chunks/interfaces.js";
-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 d {
+import { css as g, html as a } from "lit";
+import { C as o } from "../../chunks/interfaces.js";
+const p = 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 f extends d {
   constructor() {
     super(...arguments), this.onModelConfigChange = async (e) => {
       const t = e?.detail.config ?? this.model.config;
@@ -40,52 +47,52 @@ class p extends d {
     this.properties = { layerFieldsInfo: 16, model: 0, chartData: 0, seriesColor: 0, calculatedMinMaxBounds: 0, page: 1, layer: 0, usePopupTemplateFieldsInfo: 5 };
   }
   static {
-    this.styles = f;
+    this.styles = p;
   }
   async load() {
     this.seriesColor !== void 0 && this.seriesColorChange(this.seriesColor), await this.updateFetchLayerFieldsInfo(this.model?.config), this.modelChange(this.model);
   }
   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();
+    let i = !1;
+    e.has("model") && this.modelChange(this.model, e.get("model")), e.has("layer") && this.layer !== void 0 && !r(e.get("layer"), this.layer) && (i = !0), e.has("usePopupTemplateFieldsInfo") && this.usePopupTemplateFieldsInfo !== e.get("usePopupTemplateFieldsInfo") && (i = !0), e.has("seriesColor") && this.seriesColorChange(this.seriesColor), this.layerFieldsInfo === void 0 && (i = !0), i && this.updateFetchLayerFieldsInfo();
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this.model.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
-  modelChange(e, a) {
-    a?.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange), e?.addEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
+  modelChange(e, i) {
+    i?.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange), e?.addEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
   seriesColorChange(e) {
-    this.model.colorMatch && e?.forEach((a) => {
-      c(a) && e?.get(0) !== void 0 && !r(this.model.binSymbol, a) && (this.model.binSymbol = a);
+    this.model.colorMatch && e?.forEach((i) => {
+      n(i) && e?.get(0) !== void 0 && !r(this.model.binSymbol, i) && (this.model.binSymbol = i);
     });
   }
   async updateFetchLayerFieldsInfo(e) {
-    const a = e ?? this.model.config;
+    const i = e ?? this.model.config;
     let t = this.layer;
     if (!t) {
-      const o = m(a) ? a.iLayer : void 0;
-      o && (t = await n(o));
+      const s = h(i) ? i.iLayer : void 0;
+      s && (t = await m(s));
     }
-    t && (this.layerFieldsInfo = await h(t, this.usePopupTemplateFieldsInfo));
+    t && (await t.load(), this.layerFieldsInfo = c(t, this.usePopupTemplateFieldsInfo));
   }
   render() {
     let e;
     switch (this.page) {
-      case s.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>`;
+      case o.Data:
+        e = a`<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 = i`<arcgis-charts-config-axes .model=${this.model} show-max-y-bound-option .calculatedMinMaxBounds=${this.calculatedMinMaxBounds}></arcgis-charts-config-axes>`;
+      case o.Axes:
+        e = a`<arcgis-charts-config-axes .model=${this.model} show-max-y-bound-option .calculatedMinMaxBounds=${this.calculatedMinMaxBounds}></arcgis-charts-config-axes>`;
         break;
-      case s.Guides:
-        e = i`<arcgis-charts-config-guides .model=${this.model} enable-y-axis-guide></arcgis-charts-config-guides>`;
+      case o.Guides:
+        e = a`<arcgis-charts-config-guides .model=${this.model} enable-y-axis-guide></arcgis-charts-config-guides>`;
         break;
-      case s.Format:
-        e = i`<arcgis-charts-config-format .model=${this.model}></arcgis-charts-config-format>`;
+      case o.Format:
+        e = a`<arcgis-charts-config-format .model=${this.model}></arcgis-charts-config-format>`;
         break;
-      case s.General:
-        e = i`<arcgis-charts-config-general .model=${this.model}></arcgis-charts-config-general>`;
+      case o.General:
+        e = a`<arcgis-charts-config-general .model=${this.model}></arcgis-charts-config-general>`;
         break;
       default:
         e = "";
@@ -94,7 +101,7 @@ class p extends d {
     return e;
   }
 }
-l("arcgis-charts-config-histogram", p);
+l("arcgis-charts-config-histogram", f);
 export {
-  p as ArcgisChartsConfigHistogram
+  f as ArcgisChartsConfigHistogram
 };

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

@@ -4,29 +4,37 @@ import { keyed as y } from "lit/directives/keyed.js";
 import "@arcgis/toolkit/intl";
 import { debounce as f } from "lodash-es";
 import "luxon";
-import "d3-array";
+import { g as p } from "../../chunks/series-types.js";
 import "@arcgis/toolkit/type";
-import { b as u } from "../../chunks/series-types.js";
-import { f as I } from "../../chunks/rest-js-object-literals.js";
-import { cY as L, aF as V, aD as T } from "../../chunks/index.js";
+import { i as I } from "../../chunks/rest-js-object-literals.js";
+import { bm as L, ah as V, aJ as T } 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 "@amcharts/amcharts4/core.js";
+import "@amcharts/amcharts4/charts.js";
+import "@amcharts/amcharts4/.internal/charts/axes/Axis.js";
 import "@arcgis/core/layers/support/FeatureFilter.js";
 import "@arcgis/core/smartMapping/statistics/histogram.js";
 import "@arcgis/core/smartMapping/statistics/summaryStatistics.js";
+import "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/layers/support/CodedValueDomain.js";
+import "@arcgis/core/intl.js";
 import "simple-statistics";
 import "@arcgis/core/request.js";
-import "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/core/sql.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
+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 "@arcgis/core/applications/Components/imageryUtils.js";
+import "@arcgis/core/geometry/Extent.js";
+import "@arcgis/core/geometry/Point.js";
 import "@arcgis/toolkit/dom";
 import { r as P } from "../../chunks/popover-ui-utils.js";
-import { H as m, e as a, b as d } from "../../chunks/interfaces.js";
+import { H as c, e as a, b as d } from "../../chunks/interfaces.js";
 import { i as x, m as C, a as S, k as N, s as F, U as D, D as B } from "../../chunks/chart-ui-utils2.js";
 import { d as _, s as H } from "../../chunks/store.js";
 import { u as K } from "../../chunks/useT9n.js";
@@ -41,7 +49,7 @@ const o = {
   sectionLabel: "section-label",
   binTextPadding: "bin-text-padding",
   histogramStatsList: "histogram-stats-list"
-}, j = A`.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:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin)}calcite-list-item{margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor)}.label{display:flex;margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor);margin-bottom:var(--arcgis-charts-config-margin-minor);justify-content:space-between}.text{display:flex;margin-left:var(--arcgis-charts-config-margin-minor);width:calc(100% - 1.5rem);height:2rem;margin-bottom:var(--arcgis-charts-config-margin-minor);justify-content:space-between}.row{padding-top:1rem}.bin-count-container{display:flex;flex-wrap:wrap;padding:var(--arcgis-charts-config-margin-minor)}.bin-count-container>calcite-slider{flex-grow:10;min-width:50%}.bin-count-container>calcite-input{margin-bottom:.5rem;margin-top:var(--arcgis-charts-config-margin-minor);margin-left:var(--arcgis-charts-config-margin-minor);width:5rem}.section-label{display:flex;margin:var(--arcgis-charts-config-margin-major) var(--arcgis-charts-config-margin-minor);justify-content:space-between;align-items:center;font-weight:var(--calcite-font-weight-medium);font-size:var(--calcite-font-size-0)}.bin-text-padding{margin-left:var(--arcgis-charts-config-margin-minor)}.histogram-stats-list{pointer-events:none;margin-bottom:var(--arcgis-charts-config-margin-minor)}`;
+}, j = A`.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:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin)}calcite-list-item{margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor)}.label{display:flex;margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor);margin-bottom:var(--arcgis-charts-config-margin-minor);justify-content:space-between}.text{display:flex;margin-left:var(--arcgis-charts-config-margin-minor);width:calc(100% - 1.5rem);height:2rem;margin-bottom:var(--arcgis-charts-config-margin-minor);justify-content:space-between}.row{padding-top:1rem}.bin-count-container{display:flex;flex-wrap:wrap;padding:var(--arcgis-charts-config-margin-minor)}.bin-count-container>calcite-slider{flex-grow:10;min-width:50%}.bin-count-container>calcite-input{margin-bottom:.5rem;margin-top:var(--arcgis-charts-config-margin-minor);margin-left:var(--arcgis-charts-config-margin-minor);width:5rem}.section-label{display:flex;margin:var(--arcgis-charts-config-margin-major) var(--arcgis-charts-config-margin-minor);justify-content:space-between;align-items:center;font-weight:var(--calcite-font-weight-medium);font-size:var(--calcite-font-size-0)}.bin-text-padding{margin-left:var(--arcgis-charts-config-margin-minor)}.histogram-stats-list{pointer-events:none;margin-bottom:var(--arcgis-charts-config-margin-minor)}`;
 class q extends U {
   constructor() {
     super(...arguments), this._messages = K(), this.numericalFieldSelectionElement = b(), this.transformationSelectionElement = b(), this.histogramPopover = null, this.binColorSectionElement = b(), this.binSliderElement = b(), this.binInputElement = b(), this.popoverHeading = "", this.onBinCountChange = f(() => {
@@ -67,10 +75,10 @@ class q extends U {
         if (e.detail !== null && e.detail !== void 0) {
           const { contentKind: t } = e.detail, { value: i } = e.detail;
           switch (_(H), t) {
-            case m.transformation:
-              this.model.dataTransformationType = i ?? u.None;
+            case c.transformation:
+              this.model.dataTransformationType = i ?? p.None;
               break;
-            case m.numericFields:
+            case c.numericFields:
               this.model.numericField = i ?? "";
               break;
             default:
@@ -133,13 +141,13 @@ class q extends U {
   getDataTransformationLabel() {
     let e;
     switch (this.model.dataTransformationType) {
-      case u.None:
+      case p.None:
         e = this._messages.none ?? "";
         break;
-      case u.Log:
+      case p.Log:
         e = this._messages.log ?? "";
         break;
-      case u.Sqrt:
+      case p.Sqrt:
         e = this._messages.sqRt ?? "";
         break;
       default:
@@ -192,13 +200,13 @@ class q extends U {
     }));
   }
   onColorElementSelect(e, t, i) {
-    this.binColorSelected = i === void 0, e.type === I.SFS ? (this.selectedOverlaySymbol = void 0, this.selectedBinColorSymbol = e, this.contentKind = m.fillSymbol) : (this.selectedBinColorSymbol = void 0, this.selectedOverlaySymbol = e, this.overlaySectionElement = i, this.contentKind = m.lineSymbol), this.popoverHeading = t, this.setupPopover();
+    this.binColorSelected = i === void 0, e.type === I.SFS ? (this.selectedOverlaySymbol = void 0, this.selectedBinColorSymbol = e, this.contentKind = c.fillSymbol) : (this.selectedBinColorSymbol = void 0, this.selectedOverlaySymbol = e, this.overlaySectionElement = i, this.contentKind = c.lineSymbol), this.popoverHeading = t, this.setupPopover();
   }
   onNumericFieldSelect(e) {
-    e.stopImmediatePropagation(), this.selectedNumericalField = this.model.numericField, this.contentKind = m.numericFields, this.setupPopover();
+    e.stopImmediatePropagation(), this.selectedNumericalField = this.model.numericField, this.contentKind = c.numericFields, this.setupPopover();
   }
   onTransformationSelect(e) {
-    e.stopImmediatePropagation(), this.selectedTransformationType = this.model.dataTransformationType, this.contentKind = m.transformation, this.setupPopover();
+    e.stopImmediatePropagation(), this.selectedTransformationType = this.model.dataTransformationType, this.contentKind = c.transformation, this.setupPopover();
   }
   onBinColorSelect(e) {
     e.stopImmediatePropagation(), this.onColorElementSelect(this.model.binSymbol, this._messages.binColor ?? "");
@@ -222,28 +230,28 @@ class q extends U {
     this.model.dataLabelsVisibility = e.target.checked;
   }
   onOverlayListChange(e) {
-    const t = e.target.selectedItems.map((h) => h.value), i = t.includes(a.Mean), c = t.includes(a.Median), l = t.includes(a.StandardDev), n = t.includes(a.NormalDist);
-    this.meanOverlayVisible !== i && (this.model.showMeanOverlay = i, this.meanOverlayVisible = i), this.medianOverlayVisible !== c && (this.model.showMedianOverlay = c, this.medianOverlayVisible = c), this.standardDevOverlayVisible !== l && (this.model.showStandardDevOverlay = l, this.standardDevOverlayVisible = l), this.normalDistOverlayVisible !== n && (this.model.showNormalDistOverlay = n, this.normalDistOverlayVisible = n);
+    const t = e.target.selectedItems.map((h) => h.value), i = t.includes(a.Mean), m = t.includes(a.Median), l = t.includes(a.StandardDev), n = t.includes(a.NormalDist);
+    this.meanOverlayVisible !== i && (this.model.showMeanOverlay = i, this.meanOverlayVisible = i), this.medianOverlayVisible !== m && (this.model.showMedianOverlay = m, this.medianOverlayVisible = m), this.standardDevOverlayVisible !== l && (this.model.showStandardDevOverlay = l, this.standardDevOverlayVisible = l), this.normalDistOverlayVisible !== n && (this.model.showNormalDistOverlay = n, this.normalDistOverlayVisible = n);
   }
   setupPopover() {
     this.removeHistogramDataPopover();
     const e = [...this.layerFieldsInfo];
-    let t, i, c = "trailing", l, n, h, g;
+    let t, i, m = "trailing", l, n, h, g;
     switch (this.contentKind) {
-      case m.transformation:
+      case c.transformation:
         l = this.selectedTransformationType, t = this.transformationSelectionElement.value, h = void 0, g = void 0, n = void 0;
         break;
-      case m.numericFields:
+      case c.numericFields:
         n = this.selectedNumericalField, t = this.numericalFieldSelectionElement.value, h = void 0, g = void 0, l = void 0;
         break;
-      case m.fillSymbol:
-        t = this.binColorSectionElement.value, h = this.selectedBinColorSymbol, i = this.popoverHeading, c = "leading", g = void 0, l = void 0, n = void 0;
+      case c.fillSymbol:
+        t = this.binColorSectionElement.value, h = this.selectedBinColorSymbol, i = this.popoverHeading, m = "leading", g = void 0, l = void 0, n = void 0;
         break;
-      case m.lineSymbol:
+      case c.lineSymbol:
         this.selectedOverlayKind = this.overlaySectionElement?.value, t = this.overlaySectionElement, g = this.selectedOverlaySymbol, i = this.popoverHeading, h = void 0, l = void 0, n = void 0;
         break;
     }
-    this.histogramPopover = z(r`<arcgis-charts-config-histogram-popover .headingTitle=${i} .referenceElement=${t} open .contentKind=${this.contentKind} .layerFieldsInfo=${e} .placement=${c} .selectedNumericField=${n} .selectedTransformationType=${l} .selectedBinColor=${h} .selectedOverlaySymbol=${g} @arcgisChartsConfigPopoverClose=${this.popoverClose} @arcgisChartsConfigHistogramPopoverChange=${this.updateProps} @arcgisChartsConfigHistogramPopoverSymbolChange=${this.updateSymbolProps}></arcgis-charts-config-histogram-popover>`), !document.body.contains(this.histogramPopover) && this.histogramPopover !== null && document.body.appendChild(this.histogramPopover);
+    this.histogramPopover = z(r`<arcgis-charts-config-histogram-popover .headingTitle=${i} .referenceElement=${t} open .contentKind=${this.contentKind} .layerFieldsInfo=${e} .placement=${m} .selectedNumericField=${n} .selectedTransformationType=${l} .selectedBinColor=${h} .selectedOverlaySymbol=${g} @arcgisChartsConfigPopoverClose=${this.popoverClose} @arcgisChartsConfigHistogramPopoverChange=${this.updateProps} @arcgisChartsConfigHistogramPopoverSymbolChange=${this.updateSymbolProps}></arcgis-charts-config-histogram-popover>`), !document.body.contains(this.histogramPopover) && this.histogramPopover !== null && document.body.appendChild(this.histogramPopover);
   }
   renderFieldSelect() {
     return r`<arcgis-charts-config-field-select .label=${L(this.layerFieldsInfo, this.model.numericField)} @click=${this.onNumericFieldSelect} ${v(this.numericalFieldSelectionElement)}></arcgis-charts-config-field-select>`;
@@ -252,12 +260,12 @@ class q extends U {
     return r`<arcgis-charts-config-field-select .label=${this.getDataTransformationLabel()} @click=${this.onTransformationSelect} ${v(this.transformationSelectionElement)}></arcgis-charts-config-field-select>`;
   }
   renderColorListItem(e) {
-    const { textLabel: t, key: i, value: c, selected: l, ref: n, colorAction: h, color: g } = e, [p, E, w, M] = [...g ?? V()];
-    return y(i, r`<calcite-list-item .label=${t ?? ""} .value=${c} .selected=${l} ${v(n ?? void 0)}><calcite-action text=color slot=actions-end appearance=transparent @click=${h}><calcite-icon icon=line-solid style=${O(p !== void 0 ? { color: `rgba(${p},${E},${w},${(M ?? 0) / 255})` } : {})}></calcite-icon></calcite-action></calcite-list-item>`);
+    const { textLabel: t, key: i, value: m, selected: l, ref: n, colorAction: h, color: g } = e, [u, E, w, M] = [...g ?? V()];
+    return y(i, r`<calcite-list-item .label=${t ?? ""} .value=${m} .selected=${l} ${v(n ?? void 0)}><calcite-action text=color slot=actions-end appearance=transparent @click=${h}><calcite-icon icon=line-solid style=${O(u !== void 0 ? { color: `rgba(${u},${E},${w},${(M ?? 0) / 255})` } : {})}></calcite-icon></calcite-action></calcite-list-item>`);
   }
   renderBinColorElement() {
-    const [e, t, i, c] = [...this.model.binSymbol?.color ?? T(0)];
-    return r`<calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .label=${this._messages.binColor} value=selectTrendLine .selected=${this.binColorSelected} @click=${this.onBinColorSelect} ${v(this.binColorSectionElement)}><calcite-icon slot=content-end icon=square-f style=${O({ color: `rgba(${e},${t},${i},${c / 255})` })} class=${s(o.iconSelect)}></calcite-icon></calcite-list-item></calcite-list>`;
+    const [e, t, i, m] = [...this.model.binSymbol?.color ?? T(0)];
+    return r`<calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .label=${this._messages.binColor} value=selectTrendLine .selected=${this.binColorSelected} @click=${this.onBinColorSelect} ${v(this.binColorSectionElement)}><calcite-icon slot=content-end icon=square-f style=${O({ color: `rgba(${e},${t},${i},${m / 255})` })} class=${s(o.iconSelect)}></calcite-icon></calcite-list-item></calcite-list>`;
   }
   renderNormalDistOverlay() {
     return this.normalDistOverlayVisible = this.model.showNormalDistOverlay, this.renderColorListItem({

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

@@ -3,31 +3,39 @@ import { c as f } from "../../chunks/runtime.js";
 import { css as y, html as o } from "lit";
 import { keyed as c } from "lit/directives/keyed.js";
 import "@arcgis/toolkit/type";
-import { b as s } from "../../chunks/series-types.js";
-import { f as v } from "../../chunks/rest-js-object-literals.js";
+import { g as s } from "../../chunks/series-types.js";
+import { i as v } from "../../chunks/rest-js-object-literals.js";
 import "@arcgis/toolkit/intl";
 import "lodash-es";
 import "luxon";
-import "d3-array";
-import { bL as C, cY as u, ap as b } from "../../chunks/index.js";
+import { d2 as C, bm as u, e4 as b } 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 "@amcharts/amcharts4/core.js";
+import "@amcharts/amcharts4/charts.js";
+import "@amcharts/amcharts4/.internal/charts/axes/Axis.js";
 import "@arcgis/core/layers/support/FeatureFilter.js";
 import "@arcgis/core/smartMapping/statistics/histogram.js";
 import "@arcgis/core/smartMapping/statistics/summaryStatistics.js";
+import "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/layers/support/CodedValueDomain.js";
+import "@arcgis/core/intl.js";
 import "simple-statistics";
 import "@arcgis/core/request.js";
-import "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/core/sql.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
+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 "@arcgis/core/applications/Components/imageryUtils.js";
+import "@arcgis/core/geometry/Extent.js";
+import "@arcgis/core/geometry/Point.js";
 import "@arcgis/toolkit/dom";
 import { e as $ } from "../../chunks/popover-ui-utils.js";
-import { H as l } from "../../chunks/interfaces.js";
+import { H as r } from "../../chunks/interfaces.js";
 import { a as P, l as S } from "../../chunks/chart-ui-utils2.js";
 import { u as k } from "../../chunks/useT9n.js";
 import { createRef as m, ref as h } from "lit/directives/ref.js";
@@ -40,7 +48,7 @@ const i = {
   pickListItemLabel: "pick-list-item-label",
   fieldSelectPanel: "field-select-panel",
   transformationPanel: "transformation-panel"
-}, T = y`.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)}.right{display:block;text-align:right}.inline{display:inline-flex;flex-wrap:wrap}.symbol-property-popover{min-width:300px}.symbol-property-popover .inline{align-items:center;margin-bottom:1rem;padding:0 1rem}.symbol-property-popover .inline calcite-action{margin-left:.2rem}.symbol-property-popover .inline input,.symbol-property-popover .inline select{width:4rem;margin-left:.5rem;height:24px}.symbol-property-popover .inline select{width:6rem}.symbol-property-popover .color calcite-icon{margin-left:.5rem}.symbol-property-popover .color .color-picker{padding:1rem}.header{margin:0;font-weight:bolder}.pick-list-item-label{font-size:small}.field-select-panel{max-height:60vh}.transformation-panel{width:calc(var(--calcite-panel-width-multiplier) * 12vw);max-width:calc(var(--calcite-panel-width-multiplier) * 300px);min-width:calc(var(--calcite-panel-width-multiplier) * 150px);min-width:calc(var(--calcite-panel-width-multiplier) * 170px)}`;
+}, T = y`.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)}.right{display:block;text-align:right}.inline{display:inline-flex;flex-wrap:wrap}.symbol-property-popover{min-width:300px}.symbol-property-popover .inline{align-items:center;margin-bottom:1rem;padding:0 1rem}.symbol-property-popover .inline calcite-action{margin-left:.2rem}.symbol-property-popover .inline input,.symbol-property-popover .inline select{width:4rem;margin-left:.5rem;height:24px}.symbol-property-popover .inline select{width:6rem}.symbol-property-popover .color calcite-icon{margin-left:.5rem}.symbol-property-popover .color .color-picker{padding:1rem}.header{margin:0;font-weight:bolder}.pick-list-item-label{font-size:small}.field-select-panel{max-height:60vh}.transformation-panel{width:calc(var(--calcite-panel-width-multiplier) * 12vw);max-width:calc(var(--calcite-panel-width-multiplier) * 300px);min-width:calc(var(--calcite-panel-width-multiplier) * 150px);min-width:calc(var(--calcite-panel-width-multiplier) * 170px)}`;
 class F extends L {
   constructor() {
     super(...arguments), this._messages = k(), this.picklist = m(), this.popoverElement = m(), this.layerFieldsInfo = [], this.arcgisChartsConfigHistogramPopoverChange = p(), this.arcgisChartsConfigHistogramPopoverSymbolChange = p(), this.arcgisChartsConfigPopoverClose = p();
@@ -61,23 +69,23 @@ class F extends L {
   }
   buildPickListItems(e) {
     const n = [];
-    if (e === l.numericFields)
-      for (let r = 0; r < this.layerFieldsInfo?.length; r += 1) {
-        const a = this.layerFieldsInfo[r];
+    if (e === r.numericFields)
+      for (let l = 0; l < this.layerFieldsInfo?.length; l += 1) {
+        const a = this.layerFieldsInfo[l];
         C(a) && n.push(c(a.name, o`<calcite-list-item .label=${u(this.layerFieldsInfo, a.name)} .value=${a.name} .selected=${this.selectedNumericField === a.name}></calcite-list-item>`));
       }
     else {
-      const r = [
+      const l = [
         c(s.None, o`<calcite-list-item .label=${this._messages.none} .value=${s.None} .selected=${this.selectedTransformationType === s.None}></calcite-list-item>`),
         c(s.Log, o`<calcite-list-item .label=${this._messages.log} .value=${s.Log} .selected=${this.selectedTransformationType === s.Log}></calcite-list-item>`),
         c(s.Sqrt, o`<calcite-list-item .label=${this._messages.sqRt} .value=${s.Sqrt} .selected=${this.selectedTransformationType === s.Sqrt}></calcite-list-item>`)
       ];
-      n.push(...r);
+      n.push(...l);
     }
     return n;
   }
   getPopoverClass() {
-    return this.contentKind === l.fillSymbol || this.contentKind === l.lineSymbol ? i.symbolPropertyPopover : "";
+    return this.contentKind === r.fillSymbol || this.contentKind === r.lineSymbol ? i.symbolPropertyPopover : "";
   }
   closePopover() {
     (this.open || this.popoverElement.value?.open === !1) && (this.open = !1, this.arcgisChartsConfigPopoverClose.emit());
@@ -86,10 +94,10 @@ class F extends L {
     this.arcgisChartsConfigHistogramPopoverSymbolChange.emit(e.detail);
   }
   fillColorChange(e) {
-    const n = e.detail, [r, a, d] = n, g = b * 255;
+    const n = e.detail, [l, a, d] = n, g = b * 255;
     this.arcgisChartsConfigHistogramPopoverSymbolChange.emit({
       type: v.SFS,
-      color: [r, a, d, g]
+      color: [l, a, d, g]
     });
   }
   onPickListChange(e) {
@@ -105,11 +113,11 @@ class F extends L {
     return o`<arcgis-charts-config-line-style class=${t(i.colorPicker)} .open=${this.open} enable-close .header=${this.headingTitle ?? this._messages.lineStyle} .lineStyle=${this.selectedOverlaySymbol} @arcgisChartsConfigLineStyleClose=${this.closePopover} @arcgisChartsConfigLineStyleChange=${this.overlaySymbolChange}></arcgis-charts-config-line-style>`;
   }
   renderFieldSelect() {
-    const e = this.buildPickListItems(l.numericFields);
+    const e = this.buildPickListItems(r.numericFields);
     return o`<calcite-panel class=${t(i.fieldSelectPanel)} closable .closed=${!this.open} @calcitePanelClose=${this.closePopover}><div slot=header-content class=${t(i.header)}>${this._messages.numericalFieldHeader}</div><calcite-list label selection-mode=single selection-appearance=border class=${t(i.pickListItemLabel)} filter-enabled @calciteListChange=${this.onPickListChange} ${h(this.picklist)}>${e}</calcite-list></calcite-panel>`;
   }
   renderTransformationSelect() {
-    const e = this.buildPickListItems(l.transformation);
+    const e = this.buildPickListItems(r.transformation);
     return o`<calcite-panel class=${t(i.transformationPanel)} closable .closed=${!this.open} @calcitePanelClose=${this.closePopover}><div slot=header-content class=${t(i.header)}>${this._messages.transformationHeader}</div><calcite-list label selection-mode=single selection-appearance=border class=${t(i.pickListItemLabel)} @calciteListChange=${this.onPickListChange}>${e}</calcite-list></calcite-panel>`;
   }
   render() {
@@ -117,13 +125,13 @@ class F extends L {
   }
   renderContentType() {
     switch (this.contentKind) {
-      case l.fillSymbol:
+      case r.fillSymbol:
         return this.renderFillColor();
-      case l.lineSymbol:
+      case r.lineSymbol:
         return this.renderOverlayStyle();
-      case l.numericFields:
+      case r.numericFields:
         return this.renderFieldSelect();
-      case l.transformation:
+      case r.transformation:
         return this.renderTransformationSelect();
       default:
         return;

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

@@ -3,31 +3,38 @@ import { c as l } from "../../chunks/runtime.js";
 import "@arcgis/toolkit/intl";
 import { isEqual as o } from "lodash-es";
 import "luxon";
-import "d3-array";
-import "@arcgis/toolkit/type";
 import "../../chunks/series-types.js";
-import { bF as n, bH as h, bL as c, bM as d } from "../../chunks/index.js";
+import "@arcgis/toolkit/type";
+import { cp as n, bx as c, a8 as h, d2 as d, cM as m } from "../../chunks/index.js";
 import "@arcgis/core/Graphic.js";
 import "@arcgis/core/renderers/support/jsonUtils.js";
 import "@arcgis/core/symbols/support/symbolUtils.js";
+import "@amcharts/amcharts4/core.js";
+import "@amcharts/amcharts4/charts.js";
+import "@amcharts/amcharts4/.internal/charts/axes/Axis.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 "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/layers/support/CodedValueDomain.js";
+import "@arcgis/core/intl.js";
 import "simple-statistics";
 import "@arcgis/core/request.js";
-import "@arcgis/core/AttributeBinsGraphic.js";
+import "@arcgis/core/core/sql.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
+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 { h as m } from "../../chunks/index4.js";
+import "@arcgis/core/applications/Components/imageryUtils.js";
+import "@arcgis/core/geometry/Extent.js";
+import "@arcgis/core/geometry/Point.js";
 import "@arcgis/toolkit/dom";
 import { LitElement as g, createEvent as f } from "@arcgis/lumina";
-import { css as p, html as a } from "lit";
-import { C as r } from "../../chunks/interfaces.js";
+import { css as p, html as r } from "lit";
+import { C as a } from "../../chunks/interfaces.js";
 const u = p`: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 C extends g {
   constructor() {
@@ -64,32 +71,32 @@ class C extends g {
     const e = t ?? this.model.config;
     let i = this.layer;
     if (!i) {
-      const s = m(e) ? e.iLayer : void 0;
-      s && (i = await n(s));
+      const s = n(e) ? e.iLayer : void 0;
+      s && (i = await c(s));
     }
-    i && (this.layerFieldsInfo = await h(i, this.usePopupTemplateFieldsInfo));
+    i && (await i.load(), this.layerFieldsInfo = h(i, this.usePopupTemplateFieldsInfo));
   }
   render() {
-    const t = this.layerFieldsInfo?.find((s) => s.name === this.model.xAxisField), e = t !== void 0 && (c(t) || d(t));
+    const t = this.layerFieldsInfo?.find((s) => s.name === this.model.xAxisField), e = t !== void 0 && (d(t) || m(t));
     let i;
     switch (this.page) {
-      case r.Data:
-        i = a`<arcgis-charts-config-line-chart-data .model=${this.model} .resetTimeInterval=${this.model.resetTimeInterval} .layerFieldsInfo=${this.layerFieldsInfo}></arcgis-charts-config-line-chart-data>`;
+      case a.Data:
+        i = r`<arcgis-charts-config-line-chart-data .model=${this.model} .resetTimeInterval=${this.model.resetTimeInterval} .layerFieldsInfo=${this.layerFieldsInfo}></arcgis-charts-config-line-chart-data>`;
         break;
-      case r.Series:
-        i = a`<arcgis-charts-config-line-chart-series .model=${this.model} .activeColorMatch=${this.activeColorMatch} .popoverPlacement=${this.popoverPlacement}></arcgis-charts-config-line-chart-series>`;
+      case a.Series:
+        i = r`<arcgis-charts-config-line-chart-series .model=${this.model} .activeColorMatch=${this.activeColorMatch} .popoverPlacement=${this.popoverPlacement}></arcgis-charts-config-line-chart-series>`;
         break;
-      case r.Axes:
-        i = a`<arcgis-charts-config-axes .model=${this.model} show-min-y-bound-option show-max-y-bound-option show-enable-x-log-option show-enable-y-log-option .calculatedMinMaxBounds=${this.calculatedMinMaxBounds} .calculatedDataMinMaxBounds=${this.calculatedDataMinMaxBounds}></arcgis-charts-config-axes>`;
+      case a.Axes:
+        i = r`<arcgis-charts-config-axes .model=${this.model} show-min-y-bound-option show-max-y-bound-option show-enable-x-log-option show-enable-y-log-option .calculatedMinMaxBounds=${this.calculatedMinMaxBounds} .calculatedDataMinMaxBounds=${this.calculatedDataMinMaxBounds}></arcgis-charts-config-axes>`;
         break;
-      case r.Guides:
-        i = a`<arcgis-charts-config-guides .model=${this.model} .timeZone=${this.timeZone} .calculatedMinMaxBounds=${this.calculatedMinMaxBounds} .enableXAxisGuide=${e} enable-y-axis-guide></arcgis-charts-config-guides>`;
+      case a.Guides:
+        i = r`<arcgis-charts-config-guides .model=${this.model} .timeZone=${this.timeZone} .calculatedMinMaxBounds=${this.calculatedMinMaxBounds} .enableXAxisGuide=${e} enable-y-axis-guide></arcgis-charts-config-guides>`;
         break;
-      case r.Format:
-        i = a`<arcgis-charts-config-format .model=${this.model}></arcgis-charts-config-format>`;
+      case a.Format:
+        i = r`<arcgis-charts-config-format .model=${this.model}></arcgis-charts-config-format>`;
         break;
-      case r.General:
-        i = a`<arcgis-charts-config-general .model=${this.model}></arcgis-charts-config-general>`;
+      case a.General:
+        i = r`<arcgis-charts-config-general .model=${this.model}></arcgis-charts-config-general>`;
         break;
       default:
         i = "";