@arcgis/charts-components 4.33.0-next.98 → 4.34.0-next.0

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

@@ -23,12 +23,14 @@ export declare class ArcgisChartsConfigFormatPopover extends LitElement {
      * Place the popover in the give placement.
      *
      * @category Public
+     * @default "leading"
      */
     placement: HTMLCalcitePopoverElement["placement"];
     /**
      * boolean to open or close the popover.
      *
      * @category Public
+     * @default false
      */
     open?: boolean;
     /**
@@ -42,13 +44,13 @@ export declare class ArcgisChartsConfigFormatPopover extends LitElement {
      *
      * @category Public
      */
-    readonly arcgisChartsConfigFormatPopoverColorChange: TargetedEvent<this, undefined>;
+    readonly arcgisChartsConfigFormatPopoverColorChange: TargetedEvent<this, void>;
     /**
      * Event emitted when there is a change in symbol property.
      *
      * @category Public
      */
-    readonly arcgisChartsConfigFormatPopoverSymbolChange: TargetedEvent<this, undefined>;
+    readonly arcgisChartsConfigFormatPopoverSymbolChange: TargetedEvent<this, void>;
     /**
      * Event emitted when there is a change in text property.
      *
@@ -60,7 +62,6 @@ export declare class ArcgisChartsConfigFormatPopover extends LitElement {
      *
      * @category Public
      */
-    readonly arcgisChartsConfigPopoverClose: TargetedEvent<this, undefined>;
-    /** @category Private */
+    readonly arcgisChartsConfigPopoverClose: TargetedEvent<this, void>;
     private _messages;
 }

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

@@ -1,18 +1,28 @@
 import { c as i } from "../../chunks/runtime.js";
 import { html as o } from "lit-html";
-import { editPopover as a } from "@arcgis/charts-shared-utils";
 import { RESTSymbolType as r } from "@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 { e as a } from "../../chunks/popover-ui-utils.js";
 import { u as l } from "../../chunks/useT9n.js";
