@arcgis/charts-components 4.34.0-next.10 → 4.34.0-next.100

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,22 @@ 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 "@arcgis/toolkit/intl";
+import "@arcgis/toolkit/dom";
+import { e as p } 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 { 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.10 */
+v4.34.0-next.100 */
 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 = n(), 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 +38,7 @@ class f extends m {
     await this.popoverElement.value?.reposition();
   }
   updated() {
-    a(this.popoverElement.value, this.open);
+    p(this.popoverElement.value, this.open);
   }
   guidePopoverClose() {
     this.open = !1, this.arcgisChartsConfigPopoverClose.emit();
@@ -52,7 +53,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} auto-close ${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.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { ModelWithGuides } from '../../model/mixins';
 import { CalculatedMinMaxBoundsPayload } from '@arcgis/charts-spec';
 import { default as MapView } from '@arcgis/core/views/MapView';
@@ -49,11 +49,5 @@ export declare class ArcgisChartsConfigGuides extends LitElement {
      * @default false
      */
     open: boolean;
-    /**
-     * Event when there is change in guide popover.
-     *
-     * @category Public
-     */
-    readonly arcgisChartsConfigGuidePopoverChange: TargetedEvent<this, void>;
     private _messages;
 }

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

@@ -1,56 +1,47 @@
-import { c as x } from "../../chunks/runtime.js";
-import "@arcgis/charts-spec";
+import { c as p } from "../../chunks/runtime.js";
 import { cloneDeep as r } from "lodash-es";
-import "d3-array";
-import "../../chunks/interfaces.js";
-import "@arcgis/core/geometry/support/jsonUtils.js";
-import "@arcgis/core/rest/support/AttributeBinsQuery.js";
-import "@arcgis/core/rest/support/Query.js";
-import "@arcgis/core/rest/support/StatisticDefinition.js";
-import "@arcgis/core/time/TimeExtent.js";
-import "@arcgis/core/core/promiseUtils.js";
-import "@arcgis/core/request.js";
-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 { 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 { d as g } from "../../chunks/default.js";
+import { g as u, H as c } from "../../chunks/resource.js";
+import { u as f } from "../../chunks/useT9n.js";
+import { css as A, html as a } from "lit";
+import { createRef as x, ref as C } from "lit-html/directives/ref.js";
+import { LitElement as b, renderElement as v, safeClassMap as m } from "@arcgis/lumina";
 import { G as o } from "../../chunks/common.js";
-import { m as l, n as h } from "../../chunks/type-guards.js";
+import { n as l, o as h } from "../../chunks/type-guards.js";
+import "@arcgis/charts-spec";
 /*! 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.10 */
-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.100 */
+const P = A`: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 $ extends b {
   constructor() {
-    super(...arguments), this._messages = b(), this.addGuideButton = m(), this.popoverElement = m(), this.addXGuide = () => {
+    super(...arguments), this._messages = f(), this.addGuideButton = x(), this.guideTypePopover = null, this.addXGuide = (e) => {
       if (l(this.model)) {
-        const e = this.getUniqueName(this._messages.xAxisGuide ?? ""), i = this.model.getXGuidesLength() ?? 0;
-        this.model.addXAxisGuide(e, i), this.model.setGuideStyle(r(c.style), i, o.X), this.latestGuidePosition = u(i, o.X, this.model), this.togglePopOver(), (this.el.shadowRoot?.querySelectorAll("calcite-block") ?? []).forEach((s, d) => {
-          d !== this.latestGuidePosition && (s.open = !1);
+        const t = this.getUniqueName(this._messages.xAxisGuide ?? ""), i = this.model.getXGuidesLength() ?? 0;
+        this.model.addXAxisGuide(t, i), this.model.setGuideStyle(r(g.style), i, o.X), this.latestGuidePosition = u(i, o.X, this.model), this.togglePopOver(e), (this.el.shadowRoot?.querySelectorAll("calcite-block") ?? []).forEach((d, n) => {
+          n !== this.latestGuidePosition && (d.open = !1);
         });
       }
-    }, this.addYGuide = () => {
+    }, this.addYGuide = (e) => {
       if (h(this.model)) {
-        const e = this.getUniqueName(this._messages.yAxisGuide ?? ""), i = this.model.getYGuidesLength() ?? 0;
-        this.model.addYAxisGuide(e, i), this.model.setGuideStyle(r(c.style), i, o.Y), this.latestGuidePosition = u(i, o.Y, this.model), this.togglePopOver();
-        for (const t of this.el.shadowRoot?.querySelectorAll("calcite-block") ?? [])
-          t.open = !1;
+        const t = this.getUniqueName(this._messages.yAxisGuide ?? ""), i = this.model.getYGuidesLength() ?? 0;
+        this.model.addYAxisGuide(t, i), this.model.setGuideStyle(r(g.style), i, o.Y), this.latestGuidePosition = u(i, o.Y, this.model), this.togglePopOver(e);
+        for (const s of this.el.shadowRoot?.querySelectorAll("calcite-block") ?? [])
+          s.open = !1;
       }
-    }, this.togglePopOver = () => {
-      this.enableXAxisGuide && this.enableYAxisGuide && (this.showAddButton = !this.showAddButton);
+    }, this.togglePopOver = (e) => {
+      e.stopImmediatePropagation(), this.enableXAxisGuide && this.enableYAxisGuide && (this.showAddButton = !this.showAddButton);
     }, this.onModelConfigChange = () => {
       this.requestUpdate();
-    }, this.showAddButton = !0, this.latestGuidePosition = 0, this.open = !1, this.arcgisChartsConfigGuidePopoverChange = $();
+    }, this.closeAddPopOver = (e) => {
+      e.stopImmediatePropagation(), this.showAddButton = !0;
+    }, this.showAddButton = !0, this.latestGuidePosition = 0, this.open = !1;
   }
   static {
     this.properties = { showAddButton: 16, latestGuidePosition: 16, messageOverrides: 0, model: 0, timeZone: 3, calculatedMinMaxBounds: 2, enableXAxisGuide: 5, enableYAxisGuide: 5, open: 7 };
   }
   static {
-    this.styles = X;
+    this.styles = P;
   }
   load() {
     this.modelChange(this.model);
@@ -58,56 +49,57 @@ class Y extends C {
   willUpdate(e) {
     e.has("model") && this.modelChange(this.model, e.get("model"));
   }
-  updated() {
-    A(this.popoverElement.value, !this.showAddButton);
-  }
   disconnectedCallback() {
     super.disconnectedCallback(), this.model.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
-  modelChange(e, i) {
-    i?.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange), e?.addEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
+  modelChange(e, t) {
+    t?.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange), e?.addEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
   getAllGuidesLength() {
-    const e = l(this.model) ? this.model.getXGuidesLength() ?? 0 : 0, i = h(this.model) ? this.model.getYGuidesLength() ?? 0 : 0;
-    return e + i;
+    const e = l(this.model) ? this.model.getXGuidesLength() ?? 0 : 0, t = h(this.model) ? this.model.getYGuidesLength() ?? 0 : 0;
+    return e + t;
   }
-  getUniqueName(e, i = 1) {
-    const t = `${e} ${i}`;
+  getUniqueName(e, t = 1) {
+    const i = `${e} ${t}`;
     let s = !1;
     if (l(this.model)) {
       const d = this.model.getXGuidesLength() ?? 0;
       for (let n = 0; n < d && !s; n += 1)
-        this.model.getGuideName(n, o.X) === t && (s = !0);
+        this.model.getGuideName(n, o.X) === i && (s = !0);
     }
     if (h(this.model)) {
       const d = this.model.getYGuidesLength() ?? 0;
       for (let n = 0; n < d && !s; n += 1)
-        this.model.getGuideName(n, o.Y) === t && (s = !0);
+        this.model.getGuideName(n, o.Y) === i && (s = !0);
     }
-    return s ? this.getUniqueName(e, i + 1) : t;
-  }
-  closeAddPopOver() {
-    this.showAddButton = !0;
+    return s ? this.getUniqueName(e, t + 1) : i;
   }
   setChangedGuide(e) {
-    const { index: i, orientation: t, isDelete: s } = e.detail, d = u(i, t, this.model);
+    const { index: t, orientation: i, isDelete: s } = e.detail, d = u(t, i, this.model);
     s && d !== void 0 && d <= this.latestGuidePosition && this.latestGuidePosition > 0 && (this.latestGuidePosition -= 1);
   }
-  renderGuide(e, i) {
-    let t;
-    return (this.enableXAxisGuide && i === o.X || this.enableYAxisGuide && i === o.Y) && (t = a`<arcgis-charts-config-guide .model=${this.model} .timeZone=${this.timeZone} .calculatedMinMaxBounds=${this.calculatedMinMaxBounds} .index=${e} .orientation=${i} .latestGuidePosition=${this.latestGuidePosition} @arcgisChartsConfigGuideChange=${this.setChangedGuide}></arcgis-charts-config-guide>`), t;
+  setupGuidePopover(e) {
+    e.stopImmediatePropagation(), this.togglePopOver(e);
+  }
+  renderGuideTypePopover() {
+    const e = this.getAllGuidesLength();
+    this.guideTypePopover = v(a`<arcgis-charts-config-guides-type-popover .enableXAxisGuide=${this.enableXAxisGuide} .enableYAxisGuide=${this.enableYAxisGuide} .referenceElement=${this.addGuideButton.value} .placement=${e === 0 ? "bottom" : "top"} .open=${!this.showAddButton} @arcgisChartsAddXAxisGuide=${this.addXGuide} @arcgisChartsAddYAxisGuide=${this.addYGuide} @arcgisChartsConfigPopoverClose=${this.closeAddPopOver}></arcgis-charts-config-guides-type-popover>`), !this.showAddButton && !document.body.contains(this.guideTypePopover) && this.guideTypePopover !== null && document.body.appendChild(this.guideTypePopover);
+  }
+  renderGuide(e, t) {
+    let i;
+    return (this.enableXAxisGuide && t === o.X || this.enableYAxisGuide && t === o.Y) && (i = a`<arcgis-charts-config-guide .model=${this.model} .timeZone=${this.timeZone} .calculatedMinMaxBounds=${this.calculatedMinMaxBounds} .index=${e} .orientation=${t} .latestGuidePosition=${this.latestGuidePosition} @arcgisChartsConfigGuideChange=${this.setChangedGuide}></arcgis-charts-config-guide>`), i;
   }
   renderGuides() {
     const e = [];
     if (l(this.model)) {
-      const i = this.model.getXGuidesLength() ?? 0;
-      for (let t = 0; t < i; t += 1)
-        e.push(this.renderGuide(t, o.X));
+      const t = this.model.getXGuidesLength() ?? 0;
+      for (let i = 0; i < t; i += 1)
+        e.push(this.renderGuide(i, o.X));
     }
     if (h(this.model)) {
-      const i = this.model.getYGuidesLength() ?? 0;
-      for (let t = 0; t < i; t += 1)
-        e.push(this.renderGuide(t, o.Y));
+      const t = this.model.getYGuidesLength() ?? 0;
+      for (let i = 0; i < t; i += 1)
+        e.push(this.renderGuide(i, o.Y));
     }
     return e;
   }
@@ -115,11 +107,11 @@ class Y extends C {
     return a`<calcite-fab slot=fab appearance=outline-fill kind=neutral text-enabled .text=${this._messages.addGuide} .label=${this._messages.addGuide} @click=${e} scale=s></calcite-fab>`;
   }
   render() {
-    const e = this.getAllGuidesLength(), i = e > 0, t = this.showAddButton && this.enableXAxisGuide && this.enableYAxisGuide, s = this.enableXAxisGuide && !this.enableYAxisGuide, d = !this.enableXAxisGuide && this.enableYAxisGuide;
-    return a`<calcite-popover .open=${!this.showAddButton} .referenceElement=${this.addGuideButton.value ?? document.body} flip-disabled pointer-disabled offset-distance=-18 @calcitePopoverClose=${this.closeAddPopOver} .placement=${e === 0 ? "bottom" : "top"} label ${G(this.popoverElement)}><calcite-panel .heading=${this._messages.guideType}><calcite-action text slot=header-actions-end icon=x @click=${this.closeAddPopOver}></calcite-action>${this.enableXAxisGuide ? a`<calcite-action .label=${this._messages.addXAxisGuide} .text=${this._messages.addXAxisGuide ?? ""} @click=${this.addXGuide} icon=x-axis-guide text-enabled></calcite-action>` : null}${this.enableYAxisGuide ? a`<calcite-action .label=${this._messages.addYAxisGuide} .text=${this._messages.addYAxisGuide ?? ""} @click=${this.addYGuide} icon=y-axis-guide text-enabled></calcite-action>` : null}</calcite-panel></calcite-popover>${i ? this.renderGuides() : a`<div class=${p(g.noMessages)}>${this._messages.noGuidesMsg}</div>`}<div class=${p(g.addGuide)} ${G(this.addGuideButton)}>${t && this.renderAddGuideButton(this.togglePopOver) || ""}${s && this.renderAddGuideButton(this.addXGuide) || ""}${d && this.renderAddGuideButton(this.addYGuide) || ""}</div>`;
+    const t = this.getAllGuidesLength() > 0, i = this.showAddButton && this.enableXAxisGuide && this.enableYAxisGuide, s = this.enableXAxisGuide && !this.enableYAxisGuide, d = !this.enableXAxisGuide && this.enableYAxisGuide;
+    return a`${this.renderGuideTypePopover()}${t ? this.renderGuides() : a`<div class=${m(c.noMessages)}>${this._messages.noGuidesMsg}</div>`}<div class=${m(c.addGuide)} ${C(this.addGuideButton)}>${i && this.renderAddGuideButton(this.setupGuidePopover) || ""}${s && this.renderAddGuideButton(this.addXGuide) || ""}${d && this.renderAddGuideButton(this.addYGuide) || ""}</div>`;
   }
 }
-x("arcgis-charts-config-guides", Y);
+p("arcgis-charts-config-guides", $);
 export {
-  Y as ArcgisChartsConfigGuides
+  $ as ArcgisChartsConfigGuides
 };

package/dist/components/arcgis-charts-config-guides/index.d.ts

@@ -1,6 +1,4 @@
+import "../arcgis-charts-config-guides-type-popover/index.js";
 import "../arcgis-charts-config-guide/index.js";
 import "@esri/calcite-components/components/calcite-fab";
-import "@esri/calcite-components/components/calcite-popover";
-import "@esri/calcite-components/components/calcite-panel";
-import "@esri/calcite-components/components/calcite-action";
 export * from "./customElement.js";

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

@@ -1,6 +1,4 @@
+import "../arcgis-charts-config-guides-type-popover/index.js";
 import "../arcgis-charts-config-guide/index.js";
 import "@esri/calcite-components/components/calcite-fab";
-import "@esri/calcite-components/components/calcite-popover";
-import "@esri/calcite-components/components/calcite-panel";
-import "@esri/calcite-components/components/calcite-action";
 export * from "./customElement.js";

package/dist/components/arcgis-charts-config-guides-type-popover/customElement.d.ts

@@ -0,0 +1,67 @@
+/// <reference path="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+
+/** @private */
+export declare class ArcgisChartsConfigGuidesTypePopover extends LitElement {
+    /**
+     * Enable X-Axis guide
+     *
+     * @category Public
+     * @default false
+     */
+    enableXAxisGuide: boolean;
+    /**
+     * Enable Y-Axis guide
+     *
+     * @category Public
+     * @default false
+     */
+    enableYAxisGuide: boolean;
+    /** Overwrite localized strings for this component */
+    messageOverrides?: typeof this._messages._overrides;
+    /**
+     * Reference element to show the popover.
+     *
+     * @category Public
+     */
+    referenceElement?: HTMLElement;
+    /**
+     * Place the popover in the give placement.
+     *
+     * @category Public
+     * @default "bottom"
+     */
+    placement: HTMLCalcitePopoverElement["placement"];
+    /**
+     * boolean to open or close the popover.
+     *
+     * @category Public
+     * @default false
+     */
+    open: boolean;
+    /**
+     * Calls `reposition()` method on popover element.
+     *
+     * @category Public
+     */
+    reposition(): Promise<void>;
+    /**
+     * Event emitted when the X axis guide is added.
+     *
+     * @category Public
+     */
+    readonly arcgisChartsAddXAxisGuide: TargetedEvent<this, void>;
+    /**
+     * Event emitted when the Y axis guide is added.
+     *
+     * @category Public
+     */
+    readonly arcgisChartsAddYAxisGuide: TargetedEvent<this, void>;
+    /**
+     * Event emitted when the popover is closed.
+     *
+     * @category Public
+     */
+    readonly arcgisChartsConfigPopoverClose: TargetedEvent<this, void>;
+    private _messages;
+}

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

@@ -0,0 +1,50 @@
+import { c as t } from "../../chunks/runtime.js";
+import { html as e } from "lit";
+import { LitElement as s, createEvent as i } from "@arcgis/lumina";
+import { u as o } from "../../chunks/useT9n.js";
+import { createRef as a, ref as r } from "lit-html/directives/ref.js";
+import "@arcgis/charts-spec";
+import "lodash-es";
+import "d3-array";
+import "../../chunks/interfaces.js";
+import "@arcgis/core/geometry/support/jsonUtils.js";
+import "@arcgis/core/rest/support/AttributeBinsQuery.js";
+import "@arcgis/core/rest/support/Query.js";
+import "@arcgis/core/rest/support/StatisticDefinition.js";
+import "@arcgis/core/time/TimeExtent.js";
+import "@arcgis/core/core/promiseUtils.js";
+import "@arcgis/core/request.js";
+import "@arcgis/toolkit/intl";
+import "@arcgis/toolkit/dom";
+import { e as l } from "../../chunks/popover-ui-utils.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.100 */
+class p extends s {
+  constructor() {
+    super(...arguments), this._messages = o(), this.popoverElement = a(), this.onAddXGuide = () => {
+      this.open = !1, this.arcgisChartsAddXAxisGuide.emit();
+    }, this.onAddYGuide = () => {
+      this.open = !1, this.arcgisChartsAddYAxisGuide.emit();
+    }, this.enableXAxisGuide = !1, this.enableYAxisGuide = !1, this.placement = "bottom", this.open = !1, this.arcgisChartsAddXAxisGuide = i(), this.arcgisChartsAddYAxisGuide = i(), this.arcgisChartsConfigPopoverClose = i();
+  }
+  static {
+    this.properties = { enableXAxisGuide: 7, enableYAxisGuide: 7, messageOverrides: 0, referenceElement: 2, placement: 3, open: 7 };
+  }
+  async reposition() {
+    await this.popoverElement.value?.reposition();
+  }
+  updated() {
+    l(this.popoverElement.value, this.open);
+  }
+  guidePopoverClose() {
+    this.open = !1, this.arcgisChartsConfigPopoverClose.emit();
+  }
+  render() {
+    return e`<calcite-popover .open=${this.open} .referenceElement=${this.referenceElement ?? document.body} flip-disabled pointer-disabled offset-distance=-18 @calcitePopoverClose=${this.guidePopoverClose} .placement=${this.placement} auto-close label ${r(this.popoverElement)}><calcite-panel .heading=${this._messages.guideType} closable @calcitePanelClose=${this.guidePopoverClose}>${this.enableXAxisGuide ? e`<calcite-action .label=${this._messages.addXAxisGuide} .text=${this._messages.addXAxisGuide ?? ""} @click=${this.onAddXGuide} icon=x-axis-guide text-enabled></calcite-action>` : null}${this.enableYAxisGuide ? e`<calcite-action .label=${this._messages.addYAxisGuide} .text=${this._messages.addYAxisGuide ?? ""} @click=${this.onAddYGuide} icon=y-axis-guide text-enabled></calcite-action>` : null}</calcite-panel></calcite-popover>`;
+  }
+}
+t("arcgis-charts-config-guides-type-popover", p);
+export {
+  p as ArcgisChartsConfigGuidesTypePopover
+};

package/dist/components/arcgis-charts-config-guides-type-popover/index.d.ts

@@ -0,0 +1,4 @@
+import "@esri/calcite-components/components/calcite-popover";
+import "@esri/calcite-components/components/calcite-panel";
+import "@esri/calcite-components/components/calcite-action";
+export * from "./customElement.js";

package/dist/components/arcgis-charts-config-guides-type-popover/index.js

@@ -0,0 +1,4 @@
+import "@esri/calcite-components/components/calcite-popover";
+import "@esri/calcite-components/components/calcite-panel";
+import "@esri/calcite-components/components/calcite-action";
+export * from "./customElement.js";

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

@@ -1,4 +1,4 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { HistogramModel } from '../../model';
 import { SeriesSymbolsMap } from '../../utils';
 import { CalculatedMinMaxBoundsPayload, SupportedLayer, WebChartHistogramDataItem } from '@arcgis/charts-spec';

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

@@ -2,7 +2,7 @@ import { c as n } from "../../chunks/runtime.js";
 import "@arcgis/charts-spec";
 import { isEqual as r } from "lodash-es";
 import "d3-array";
-import { g as l, a_ as h } from "../../chunks/interfaces.js";
+import { g as l, b1 as h } 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";
@@ -10,18 +10,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 { b as d, h as c } from "../../chunks/index4.js";
+import "@arcgis/toolkit/intl";
+import { b as d, h as c } from "../../chunks/index5.js";
+import "@arcgis/toolkit/dom";
 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.10 */
-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 {
+v4.34.0-next.100 */
+const f = g`:host{overflow-y:auto;overflow-x:hidden;margin-bottom:var(--arcgis-charts-intra-section-margin);margin-top:var(--arcgis-charts-intra-section-margin);height:100%}`;
+class p extends m {
   constructor() {
-    super(...arguments), this.popoverElement = null, this.onModelConfigChange = async (e) => {
+    super(...arguments), this.onModelConfigChange = async (e) => {
       const i = e?.detail.config ?? this.model.getConfig();
       this.layer === void 0 && await this.updateFetchLayerFieldsInfo(i);
     };
@@ -30,7 +31,7 @@ class f extends m {
     this.properties = { layerFieldsInfo: 16, model: 0, chartData: 0, seriesColor: 2, calculatedMinMaxBounds: 2, page: 3, layer: 0, usePopupTemplateFieldsInfo: 5 };
   }
   static {
-    this.styles = p;
+    this.styles = f;
   }
   async load() {
     this.layer !== void 0 && await this.layerChange(this.layer, void 0), this.seriesColor !== void 0 && this.seriesColorChange(this.seriesColor), this.usePopupTemplateFieldsInfo !== void 0 && await this.usePopupTemplateFieldsInfoChange(this.usePopupTemplateFieldsInfo, void 0), this.modelChange(this.model), this.onModelConfigChange();
@@ -64,24 +65,20 @@ class f extends m {
     }
     i && (this.layerFieldsInfo = await h(i, this.usePopupTemplateFieldsInfo));
   }
-  popoverOpen(e) {
-    const { open: a = !1, element: i = null } = { ...e.detail };
-    a === !0 && this.popoverElement !== i ? (this.popoverElement !== null && (this.popoverElement.open = !1), this.popoverElement = i) : a === !1 && this.popoverElement === i && (this.popoverElement = null);
-  }
   render() {
     let e;
     switch (this.page) {
       case s.Data:
-        e = t`<arcgis-charts-config-histogram-data .model=${this.model} .meanValue=${this.chartData?.mean} .medianValue=${this.chartData?.median} .standardDevValue=${this.chartData?.stddev} .minValue=${this.chartData?.min} .maxValue=${this.chartData?.max} .sumValue=${this.chartData?.sum} .nullsValue=${this.chartData?.nulls} .countValue=${this.chartData?.count} .layerFieldsInfo=${this.layerFieldsInfo} @arcgisChartsConfigHistogramDataPopoverChange=${this.popoverOpen}></arcgis-charts-config-histogram-data>`;
+        e = t`<arcgis-charts-config-histogram-data .model=${this.model} .meanValue=${this.chartData?.mean} .medianValue=${this.chartData?.median} .standardDevValue=${this.chartData?.stddev} .minValue=${this.chartData?.min} .maxValue=${this.chartData?.max} .sumValue=${this.chartData?.sum} .nullsValue=${this.chartData?.nulls} .countValue=${this.chartData?.count} .layerFieldsInfo=${this.layerFieldsInfo}></arcgis-charts-config-histogram-data>`;
         break;
       case s.Axes:
         e = t`<arcgis-charts-config-axes .model=${this.model} show-max-y-bound-option .calculatedMinMaxBounds=${this.calculatedMinMaxBounds}></arcgis-charts-config-axes>`;
         break;
       case s.Guides:
-        e = t`<arcgis-charts-config-guides .model=${this.model} enable-y-axis-guide @arcgisChartsConfigGuidePopoverChange=${this.popoverOpen}></arcgis-charts-config-guides>`;
+        e = t`<arcgis-charts-config-guides .model=${this.model} enable-y-axis-guide></arcgis-charts-config-guides>`;
         break;
       case s.Format:
-        e = t`<arcgis-charts-config-format .model=${this.model} @arcgisChartsConfigFormatPopoverChange=${this.popoverOpen}></arcgis-charts-config-format>`;
+        e = t`<arcgis-charts-config-format .model=${this.model}></arcgis-charts-config-format>`;
         break;
       case s.General:
         e = t`<arcgis-charts-config-general .model=${this.model}></arcgis-charts-config-general>`;
@@ -93,7 +90,7 @@ class f extends m {
     return e;
   }
 }
-n("arcgis-charts-config-histogram", f);
+n("arcgis-charts-config-histogram", p);
 export {
-  f as ArcgisChartsConfigHistogram
+  p as ArcgisChartsConfigHistogram
 };

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

@@ -1,12 +1,18 @@
-/// <reference types="../../index.d.ts" />
+/// <reference path="../../index.d.ts" />
 import { HistogramModel } from '../../model';
-import { IField } from '@arcgis/charts-spec';
-import { DataChangeErrorPayload, PopoverChangePayload, PopoverOpenChangePayload } from '../../utils/components/event-payloads';
+import { IField, ISimpleFillSymbol, OverlayTerms } from '@arcgis/charts-spec';
+import { DataChangeErrorPayload, PopoverChangePayload } from '../../utils/components/event-payloads';
 import { PropertyValues } from 'lit';
 import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
 
 /** @private */
 export declare class ArcgisChartsConfigHistogramData extends LitElement {
+    /**
+     * Type of overlay symbol selected.
+     *
+     * @category Public
+     */
+    selectedOverlaySymbolType?: OverlayTerms;
     /** Overwrite localized strings for this component */
     messageOverrides?: typeof this._messages._overrides;
     /**
@@ -82,11 +88,5 @@ export declare class ArcgisChartsConfigHistogramData extends LitElement {
      * @category Public
      */
     readonly arcgisChartsConfigHistogramDataPopoverChange: TargetedEvent<this, PopoverChangePayload>;
-    /**
-     * Event emitted when the popover is closed.
-     *
-     * @category Public
-     */
-    readonly arcgisChartsConfigPopoverOpenChange: TargetedEvent<this, PopoverOpenChangePayload>;
     private _messages;
 }