@arcgis/charts-components 4.34.0-next.4 → 4.34.0-next.40

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

@@ -22,7 +22,7 @@ import { j as L, U as $, i as u, h as E, s as z } from "../../chunks/chart-ui-ut
 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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 const N = 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)}.name{display:flex;flex-direction:column;margin:.5rem;padding:.5rem;background:#fff;min-width:250px}.header{margin:0;font-weight:bolder}.fab{display:flex;justify-content:stretch}.pick-list-item-label{font-size:small}.sort-icon-color{color:#000}.sort-y-axis{transform:rotate(90deg)}calcite-panel{max-height:60vh}calcite-panel .size-section{width:19rem;margin:1rem 0;display:flex;flex-wrap:wrap;justify-content:space-evenly}calcite-panel .size-section calcite-label{width:8rem;margin-bottom:.25rem}calcite-panel .apply-button{width:17rem}`, r = {
   jsAppFlyout: "js-app-flyout",
   name: "line-chart-data-popover",

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

@@ -20,7 +20,7 @@ import { g as M } from "../../chunks/chart-ui-utils2.js";
 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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 const N = 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)}`;
 class T extends x {
   constructor() {

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

@@ -19,7 +19,7 @@ import { LitElement as $, createEvent as s, safeClassMap as o } from "@arcgis/lu
 import { css as x } 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.4 */
+v4.34.0-next.40 */
 const n = {
   jsAppFlyout: "js-app-flyout",
   sizeSection: "size-section",

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

@@ -8,7 +8,7 @@ import { LitElement as f, createEvent as h, safeClassMap as s, nothing as n } fr
 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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 const o = {
   sizeSection: "size-section",
   dropdownText: "dropdown-text",

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

@@ -1,18 +1,17 @@
 import { c as l } from "../../chunks/runtime.js";
 import { html as u } from "lit-html";
-import { b as h, m as r, s as d, c } from "../../chunks/chart-ui-utils2.js";
+import { b as h, m as r, s as d, c as m } from "../../chunks/chart-ui-utils2.js";
 import { u as p } from "../../chunks/useT9n.js";
 import { createRef as g, ref as b } from "lit-html/directives/ref.js";
-import { LitElement as f, createEvent as v, safeClassMap as a } from "@arcgis/lumina";
+import { LitElement as f, createEvent as v, safeClassMap as i } from "@arcgis/lumina";
 import { css as x } 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.4 */
-const i = {
+v4.34.0-next.40 */
+const n = {
   container: "container",
   label: "label",
-  numberInput: "number-input",
-  rtl: "arcgis-charts-rtl"
+  numberInput: "number-input"
 }, F = 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)}.container{width:var(--arcgis-charts-config-calcite-block-width, var(--arcgis-charts-config-calcite-block-default-width));height:var(--arcgis-charts-config-calcite-block-height, var(--arcgis-charts-config-calcite-block-default-height));margin-top:.5rem}.container>.number-input{margin-bottom:.5rem;display:flex}.container>.number-input>div{width:100%}.label{display:flex;margin-bottom:.5rem;justify-content:space-between}`;
 class w extends f {
   constructor() {
@@ -25,28 +24,28 @@ class w extends f {
     this.styles = F;
   }
   onDecimalPlacesChange() {
-    const t = this.decimalPlacesInputElement.value?.value, s = Math.floor(Number(t)), n = s === Number(t) && s >= 0;
-    if (t !== void 0 && n && h(t, this.decimalPlacesInputElement.value?.min, this.decimalPlacesInputElement.value?.max)) {
-      const m = Number.parseInt(t), e = {
+    const t = this.decimalPlacesInputElement.value?.value, a = Math.floor(Number(t)), s = a === Number(t) && a >= 0;
+    if (t !== void 0 && s && h(t, this.decimalPlacesInputElement.value?.min, this.decimalPlacesInputElement.value?.max)) {
+      const o = Number.parseInt(t), e = {
         minimumFractionDigits: this.numberFormat?.minimumFractionDigits,
-        maximumFractionDigits: m
+        maximumFractionDigits: o
       };
       e.maximumFractionDigits !== void 0 && e.minimumFractionDigits !== void 0 && e.minimumFractionDigits > e.maximumFractionDigits && (e.minimumFractionDigits = e.maximumFractionDigits);
-      const o = this.getUpdatedNumberFormat(e);
-      this.arcgisChartsConfigNumberFormatChange.emit(o), this.decimalPlacesInputElement.value && r({
+      const c = this.getUpdatedNumberFormat(e);
+      this.arcgisChartsConfigNumberFormatChange.emit(c), this.decimalPlacesInputElement.value && r({
         inputElement: this.decimalPlacesInputElement.value,
-        status: c.IDLE
+        status: m.IDLE
       });
     } else this.decimalPlacesInputElement.value && r({
       inputElement: this.decimalPlacesInputElement.value,
-      status: c.INVALID
+      status: m.INVALID
     });
   }
   onShowThousandsSeparatorChange(t) {
-    const s = t.target.checked, n = this.getUpdatedNumberFormat({
-      useGrouping: s
+    const a = t.target.checked, s = this.getUpdatedNumberFormat({
+      useGrouping: a
     });
-    this.arcgisChartsConfigNumberFormatChange.emit(n);
+    this.arcgisChartsConfigNumberFormatChange.emit(s);
   }
   getUpdatedNumberFormat(t) {
     return {
@@ -55,7 +54,7 @@ class w extends f {
     };
   }
   render() {
-    return u`<div class=${a({ [i.rtl]: this.direction === "rtl" })}><div class=${a(i.container)}><calcite-label class=${a(i.label)}>${this._messages.decimalPlaces}<calcite-input type=number class=${a(i.numberInput)} min=0 max=20 step=1 .value=${d(this.numberFormat?.maximumFractionDigits, 2)} @calciteInputInput=${this.onDecimalPlacesChange} ${b(this.decimalPlacesInputElement)}></calcite-input></calcite-label><calcite-label layout=inline-space-between class=${a(i.label)}>${this._messages.showThousandSeparators}<calcite-switch name=useGrouping .checked=${!!(this.numberFormat?.useGrouping ?? !0)} @calciteSwitchChange=${this.onShowThousandsSeparatorChange}></calcite-switch></calcite-label></div></div>`;
+    return u`<div><div class=${i(n.container)}><calcite-label class=${i(n.label)}>${this._messages.decimalPlaces}<calcite-input type=number class=${i(n.numberInput)} min=0 max=20 step=1 .value=${d(this.numberFormat?.maximumFractionDigits, 2)} @calciteInputInput=${this.onDecimalPlacesChange} ${b(this.decimalPlacesInputElement)}></calcite-input></calcite-label><calcite-label layout=inline-space-between class=${i(n.label)}>${this._messages.showThousandSeparators}<calcite-switch name=useGrouping .checked=${!!(this.numberFormat?.useGrouping ?? !0)} @calciteSwitchChange=${this.onShowThousandsSeparatorChange}></calcite-switch></calcite-label></div></div>`;
   }
 }
 l("arcgis-charts-config-number-format", w);

package/dist/components/arcgis-charts-config-number-format/resource.d.ts

@@ -2,5 +2,4 @@ export declare const HTMLClasses: {
     readonly container: "container";
     readonly label: "label";
     readonly numberInput: "number-input";
-    readonly rtl: "arcgis-charts-rtl";
 };

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

@@ -17,7 +17,7 @@ import { C as c } from "../../chunks/interfaces2.js";
 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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 const P = S`: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 E extends F {
   constructor() {

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

@@ -1,6 +1,6 @@
 import { c as C } from "../../chunks/runtime.js";
 import { keyed as f } from "lit-html/directives/keyed.js";
-import { defaultPieFromFieldsName as c, WebChartStatisticType as u } from "@arcgis/charts-spec";
+import { defaultPieFromFieldsName as n, WebChartStatisticType as u } from "@arcgis/charts-spec";
 import "lodash-es";
 import "d3-array";
 import { c9 as m, b0 as v } from "../../chunks/interfaces.js";
@@ -16,21 +16,20 @@ import { a as g } from "../../chunks/common.js";
 import { P as r } from "../../chunks/interfaces2.js";
 import { u as F } from "../../chunks/useT9n.js";
 import { html as a } from "lit";
-import { createRef as n, ref as h } from "lit-html/directives/ref.js";
-import { LitElement as $, createEvent as p, safeClassMap as s } from "@arcgis/lumina";
+import { createRef as c, ref as h } from "lit-html/directives/ref.js";
+import { LitElement as $, createEvent as p, safeClassMap as o } from "@arcgis/lumina";
 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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
-const o = {
+v4.34.0-next.40 */
+const l = {
   label: "label",
   fieldList: "field-list",
-  fab: "fab",
-  rtl: "arcgis-charts-rtl"
-}, E = w`:host{display:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin);margin-top:var(--arcgis-charts-top-section-margin)}.label,.disabled-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}.field-list{max-height:50vh;overflow-y:auto}.disabled-label{pointer-events:none}.fab{display:flex;margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor);margin-bottom:1.5rem;justify-content:center}:host(.arcgis-chart-rtl) .text{margin-left:0rem;margin-right:var(--arcgis-charts-config-margin-minor)}`;
+  fab: "fab"
+}, E = w`:host{display:flex;flex-direction:column;width:var(--arcgis-charts-config-calcite-block-default-width);margin:var(--arcgis-charts-config-calcite-block-default-margin);margin-top:var(--arcgis-charts-top-section-margin)}.label,.disabled-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}.field-list{max-height:50vh;overflow-y:auto}.disabled-label{pointer-events:none}.fab{display:flex;margin-left:var(--arcgis-charts-config-margin-minor);margin-right:var(--arcgis-charts-config-margin-minor);margin-bottom:1.5rem;justify-content:center}`;
 class N extends $ {
   constructor() {
-    super(...arguments), this._messages = F(), this.pieChartPopover = null, this.sortOrderElement = n(), this.categoryElement = n(), this.numericFieldsElement = n(), this.onPieChartDataChange = async (e) => {
+    super(...arguments), this._messages = F(), this.pieChartPopover = null, this.sortOrderElement = c(), this.categoryElement = c(), this.numericFieldsElement = c(), this.onPieChartDataChange = async (e) => {
       try {
         if (e.detail !== null && e.detail?.value !== void 0) {
           const { contentKind: t } = e.detail, i = [...e.detail.value];
@@ -39,14 +38,14 @@ class N extends $ {
               await this.model.setAggregationType(i[0] !== u.NoAggregation ? i[0] : "");
               break;
             case r.category: {
-              const l = i[0]?.trim() || "";
-              this.updateMode(l);
+              const s = i[0]?.trim() || "";
+              this.updateMode(s);
               const d = this.model.getNumericFields();
-              d.length > 1 && l !== c && await this.model.setNumericFields([d[0]]), await this.model.setCategory(l), this.model.setColorMatch(!0);
+              d.length > 1 && s !== n && await this.model.setNumericFields([d[0]]), await this.model.setCategory(s), this.model.setColorMatch(!0);
               break;
             }
             case r.numericFields:
-              i.length > 1 && (this.updateMode(c), await this.model.setCategory(c)), await this.model.setNumericFields(i);
+              i.length > 1 && (this.updateMode(n), await this.model.setCategory(n)), await this.model.setNumericFields(i);
               break;
             case r.sortOrder:
               this.model.setSortOrder(i[0]);
@@ -103,7 +102,7 @@ class N extends $ {
     this.model.setDataLabelsVisibility(e.target.checked);
   }
   updateMode(e) {
-    const t = e !== c && e.trim() !== "";
+    const t = e !== n && e.trim() !== "";
     this.model.setMode(t ? g.Category : g.Fields);
   }
   setupPopover() {
@@ -132,7 +131,7 @@ class N extends $ {
     !document.body.contains(this.pieChartPopover) && this.pieChartPopover !== null && document.body.appendChild(this.pieChartPopover);
   }
   getCorrectedCategoryValue() {
-    return this.model.getCategory() === c || this.model.getCategory().trim() === "" ? "" : m(this.layerFieldsInfo, this.model.getCategory());
+    return this.model.getCategory() === n || this.model.getCategory().trim() === "" ? "" : m(this.layerFieldsInfo, this.model.getCategory());
   }
   removePieChartDataPopover() {
     this.pieChartPopover !== null && (this.pieChartPopover.open = !1, this.pieChartPopover = y(this.pieChartPopover));
@@ -146,16 +145,16 @@ class N extends $ {
   }
   renderNumericFields(e) {
     const t = v(this.layerFieldsInfo), i = [];
-    for (const l of e)
-      l !== t && i.push(this.buildNumericFieldItem(l));
-    return a`<calcite-list label class=${s(o.fieldList)} ${h(this.numericFieldsElement)}>${i}</calcite-list>`;
+    for (const s of e)
+      s !== t && i.push(this.buildNumericFieldItem(s));
+    return a`<calcite-list label class=${o(l.fieldList)} ${h(this.numericFieldsElement)}>${i}</calcite-list>`;
   }
   render() {
     const e = this.renderCategory(), t = this.renderSorting(), i = this.renderNumericFields([...this.model.getNumericFields()]);
-    return a`<div class=${s({ [o.rtl]: this.direction === "rtl" })}><calcite-label class=${s(o.label)}>${this._messages.category}${e}</calcite-label>${[
-      a`<calcite-label class=${s(o.label)}>${this._messages.numericFields}${i}</calcite-label>`,
-      a`<div class=${s(o.fab)}><calcite-fab appearance=outline-fill kind=neutral scale=m .label=${this._messages.selectNumericFields} text-enabled .text=${this._messages.selectNumericFields} icon=plus @click=${this.onAddNumericFields}></calcite-fab></div>`
-    ]}<calcite-label class=${s(o.label)} layout=inline-space-between>${this._messages.showDataLabels}<calcite-switch .checked=${this.model.getDataLabelsVisibility()} @calciteSwitchChange=${this.onShowDataLabelsChange}></calcite-switch></calcite-label><calcite-label class=${s(o.label)}>${this._messages.sortOrder}${t}</calcite-label></div>`;
+    return a`<div><calcite-label class=${o(l.label)}>${this._messages.category}${e}</calcite-label>${[
+      a`<calcite-label class=${o(l.label)}>${this._messages.numericFields}${i}</calcite-label>`,
+      a`<div class=${o(l.fab)}><calcite-fab appearance=outline-fill kind=neutral scale=m .label=${this._messages.selectNumericFields} text-enabled .text=${this._messages.selectNumericFields} icon=plus @click=${this.onAddNumericFields}></calcite-fab></div>`
+    ]}<calcite-label class=${o(l.label)} layout=inline-space-between>${this._messages.showDataLabels}<calcite-switch .checked=${this.model.getDataLabelsVisibility()} @calciteSwitchChange=${this.onShowDataLabelsChange}></calcite-switch></calcite-label><calcite-label class=${o(l.label)}>${this._messages.sortOrder}${t}</calcite-label></div>`;
   }
 }
 C("arcgis-charts-config-pie-chart-data", N);

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

@@ -4,5 +4,4 @@ export declare const HTMLClasses: {
     readonly fieldList: "field-list";
     readonly fab: "fab";
     readonly disabledLabel: "disabled-label";
-    readonly rtl: "arcgis-charts-rtl";
 };

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

@@ -23,7 +23,7 @@ import { LitElement as D, createEvent as C, safeClassMap as l } from "@arcgis/lu
 import { css as T } 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.4 */
+v4.34.0-next.40 */
 const o = {
   jsAppFlyout: "js-app-flyout",
   name: "pie-chart-data-popover",

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

@@ -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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 const o = {
   sectionLabel: "section-label",
   label: "label",

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

@@ -19,7 +19,7 @@ import { LitElement as v, createEvent as o, safeClassMap as i } from "@arcgis/lu
 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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 const s = {
   jsAppFlyout: "js-app-flyout",
   panelChildrenContainer: "panel-children-container"

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

@@ -17,7 +17,7 @@ import { C as o } from "../../chunks/interfaces2.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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 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

@@ -21,7 +21,7 @@ import { LitElement as D, createEvent as v, safeClassMap as i, safeStyleMap as P
 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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 const s = {
   label: "label",
   r2: "r2",
@@ -30,9 +30,8 @@ const s = {
   sectionLabel: "section-label",
   switchElement: "switch-element",
   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{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}`;
+  multiInputSection: "multi-input-section"
+}, 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%}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) => {
@@ -271,7 +270,7 @@ class K extends D {
     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=${P({ color: `rgba(${e},${t},${o},${n / 255})` })} class=${i(s.iconSelect)} @click=${this.changeElementStyle}></calcite-icon></calcite-list-item></calcite-list></div>`;
   }
   render() {
-    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>`;
+    return r`<div><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

@@ -8,5 +8,4 @@ export declare const HTMLClasses: {
     readonly switchElement: "switch-element";
     readonly sectionContainer: "section-container";
     readonly multiInputSection: "multi-input-section";
-    readonly rtl: "arcgis-charts-rtl";
 };

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

@@ -21,7 +21,7 @@ import { LitElement as S, createEvent as a, safeClassMap as l } from "@arcgis/lu
 import { css as P } 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.4 */
+v4.34.0-next.40 */
 const r = {
   jsAppFlyout: "js-app-flyout",
   scatterplotPopover: "scatter-plot-popover",

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

@@ -13,23 +13,22 @@ import "@arcgis/core/core/promiseUtils.js";
 import "@arcgis/core/request.js";
 import { e as c } from "../../chunks/popover-ui-utils.js";
 import { U as r } from "../../chunks/chart-ui-utils2.js";
-import { u as n } from "../../chunks/useT9n.js";
-import { createRef as p, ref as h } from "lit-html/directives/ref.js";
+import { u as p } from "../../chunks/useT9n.js";
+import { createRef as n, ref as h } from "lit-html/directives/ref.js";
 import { LitElement as m, createEvent as o, safeClassMap as s } from "@arcgis/lumina";
 import { css as d } from "@lit/reactive-element/css-tag.js";
 import { M as e } from "../../chunks/common.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.4 */
-const t = {
+v4.34.0-next.40 */
+const i = {
   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)}: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}`;
+}, 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}`;
 class f extends m {
   constructor() {
-    super(...arguments), this._messages = n(), this.selectChartTypePopover = p(), this.arcgisChartsConfigPopoverClose = o(), this.arcgisChartsConfigSelectChartTypeChange = o();
+    super(...arguments), this._messages = p(), this.selectChartTypePopover = n(), this.arcgisChartsConfigPopoverClose = o(), this.arcgisChartsConfigSelectChartTypeChange = o();
   }
   static {
     this.properties = { messageOverrides: 0, headerTitle: 3, layerId: 3, open: 7, popoverReferenceElement: 0, popoverPlacement: 3, selectedModelType: 3 };
@@ -48,8 +47,8 @@ class f extends m {
   buildChartTypesList() {
     return a`<calcite-list label @click=${this.onChartTypeClick}><calcite-list-item .label=${this._messages.barChart} .value=${e.BarChart} .selected=${this.selectedModelType === e.BarChart}><calcite-icon slot=content-start icon=graph-bar></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.lineChart} .value=${e.LineChart} .selected=${this.selectedModelType === e.LineChart}><calcite-icon slot=content-start icon=graph-time-series></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.pieChart} .value=${e.PieChart} .selected=${this.selectedModelType === e.PieChart}><calcite-icon slot=content-start icon=pie-chart></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.histogram} .value=${e.Histogram} .selected=${this.selectedModelType === e.Histogram}><calcite-icon slot=content-start icon=graph-histogram></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.scatterplot} .value=${e.Scatterplot} .selected=${this.selectedModelType === e.Scatterplot}><calcite-icon slot=content-start icon=graph-scatter-plot></calcite-icon></calcite-list-item><calcite-list-item .label=${this._messages.boxPlot} .value=${e.BoxPlot} .selected=${this.selectedModelType === e.BoxPlot}><calcite-icon slot=content-start icon=box-chart></calcite-icon></calcite-list-item></calcite-list>`;
   }
-  onChartTypeClick(i) {
-    i.target?.localName === "calcite-list-item" ? this.selectedModelType = i.target?.value : this.selectedModelType = i.target?.parentNode?.value, this.arcgisChartsConfigSelectChartTypeChange.emit();
+  onChartTypeClick(t) {
+    t.target?.localName === "calcite-list-item" ? this.selectedModelType = t.target?.value : this.selectedModelType = t.target?.parentNode?.value, this.arcgisChartsConfigSelectChartTypeChange.emit();
   }
   popoverOpen() {
     setTimeout(async () => await this.selectChartTypePopover.value?.setFocus(), 250);
@@ -59,10 +58,9 @@ class f extends m {
   }
   render() {
     return a`<div class=${s({
-      [t.rtl]: this.direction === "rtl",
-      [t.selectChartComponent]: !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=${s(t.panel)} .heading=${this.headerTitle ?? this._messages.chooseChartType} closable @calcitePanelClose=${this.popoverClose} .closed=${!this.open}>${this.buildChartTypesList()}</calcite-panel></calcite-popover></div>`;
+      [i.selectChartComponent]: !0,
+      [i.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=${s(i.panel)} .heading=${this.headerTitle ?? this._messages.chooseChartType} closable @calcitePanelClose=${this.popoverClose} .closed=${!this.open}>${this.buildChartTypesList()}</calcite-panel></calcite-popover></div>`;
   }
 }
 l("arcgis-charts-config-select-chart-type-popover", f);

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

@@ -1,7 +1,6 @@
 export declare const HTMLClasses: {
     readonly selectChartComponent: "select-chart-component";
     readonly header: "header";
-    readonly rtl: "arcgis-charts-rtl";
     readonly jsAppFlyout: "js-app-flyout";
     readonly panel: "panel";
 };

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

@@ -36,7 +36,7 @@ export declare class ArcgisChartsConfigViewCharts extends LitElement {
      */
     noGroup: boolean;
     /**
-     * Disable the three-dot menu for editing, renaming, and deleting charts. Useful if the list is only intended for viewing.
+     * Disable the three-dot menu for editing, renaming & deleting charts and disable re-ordering charts position in the charts list. Useful if the list is only intended for viewing.
      *
      * @category Public
      * @default false

package/dist/components/arcgis-charts-config-view-charts/customElement.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.34/esri/copyright.txt for details.
-v4.34.0-next.4 */
+v4.34.0-next.40 */
 const c = {
   addChartContainer: "add-chart-container",
   viewChartComponent: "view-chart-component",
@@ -75,7 +75,7 @@ class R extends v {
       const a = t.getChartId(), s = t.getTitleText(), l = m(t.getConfig());
       return o`<calcite-list-item .label=${s ?? a ?? d(this._messages.chartTitle ?? "", { index: i.toString() })} .selected=${this.selectedChartId === (a?.toString() ?? i.toString())} .value=${a ?? i.toString()} @click=${this.onChartSelect}><calcite-icon slot=content-start .icon=${l}></calcite-icon>${this.disableEditing ? null : o`<calcite-dropdown slot=actions-end overlay-positioning=fixed placement=bottom-end @calciteDropdownClose=${() => this.chartActionClosed(a ?? "")} @calciteDropdownOpen=${() => this.chartActionOpened(a ?? "")} class=${n(c.dropdownPopup)}><calcite-action scale=l .text=${this._messages.chartActions ?? ""} slot=trigger .active=${a === this.selectedActionChartId}><calcite-icon icon=ellipsis></calcite-icon></calcite-action><calcite-dropdown-group selection-mode=none><calcite-dropdown-item accesskey=edit @calciteDropdownItemSelect=${this.chartEditSelect}>${this._messages.edit}</calcite-dropdown-item><calcite-dropdown-item accesskey=rename @calciteDropdownItemSelect=${this.chartRenameSelect}>${this._messages.rename}</calcite-dropdown-item><calcite-dropdown-item accesskey=delete @calciteDropdownItemSelect=${this.chartDeleteSelect}>${this._messages.delete}</calcite-dropdown-item></calcite-dropdown-group></calcite-dropdown>`}</calcite-list-item>`;
     }) : null;
-    return this.layer ? o`<div>${this.noGroup ? null : o`<p class=${n(c.header)}>${this.layer.title ?? this.layer.id.toString()}</p>`}<calcite-list label drag-enabled selection-mode=single selection-appearance=border @calciteListOrderChange=${this.onCalciteListOrderChange}>${e}${this.disableEditing ? null : o`<div class=${n(c.addChartContainer)}><calcite-fab slot=fab appearance=outline-fill kind=neutral text-enabled .text=${this._messages.addChart} .label=${this._messages.addChart} @click=${this.onAddChartClick} scale=s></calcite-fab></div>`}</calcite-list></div>` : null;
+    return this.layer ? o`<div>${this.noGroup ? null : o`<p class=${n(c.header)}>${this.layer.title ?? this.layer.id.toString()}</p>`}<calcite-list label .dragEnabled=${!this.disableEditing} selection-mode=single selection-appearance=border @calciteListOrderChange=${this.onCalciteListOrderChange}>${e}${this.disableEditing ? null : o`<div class=${n(c.addChartContainer)}><calcite-fab slot=fab appearance=outline-fill kind=neutral text-enabled .text=${this._messages.addChart} .label=${this._messages.addChart} @click=${this.onAddChartClick} scale=s></calcite-fab></div>`}</calcite-list></div>` : null;
   }
   onChartSelect(e) {
     const t = e.currentTarget;

package/dist/demo-chart-rendering/common/index.d.ts

@@ -69,6 +69,7 @@ export declare const ControlLabels: {
     readonly ExportConfig: "Download config";
     readonly ExportImage: "Export PNG";
     readonly ExportImageNext: "Export PNG (Next)";
+    readonly ExportAsTable: "Export As Table";
     readonly DataType: "Data type";
     readonly StackedType: "Stacked type";
     readonly StackNegativeValuesOption: "Stack negative values to base line";

package/dist/docs/api.json

@@ -1,8 +1,8 @@
 {
-  "timestamp": "2025-05-26T04:45:02",
+  "timestamp": "2025-06-28T04:44:39",
   "compiler": {
     "name": "@arcgis/lumina-compiler",
-    "version": "4.34.0-next.4",
+    "version": "4.34.0-next.40",
     "typescriptVersion": "5.8.3"
   },
   "schemaVersion": "1.0.0",
@@ -16,7 +16,7 @@
           "customElement": true,
           "name": "ArcgisChart",
           "tagName": "arcgis-chart",
-          "description": "Chart component renders various chart types based on the provided model, including bar charts, line charts, pie charts, box plots, combo bar-line charts, gauges, scatterplots, and histograms.",
+          "description": "The ArcGIS Chart component renders various chart types based on the provided model.\n\nSupported chart types include bar charts, line charts, pie charts, box plots, combo bar-line charts, gauges, scatterplots, histograms and radar charts.\n\nThe Chart component can be rendered using an [existing model](https://developers.arcgis.com/javascript/latest/charts-components-intro/#use-an-existing-model-from-a-webmap-or-feature-layer) from a web map or feature layer,\nor by [creating a new model](https://developers.arcgis.com/javascript/latest/charts-components-intro/#create-a-new-model).\n\nSee also:\n- [Introduction to Charts components](https://developers.arcgis.com/javascript/latest/charts-components-intro/)\n- [Tutorial: Display and create charts components](https://developers.arcgis.com/javascript/latest/tutorials/display-and-create-charts-components/)",
           "demos": [
             {
               "description": "Docs",
@@ -27,7 +27,7 @@
               "url": "https://developers.arcgis.com/javascript/latest/storybook/charts-components/?path=/story/arcgis-chart--bar-chart&singleStory=true"
             },
             {
-              "description": "Box Plot\nBox plots visualize and compares the distribution and central tendency of numeric values through their quartiles.",
+              "description": "Box Plot\nBox plots visualize and compare the distribution and central tendency of numeric values through their quartiles.",
               "url": "https://developers.arcgis.com/javascript/latest/storybook/charts-components/?path=/story/arcgis-chart--box-plot&singleStory=true"
             },
             {
@@ -247,7 +247,7 @@
               "docsTags": [
                 {
                   "name": "example",
-                  "text": "const arcgisChart = document.createElement(\"arcgis-chart\");\ndocument.body.append(arcgisChart);\narcgisChart.componentOnReady().then(() => {\n  console.log(\"arcgis-chart is ready to go!\");\n});"
+                  "text": "```js\nconst arcgisChart = document.querySelector(\"arcgis-chart\");\ndocument.body.append(arcgisChart);\nawait arcgisChart.componentOnReady();\nconsole.log(\"arcgis-chart is ready to go!\");\n```"
                 }
               ]
             },
@@ -589,7 +589,7 @@
               "docsTags": [
                 {
                   "name": "param",
-                  "text": "options The options to use when exporting the data.\n\nThe `Options` object can contain the following properties:\n- `columns` - An array of column to include in the CSV file.\n- `delimiter` - The delimiter to use in the CSV file. Default is `,`.\n- `includeHeader` - Whether to include the header row in the CSV file. Default is `true`.\n- `quoteAll` - Whether to quote all values in the CSV file. Default is `false`."
+                  "text": "options The options to use when exporting the data.\n\nNOTE: This method won't work for scatter plot series. The support charts for this method are:\n- Bar chart\n- Line chart\n- Combo bar-line chart\n- Box plot\n- Histogram\n- Pie chart\n\nThe `Options` object can contain the following properties:\n- `columns` - An array of column to include in the CSV file.\n- `delimiter` - The delimiter to use in the CSV file. Default is `,`.\n- `includeHeader` - Whether to include the header row in the CSV file. Default is `true`.\n- `quoteAll` - Whether to quote all values in the CSV file. Default is `false`."
                 },
                 {
                   "name": "category",
@@ -2984,7 +2984,7 @@
           "slots": [
             {
               "name": "action-bar",
-              "description": "A slot for adding charts-action-bar component or calcite-action-bar."
+              "description": "Slot for adding a `charts-action-bar` component or `calcite-action-bar`."
             }
           ]
         }
@@ -3009,7 +3009,7 @@
           "customElement": true,
           "name": "ArcgisChartsActionBar",
           "tagName": "arcgis-charts-action-bar",
-          "description": "The charts action bar component enhances chart functionality by offering context-specific actions such as rotation, zooming, and filtering. It is designed to be used in conjunction with a chart component and is not intended for standalone use.",
+          "description": "The ArcGIS charts action bar component enhances chart functionality by offering context-specific actions such as rotation, zooming, and filtering.\nIt also supports general actions like exporting the chart as an image or CSV.\nThis component is designed to be used with a chart component and is not intended for standalone use.\n\nSee also:\n- [Tutorial: Charts components with Map components using charts action bar](https://developers.arcgis.com/javascript/latest/tutorials/charts-components-with-map-components/)",
           "demos": [
             {
               "description": "Docs",
@@ -3264,7 +3264,7 @@
               "docsTags": [
                 {
                   "name": "example",
-                  "text": "const arcgisChartsActionBar = document.createElement(\"arcgis-charts-action-bar\");\ndocument.body.append(arcgisChartsActionBar);\narcgisChartsActionBar.componentOnReady().then(() => {\n  console.log(\"arcgis-charts-action-bar is ready to go!\");\n});"
+                  "text": "```js\nconst arcgisChartsActionBar = document.querySelector(\"arcgis-charts-action-bar\");\ndocument.body.append(arcgisChartsActionBar);\nawait arcgisChartsActionBar.componentOnReady();\nconsole.log(\"arcgis-charts-action-bar is ready to go!\");\n```"
                 }
               ]
             },
@@ -3842,7 +3842,7 @@
               "name": "hiddenActions",
               "description": "Holds a list of actions to hide from the action bar.\n\n**Note:** The edit chart action is hidden by default. To show it, remove its value from this array.",
               "type": {
-                "text": "Array<\"legend\" | \"fullExtent\" | \"filterBySelection\" | \"filterByExtent\" | \"rotateChart\" | \"selection\" | \"clearSelection\" | \"switchSelection\" | \"zoom\" | \"editChart\" | \"exportAsImage\" | \"exportAsCSV\">",
+                "text": "Array<\"zoom\" | \"legend\" | \"fullExtent\" | \"filterBySelection\" | \"filterByExtent\" | \"rotateChart\" | \"selection\" | \"clearSelection\" | \"switchSelection\" | \"editChart\" | \"exportAsImage\" | \"exportAsCSV\">",
                 "references": [
                   {
                     "name": "Array",