-import { createRef as n, ref as c } from "lit-html/directives/ref.js";
-import { LitElement as p, createEvent as s, safeClassMap as h } from "@arcgis/lumina";
-import { css as m } from "@lit/reactive-element/css-tag.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";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.98 */
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0-next.0 */
 const g = {
   jsAppFlyout: "js-app-flyout"
-}, C = m``;
-class f extends p {
+}, C = h``;
+class f extends c {
   constructor() {
     super(...arguments), this._messages = l(), this.popoverElement = n(), this.placement = "leading", this.arcgisChartsConfigFormatPopoverColorChange = s(), this.arcgisChartsConfigFormatPopoverSymbolChange = s(), this.arcgisChartsConfigFormatPopoverTextChange = s(), this.arcgisChartsConfigPopoverClose = s();
   }
@@ -22,46 +32,27 @@ class f extends p {
   static {
     this.styles = C;
   }
-  //#endregion
-  //#region Public Methods
-  /**
-   * Calls `reposition()` method on popover element.
-   *
-   * @category Public
-   */
   async reposition() {
     await this.popoverElement.value?.reposition();
   }
-  //#endregion
-  //#region Lifecycle
-  /** @category Lifecycle */
   updated() {
     a(this.popoverElement.value, this.open);
   }
-  //#endregion
-  //#region Private Methods
-  /** @category Private */
   closePopover() {
     this.open = !1, this.arcgisChartsConfigPopoverClose.emit();
   }
-  /** @category Event handler */
   updateSymbolProperties(e) {
     this.selectedElement = e.target.lineStyle, this.arcgisChartsConfigFormatPopoverSymbolChange.emit(e.detail);
   }
-  /** @category Event handler */
   updateTextProperties(e) {
     this.selectedElement = e.target.fontStyle, this.arcgisChartsConfigFormatPopoverTextChange.emit(e.detail);
   }
-  /** @category Event handler */
   updateColorProperties(e) {
     this.selectedElement = e.detail, this.arcgisChartsConfigFormatPopoverColorChange.emit(e.detail);
   }
-  //#endregion
-  //#region Rendering
-  /** @category Lifecycle */
   render() {
     const e = this.selectedElement, t = this.selectedElement;
-    return o`<div class=${h(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>`;
+    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>`;
   }
 }
 i("arcgis-charts-config-format-popover", f);

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

@@ -4,7 +4,7 @@ import { PropertyValues } from 'lit';
 import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
 
 /** @private */
-export declare class ArcGISChartsConfigGeneral extends LitElement {
+export declare class ArcgisChartsConfigGeneral extends LitElement {
     /** Overwrite localized strings for this component */
     messageOverrides?: typeof this._messages._overrides;
     /**
@@ -13,8 +13,11 @@ export declare class ArcGISChartsConfigGeneral extends LitElement {
      * @category Public
      */
     model: ChartModel;
-    /** When true, the content of the component will be displayed. */
+    /**
+     * When true, the content of the component will be displayed.
+     *
+     * @default false
+     */
     open: boolean;
-    /** @category Private */
     private _messages;
 }

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

@@ -1,19 +1,17 @@
 import { c as r } from "../../chunks/runtime.js";
-import "@arcgis/charts-shared-utils";
-import { WebChartLegendPositions as s } from "@arcgis/charts-spec";
-import "../../chunks/scatter-plot-model.js";
+import { o, g as n, h as c } from "../../chunks/type-guards.js";
+import { WebChartLegendPositions as l } from "@arcgis/charts-spec";
 import { isEmpty as m } from "lodash-es";
-import { c as o, d as n, b as c } from "../../chunks/type-guards.js";
-import { m as g, b as d } from "../../chunks/chart-ui-utils.js";
+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";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/4.33/esri/copyright.txt for details.
-v4.33.0-next.98 */
-const l = {
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0-next.0 */
+const s = {
   textInput: "text-input",
   label: "label",
   labelContainer: "label-container",
@@ -31,27 +29,18 @@ class C extends x {
   static {
     this.styles = $;
   }
-  //#endregion
-  //#region Lifecycle
-  /** @category Lifecycle */
   load() {
     this.modelChange(this.model);
   }
-  /** @category Lifecycle */
   willUpdate(e) {
     e.has("model") && this.modelChange(this.model, e.get("model"));
   }
-  /** @category Lifecycle */
   disconnectedCallback() {
     super.disconnectedCallback(), this.model.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
-  //#endregion
-  //#region Private Methods
-  /** @category Watch handler */
   modelChange(e, t) {
     t?.removeEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange), e?.addEventListener("arcgisChartsModelConfigChange", this.onModelConfigChange);
   }
-  /** @category Event handler */
   setChartTitle(e) {
     const { value: t } = e.target;
     this.isChartTitleInvalid = m(t.trim()), this.characterLimitInputElement.value && g({
@@ -59,80 +48,62 @@ class C extends x {
       status: this.isChartTitleInvalid ? d.INVALID : d.IDLE
     }), this.isChartTitleInvalid || this.model.setTitleText(t);
   }
-  /** @category Event handler */
   setChartLegendTitle(e) {
     const { value: t } = e.target;
     t !== void 0 && o(this.model) && this.model.setLegendTitleText(t);
   }
-  /** @category Event handler */
   setChartXAxisTitle(e) {
     const { value: t } = e.target;
     t !== void 0 && n(this.model) && this.model.setXAxisTitleText(t);
   }
-  /** @category Event handler */
   setChartYAxisTitle(e) {
     const { value: t } = e.target;
     t !== void 0 && c(this.model) && this.model.setYAxisTitleText(t);
   }
-  /** @category Event handler */
   setChartDescription(e) {
     const { value: t } = e.target;
     t !== void 0 && this.model.setDescriptionText(t);
   }
-  /** @category Event handler */
   enableChartTitle(e) {
     const t = e.target.checked;
     this.model.setChartTitleVisibility(t);
   }
-  /** @category Event handler */
   enableXAxisTitle(e) {
     const t = e.target.checked;
     n(this.model) && this.model.setXAxisTitleVisibility(t);
   }
-  /** @category Event handler */
   enableYAxisTitle(e) {
     const t = e.target.checked;
     c(this.model) && this.model.setYAxisTitleVisibility(t);
   }
-  /** @category Event handler */
   enableLegendTitle(e) {
     const t = e.target.checked;
     o(this.model) && this.model.setLegendTitleVisibility(t);
   }
-  /** @category Event handler */
   enableDescription(e) {
     const t = e.target.checked;
     this.model.setDescriptionVisibility(t);
   }
-  /** @category Event handler */
   legendPositionChange(e) {
     const h = e.target?.selectedItems[0]?.value;
     o(this.model) && this.model.setLegendPosition(h);
   }
-  //#endregion
-  //#region Rendering
-  /**
-   * Renders the options for a dropdown list of legend positions
-   *
-   * @category Render UX
-   */
   renderLegendPositions() {
     return o(this.model) ? [
-      a`<calcite-combobox-item .value=${s.Right} .textLabel=${this._messages.legendRightPosition} .selected=${this.model.getLegendPosition() === s.Right} icon=right-edge></calcite-combobox-item>`,
-      a`<calcite-combobox-item .value=${s.Left} .textLabel=${this._messages.legendLeftPosition} .selected=${this.model.getLegendPosition() === s.Left} icon=left-edge></calcite-combobox-item>`,
-      a`<calcite-combobox-item .value=${s.Top} .textLabel=${this._messages.legendTopPosition} .selected=${this.model.getLegendPosition() === s.Top} icon=upload-to></calcite-combobox-item>`,
-      a`<calcite-combobox-item .value=${s.Bottom} .textLabel=${this._messages.legendBottomPosition} .selected=${this.model.getLegendPosition() === s.Bottom} icon=download-to></calcite-combobox-item>`
+      a`<calcite-combobox-item .value=${l.Right} .textLabel=${this._messages.legendRightPosition} .selected=${this.model.getLegendPosition() === l.Right} icon=right-edge></calcite-combobox-item>`,
+      a`<calcite-combobox-item .value=${l.Left} .textLabel=${this._messages.legendLeftPosition} .selected=${this.model.getLegendPosition() === l.Left} icon=left-edge></calcite-combobox-item>`,
+      a`<calcite-combobox-item .value=${l.Top} .textLabel=${this._messages.legendTopPosition} .selected=${this.model.getLegendPosition() === l.Top} icon=upload-to></calcite-combobox-item>`,
+      a`<calcite-combobox-item .value=${l.Bottom} .textLabel=${this._messages.legendBottomPosition} .selected=${this.model.getLegendPosition() === l.Bottom} icon=download-to></calcite-combobox-item>`
     ] : [];
   }
-  /** @category Lifecycle */
   render() {
-    return a`<div class=${i(l.labelContainer)}><calcite-label layout=inline-space-between class=${i(l.label)}>${this._messages.chartTitle}<calcite-switch .checked=${this.model.getChartTitleVisibility()} @calciteSwitchChange=${this.enableChartTitle}></calcite-switch></calcite-label><calcite-input class=${i(l.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) ? [
-      a`<div class=${i(l.labelContainer)}><calcite-label layout=inline-space-between class=${i(l.label)}>${this._messages.xAxisTitle}<calcite-switch .checked=${this.model.getXAxisTitleVisibility()} @calciteSwitchChange=${this.enableXAxisTitle}></calcite-switch></calcite-label><calcite-input class=${i(l.textInput)} type=text .disabled=${!this.model.getXAxisTitleVisibility()} .value=${this.model.getXAxisTitleText()} @calciteInputInput=${this.setChartXAxisTitle}></calcite-input></div>`,
-      c(this.model) ? a`<div class=${i(l.labelContainer)}><calcite-label layout=inline-space-between class=${i(l.label)}>${this._messages.yAxisTitle}<calcite-switch .checked=${this.model.getYAxisTitleVisibility()} @calciteSwitchChange=${this.enableYAxisTitle}></calcite-switch></calcite-label><calcite-input class=${i(l.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(l.labelContainer)}><calcite-label layout=inline-space-between class=${i(l.label)}>${this._messages.legendTitle}<calcite-switch .checked=${this.model.getLegendTitleVisibility()} @calciteSwitchChange=${this.enableLegendTitle}></calcite-switch></calcite-label><calcite-input class=${i(l.textInput)} type=text .disabled=${!this.model.getLegendTitleVisibility()} .value=${this.model.getLegendTitleText()} @calciteInputInput=${this.setChartLegendTitle}></calcite-input></div>` : null}<div class=${i(l.labelContainer)}><calcite-label layout=inline-space-between class=${i(l.label)}>${this._messages.legendPosition}</calcite-label><calcite-combobox clear-disabled label class=${i(l.select)} @calciteComboboxChange=${this.legendPositionChange} selection-mode=single>${this.renderLegendPositions()}</calcite-combobox></div><div class=${i(l.labelContainer)}><calcite-label layout=inline-space-between class=${i(l.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>`;
+    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) ? [
+      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>`;
   }
 }
 r("arcgis-charts-config-general", C);
 export {
-  C as ArcGISChartsConfigGeneral
+  C as ArcgisChartsConfigGeneral
 };

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

@@ -1,11 +1,12 @@
 /// <reference types="../../index.d.ts" />
-import { ModelWithGuides, GuideOrientation } from '../../model';
+import { ModelWithGuides } from '../../model/mixins';
 import { CalculatedMinMaxBoundsPayload } from '@arcgis/charts-spec';
 import { default as MapView } from '@arcgis/core/views/MapView';
-import { PopoverChangePayload, PopoverOpenChangePayload } from '../../utils/event-payloads';
+import { PopoverChangePayload, PopoverOpenChangePayload } from '../../utils/components/event-payloads';
 import { GuideChangePayload } from './resource';
 import { PropertyValues } from 'lit';
 import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { GuideOrientation } from '../../model';
 
 /** @private */
 export declare class ArcgisChartsConfigGuide extends LitElement {
@@ -47,6 +48,7 @@ export declare class ArcgisChartsConfigGuide extends LitElement {
      * List position of the latest guide to be opened.
      *
      * @category Private
+     * @default 0
      */
     latestGuidePosition: number;
     /**
@@ -67,6 +69,5 @@ export declare class ArcgisChartsConfigGuide extends LitElement {
      * @category Public
      */
     readonly arcgisChartsConfigPopoverOpenChange: TargetedEvent<this, PopoverOpenChangePayload>;
-    /** @category Private */
     private _messages;
 }