@arcgis/charts-components 4.33.0-next.103 → 4.33.0-next.104

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

@@ -3,7 +3,7 @@ import { keyed as f } from "lit-html/directives/keyed.js";
 import { RESTSymbolType as T } from "@arcgis/charts-spec";
 import { debounce as C, isEmpty as E, toNumber as G } from "lodash-es";
 import "d3-array";
-import { p as S, l as $ } from "../../chunks/interfaces.js";
+import { aN as S, X as $ } from "../../chunks/interfaces.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
@@ -12,7 +12,7 @@ import "@arcgis/core/time/TimeExtent.js";
 import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
 import { r as N, c as x, P as _ } from "../../chunks/popover-ui-utils.js";
-import { O as d } from "../../chunks/scatter-plot-model.js";
+import { V as d } from "../../chunks/scatter-plot-model.js";
 import { U as I, c as D, d as O, s as p } from "../../chunks/chart-ui-utils2.js";
 import { u as w } from "../../chunks/useT9n.js";
 import { html as h } from "lit";
@@ -21,7 +21,7 @@ import { LitElement as M, createEvent as P, safeStyleMap as b, safeClassMap as s
 import { css as k } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.103 */
+v4.33.0-next.104 */
 const o = {
   sectionLabel: "section-label",
   label: "label",
@@ -32,7 +32,7 @@ const o = {
   groupingLabelContainer: "grouping-label-container",
   numberInput: "number-input"
 }, z = k`:host{display:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin)}.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)}.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}.label .grouping-label-container{display:flex;justify-content:space-between}.label .slider-input-container{display:flex}.label .slider-input-container calcite-slider{--calcite-label-margin-bottom: var(--arcgis-charts-intra-section-margin) !important;margin-right:var(--arcgis-charts-config-margin-minor);flex-grow:1}.label .slider-input-container .number-input{width:8rem}.slice-list{margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor);margin-bottom:var(--arcgis-charts-config-margin-major)}.radio-group{margin-top:var(--arcgis-charts-config-margin-minor)}.pie-donut-labels-container{display:flex;justify-content:space-between;margin-top:calc(var(--arcgis-charts-config-margin-minor) * -3)}`;
-class j extends M {
+class V extends M {
   constructor() {
     super(...arguments), this._messages = w(), this.slicesPopover = null, this.donutSizeSliderElement = m(), this.groupingThresholdElement = m(), this.groupingThresholdSliderElement = m(), this.labelCharacterLimitElement = m(), this.decimalPlacesElement = m(), this.onDonutSizeSliderChange = C(() => {
       this.donutSizeSliderElement.value && Number.isInteger(this.donutSizeSliderElement.value?.value) && this.model.setInnerRadiusSize(this.donutSizeSliderElement.value.value ?? S);
@@ -249,7 +249,7 @@ class j extends M {
     }} ${g(this.groupingThresholdElement)}></calcite-input></div></calcite-label><div class=${s(o.sectionLabel)}>${this._messages.labels}</div><calcite-label class=${s(o.label)}>${this._messages.labelCharacterLimit}<calcite-input type=number min=1 step=1 .value=${p(this.model.getLabelCharacterLimit())} @calciteInputInput=${this.onLabelCharacterLimitChange} ${g(this.labelCharacterLimitElement)}></calcite-input></calcite-label><calcite-label class=${s(o.label)}>${this._messages.decimalPlaces}<calcite-input type=number min=0 max=20 step=1 .value=${p(this.model.getDecimalPlaces())} @calciteInputInput=${this.onDecimalPlacesChange} ${g(this.decimalPlacesElement)}></calcite-input></calcite-label><calcite-label class=${s(o.label)}>${this._messages.display}<calcite-radio-button-group class=${s(o.radioGroup)} name=display layout=vertical @calciteRadioButtonGroupChange=${this.onDisplayTypeChange}><calcite-label layout=inline><calcite-radio-button .value=${d.Value} .checked=${this.model.getDisplayType() === d.Value}></calcite-radio-button>${this._messages.value}</calcite-label><calcite-label layout=inline><calcite-radio-button .value=${d.Percentage} .checked=${this.model.getDisplayType() === d.Percentage}></calcite-radio-button>${this._messages.percentage}</calcite-label><calcite-label layout=inline><calcite-radio-button .value=${d.Both} .checked=${this.model.getDisplayType() === d.Both}></calcite-radio-button>${this._messages.both}</calcite-label></calcite-radio-button-group></calcite-label><div class=${s(o.sectionLabel)}>${this._messages.slices}<calcite-button @click=${this.resetSlicesOriginal} .disabled=${!this.model.resetAvailable()} appearance=transparent icon-end=reset>${this._messages.reset}</calcite-button></div>${this.buildSliceList()}<div class=${s(o.sectionLabel)}>${this._messages.groupedSlices}</div>${this.buildGroupedSliceList()}`;
   }
 }
-L("arcgis-charts-config-pie-chart-slices", j);
+L("arcgis-charts-config-pie-chart-slices", V);
 export {
-  j as ArcGISChartsConfigPieChartSlices
+  V as ArcGISChartsConfigPieChartSlices
 };

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

@@ -2,7 +2,7 @@ import { c } from "../../chunks/runtime.js";
 import "@arcgis/charts-spec";
 import "lodash-es";
 import "d3-array";
-import { r as p } from "../../chunks/interfaces.js";
+import { R as p } from "../../chunks/interfaces.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
@@ -15,16 +15,15 @@ import { U as m } from "../../chunks/chart-ui-utils2.js";
 import { u as d } from "../../chunks/useT9n.js";
 import { html as g } from "lit";
 import { createRef as f, ref as C } from "lit-html/directives/ref.js";
-import { LitElement as v, createEvent as o, safeClassMap as s } from "@arcgis/lumina";
+import { LitElement as v, createEvent as o, safeClassMap as i } from "@arcgis/lumina";
 import { css as u } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.103 */
-const i = {
-  hostDiv: "host-div",
+v4.33.0-next.104 */
+const s = {
   jsAppFlyout: "js-app-flyout",
   panelChildrenContainer: "panel-children-container"
-}, b = u`.hide{display:none}.am5-modal{width:100%;height:100%;position:absolute;z-index:100000;top:0;left:0}.am5-modal-curtain{top:0;left:0;width:100%;height:100%;position:absolute;background:#fff!important;z-index:100}.am5-modal-wrapper{top:0;left:0;width:100%;height:100%;position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;background:#ffffff80;z-index:101}.am5-modal-content{display:inline-block;padding:1.2em;vertical-align:middle;text-align:start;white-space:normal;background:#fff;border-radius:4px;box-shadow:#00000073 0 0 36px;color:#000}.am5-layer-1000{z-index:1000!important}.arcgis-charts-modal{box-shadow:none!important}.arcgis-charts-modal-header{background-color:#0000000d;font-weight:700;padding:4px;align-content:center}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}.host-div{overflow-y:auto;width:min-content}.panel-children-container{display:flex;padding:0 1rem;margin-top:1rem}.panel-children-container calcite-label{flex:1 1 0px;display:flex;width:0px}`;
+}, b = u`.hide{display:none}.am5-modal{width:100%;height:100%;position:absolute;z-index:100000;top:0;left:0}.am5-modal-curtain{top:0;left:0;width:100%;height:100%;position:absolute;background:#fff!important;z-index:100}.am5-modal-wrapper{top:0;left:0;width:100%;height:100%;position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;background:#ffffff80;z-index:101}.am5-modal-content{display:inline-block;padding:1.2em;vertical-align:middle;text-align:start;white-space:normal;background:#fff;border-radius:4px;box-shadow:#00000073 0 0 36px;color:#000}.am5-layer-1000{z-index:1000!important}.arcgis-charts-modal{box-shadow:none!important}.arcgis-charts-modal-header{background-color:#0000000d;font-weight:700;padding:4px;align-content:center}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}:host{overflow-y:auto;width:min-content}.panel-children-container{display:flex;padding:0 1rem;margin-top:1rem}.panel-children-container calcite-label{flex:1 1 0px;display:flex;width:0px}`;
 class x extends v {
   constructor() {
     super(...arguments), this._messages = d(), this.popoverElement = f(), this.arcgisChartsConfigPopoverClose = o(), this.arcgisChartsConfigPopoverOpenChange = o(), this.arcgisChartsConfigSlicesPopoverColorChange = o(), this.arcgisChartsConfigSlicesPopoverNameChange = o();
@@ -89,10 +88,9 @@ class x extends v {
   /** @category Lifecycle */
   render() {
     const e = this.selectedColor !== void 0 ? [...this.selectedColor] : void 0;
-    return g`<div class=${s({
-      [i.jsAppFlyout]: !0,
-      [i.hostDiv]: !0
-    })}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} @calcitePopoverClose=${this.closePopover} .open=${this.open} label ${C(this.popoverElement)}><calcite-panel .heading=${this._messages.sliceStyle} closable .closed=${!this.open} @calcitePanelClose=${this.closePopover}><div class=${s(i.panelChildrenContainer)}><calcite-label>${this._messages.label}<calcite-input type=text .value=${this.selectedName} @calciteInputInput=${this.sliceNameChange}></calcite-input></calcite-label></div><div class=${s(i.panelChildrenContainer)}><arcgis-charts-config-colors .heading=${this._messages.symbolColor} .rgba=${e} @colorSelect=${this.colorChange}></arcgis-charts-config-colors></div></calcite-panel></calcite-popover></div>`;
+    return g`<div class=${i({
+      [s.jsAppFlyout]: !0
+    })}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} @calcitePopoverClose=${this.closePopover} .open=${this.open} label ${C(this.popoverElement)}><calcite-panel .heading=${this._messages.sliceStyle} closable .closed=${!this.open} @calcitePanelClose=${this.closePopover}><div class=${i(s.panelChildrenContainer)}><calcite-label>${this._messages.label}<calcite-input type=text .value=${this.selectedName} @calciteInputInput=${this.sliceNameChange}></calcite-input></calcite-label></div><div class=${i(s.panelChildrenContainer)}><arcgis-charts-config-colors .heading=${this._messages.symbolColor} .rgba=${e} @colorSelect=${this.colorChange}></arcgis-charts-config-colors></div></calcite-panel></calcite-popover></div>`;
   }
 }
 c("arcgis-charts-config-pie-chart-slices-popover", x);

package/dist/components/arcgis-charts-config-pie-chart-slices-popover/resource.d.ts

@@ -1,5 +1,4 @@
 export declare const HTMLClasses: {
-    readonly hostDiv: "host-div";
     readonly jsAppFlyout: "js-app-flyout";
     readonly panelChildrenContainer: "panel-children-container";
 };

package/dist/components/arcgis-charts-config-scatter-plot/customElement.js

@@ -2,7 +2,7 @@ import { c as r } from "../../chunks/runtime.js";
 import "@arcgis/charts-spec";
 import { isEqual as n } from "lodash-es";
 import "d3-array";
-import { h as l, j as h, k as p } from "../../chunks/interfaces.js";
+import { g as l, aX as h, bE as p } from "../../chunks/interfaces.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
@@ -10,14 +10,14 @@ import "@arcgis/core/rest/support/Query.js";
 import "@arcgis/core/time/TimeExtent.js";
 import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
-import { h as d } from "../../chunks/index.js";
+import { j as d } from "../../chunks/index.js";
 import { LitElement as c, createEvent as g } from "@arcgis/lumina";
 import { html as i } from "lit";
-import { C as o } from "../../chunks/interfaces2.js";
+import { C as o } from "../../chunks/interfaces3.js";
 import { css as m } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.103 */
+v4.33.0-next.104 */
 const f = m`: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 u extends c {
   constructor() {

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

@@ -2,7 +2,7 @@ import { c as E } from "../../chunks/runtime.js";
 import { WebChartTypes as b, RESTSymbolType as P } from "@arcgis/charts-spec";
 import { cloneDeep as I, isEmpty as T, toNumber as z } from "lodash-es";
 import "d3-array";
-import { d as F, c as y, e as $, r as w } from "../../chunks/interfaces.js";
+import { aM as F, c6 as y, $, R as w } from "../../chunks/interfaces.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
@@ -11,19 +11,18 @@ import "@arcgis/core/time/TimeExtent.js";
 import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
 import { r as C, c as L, P as k } from "../../chunks/popover-ui-utils.js";
-import { S as l, b as h } from "../../chunks/interfaces2.js";
+import { S as l, b as h } from "../../chunks/interfaces3.js";
 import { d as A, s as m } from "../../chunks/store.js";
 import { a as f, m as g, f as M, s as u, D as V, b as p } from "../../chunks/chart-ui-utils2.js";
 import { u as _ } from "../../chunks/useT9n.js";
 import { html as r } from "lit";
 import { createRef as d, ref as a } from "lit-html/directives/ref.js";
-import { LitElement as D, createEvent as v, safeClassMap as s, safeStyleMap as x } from "@arcgis/lumina";
+import { LitElement as D, createEvent as v, safeClassMap as i, safeStyleMap as x } from "@arcgis/lumina";
 import { css as N } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.103 */
-const i = {
-  hostDiv: "host-div",
+v4.33.0-next.104 */
+const s = {
   label: "label",
   r2: "r2",
   numberInput: "number-input",
@@ -33,7 +32,7 @@ const i = {
   sectionContainer: "section-container",
   multiInputSection: "multi-input-section",
   rtl: "arcgis-charts-rtl"
-}, R = N`.hide{display:none}.am5-modal{width:100%;height:100%;position:absolute;z-index:100000;top:0;left:0}.am5-modal-curtain{top:0;left:0;width:100%;height:100%;position:absolute;background:#fff!important;z-index:100}.am5-modal-wrapper{top:0;left:0;width:100%;height:100%;position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;background:#ffffff80;z-index:101}.am5-modal-content{display:inline-block;padding:1.2em;vertical-align:middle;text-align:start;white-space:normal;background:#fff;border-radius:4px;box-shadow:#00000073 0 0 36px;color:#000}.am5-layer-1000{z-index:1000!important}.arcgis-charts-modal{box-shadow:none!important}.arcgis-charts-modal-header{background-color:#0000000d;font-weight:700;padding:4px;align-content:center}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}.host-div{display:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin)}.host-div .number-input{margin-bottom:.5rem;display:flex}.host-div .number-input>div{width:100%}calcite-list-item{margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor)}calcite-slider{margin-top:-1.5rem}.r2{margin:var(--arcgis-charts-config-margin-major) 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}.section-container{display:flex;flex-direction:column}.icon-select{cursor:pointer}.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)}.switch-element{margin-right:var(--arcgis-charts-config-margin-minor)}.multi-input-section{display:flex;justify-content:space-between;align-items:center}.host-div.arcgis-charts-rtl .text,.host-div.arcgis-charts-rtl .sub-header{margin-left:0rem;margin-right:var(--arcgis-charts-config-margin-minor)}.host-div.arcgis-charts-rtl .switch-element{margin-left:var(--arcgis-charts-config-margin-minor);margin-right:0rem}`;
+}, R = N`.hide{display:none}.am5-modal{width:100%;height:100%;position:absolute;z-index:100000;top:0;left:0}.am5-modal-curtain{top:0;left:0;width:100%;height:100%;position:absolute;background:#fff!important;z-index:100}.am5-modal-wrapper{top:0;left:0;width:100%;height:100%;position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;background:#ffffff80;z-index:101}.am5-modal-content{display:inline-block;padding:1.2em;vertical-align:middle;text-align:start;white-space:normal;background:#fff;border-radius:4px;box-shadow:#00000073 0 0 36px;color:#000}.am5-layer-1000{z-index:1000!important}.arcgis-charts-modal{box-shadow:none!important}.arcgis-charts-modal-header{background-color:#0000000d;font-weight:700;padding:4px;align-content:center}.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)}:host .number-input{margin-bottom:.5rem;display:flex}:host .number-input>div{width:100%}:host .arcgis-charts-rtl .text{margin-left:0rem;margin-right:var(--arcgis-charts-config-margin-minor)}:host .arcgis-charts-rtl .sub-header{margin-left:0rem;margin-right:var(--arcgis-charts-config-margin-minor)}:host .arcgis-charts-rtl .switch-element{margin-left:var(--arcgis-charts-config-margin-minor);margin-right:0rem}calcite-list-item{margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor)}calcite-slider{margin-top:-1.5rem}.r2{margin:var(--arcgis-charts-config-margin-major) 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}.section-container{display:flex;flex-direction:column}.icon-select{cursor:pointer}.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)}.switch-element{margin-right:var(--arcgis-charts-config-margin-minor)}.multi-input-section{display:flex;justify-content:space-between;align-items:center}`;
 class K extends D {
   constructor() {
     super(...arguments), this._messages = _(), this.scatterPlotPopover = null, this.selectColorElement = d(), this.selectTrendLineElement = d(), this.xAxisElement = d(), this.yAxisElement = d(), this.sizeVariableElement = d(), this.colorModeElement = d(), this.symbolSizeModeElement = d(), this.minSizeInputElement = d(), this.maxSizeInputElement = d(), this.items = [], this.setTrendLineSymbol = (e) => {
@@ -294,11 +293,11 @@ class K extends D {
   /** @category Render UX */
   renderStatistics() {
     const [e, t, o, n] = [...this.model.getLinearTrendSymbol()?.color ?? $(0)];
-    return r`<div class=${s(i.sectionContainer)}><calcite-label class=${s(i.label)} layout=inline-space-between>${this._messages.showLinearTrend}<calcite-switch class=${s(i.switchElement)} .checked=${this.model.getShowLinearTrend()} @calciteSwitchChange=${this.setShowTrendLine}></calcite-switch></calcite-label><calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .label=${this._messages.trendLineStyle} value=selectTrendLine .hidden=${!this.model.getShowLinearTrend()} .selected=${this.selectedElement?.type === P.SLS} @click=${this.changeElementStyle} ${a(this.selectTrendLineElement)}><calcite-icon slot=content-end icon=line-solid style=${x({ color: `rgba(${e},${t},${o},${n / 255})` })} class=${s(i.iconSelect)} @click=${this.changeElementStyle}></calcite-icon></calcite-list-item></calcite-list><div class=${s(i.r2)} .hidden=${!this.model.getShowLinearTrend()}>${`${this._messages.r2}: ${Number.isNaN(this.r2) ? this.defaultR2Label : M(this.r2, V)}`}</div></div>`;
+    return r`<div class=${i(s.sectionContainer)}><calcite-label class=${i(s.label)} layout=inline-space-between>${this._messages.showLinearTrend}<calcite-switch class=${i(s.switchElement)} .checked=${this.model.getShowLinearTrend()} @calciteSwitchChange=${this.setShowTrendLine}></calcite-switch></calcite-label><calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .label=${this._messages.trendLineStyle} value=selectTrendLine .hidden=${!this.model.getShowLinearTrend()} .selected=${this.selectedElement?.type === P.SLS} @click=${this.changeElementStyle} ${a(this.selectTrendLineElement)}><calcite-icon slot=content-end icon=line-solid style=${x({ color: `rgba(${e},${t},${o},${n / 255})` })} class=${i(s.iconSelect)} @click=${this.changeElementStyle}></calcite-icon></calcite-list-item></calcite-list><div class=${i(s.r2)} .hidden=${!this.model.getShowLinearTrend()}>${`${this._messages.r2}: ${Number.isNaN(this.r2) ? this.defaultR2Label : M(this.r2, V)}`}</div></div>`;
   }
   /** @category Render UX */
   renderFixedSymbol() {
-    return r`<calcite-label class=${s(i.label)}>${this._messages.size}<calcite-input type=number name=fixed-symbol-size class=${s(i.numberInput)} min=1 max=100 step=1 .value=${u(this.model.getFixedMarkerSymbol()?.size)} @calciteInputInput=${this.symbolSizeChange}></calcite-input></calcite-label>`;
+    return r`<calcite-label class=${i(s.label)}>${this._messages.size}<calcite-input type=number name=fixed-symbol-size class=${i(s.numberInput)} min=1 max=100 step=1 .value=${u(this.model.getFixedMarkerSymbol()?.size)} @calciteInputInput=${this.symbolSizeChange}></calcite-input></calcite-label>`;
   }
   /** @category Render UX */
   renderSizeVariable() {
@@ -306,28 +305,28 @@ class K extends D {
   }
   /** @category Render UX */
   renderMinSizeInput() {
-    return r`<calcite-input type=number name=proportional-symbol-min-size class=${s(i.numberInput)} min=1 .max=${this.model.getSizePolicy()?.maxSize ?? 100} step=1 .value=${u(this.model.getSizePolicy()?.minSize)} @calciteInputInput=${this.symbolSizeChange} ${a(this.minSizeInputElement)}></calcite-input>`;
+    return r`<calcite-input type=number name=proportional-symbol-min-size class=${i(s.numberInput)} min=1 .max=${this.model.getSizePolicy()?.maxSize ?? 100} step=1 .value=${u(this.model.getSizePolicy()?.minSize)} @calciteInputInput=${this.symbolSizeChange} ${a(this.minSizeInputElement)}></calcite-input>`;
   }
   /** @category Render UX */
   renderMaxSizeInput() {
-    return r`<calcite-input type=number name=proportional-symbol-max-size class=${s(i.numberInput)} .min=${this.model.getSizePolicy()?.minSize ?? 1} max=100 step=1 .value=${u(this.model.getSizePolicy()?.maxSize)} @calciteInputInput=${this.symbolSizeChange} ${a(this.maxSizeInputElement)}></calcite-input>`;
+    return r`<calcite-input type=number name=proportional-symbol-max-size class=${i(s.numberInput)} .min=${this.model.getSizePolicy()?.minSize ?? 1} max=100 step=1 .value=${u(this.model.getSizePolicy()?.maxSize)} @calciteInputInput=${this.symbolSizeChange} ${a(this.maxSizeInputElement)}></calcite-input>`;
   }
   /** @category Render UX */
   renderProportionalSymbol() {
-    return r`<div class=${s(i.sectionContainer)}><calcite-label class=${s(i.label)}>${this._messages.numberRequired}${this.renderSizeVariable()}</calcite-label><div class=${s(i.multiInputSection)}><calcite-label class=${s(i.label)}>${this._messages.minSize}${this.renderMinSizeInput()}</calcite-label><calcite-label class=${s(i.label)}>${this._messages.maxSize}${this.renderMaxSizeInput()}</calcite-label></div><calcite-label><calcite-slider min=1 max=100 .minValue=${z(u(this.model.getSizePolicy()?.minSize))} .maxValue=${z(u(this.model.getSizePolicy()?.maxSize))} step=1 @calciteSliderInput=${this.symbolSizeRangeSliderInput}></calcite-slider></calcite-label></div>`;
+    return r`<div class=${i(s.sectionContainer)}><calcite-label class=${i(s.label)}>${this._messages.numberRequired}${this.renderSizeVariable()}</calcite-label><div class=${i(s.multiInputSection)}><calcite-label class=${i(s.label)}>${this._messages.minSize}${this.renderMinSizeInput()}</calcite-label><calcite-label class=${i(s.label)}>${this._messages.maxSize}${this.renderMaxSizeInput()}</calcite-label></div><calcite-label><calcite-slider min=1 max=100 .minValue=${z(u(this.model.getSizePolicy()?.minSize))} .maxValue=${z(u(this.model.getSizePolicy()?.maxSize))} step=1 @calciteSliderInput=${this.symbolSizeRangeSliderInput}></calcite-slider></calcite-label></div>`;
   }
   /** @category Render UX */
   renderSymbolSizeType() {
-    return r`<calcite-label class=${s(i.label)}>${this._messages.size}<calcite-segmented-control name=symbolSizeType layout=horizontal scale=s @calciteSegmentedControlChange=${this.changeSymbolSizeTypeToggle} ${a(this.symbolSizeModeElement)}><calcite-segmented-control-item .value=${h.Fixed} .checked=${h.Fixed === this.selectedSizeType} ${a(this.segmentedControlRef)}>${this._messages.fixed}</calcite-segmented-control-item><calcite-segmented-control-item .value=${h.Proportional} .checked=${h.Proportional === this.selectedSizeType} ${a(this.segmentedControlRef)}>${this._messages.proportional}</calcite-segmented-control-item></calcite-segmented-control></calcite-label>`;
+    return r`<calcite-label class=${i(s.label)}>${this._messages.size}<calcite-segmented-control name=symbolSizeType layout=horizontal scale=s @calciteSegmentedControlChange=${this.changeSymbolSizeTypeToggle} ${a(this.symbolSizeModeElement)}><calcite-segmented-control-item .value=${h.Fixed} .checked=${h.Fixed === this.selectedSizeType} ${a(this.segmentedControlRef)}>${this._messages.fixed}</calcite-segmented-control-item><calcite-segmented-control-item .value=${h.Proportional} .checked=${h.Proportional === this.selectedSizeType} ${a(this.segmentedControlRef)}>${this._messages.proportional}</calcite-segmented-control-item></calcite-segmented-control></calcite-label>`;
   }
   /** @category Render UX */
   renderSymbol() {
     const [e, t, o, n] = [...this.model.getFixedMarkerSymbol()?.color ?? $(0)];
-    return r`<div class=${s(i.sectionContainer)}>${this.renderSymbolSizeType()}${this.selectedSizeType === h.Proportional ? this.renderProportionalSymbol() : this.renderFixedSymbol()}<calcite-label class=${s(i.label)}>${this._messages.color}${this.isTableLayer !== !0 ? r`<calcite-segmented-control name=layerColor layout=horizontal scale=s @calciteSegmentedControlChange=${this.changeColorTypeToggle} ${a(this.colorModeElement)}><calcite-segmented-control-item .value=${this._messages.useLayerColors} .checked=${this.model.getColorMatch()} ${a(this.segmentedControlRef)}>${this._messages.useLayerColors}</calcite-segmented-control-item><calcite-segmented-control-item .value=${this._messages.singleColor} .checked=${!this.model.getColorMatch()} ${a(this.segmentedControlRef)}>${this._messages.singleColor}</calcite-segmented-control-item></calcite-segmented-control>` : null}</calcite-label><calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .label=${this._messages.color} value=selectColor .hidden=${this.model.getColorMatch() && this.isTableLayer !== !0} .selected=${Array.isArray(this.selectedElement)} @click=${this.changeElementStyle} ${a(this.selectColorElement)}><calcite-icon slot=content-end icon=circle-f style=${x({ color: `rgba(${e},${t},${o},${n / 255})` })} class=${s(i.iconSelect)} @click=${this.changeElementStyle}></calcite-icon></calcite-list-item></calcite-list></div>`;
+    return r`<div class=${i(s.sectionContainer)}>${this.renderSymbolSizeType()}${this.selectedSizeType === h.Proportional ? this.renderProportionalSymbol() : this.renderFixedSymbol()}<calcite-label class=${i(s.label)}>${this._messages.color}${this.isTableLayer !== !0 ? r`<calcite-segmented-control name=layerColor layout=horizontal scale=s @calciteSegmentedControlChange=${this.changeColorTypeToggle} ${a(this.colorModeElement)}><calcite-segmented-control-item .value=${this._messages.useLayerColors} .checked=${this.model.getColorMatch()} ${a(this.segmentedControlRef)}>${this._messages.useLayerColors}</calcite-segmented-control-item><calcite-segmented-control-item .value=${this._messages.singleColor} .checked=${!this.model.getColorMatch()} ${a(this.segmentedControlRef)}>${this._messages.singleColor}</calcite-segmented-control-item></calcite-segmented-control>` : null}</calcite-label><calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .label=${this._messages.color} value=selectColor .hidden=${this.model.getColorMatch() && this.isTableLayer !== !0} .selected=${Array.isArray(this.selectedElement)} @click=${this.changeElementStyle} ${a(this.selectColorElement)}><calcite-icon slot=content-end icon=circle-f style=${x({ color: `rgba(${e},${t},${o},${n / 255})` })} class=${i(s.iconSelect)} @click=${this.changeElementStyle}></calcite-icon></calcite-list-item></calcite-list></div>`;
   }
   /** @category Lifecycle */
   render() {
-    return r`<div class=${s({ [i.hostDiv]: !0, [i.rtl]: this.direction === "rtl" })}><h3 class=${s(i.sectionLabel)}>${this._messages.variables}</h3><calcite-label class=${s(i.label)}>${this._messages.xAxisNumber}${this.renderXVariable()}</calcite-label><calcite-label class=${s(i.label)}>${this._messages.yAxisNumber}${this.renderYVariable()}</calcite-label><h3 class=${s(i.sectionLabel)}>${this._messages.statistics}</h3>${this.renderStatistics()}<h3 class=${s(i.sectionLabel)}>${this._messages.symbol}</h3>${this.renderSymbol()}</div>`;
+    return r`<div class=${i({ [s.rtl]: this.direction === "rtl" })}><h3 class=${i(s.sectionLabel)}>${this._messages.variables}</h3><calcite-label class=${i(s.label)}>${this._messages.xAxisNumber}${this.renderXVariable()}</calcite-label><calcite-label class=${i(s.label)}>${this._messages.yAxisNumber}${this.renderYVariable()}</calcite-label><h3 class=${i(s.sectionLabel)}>${this._messages.statistics}</h3>${this.renderStatistics()}<h3 class=${i(s.sectionLabel)}>${this._messages.symbol}</h3>${this.renderSymbol()}</div>`;
   }
 }
 E("arcgis-charts-config-scatter-plot-data", K);

package/dist/components/arcgis-charts-config-scatter-plot-data/resource.d.ts

@@ -1,5 +1,4 @@
 export declare const HTMLClasses: {
-    readonly hostDiv: "host-div";
     readonly label: "label";
     readonly text: "text";
     readonly r2: "r2";

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

@@ -3,7 +3,7 @@ import { keyed as n } from "lit-html/directives/keyed.js";
 import { RESTSymbolType as c } from "@arcgis/charts-spec";
 import "lodash-es";
 import "d3-array";
-import { i as v, c as u } from "../../chunks/interfaces.js";
+import { a_ as v, c6 as u } from "../../chunks/interfaces.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
@@ -12,28 +12,27 @@ import "@arcgis/core/time/TimeExtent.js";
 import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
 import { e as y } from "../../chunks/popover-ui-utils.js";
-import { S as p } from "../../chunks/interfaces2.js";
-import { U as h, g as P, i as d } from "../../chunks/chart-ui-utils2.js";
+import { S as p } from "../../chunks/interfaces3.js";
+import { U as h, g as P, i as m } from "../../chunks/chart-ui-utils2.js";
 import { u as b } from "../../chunks/useT9n.js";
-import { html as a } from "lit";
-import { createRef as m, ref as g } from "lit-html/directives/ref.js";
-import { LitElement as $, createEvent as l, safeClassMap as r } from "@arcgis/lumina";
+import { html as o } from "lit";
+import { createRef as d, ref as g } from "lit-html/directives/ref.js";
+import { LitElement as $, createEvent as a, safeClassMap as l } from "@arcgis/lumina";
 import { css as S } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.103 */
-const s = {
-  hostDiv: "host-div",
+v4.33.0-next.104 */
+const r = {
   jsAppFlyout: "js-app-flyout",
   scatterPlotPopover: "scatter-plot-popover",
   fillColor: "fill-color",
   header: "header",
   pickListItemLabel: "pick-list-item-label",
   pickListPanel: "pick-list-panel"
-}, k = S`.hide{display:none}.am5-modal{width:100%;height:100%;position:absolute;z-index:100000;top:0;left:0}.am5-modal-curtain{top:0;left:0;width:100%;height:100%;position:absolute;background:#fff!important;z-index:100}.am5-modal-wrapper{top:0;left:0;width:100%;height:100%;position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;background:#ffffff80;z-index:101}.am5-modal-content{display:inline-block;padding:1.2em;vertical-align:middle;text-align:start;white-space:normal;background:#fff;border-radius:4px;box-shadow:#00000073 0 0 36px;color:#000}.am5-layer-1000{z-index:1000!important}.arcgis-charts-modal{box-shadow:none!important}.arcgis-charts-modal-header{background-color:#0000000d;font-weight:700;padding:4px;align-content:center}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}.host-div{width:100%}.pick-list-panel{max-height:60vh}`;
+}, k = S`.hide{display:none}.am5-modal{width:100%;height:100%;position:absolute;z-index:100000;top:0;left:0}.am5-modal-curtain{top:0;left:0;width:100%;height:100%;position:absolute;background:#fff!important;z-index:100}.am5-modal-wrapper{top:0;left:0;width:100%;height:100%;position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;background:#ffffff80;z-index:101}.am5-modal-content{display:inline-block;padding:1.2em;vertical-align:middle;text-align:start;white-space:normal;background:#fff;border-radius:4px;box-shadow:#00000073 0 0 36px;color:#000}.am5-layer-1000{z-index:1000!important}.arcgis-charts-modal{box-shadow:none!important}.arcgis-charts-modal-header{background-color:#0000000d;font-weight:700;padding:4px;align-content:center}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}:host{width:100%}.pick-list-panel{max-height:60vh}`;
 class F extends $ {
   constructor() {
-    super(...arguments), this.picklist = m(), this._messages = b(), this.popoverElement = m(), this.layerFieldsInfo = [], this.arcgisChartsConfigPopoverClose = l(), this.arcgisChartsConfigPopoverOpenChange = l(), this.arcgisChartsConfigScatterPlotFillColorChange = l(), this.arcgisChartsConfigScatterPlotLineStyleChange = l(), this.arcgisChartsConfigScatterPlotSizeVariableFieldChange = l(), this.arcgisChartsConfigScatterPlotXYFieldChange = l();
+    super(...arguments), this.picklist = d(), this._messages = b(), this.popoverElement = d(), this.layerFieldsInfo = [], this.arcgisChartsConfigPopoverClose = a(), this.arcgisChartsConfigPopoverOpenChange = a(), this.arcgisChartsConfigScatterPlotFillColorChange = a(), this.arcgisChartsConfigScatterPlotLineStyleChange = a(), this.arcgisChartsConfigScatterPlotSizeVariableFieldChange = a(), this.arcgisChartsConfigScatterPlotXYFieldChange = a();
   }
   static {
     this.properties = { messageOverrides: 0, headingTitle: 3, contentKind: 3, selectedContent: 3, referenceElement: 2, placement: 3, open: 7, layerFieldsInfo: 0 };
@@ -110,7 +109,7 @@ class F extends $ {
   /** @category Lifecycle */
   render() {
     const e = this.selectedContent, t = this.selectedContent;
-    return a`<div class=${r({ [s.jsAppFlyout]: !0, [s.hostDiv]: !0 })}><calcite-popover class=${r(s.scatterPlotPopover)} .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} .offsetDistance=${P(this.placement)} @calcitePopoverClose=${this.closePopover} .open=${this.open} label ${g(this.popoverElement)}>${Array.isArray(e) ? a`<arcgis-charts-config-color-style .header=${this._messages.fillColor} class=${r(s.fillColor)} enable-close .open=${this.open} .selectedColor=${e} @arcgisChartsConfigColorStyleClose=${this.seriesPopoverClose} @arcgisChartsConfigColorStyleChange=${this.updateColorProperties}></arcgis-charts-config-color-style>` : null}${t?.type === c.SLS ? a`<arcgis-charts-config-line-style .header=${this._messages.lineStyle} .open=${this.open} enable-close .lineStyle=${t} @arcgisChartsConfigLineStyleClose=${this.seriesPopoverClose} @arcgisChartsConfigLineStyleChange=${this.updateSymbolProperties}></arcgis-charts-config-line-style>` : null}${!Array.isArray(e) && t?.type !== c.SLS ? this.renderVariablePickList() : null}</calcite-popover></div>`;
+    return o`<div class=${l({ [r.jsAppFlyout]: !0 })}><calcite-popover class=${l(r.scatterPlotPopover)} .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} .offsetDistance=${P(this.placement)} @calcitePopoverClose=${this.closePopover} .open=${this.open} label ${g(this.popoverElement)}>${Array.isArray(e) ? o`<arcgis-charts-config-color-style .header=${this._messages.fillColor} class=${l(r.fillColor)} enable-close .open=${this.open} .selectedColor=${e} @arcgisChartsConfigColorStyleClose=${this.seriesPopoverClose} @arcgisChartsConfigColorStyleChange=${this.updateColorProperties}></arcgis-charts-config-color-style>` : null}${t?.type === c.SLS ? o`<arcgis-charts-config-line-style .header=${this._messages.lineStyle} .open=${this.open} enable-close .lineStyle=${t} @arcgisChartsConfigLineStyleClose=${this.seriesPopoverClose} @arcgisChartsConfigLineStyleChange=${this.updateSymbolProperties}></arcgis-charts-config-line-style>` : null}${!Array.isArray(e) && t?.type !== c.SLS ? this.renderVariablePickList() : null}</calcite-popover></div>`;
   }
   /**
    * @param axis
@@ -118,15 +117,15 @@ class F extends $ {
    */
   renderVariablePickList() {
     const e = this.layerFieldsInfo?.length ?? 0, t = [];
-    this.contentKind === p.sizeVariable && t.push(n(" ", a`<calcite-list-item label=" " value=" " .selected=${d("", this.selectedContent)}></calcite-list-item>`));
+    this.contentKind === p.sizeVariable && t.push(n(" ", o`<calcite-list-item label=" " value=" " .selected=${m("", this.selectedContent)}></calcite-list-item>`));
     for (let i = 0; i < e; i += 1) {
-      const o = this.layerFieldsInfo?.[i] ?? void 0;
-      if (o !== void 0 && v(o)) {
-        const f = u(this.layerFieldsInfo, o.name);
-        t.push(n(o.name, a`<calcite-list-item .label=${f} .value=${o.name} .selected=${d(o.name, this.selectedContent)}></calcite-list-item>`));
+      const s = this.layerFieldsInfo?.[i] ?? void 0;
+      if (s !== void 0 && v(s)) {
+        const f = u(this.layerFieldsInfo, s.name);
+        t.push(n(s.name, o`<calcite-list-item .label=${f} .value=${s.name} .selected=${m(s.name, this.selectedContent)}></calcite-list-item>`));
       }
     }
-    return a`<calcite-panel class=${r(s.pickListPanel)} closable .closed=${!this.open} @calcitePanelClose=${this.closePopover}><div slot=header-content class=${r(s.header)}>${this.headingTitle ?? ""}</div><calcite-list label class=${r(s.pickListItemLabel)} selection-mode=single selection-appearance=border filter-enabled @calciteListChange=${this.onFieldSelectionChange} ${g(this.picklist)}>${t}</calcite-list></calcite-panel>`;
+    return o`<calcite-panel class=${l(r.pickListPanel)} closable .closed=${!this.open} @calcitePanelClose=${this.closePopover}><div slot=header-content class=${l(r.header)}>${this.headingTitle ?? ""}</div><calcite-list label class=${l(r.pickListItemLabel)} selection-mode=single selection-appearance=border filter-enabled @calciteListChange=${this.onFieldSelectionChange} ${g(this.picklist)}>${t}</calcite-list></calcite-panel>`;
   }
 }
 C("arcgis-charts-config-scatter-plot-popover", F);

package/dist/components/arcgis-charts-config-scatter-plot-popover/resource.d.ts

@@ -1,5 +1,4 @@
 export declare const HTMLClasses: {
-    readonly hostDiv: "host-div";
     readonly symbolPropertyPopover: "symbol-property-popover";
     readonly text: "text";
     readonly jsAppFlyout: "js-app-flyout";

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

@@ -19,14 +19,13 @@ import { LitElement as m, createEvent as s, safeClassMap as o } from "@arcgis/lu
 import { css as d } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.103 */
+v4.33.0-next.104 */
 const t = {
-  hostDiv: "host-div",
   selectChartComponent: "select-chart-component",
   rtl: "arcgis-charts-rtl",
   jsAppFlyout: "js-app-flyout",
   panel: "panel"
-}, g = d`.hide{display:none}.am5-modal{width:100%;height:100%;position:absolute;z-index:100000;top:0;left:0}.am5-modal-curtain{top:0;left:0;width:100%;height:100%;position:absolute;background:#fff!important;z-index:100}.am5-modal-wrapper{top:0;left:0;width:100%;height:100%;position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;background:#ffffff80;z-index:101}.am5-modal-content{display:inline-block;padding:1.2em;vertical-align:middle;text-align:start;white-space:normal;background:#fff;border-radius:4px;box-shadow:#00000073 0 0 36px;color:#000}.am5-layer-1000{z-index:1000!important}.arcgis-charts-modal{box-shadow:none!important}.arcgis-charts-modal-header{background-color:#0000000d;font-weight:700;padding:4px;align-content:center}.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}.host-div.arcgis-charts-rtl .label{margin-left:0rem;margin-right:1rem}`;
+}, g = d`.hide{display:none}.am5-modal{width:100%;height:100%;position:absolute;z-index:100000;top:0;left:0}.am5-modal-curtain{top:0;left:0;width:100%;height:100%;position:absolute;background:#fff!important;z-index:100}.am5-modal-wrapper{top:0;left:0;width:100%;height:100%;position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;background:#ffffff80;z-index:101}.am5-modal-content{display:inline-block;padding:1.2em;vertical-align:middle;text-align:start;white-space:normal;background:#fff;border-radius:4px;box-shadow:#00000073 0 0 36px;color:#000}.am5-layer-1000{z-index:1000!important}.arcgis-charts-modal{box-shadow:none!important}.arcgis-charts-modal-header{background-color:#0000000d;font-weight:700;padding:4px;align-content:center}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--arcgis-charts-dim-text)}:host .arcgis-charts-rtl .label{margin-left:0rem;margin-right:1rem}.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 f extends m {
   constructor() {
     super(...arguments), this._messages = n(), this.selectChartTypePopover = p(), this.arcgisChartsConfigPopoverClose = s(), this.arcgisChartsConfigSelectChartTypeChange = s();
@@ -81,8 +80,7 @@ class f extends m {
     return a`<div class=${o({
       [t.rtl]: this.direction === "rtl",
       [t.selectChartComponent]: !0,
-      [t.jsAppFlyout]: !0,
-      [t.hostDiv]: !0
+      [t.jsAppFlyout]: !0
     })}><calcite-popover .referenceElement=${this.popoverReferenceElement ?? document.body} .placement=${this.popoverPlacement} .flipPlacements=${["top", "bottom"]} @calcitePopoverOpen=${this.popoverOpen} @calcitePopoverClose=${this.popoverClose} .open=${this.open} label ${h(this.selectChartTypePopover)}><calcite-panel class=${o(t.panel)} .heading=${this.headerTitle ?? this._messages.chooseChartType} closable @calcitePanelClose=${this.popoverClose} .closed=${!this.open}>${this.buildChartTypesList()}</calcite-panel></calcite-popover></div>`;
   }
 }

package/dist/components/arcgis-charts-config-select-chart-type-popover/resource.d.ts

@@ -1,5 +1,4 @@
 export declare const HTMLClasses: {
-    readonly hostDiv: "host-div";
     readonly selectChartComponent: "select-chart-component";
     readonly header: "header";
     readonly rtl: "arcgis-charts-rtl";

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

@@ -2,7 +2,7 @@ import { c as h } from "../../chunks/runtime.js";
 import "@arcgis/charts-spec";
 import "lodash-es";
 import "d3-array";
-import { f as d } from "../../chunks/interfaces.js";
+import { bN as d } from "../../chunks/interfaces.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
@@ -19,7 +19,7 @@ import { repeat as u } from "lit-html/directives/repeat.js";
 import { css as w } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.103 */
+v4.33.0-next.104 */
 const c = {
   addChartContainer: "add-chart-container",
   viewChartComponent: "view-chart-component",

package/dist/docs/api.json

@@ -1,8 +1,8 @@
 {
-  "timestamp": "2025-04-29T14:30:30",
+  "timestamp": "2025-04-30T05:06:40",
   "compiler": {
     "name": "@arcgis/lumina-compiler",
-    "version": "4.33.0-next.103",
+    "version": "4.33.0-next.104",
     "typescriptVersion": "5.6.3"
   },
   "schemaVersion": "1.0.0",

package/dist/docs/docs.json

@@ -1,8 +1,8 @@
 {
-  "timestamp": "2025-04-29T14:30:30",
+  "timestamp": "2025-04-30T05:06:40",
   "compiler": {
     "name": "@arcgis/lumina-compiler",
-    "version": "4.33.0-next.103",
+    "version": "4.33.0-next.104",
     "typescriptVersion": "5.6.3"
   },
   "components": [

package/dist/docs/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@arcgis/charts-components",
-  "version": "4.33.0-next.103",
+  "version": "4.33.0-next.104",
   "description-markup": "markdown",
   "contributions": {
     "html": {

package/dist/index.d.ts

@@ -1,8 +1,9 @@
 import type { ArcGISChart } from "./components/arcgis-chart";
 import type { ArcGISChartsActionBar } from "./components/arcgis-charts-action-bar";
 
-export { BarChartModel, BoxPlotModel, ChartModel, GuideOrientation, HistogramModel, LineChartModel, ModelWithGuides, ModelWithXYAxes, PieChartModel, ScatterPlotModel, RadarChartModel, GaugeModel, ComboBarLineChartModel, ModelWithBaselineStacking, ModelWithBasicXAxis, ModelWithColorMatch, ModelWithDataLabels, ModelWithLegend, ModelWithLineMarkerStyling, ModelWithRotation, ModelWithTemporalBinning, ModelWithTooltips, ModelWithXGuides, ModelWithYGuides, } from './model';
-export type { ActionModes, ActionState, ActionToggle, ChartElementLimit, ChartTypes, CursorRange, DataWarningObject, DefaultChartActions, ErrorPolicy, LayerFieldsChangePolicy, LayerFilterChangePolicy, LayerRendererChangePolicy, PieSlicesSymbols, SelectionData, SelectionTheme, SelectionThemeProperties, SeriesSymbolsMap, ValidationStatus, ViewTimeExtentChangePolicy, } from './utils';
+export type { WebChart } from '@arcgis/charts-spec';
+export * from './model';
+export * from './utils';
 export type { PanelNumberChangePayload, DataChangeErrorPayload, PopoverOpenChangePayload, ModelListChangePayload, DataProcessCompletePayload, AxesMinMaxChangePayload, SeriesColorChangePayload, NoRenderPropChangePayload, LegendItemVisibilityChangePayload, DefaultActionSelectPayload, SelectionCompletePayload, } from './utils/components/event-payloads';
 export type { AxisLabelFormatCallback, ChartOptions, GaugeInnerLabelFormatCallback, GuideTooltipFormatCallback, MessageOptions, NotifyOptions, PieChartLegendValueLabelFormatCallback, PreRenderCallback, } from './chart-rendering/common/interfaces';
 export { BarChartDataPopoverKinds, BoxPlotDataPopoverKinds, ChartAuthoringPages, HistogramDataPopoverKinds, type IntervalPopoverProps, LineChartDataPopoverKinds, PieChartDataPopoverKinds, ScatterPlotDataPopoverKinds, } from './interfaces';