@arcgis/charts-components 4.34.0-next.46 → 4.34.0-next.48

package/dist/components/arcgis-charts-config-create-flow/customElement.js

@@ -1,6 +1,6 @@
 import { c as E } from "../../chunks/runtime.js";
-import { repeat as k } from "lit-html/directives/repeat.js";
-import { keyed as L } from "lit-html/directives/keyed.js";
+import { repeat as k } from "lit/directives/repeat.js";
+import { keyed as L } from "lit/directives/keyed.js";
 import { c as A } from "../../chunks/setup-utils.js";
 import { b as x, p as T, k as F, j as b } from "../../chunks/type-guards.js";
 import { WebChartTypes as o, WebChartTemporalBinningUnits as N } from "@arcgis/charts-spec";
@@ -20,16 +20,15 @@ import { C as n } from "../../chunks/interfaces2.js";
 import { d as _, e as X } from "../../chunks/chart-ui-utils2.js";
 import "d3-array";
 import { LitElement as Y, createEvent as f, safeClassMap as h } from "@arcgis/lumina";
-import { html as c } from "lit";
-import { createRef as O, ref as W } from "lit-html/directives/ref.js";
-import { u as z } from "../../chunks/useT9n.js";
-import { s as M, g as G } from "../../chunks/store.js";
-import { h as Z, a as y, s as j } from "../../chunks/web-component-utils.js";
-import { A as K } from "../../chunks/axis-model-wrapper.js";
-import { css as q } from "@lit/reactive-element/css-tag.js";
+import { css as O, html as c } from "lit";
+import { createRef as W, ref as z } from "lit-html/directives/ref.js";
+import { u as G } from "../../chunks/useT9n.js";
+import { s as M, g as Z } from "../../chunks/store.js";
+import { h as j, a as y, s as K } from "../../chunks/web-component-utils.js";
+import { A as q } from "../../chunks/axis-model-wrapper.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 const d = {
   chartUIComponent: "chart-ui-component",
   tabBar: "tab-bar",
@@ -88,17 +87,17 @@ function ae(p, e) {
     }), t.charts = i;
   }
 }
-const ie = q`:host{display:flex;flex-direction:column;flex:1 1 auto;overflow:hidden;height:inherit;max-height:100%}.chart-ui-component{overflow-y:auto;overflow-x:hidden}.label{display:flex;margin-left:1rem;margin-bottom:.5rem;justify-content:space-between}.text{display:flex;margin-left:1rem;width:calc(100% - 1.5rem);height:2rem;margin-bottom:.5rem;justify-content:space-between}.field-list{max-height:50vh;overflow-y:scroll}.row{padding:.5rem}.bin-count-container{display:flex;width:calc(100% - 1rem);padding:.5rem}.bin-count-slider{margin-left:1rem;width:calc(90% - 1rem)}.bin-count-input{margin-left:1rem;height:2rem;width:2rem}.bin-row{padding:.5rem 0 .5rem .5rem}.tab-bar{display:flex}.tab{flex:1;height:2.5rem}`;
+const ie = O`:host{display:flex;flex-direction:column;flex:1 1 auto;overflow:hidden;height:inherit;max-height:100%}.chart-ui-component{overflow-y:auto;overflow-x:hidden}.label{display:flex;margin-left:1rem;margin-bottom:.5rem;justify-content:space-between}.text{display:flex;margin-left:1rem;width:calc(100% - 1.5rem);height:2rem;margin-bottom:.5rem;justify-content:space-between}.field-list{max-height:50vh;overflow-y:scroll}.row{padding:.5rem}.bin-count-container{display:flex;width:calc(100% - 1rem);padding:.5rem}.bin-count-slider{margin-left:1rem;width:calc(90% - 1rem)}.bin-count-input{margin-left:1rem;height:2rem;width:2rem}.bin-row{padding:.5rem 0 .5rem .5rem}.tab-bar{display:flex}.tab{flex:1;height:2.5rem}`;
 class se extends Y {
   constructor() {
-    super(), this.chartsListFlowItem = O(), this.supportedChartTypes = [
+    super(), this.chartsListFlowItem = W(), this.supportedChartTypes = [
       o.BarSeries,
       o.BoxPlotSeries,
       o.LineSeries,
       o.PieSeries,
       o.HistogramSeries,
       o.ScatterSeries
-    ], this._messages = z(), this.chartDataProcessComplete = (e) => {
+    ], this._messages = G(), this.chartDataProcessComplete = (e) => {
       const t = e, { chartData: i, model: a } = t.detail, s = this.getModel(this.selectedChartId);
       if (a?.isSameChartAs(s))
         switch (s?.getChartType()) {
@@ -186,7 +185,7 @@ class se extends Y {
     }, this.currentChartTypeText = "", this.modelList = [], this.layerList = [], this.disableEditing = !1, this.syncChartsToLayers = !1, this.panelNumber = 0, this.arcgisChartsConfigChartViewChartClose = f(), this.arcgisChartsConfigModelListChange = f(), this.arcgisChartsConfigNewChart = f(), this.arcgisChartsConfigPanelNumberChange = f(), this.arcgisChartsConfigPopoverOpenChange = f(), this.arcgisChartsConfigSelectedChartChange = f(), this.listen("arcgisChartsConfigModelListReorder", this.modelListReorderChangeListener);
   }
   static {
-    this.properties = { selectedPanel: 16, currentChartTypeText: 16, messageOverrides: 0, modelList: [0, { hasChanged: y }], layerList: [0, { hasChanged: y }], selectedChartId: 3, activeLayerId: 3, disableEditing: 7, syncChartsToLayers: 7, timeZone: 3, headerTitle: 3, open: 7, chartData: [0, { hasChanged: y }], r2: 9, calculatedDataMinMaxBounds: [0, { hasChanged: y }], calculatedMinMaxBounds: [2, { hasChanged: y }], seriesColor: [2, { hasChanged: Z }], popoverPlacement: 3, usePopupTemplateFieldsInfo: 5, panelNumber: 11, filterBySelection: 5 };
+    this.properties = { selectedPanel: 16, currentChartTypeText: 16, messageOverrides: 0, modelList: [0, { hasChanged: y }], layerList: [0, { hasChanged: y }], selectedChartId: 3, activeLayerId: 3, disableEditing: 7, syncChartsToLayers: 7, timeZone: 3, headerTitle: 3, open: 7, chartData: [0, { hasChanged: y }], r2: 9, calculatedDataMinMaxBounds: [0, { hasChanged: y }], calculatedMinMaxBounds: [2, { hasChanged: y }], seriesColor: [2, { hasChanged: j }], popoverPlacement: 3, usePopupTemplateFieldsInfo: 5, panelNumber: 11, filterBySelection: 5 };
   }
   static {
     this.styles = ie;
@@ -289,7 +288,7 @@ class se extends Y {
     e?.forEach((t) => {
       const { isXAxis: i, maximum: a, minimum: s } = t, r = this.getModel(this.selectedChartId);
       if (r !== void 0 && b(r) && this.selectedChartId !== void 0) {
-        const l = new K(r, i), m = G({
+        const l = new q(r, i), m = Z({
           chartId: this.selectedChartId,
           isXAxis: i,
           isLogarithmic: l.getLogarithmic()
@@ -310,7 +309,7 @@ class se extends Y {
     if (this.popoverPlacement !== void 0)
       e = this.popoverPlacement;
     else {
-      const t = this.modelList?.filter((a) => w(j, a.getConfig())).length;
+      const t = this.modelList?.filter((a) => w(K, a.getConfig())).length;
       e = Number(t) <= 2 ? "bottom" : "top";
     }
     return e;
@@ -411,7 +410,7 @@ class se extends Y {
     return k(e, (t) => t.id, (t) => c`<arcgis-charts-config-view-charts .noGroup=${this.activeLayerId !== void 0} .modelList=${Q(this.modelList, t.id.toString(), this.supportedChartTypes)} .selectedChartId=${this.selectedChartId ?? ""} .layer=${t} .disableEditing=${this.disableEditing} @arcgisChartsConfigViewChartSelect=${this.onViewChartsSelect} @arcgisChartsConfigViewChartEdit=${this.onViewChartsEdit} @arcgisChartsConfigViewChartDelete=${this.onViewChartDelete} @arcgisChartsConfigViewChartAddChart=${this.onAddChartClick}></arcgis-charts-config-view-charts>`);
   }
   render() {
-    return this.open !== !1 ? c`<calcite-flow>${L("charts-list", c`<calcite-flow-item .selected=${this.panelNumber === 0 || this.disableEditing} .heading=${this.headerTitle ?? this._messages.defaultHeaderTitle} closable @calciteFlowItemClose=${this.onViewChartClose} ${W(this.chartsListFlowItem)}>${this.renderViewCharts()}</calcite-flow-item>`)}${this.renderTabs()}</calcite-flow>` : null;
+    return this.open !== !1 ? c`<calcite-flow>${L("charts-list", c`<calcite-flow-item .selected=${this.panelNumber === 0 || this.disableEditing} .heading=${this.headerTitle ?? this._messages.defaultHeaderTitle} closable @calciteFlowItemClose=${this.onViewChartClose} ${z(this.chartsListFlowItem)}>${this.renderViewCharts()}</calcite-flow-item>`)}${this.renderTabs()}</calcite-flow>` : null;
   }
   renderTabs() {
     const e = this.getModel(this.selectedChartId);

package/dist/components/arcgis-charts-config-field-select/customElement.js

@@ -1,18 +1,17 @@
 import { c as s } from "../../chunks/runtime.js";
-import { html as l } from "lit-html";
-import { LitElement as c, safeClassMap as t } from "@arcgis/lumina";
-import { css as a } from "@lit/reactive-element/css-tag.js";
+import { css as l, html as c } from "lit";
+import { LitElement as a, safeClassMap as t } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 const e = {
   fieldSelectButtonSection: "field-select-btn-section",
   fieldSelectButton: "field-select-btn",
   fieldSelectButtonText: "field-select-btn-text",
   fieldSelectButtonIcon: "field-select-btn-icon",
   fieldSelectButtonInvalid: "field-select-btn-invalid"
-}, r = a`.field-select-btn-section{background-color:var(--arcgis-charts-input-background);min-width:100%}.field-select-btn{background:var(--arcgis-charts-background-clear);border:1px solid;border-radius:var(--arcgis-charts-border-radius);display:flex;align-items:center;justify-content:space-between;padding:var(--arcgis-charts-side-spacing-half) var(--arcgis-charts-side-spacing-quarter);cursor:pointer;width:100%;text-align:unset}.field-select-btn:not(.field-select-btn-invalid){border-color:var(--arcgis-charts-border)}.field-select-btn.field-select-btn-invalid{border-color:var(--arcgis-charts-border-invalid)}.field-select-btn-exp{width:calc(100% - 32px)}.field-select-btn-exp .field-select-btn{border:none;border-radius:0;border-right:1px solid var(--arcgis-charts-border)}.field-select-btn-text{flex:0 1 auto;overflow:hidden;padding:0 var(--arcgis-charts-side-spacing-eighth);text-overflow:ellipsis;white-space:nowrap}.field-select-btn-icon{flex:0 0 0%;padding:0 var(--arcgis-charts-side-spacing-half)}.field-select-btn:disabled{cursor:default}`;
-class n extends c {
+}, r = l`.field-select-btn-section{background-color:var(--arcgis-charts-input-background);min-width:100%}.field-select-btn{background:var(--arcgis-charts-background-clear);border:1px solid;border-radius:var(--arcgis-charts-border-radius);display:flex;align-items:center;justify-content:space-between;padding:var(--arcgis-charts-side-spacing-half) var(--arcgis-charts-side-spacing-quarter);cursor:pointer;width:100%;text-align:unset}.field-select-btn:not(.field-select-btn-invalid){border-color:var(--arcgis-charts-border)}.field-select-btn.field-select-btn-invalid{border-color:var(--arcgis-charts-border-invalid)}.field-select-btn-exp{width:calc(100% - 32px)}.field-select-btn-exp .field-select-btn{border:none;border-radius:0;border-right:1px solid var(--arcgis-charts-border)}.field-select-btn-text{flex:0 1 auto;overflow:hidden;padding:0 var(--arcgis-charts-side-spacing-eighth);text-overflow:ellipsis;white-space:nowrap}.field-select-btn-icon{flex:0 0 0%;padding:0 var(--arcgis-charts-side-spacing-half)}.field-select-btn:disabled{cursor:default}`;
+class n extends a {
   constructor() {
     super(...arguments), this.disabled = !1, this.invalid = !1;
   }
@@ -24,7 +23,7 @@ class n extends c {
   }
   render() {
     const i = `${e.fieldSelectButton} ${this.invalid ? e.fieldSelectButtonInvalid : ""}`;
-    return l`<div class=${t(e.fieldSelectButtonSection)}><button class=${t(i)} .disabled=${this.disabled}><span class=${t(e.fieldSelectButtonText)}>${this.label}</span><span class=${t(e.fieldSelectButtonIcon)}><calcite-icon scale=s icon=chevron-down></calcite-icon></span></button></div>`;
+    return c`<div class=${t(e.fieldSelectButtonSection)}><button class=${t(i)} .disabled=${this.disabled}><span class=${t(e.fieldSelectButtonText)}>${this.label}</span><span class=${t(e.fieldSelectButtonIcon)}><calcite-icon scale=s icon=chevron-down></calcite-icon></span></button></div>`;
   }
 }
 s("arcgis-charts-config-field-select", n);

package/dist/components/arcgis-charts-config-font-style/customElement.js

@@ -1,9 +1,9 @@
 import { c as d } from "../../chunks/runtime.js";
-import { html as l } from "lit-html";
-import { RESTSymbolType as u, RESTFontWeight as s, RESTFontStyle as c, RESTFontDecoration as r } from "@arcgis/charts-spec";
+import { css as u, html as l } from "lit";
+import { RESTSymbolType as y, RESTFontWeight as s, RESTFontStyle as c, RESTFontDecoration as r } from "@arcgis/charts-spec";
 import { merge as i } from "lodash-es";
 import "d3-array";
-import { a1 as y } from "../../chunks/interfaces.js";
+import { a1 as S } from "../../chunks/interfaces.js";
 import "@arcgis/core/geometry/support/jsonUtils.js";
 import "@arcgis/core/rest/support/AttributeBinsQuery.js";
 import "@arcgis/core/rest/support/Query.js";
@@ -11,14 +11,13 @@ import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/time/TimeExtent.js";
 import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
-import { b as S, m as h, s as g, c as m } from "../../chunks/chart-ui-utils2.js";
-import { u as b } from "../../chunks/useT9n.js";
-import { createRef as v, ref as C } from "lit-html/directives/ref.js";
-import { LitElement as $, createEvent as p, safeClassMap as n } from "@arcgis/lumina";
-import { css as x } from "@lit/reactive-element/css-tag.js";
+import { b as g, m as h, s as b, c as m } from "../../chunks/chart-ui-utils2.js";
+import { u as v } from "../../chunks/useT9n.js";
+import { createRef as C, ref as $ } from "lit-html/directives/ref.js";
+import { LitElement as x, createEvent as p, safeClassMap as n } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 const E = {
   arial: "Arial",
   arialBlack: "Arial Black",
@@ -39,11 +38,11 @@ const E = {
   font: "font",
   numberInput: "number-input",
   inputLabel: "input-label"
-}, w = x`.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}:host calcite-panel .font-style-container{display:flex;padding:0 1rem}:host calcite-panel .font-style-container .input-label{--calcite-label-margin-bottom: var(--arcgis-charts-intra-section-margin) !important}:host calcite-panel .font-style-container .number-input{margin-bottom:.5rem;display:flex}:host calcite-panel .font-style-container .number-input>div{width:100%}:host calcite-panel .font-style-container calcite-action,:host calcite-panel .font-style-container calcite-label{flex:1 1 0px;display:flex;width:0px}:host calcite-panel .font-style-container calcite-label{flex-grow:2}:host calcite-panel calcite-label.font{display:block;margin-top:1rem}`;
-class I extends $ {
+}, w = 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}:host calcite-panel .font-style-container{display:flex;padding:0 1rem}:host calcite-panel .font-style-container .input-label{--calcite-label-margin-bottom: var(--arcgis-charts-intra-section-margin) !important}:host calcite-panel .font-style-container .number-input{margin-bottom:.5rem;display:flex}:host calcite-panel .font-style-container .number-input>div{width:100%}:host calcite-panel .font-style-container calcite-action,:host calcite-panel .font-style-container calcite-label{flex:1 1 0px;display:flex;width:0px}:host calcite-panel .font-style-container calcite-label{flex-grow:2}:host calcite-panel calcite-label.font{display:block;margin-top:1rem}`;
+class I extends x {
   constructor() {
-    super(...arguments), this._messages = b(), this.fontSizeInputElement = v(), this.fontStyle = {
-      type: u.TS
+    super(...arguments), this._messages = v(), this.fontSizeInputElement = C(), this.fontStyle = {
+      type: y.TS
     }, this.arcgisChartsConfigFontStyleChange = p(), this.arcgisChartsConfigFontStyleClose = p();
   }
   static {
@@ -66,7 +65,7 @@ class I extends $ {
   }
   fontSizeChange() {
     const t = this.fontSizeInputElement.value?.value;
-    if (t !== void 0 && S(t, this.fontSizeInputElement.value?.min, this.fontSizeInputElement.value?.max)) {
+    if (t !== void 0 && g(t, this.fontSizeInputElement.value?.min, this.fontSizeInputElement.value?.max)) {
       const e = {
         size: Number.parseInt(t)
       };
@@ -108,11 +107,11 @@ class I extends $ {
     return this.fontStyle?.font?.[t] !== e[t];
   }
   renderFonts() {
-    const t = Object.values(E).map((e) => l`<calcite-option .value=${e} .selected=${e === this.fontStyle?.font?.family || e === y().font?.family?.split(",")[0] && this.fontStyle?.font?.family === void 0}>${e}</calcite-option>`);
+    const t = Object.values(E).map((e) => l`<calcite-option .value=${e} .selected=${e === this.fontStyle?.font?.family || e === S().font?.family?.split(",")[0] && this.fontStyle?.font?.family === void 0}>${e}</calcite-option>`);
     return this.fontStyle?.font?.family === "" && t.push(l`<calcite-option value selected></calcite-option>`), t;
   }
   render() {
-    return l`<calcite-panel .heading=${this.header ?? this._messages.header} .closed=${this.open === !1} .closable=${this.enableClose ?? !1} @calcitePanelClose=${this.closePanel}><div class=${n(o.fontStyleContainer)}><calcite-label class=${n(o.font)}>${this._messages.font}<calcite-select .label=${this._messages.font ?? ""} @calciteSelectChange=${this.fontChange}>${this.renderFonts()}</calcite-select></calcite-label></div><div class=${n(o.fontStyleContainer)}><calcite-label class=${n(o.inputLabel)}>${this._messages.size}<calcite-input class=${n(o.numberInput)} type=number min=6 max=40 step=1 .value=${g(this.fontStyle?.font?.size)} @calciteInputInput=${this.fontSizeChange} ${C(this.fontSizeInputElement)}></calcite-input></calcite-label><calcite-action appearance=transparent .text=${this._messages.bold ?? ""} @click=${this.boldSelect} scale=l .active=${this.fontStyle?.font?.weight === s.Bold}><calcite-icon scale=s icon=bold></calcite-icon></calcite-action><calcite-action appearance=transparent .text=${this._messages.italic ?? ""} @click=${this.italicSelect} scale=l .active=${this.fontStyle?.font?.style === c.Italic}><calcite-icon scale=s icon=italicize></calcite-icon></calcite-action><calcite-action appearance=transparent .text=${this._messages.underline ?? ""} @click=${this.underlineSelect} scale=l .active=${this.fontStyle?.font?.decoration === r.Underline}><calcite-icon scale=s icon=underline></calcite-icon></calcite-action></div><div class=${n(o.fontStyleContainer)}><arcgis-charts-config-colors .rgba=${this.fontStyle?.color ?? void 0} @colorSelect=${this.colorChange}></arcgis-charts-config-colors></div></calcite-panel>`;
+    return l`<calcite-panel .heading=${this.header ?? this._messages.header} .closed=${this.open === !1} .closable=${this.enableClose ?? !1} @calcitePanelClose=${this.closePanel}><div class=${n(o.fontStyleContainer)}><calcite-label class=${n(o.font)}>${this._messages.font}<calcite-select .label=${this._messages.font ?? ""} @calciteSelectChange=${this.fontChange}>${this.renderFonts()}</calcite-select></calcite-label></div><div class=${n(o.fontStyleContainer)}><calcite-label class=${n(o.inputLabel)}>${this._messages.size}<calcite-input class=${n(o.numberInput)} type=number min=6 max=40 step=1 .value=${b(this.fontStyle?.font?.size)} @calciteInputInput=${this.fontSizeChange} ${$(this.fontSizeInputElement)}></calcite-input></calcite-label><calcite-action appearance=transparent .text=${this._messages.bold ?? ""} @click=${this.boldSelect} scale=l .active=${this.fontStyle?.font?.weight === s.Bold}><calcite-icon scale=s icon=bold></calcite-icon></calcite-action><calcite-action appearance=transparent .text=${this._messages.italic ?? ""} @click=${this.italicSelect} scale=l .active=${this.fontStyle?.font?.style === c.Italic}><calcite-icon scale=s icon=italicize></calcite-icon></calcite-action><calcite-action appearance=transparent .text=${this._messages.underline ?? ""} @click=${this.underlineSelect} scale=l .active=${this.fontStyle?.font?.decoration === r.Underline}><calcite-icon scale=s icon=underline></calcite-icon></calcite-action></div><div class=${n(o.fontStyleContainer)}><arcgis-charts-config-colors .rgba=${this.fontStyle?.color ?? void 0} @colorSelect=${this.colorChange}></arcgis-charts-config-colors></div></calcite-panel>`;
   }
 }
 d("arcgis-charts-config-font-style", I);

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

@@ -1,5 +1,5 @@
 import { c as A } from "../../chunks/runtime.js";
-import { ref as B } from "lit-html/directives/ref.js";
+import { ref as B } from "lit/directives/ref.js";
 import { C as M, F as i, L as m } from "../../chunks/common.js";
 import { d as y, j as d, h as c, l as S, p as h, m as T, f as V } from "../../chunks/type-guards.js";
 import { RESTSimpleLineSymbolStyle as $, RESTSymbolType as f, RESTFontWeight as D, RESTFontStyle as w, RESTFontDecoration as N } from "@arcgis/charts-spec";
@@ -17,12 +17,11 @@ import { c as b, e as l } from "../../chunks/index4.js";
 import { r as k, c as W, P as O } from "../../chunks/popover-ui-utils.js";
 import { n as X } from "../../chunks/chart-ui-utils2.js";
 import { u as R } from "../../chunks/useT9n.js";
-import { html as P } from "lit";
-import { LitElement as Y, createEvent as F, safeClassMap as p } from "@arcgis/lumina";
-import { css as j } from "@lit/reactive-element/css-tag.js";
+import { css as Y, html as P } from "lit";
+import { LitElement as j, createEvent as F, safeClassMap as p } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 const v = {
   type: f.TS,
   color: [1, 1, 1, 255],
@@ -42,8 +41,8 @@ const v = {
   element: "chart-element",
   elementList: "element-list",
   sectionLabel: "section-label"
-}, _ = j`:host{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)}.element-list{margin:var(--arcgis-charts-config-margin-minor)}.element{user-select:none}`;
-class z extends Y {
+}, _ = Y`:host{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)}.element-list{margin:var(--arcgis-charts-config-margin-minor)}.element{user-select:none}`;
+class z extends j {
   constructor() {
     super(...arguments), this._messages = R(), this.formatPopover = null, this.selectableElements = [], this.textProperties = [], this.symbolProperties = [], this.symbolPropertyChange = (t) => {
       const e = t;

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

@@ -1,5 +1,5 @@
 import { c as i } from "../../chunks/runtime.js";
-import { html as o } from "lit-html";
+import { css as a, html as o } from "lit";
 import { RESTSymbolType as r } from "@arcgis/charts-spec";
 import "lodash-es";
 import "d3-array";
@@ -11,20 +11,19 @@ import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/time/TimeExtent.js";
 import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
-import { e as a } from "../../chunks/popover-ui-utils.js";
-import { u as l } from "../../chunks/useT9n.js";
-import { createRef as n, ref as p } from "lit-html/directives/ref.js";
-import { LitElement as c, createEvent as s, safeClassMap as m } from "@arcgis/lumina";
-import { css as h } from "@lit/reactive-element/css-tag.js";
+import { e as l } from "../../chunks/popover-ui-utils.js";
+import { u as n } from "../../chunks/useT9n.js";
+import { createRef as p, ref as c } from "lit-html/directives/ref.js";
+import { LitElement as h, createEvent as s, safeClassMap as m } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 const g = {
   jsAppFlyout: "js-app-flyout"
-}, C = h``;
-class f extends c {
+}, C = a``;
+class f extends h {
   constructor() {
-    super(...arguments), this._messages = l(), this.popoverElement = n(), this.placement = "leading", this.arcgisChartsConfigFormatPopoverColorChange = s(), this.arcgisChartsConfigFormatPopoverSymbolChange = s(), this.arcgisChartsConfigFormatPopoverTextChange = s(), this.arcgisChartsConfigPopoverClose = s();
+    super(...arguments), this._messages = n(), this.popoverElement = p(), this.placement = "leading", this.arcgisChartsConfigFormatPopoverColorChange = s(), this.arcgisChartsConfigFormatPopoverSymbolChange = s(), this.arcgisChartsConfigFormatPopoverTextChange = s(), this.arcgisChartsConfigPopoverClose = s();
   }
   static {
     this.properties = { messageOverrides: 0, selectedElement: 2, referenceElement: 2, placement: 3, open: 7 };
@@ -36,7 +35,7 @@ class f extends c {
     await this.popoverElement.value?.reposition();
   }
   updated() {
-    a(this.popoverElement.value, this.open);
+    l(this.popoverElement.value, this.open);
   }
   closePopover() {
     this.open = !1, this.arcgisChartsConfigPopoverClose.emit();
@@ -52,7 +51,7 @@ class f extends c {
   }
   render() {
     const e = this.selectedElement, t = this.selectedElement;
-    return o`<div class=${m(g.jsAppFlyout)}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} .open=${this.open} label @calcitePopoverClose=${this.closePopover} pointer-disabled ${p(this.popoverElement)}>${Array.isArray(e) ? o`<arcgis-charts-config-color-style .header=${this._messages.backgroundElement} enable-close .open=${this.open} .selectedColor=${e} @arcgisChartsConfigColorStyleClose=${this.closePopover} @arcgisChartsConfigColorStyleChange=${this.updateColorProperties}></arcgis-charts-config-color-style>` : null}${t?.type === r.SLS ? o`<arcgis-charts-config-line-style .header=${this._messages.lineStyle} .open=${this.open} enable-close .lineStyle=${t} @arcgisChartsConfigLineStyleClose=${this.closePopover} @arcgisChartsConfigLineStyleChange=${this.updateSymbolProperties}></arcgis-charts-config-line-style>` : null}${t?.type === r.TS ? o`<arcgis-charts-config-font-style .header=${this._messages.textStyle} .open=${this.open} enable-close .fontStyle=${t} @arcgisChartsConfigFontStyleClose=${this.closePopover} @arcgisChartsConfigFontStyleChange=${this.updateTextProperties}></arcgis-charts-config-font-style>` : null}</calcite-popover></div>`;
+    return o`<div class=${m(g.jsAppFlyout)}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} .open=${this.open} label @calcitePopoverClose=${this.closePopover} pointer-disabled ${c(this.popoverElement)}>${Array.isArray(e) ? o`<arcgis-charts-config-color-style .header=${this._messages.backgroundElement} enable-close .open=${this.open} .selectedColor=${e} @arcgisChartsConfigColorStyleClose=${this.closePopover} @arcgisChartsConfigColorStyleChange=${this.updateColorProperties}></arcgis-charts-config-color-style>` : null}${t?.type === r.SLS ? o`<arcgis-charts-config-line-style .header=${this._messages.lineStyle} .open=${this.open} enable-close .lineStyle=${t} @arcgisChartsConfigLineStyleClose=${this.closePopover} @arcgisChartsConfigLineStyleChange=${this.updateSymbolProperties}></arcgis-charts-config-line-style>` : null}${t?.type === r.TS ? o`<arcgis-charts-config-font-style .header=${this._messages.textStyle} .open=${this.open} enable-close .fontStyle=${t} @arcgisChartsConfigFontStyleClose=${this.closePopover} @arcgisChartsConfigFontStyleChange=${this.updateTextProperties}></arcgis-charts-config-font-style>` : null}</calcite-popover></div>`;
   }
 }
 i("arcgis-charts-config-format-popover", f);

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

@@ -4,22 +4,21 @@ import { WebChartLegendPositions as l } from "@arcgis/charts-spec";
 import { isEmpty as m } from "lodash-es";
 import { m as g, c as d } from "../../chunks/chart-ui-utils2.js";
 import { u as b } from "../../chunks/useT9n.js";
-import { html as a } from "lit";
-import { createRef as p, ref as u } from "lit-html/directives/ref.js";
-import { LitElement as x, safeClassMap as i } from "@arcgis/lumina";
-import { css as f } from "@lit/reactive-element/css-tag.js";
+import { css as p, html as a } from "lit";
+import { createRef as u, ref as x } from "lit-html/directives/ref.js";
+import { LitElement as f, safeClassMap as i } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 const s = {
   textInput: "text-input",
   label: "label",
   labelContainer: "label-container",
   select: "select"
-}, $ = f`.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;margin-top:var(--arcgis-charts-top-section-margin)}.text-input,.select{margin-bottom:var(--arcgis-charts-inter-section-margin)}.label{display:flex;justify-content:space-between}.label-container{display:flex;flex-direction:column;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}`;
-class C extends x {
+}, $ = p`.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;margin-top:var(--arcgis-charts-top-section-margin)}.text-input,.select{margin-bottom:var(--arcgis-charts-inter-section-margin)}.label{display:flex;justify-content:space-between}.label-container{display:flex;flex-direction:column;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}`;
+class C extends f {
   constructor() {
-    super(...arguments), this._messages = b(), this.characterLimitInputElement = p(), this.onModelConfigChange = () => {
+    super(...arguments), this._messages = b(), this.characterLimitInputElement = u(), this.onModelConfigChange = () => {
       this.requestUpdate();
     }, this.isChartTitleInvalid = !1, this.open = !1;
   }
@@ -97,7 +96,7 @@ class C extends x {
     ] : [];
   }
   render() {
-    return a`<div class=${i(s.labelContainer)}><calcite-label layout=inline-space-between class=${i(s.label)}>${this._messages.chartTitle}<calcite-switch .checked=${this.model.getChartTitleVisibility()} @calciteSwitchChange=${this.enableChartTitle}></calcite-switch></calcite-label><calcite-input class=${i(s.textInput)} type=text .disabled=${!this.model.getChartTitleVisibility()} .value=${this.model.getTitleText()} @calciteInputInput=${this.setChartTitle} ${u(this.characterLimitInputElement)}></calcite-input><arcgis-charts-config-invalid-input-message .invalidInputMessage=${this._messages.emptyChartTitle} .isInvalid=${this.isChartTitleInvalid}></arcgis-charts-config-invalid-input-message></div>${n(this.model) ? [
+    return a`<div class=${i(s.labelContainer)}><calcite-label layout=inline-space-between class=${i(s.label)}>${this._messages.chartTitle}<calcite-switch .checked=${this.model.getChartTitleVisibility()} @calciteSwitchChange=${this.enableChartTitle}></calcite-switch></calcite-label><calcite-input class=${i(s.textInput)} type=text .disabled=${!this.model.getChartTitleVisibility()} .value=${this.model.getTitleText()} @calciteInputInput=${this.setChartTitle} ${x(this.characterLimitInputElement)}></calcite-input><arcgis-charts-config-invalid-input-message .invalidInputMessage=${this._messages.emptyChartTitle} .isInvalid=${this.isChartTitleInvalid}></arcgis-charts-config-invalid-input-message></div>${n(this.model) ? [
       a`<div class=${i(s.labelContainer)}><calcite-label layout=inline-space-between class=${i(s.label)}>${this._messages.xAxisTitle}<calcite-switch .checked=${this.model.getXAxisTitleVisibility()} @calciteSwitchChange=${this.enableXAxisTitle}></calcite-switch></calcite-label><calcite-input class=${i(s.textInput)} type=text .disabled=${!this.model.getXAxisTitleVisibility()} .value=${this.model.getXAxisTitleText()} @calciteInputInput=${this.setChartXAxisTitle}></calcite-input></div>`,
       c(this.model) ? a`<div class=${i(s.labelContainer)}><calcite-label layout=inline-space-between class=${i(s.label)}>${this._messages.yAxisTitle}<calcite-switch .checked=${this.model.getYAxisTitleVisibility()} @calciteSwitchChange=${this.enableYAxisTitle}></calcite-switch></calcite-label><calcite-input class=${i(s.textInput)} tabindex=1 type=text .disabled=${!this.model.getYAxisTitleVisibility()} .value=${this.model.getYAxisTitleText()} @calciteInputInput=${this.setChartYAxisTitle}></calcite-input></div>` : null
     ] : null}${o(this.model) ? a`<div class=${i(s.labelContainer)}><calcite-label layout=inline-space-between class=${i(s.label)}>${this._messages.legendTitle}<calcite-switch .checked=${this.model.getLegendTitleVisibility()} @calciteSwitchChange=${this.enableLegendTitle}></calcite-switch></calcite-label><calcite-input class=${i(s.textInput)} type=text .disabled=${!this.model.getLegendTitleVisibility()} .value=${this.model.getLegendTitleText()} @calciteInputInput=${this.setChartLegendTitle}></calcite-input></div>` : null}<div class=${i(s.labelContainer)}><calcite-label layout=inline-space-between class=${i(s.label)}>${this._messages.legendPosition}</calcite-label><calcite-combobox clear-disabled label class=${i(s.select)} @calciteComboboxChange=${this.legendPositionChange} selection-mode=single>${this.renderLegendPositions()}</calcite-combobox></div><div class=${i(s.labelContainer)}><calcite-label layout=inline-space-between class=${i(s.label)}>${this._messages.description}<calcite-switch .checked=${this.model.getDescriptionVisibility()} @calciteSwitchChange=${this.enableDescription}></calcite-switch></calcite-label><calcite-text-area .disabled=${!this.model.getDescriptionVisibility()} .value=${this.model.getDescriptionText()} @calciteTextAreaInput=${this.setChartDescription}></calcite-text-area></div>`;

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

@@ -1,5 +1,5 @@
 import { c as X } from "../../chunks/runtime.js";
-import { keyed as B } from "lit-html/directives/keyed.js";
+import { keyed as B } from "lit/directives/keyed.js";
 import { RESTSymbolType as m, WebChartTypes as R, RESTSimpleLineSymbolStyle as O } from "@arcgis/charts-spec";
 import { cloneDeep as E } from "lodash-es";
 import "d3-array";
@@ -17,21 +17,20 @@ import { m as G, d as H, e as U, g as W, k as M, c as S } from "../../chunks/cha
 import { d as A } from "../../chunks/default.js";
 import { g as Y } from "../../chunks/resource.js";
 import { u as j } from "../../chunks/useT9n.js";
-import { html as d } from "lit";
+import { css as J, html as d } from "lit";
 import { createRef as h, ref as u } from "lit-html/directives/ref.js";
-import { LitElement as J, createEvent as $, safeClassMap as o, safeStyleMap as K } from "@arcgis/lumina";
-import { css as Q } from "@lit/reactive-element/css-tag.js";
+import { LitElement as K, createEvent as $, safeClassMap as o, safeStyleMap as Q } from "@arcgis/lumina";
 import { G as T } from "../../chunks/common.js";
 import { j as ee, n as te, o as ie } from "../../chunks/type-guards.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 const s = {
   row: "row",
   column: "column",
   colorPicker: "color-picker"
-}, oe = Q`.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}.row{display:flex;flex-direction:row;column-gap:var(--arcgis-charts-inter-section-margin)}.column{display:flex;flex-direction:column;flex-wrap:wrap;flex-grow:1}.column>calcite-input{margin-bottom:.5rem;flex-grow:2}.column>calcite-input[type=number]{margin-bottom:.5rem}input{padding:.5rem}.label{display:flex;flex-direction:row;justify-content:space-between;margin-bottom:var(--arcgis-charts-intra-section-margin);flex-grow:1}.color-picker{border:1px solid var(--calcite-color-border-2);box-shadow:none;margin-bottom:var(--arcgis-charts-inter-section-margin)}.delete-guide{display:flex;flex-direction:row-reverse;height:2rem;margin:0 1rem;font-weight:550}:host([dir=rtl]) .delete-guide{flex-direction:row}`;
-class se extends J {
+}, oe = J`.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}.row{display:flex;flex-direction:row;column-gap:var(--arcgis-charts-inter-section-margin)}.column{display:flex;flex-direction:column;flex-wrap:wrap;flex-grow:1}.column>calcite-input{margin-bottom:.5rem;flex-grow:2}.column>calcite-input[type=number]{margin-bottom:.5rem}input{padding:.5rem}.label{display:flex;flex-direction:row;justify-content:space-between;margin-bottom:var(--arcgis-charts-intra-section-margin);flex-grow:1}.color-picker{border:1px solid var(--calcite-color-border-2);box-shadow:none;margin-bottom:var(--arcgis-charts-inter-section-margin)}.delete-guide{display:flex;flex-direction:row-reverse;height:2rem;margin:0 1rem;font-weight:550}:host([dir=rtl]) .delete-guide{flex-direction:row}`;
+class se extends K {
   constructor() {
     super(...arguments), this._messages = j(), this.startCalciteInput = h(), this.endCalciteInput = h(), this.startDateCalciteInput = h(), this.endDateCalciteInput = h(), this.startTimeCalciteInput = h(), this.endTimeCalciteInput = h(), this.colorElement = h(), this.colorChange = (e) => {
       const t = e.detail, i = this.model.getGuideStart(this.index, this.orientation), n = this.model.getGuideEnd(this.index, this.orientation);
@@ -244,7 +243,7 @@ class se extends J {
   }
   renderColorElement() {
     const e = this.model.getGuideStyle(this.index, this.orientation), [t, i, n, l] = [...e?.color ?? [1, 1, 1, 255]], a = this.model.getGuideStart(this.index, this.orientation), r = this.model.getGuideEnd(this.index, this.orientation), v = g(e) ? W(e.style) : O.Solid, f = p(a, r) === m.SLS ? `line-${v}` : "square-f";
-    return d`<calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .value=${this._messages.style} class=${o(s.colorPicker)} .label=${this._messages.style} .selected=${this.guidePopover?.open} @click=${this.onColorElementSelect} ${u(this.colorElement)}><calcite-icon slot=content-end .icon=${f} style=${K({ color: `rgba(${t},${i},${n},${l / 255})` })}></calcite-icon></calcite-list-item></calcite-list>`;
+    return d`<calcite-list label selection-mode=single selection-appearance=border><calcite-list-item .value=${this._messages.style} class=${o(s.colorPicker)} .label=${this._messages.style} .selected=${this.guidePopover?.open} @click=${this.onColorElementSelect} ${u(this.colorElement)}><calcite-icon slot=content-end .icon=${f} style=${Q({ color: `rgba(${t},${i},${n},${l / 255})` })}></calcite-icon></calcite-list-item></calcite-list>`;
   }
   render() {
     const e = this.model.getGuideStart(this.index, this.orientation), t = this.model.getGuideEnd(this.index, this.orientation), i = this.model.getGuideName(this.index, this.orientation), n = this.model.getGuideLabelText(this.index, this.orientation), l = this.model.getGuideAbove(this.index, this.orientation), a = this.model.getGuideVisibility(this.index, this.orientation), r = this.isXAxisDateField;

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

@@ -1,6 +1,6 @@
 import { c as r } from "../../chunks/runtime.js";
-import { html as o } from "lit-html";
-import { RESTSymbolType as l } from "@arcgis/charts-spec";
+import { css as l, html as o } from "lit";
+import { RESTSymbolType as a } from "@arcgis/charts-spec";
 import "lodash-es";
 import "d3-array";
 import "../../chunks/interfaces.js";
@@ -11,21 +11,20 @@ import "@arcgis/core/rest/support/StatisticDefinition.js";
 import "@arcgis/core/time/TimeExtent.js";
 import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
-import { e as a } from "../../chunks/popover-ui-utils.js";
+import { e as n } from "../../chunks/popover-ui-utils.js";
 import { g as i } from "../../chunks/default.js";
-import { u as n } from "../../chunks/useT9n.js";
-import { createRef as p, ref as c } from "lit-html/directives/ref.js";
-import { LitElement as m, createEvent as s, safeClassMap as h } from "@arcgis/lumina";
-import { css as g } from "@lit/reactive-element/css-tag.js";
+import { u as p } from "../../chunks/useT9n.js";
+import { createRef as c, ref as m } from "lit-html/directives/ref.js";
+import { LitElement as h, createEvent as s, safeClassMap as g } from "@arcgis/lumina";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 const C = {
   jsAppFlyout: "js-app-flyout"
-}, d = g``;
-class f extends m {
+}, d = l``;
+class f extends h {
   constructor() {
-    super(...arguments), this._messages = n(), this.popoverElement = p(), this.placement = "leading", this.arcgisChartsConfigGuidePopoverColorChange = s(), this.arcgisChartsConfigGuidePopoverSymbolChange = s(), this.arcgisChartsConfigPopoverClose = s();
+    super(...arguments), this._messages = p(), this.popoverElement = c(), this.placement = "leading", this.arcgisChartsConfigGuidePopoverColorChange = s(), this.arcgisChartsConfigGuidePopoverSymbolChange = s(), this.arcgisChartsConfigPopoverClose = s();
   }
   static {
     this.properties = { messageOverrides: 0, selectedElement: 2, referenceElement: 2, placement: 3, open: 7 };
@@ -37,7 +36,7 @@ class f extends m {
     await this.popoverElement.value?.reposition();
   }
   updated() {
-    a(this.popoverElement.value, this.open);
+    n(this.popoverElement.value, this.open);
   }
   guidePopoverClose() {
     this.open = !1, this.arcgisChartsConfigPopoverClose.emit();
@@ -52,7 +51,7 @@ class f extends m {
   }
   render() {
     const t = this.selectedElement, e = this.selectedElement;
-    return o`<div class=${h(C.jsAppFlyout)}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} .open=${this.open} offset-distance=20 offset-skidding=60 label pointer-disabled @calcitePopoverClose=${this.guidePopoverClose} ${c(this.popoverElement)}>${Array.isArray(t) && o`<arcgis-charts-config-color-style .header=${this._messages.fillStyle} enable-close .open=${this.open} .selectedColor=${t} @arcgisChartsConfigColorStyleClose=${this.guidePopoverClose} @arcgisChartsConfigColorStyleChange=${this.updateColorProperties}></arcgis-charts-config-color-style>` || ""}${e?.type === l.SLS && o`<arcgis-charts-config-line-style .header=${this._messages.lineStyle} .open=${this.open} enable-close .lineStyle=${e} @arcgisChartsConfigLineStyleClose=${this.guidePopoverClose} @arcgisChartsConfigLineStyleChange=${this.updateSymbolProperties}></arcgis-charts-config-line-style>` || ""}</calcite-popover></div>`;
+    return o`<div class=${g(C.jsAppFlyout)}><calcite-popover .referenceElement=${this.referenceElement ?? document.body} .placement=${this.placement} .open=${this.open} offset-distance=20 offset-skidding=60 label pointer-disabled @calcitePopoverClose=${this.guidePopoverClose} ${m(this.popoverElement)}>${Array.isArray(t) && o`<arcgis-charts-config-color-style .header=${this._messages.fillStyle} enable-close .open=${this.open} .selectedColor=${t} @arcgisChartsConfigColorStyleClose=${this.guidePopoverClose} @arcgisChartsConfigColorStyleChange=${this.updateColorProperties}></arcgis-charts-config-color-style>` || ""}${e?.type === a.SLS && o`<arcgis-charts-config-line-style .header=${this._messages.lineStyle} .open=${this.open} enable-close .lineStyle=${e} @arcgisChartsConfigLineStyleClose=${this.guidePopoverClose} @arcgisChartsConfigLineStyleChange=${this.updateSymbolProperties}></arcgis-charts-config-line-style>` || ""}</calcite-popover></div>`;
   }
 }
 r("arcgis-charts-config-guide-popover", f);

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

@@ -14,17 +14,16 @@ import { e as A } from "../../chunks/popover-ui-utils.js";
 import { d as c } from "../../chunks/default.js";
 import { g as u, H as g } from "../../chunks/resource.js";
 import { u as b } from "../../chunks/useT9n.js";
-import { html as a } from "lit";
+import { css as C, html as a } from "lit";
 import { createRef as m, ref as G } from "lit-html/directives/ref.js";
-import { LitElement as C, createEvent as $, safeClassMap as p } from "@arcgis/lumina";
-import { css as v } from "@lit/reactive-element/css-tag.js";
+import { LitElement as $, createEvent as v, safeClassMap as p } from "@arcgis/lumina";
 import { G as o } from "../../chunks/common.js";
 import { n as l, o as h } from "../../chunks/type-guards.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
-const X = v`:host{display:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin)}.add-guide{display:flex;justify-content:center;padding:.5rem}.add-guide-btn{width:100%}.no-guides{border-radius:2rem}.no-messages{text-align:center}.guide-icon{padding-left:.5rem;padding-top:.5rem;width:1.5rem;height:1.5rem}`;
-class Y extends C {
+v4.34.0-next.48 */
+const X = C`:host{display:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin)}.add-guide{display:flex;justify-content:center;padding:.5rem}.add-guide-btn{width:100%}.no-guides{border-radius:2rem}.no-messages{text-align:center}.guide-icon{padding-left:.5rem;padding-top:.5rem;width:1.5rem;height:1.5rem}`;
+class Y extends $ {
   constructor() {
     super(...arguments), this._messages = b(), this.addGuideButton = m(), this.popoverElement = m(), this.addXGuide = () => {
       if (l(this.model)) {
@@ -44,7 +43,7 @@ class Y extends C {
       this.enableXAxisGuide && this.enableYAxisGuide && (this.showAddButton = !this.showAddButton);
     }, this.onModelConfigChange = () => {
       this.requestUpdate();
-    }, this.showAddButton = !0, this.latestGuidePosition = 0, this.open = !1, this.arcgisChartsConfigGuidePopoverChange = $();
+    }, this.showAddButton = !0, this.latestGuidePosition = 0, this.open = !1, this.arcgisChartsConfigGuidePopoverChange = v();
   }
   static {
     this.properties = { showAddButton: 16, latestGuidePosition: 16, messageOverrides: 0, model: 0, timeZone: 3, calculatedMinMaxBounds: 2, enableXAxisGuide: 5, enableYAxisGuide: 5, open: 7 };

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

@@ -12,12 +12,11 @@ import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
 import { b as d, h as c } from "../../chunks/index4.js";
 import { LitElement as m } from "@arcgis/lumina";
-import { html as t } from "lit";
+import { css as g, html as t } from "lit";
 import { C as s } from "../../chunks/interfaces2.js";
-import { css as g } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.46 */
+v4.34.0-next.48 */
 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 m {
   constructor() {