@arcgis/map-components 4.34.0-next.127 → 4.34.0-next.129

package/dist/components/arcgis-feature-media/customElement.js

@@ -15,7 +15,7 @@ import { renderingSanitizer as X } from "@arcgis/core/applications/Components/sa
 import { i as $, s as N, f as E, b as Y, c as ae, a as U, d as re, e as ne, h as se, j as oe } from "../../chunks/feature-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.127 */
+v4.34.0-next.129 */
 const le = W`.arcgis-feature-media__container{display:flex;flex-flow:row wrap;align-items:center;margin-top:var(--calcite-spacing-xs);width:100%;min-height:150px}.arcgis-feature-media__container .arcgis-feature-media__pagination-button{display:flex;align-items:center;justify-content:center;border:none;background:transparent;cursor:pointer;padding-block:var(--calcite-spacing-xs);padding-inline:var(--calcite-spacing-xs);color:var(--calcite-color-text-3)}.arcgis-feature-media__container .arcgis-feature-media__pagination-button:hover,.arcgis-feature-media__container .arcgis-feature-media__pagination-button:focus{background-color:var(--calcite-color-foreground-3);color:var(--calcite-color-text-1);fill:var(--calcite-color-text-1)}.arcgis-feature-media__item-title{margin:0;font-size:var(--calcite-font-size-md);line-height:var(--calcite-font-line-height-relative-snug)}.arcgis-feature-media__item-caption{padding-block-start:var(--calcite-spacing-xxs)}.arcgis-feature-media__item{display:flex;align-items:flex-start;justify-content:center;margin-block:var(--calcite-spacing-xs);width:100%;height:auto}.arcgis-feature-media__item-navigation{display:flex;flex:0 1 100%;align-items:flex-start;justify-content:space-between;margin-block-end:var(--calcite-spacing-xs)}.arcgis-feature-media__item-text{margin-inline-end:var(--calcite-spacing-xs)}.arcgis-feature-media__pagination{display:flex;flex:0 0 auto;align-items:center;overflow:hidden}.arcgis-feature-media__pagination:only-child{margin-inline-start:auto}.arcgis-feature-media__pagination-text{padding-inline:var(--calcite-spacing-xxs);color:var(--calcite-color-text-3);font-size:var(--calcite-font-size-sm);line-height:var(--calcite-font-line-height-relative-normal)}.arcgis-feature-media__item-container{flex:0 1 auto;width:100%}.arcgis-feature-media__item-container img{max-width:100%}.arcgis-feature-media__item-container img[src$=".SVG"],.arcgis-feature-media__item-container img[src$=".svg"]{width:100%}.arcgis-feature-media__chart{width:100%;height:155px}`;
 function V(R) {
   if (!$(R))
@@ -38,7 +38,7 @@ const I = "arcgis-feature-media", v = {
   mediaPaginationButton: `${I}__pagination-button`,
   mediaPaginationIcon: `${I}__pagination-icon`,
   mediaChartRendered: `${I}__chart--rendered`
-}, z = 15, w = "category", T = "value", ce = "rgba(50, 50, 50, 1)", de = 250, me = 500, ue = 200;
+}, z = 15, w = "category", T = "value", ce = "rgba(50, 50, 50, 1)", de = 250, ue = 500, me = 200;
 class he extends Q {
   constructor() {
     super(...arguments), this._prefersReducedMotion = K("(prefers-reduced-motion)"), this.activeMediaInfoIndex = 0, this.chartAnimationDisabled = !1, this.isAggregate = !1, this.headingLevel = 2;
@@ -150,16 +150,16 @@ class he extends Q {
     }
   }
   _setChartValue(e) {
-    const { value: t, values: i, formattedValues: a, chartType: r, layer: s } = e, { popupTemplate: n, relatedInfos: o } = this, { fields: d, normalizeField: p } = t, u = s;
-    if (t.fields = ae(d, u), p && (t.normalizeField = U(p, u)), !d.some((c) => !!(a[c] != null || $(c) && o?.size)))
+    const { value: t, values: i, formattedValues: a, chartType: r, layer: s } = e, { popupTemplate: n, relatedInfos: o } = this, { fields: d, normalizeField: p } = t, m = s;
+    if (t.fields = ae(d, m), p && (t.normalizeField = U(p, m)), !d.some((c) => !!(a[c] != null || $(c) && o?.size)))
       return;
-    const m = n?.fieldInfos ?? [];
+    const u = n?.fieldInfos ?? [];
     t.series = [], d.forEach((c, h) => {
       const f = t.colors?.[h];
       if ($(c)) {
         t.series = [
           ...t.series,
-          ...this._getRelatedChartInfos({ fieldInfos: m, fieldName: c, formattedValues: a, chartType: r, value: t, color: f })
+          ...this._getRelatedChartInfos({ fieldInfos: u, fieldName: c, formattedValues: a, chartType: r, value: t, color: f })
         ];
         return;
       }
@@ -169,7 +169,7 @@ class he extends Q {
         chartType: r,
         formattedValues: a,
         fieldName: c,
-        fieldInfos: m,
+        fieldInfos: u,
         color: f
       });
       t.series.push(g);
@@ -179,11 +179,11 @@ class he extends Q {
     const { fieldInfos: t, fieldName: i, formattedValues: a, chartType: r, value: s, color: n } = e, o = [], d = V(i), p = d && this.relatedInfos?.get(d.layerId);
     if (!p)
       return o;
-    const { relatedFeatures: u, relation: l } = p;
-    if (!l || !u)
+    const { relatedFeatures: m, relation: l } = p;
+    if (!l || !m)
       return o;
-    const { cardinality: m } = l;
-    return u.forEach((h) => {
+    const { cardinality: u } = l;
+    return m.forEach((h) => {
       const f = h.attributes;
       f && Object.keys(f).forEach((g) => {
         g === d.fieldName && o.push(this._getChartOption({
@@ -193,18 +193,18 @@ class he extends Q {
           fieldName: i,
           chartType: r,
           relatedFieldName: g,
-          hasMultipleRelatedFeatures: u?.length > 1,
+          hasMultipleRelatedFeatures: m?.length > 1,
           fieldInfos: t,
           color: n
         }));
       });
-    }), m && (m === "one-to-many" || m === "many-to-many") ? o : [o[0]];
+    }), u && (u === "one-to-many" || u === "many-to-many") ? o : [o[0]];
   }
   _getTooltip({ label: e, value: t, chartType: i }) {
     return i === "pie-chart" ? `${e}` : `${e}: ${t}`;
   }
   _getChartOption(e) {
-    const { value: t, values: i, formattedValues: a, fieldName: r, relatedFieldName: s, fieldInfos: n, chartType: o, hasMultipleRelatedFeatures: d, color: p } = e, u = this.layer, l = this.fieldInfoMap ?? /* @__PURE__ */ new Map(), { normalizeField: m, tooltipField: c } = t, h = m ? $(m) ? i[V(m).fieldName] : i[m] : null, f = re(r) && a?.[r] !== void 0 ? a[r] : s && i[s] !== void 0 ? i[s] : i[r] !== void 0 ? i[r] : a[r], g = f === void 0 ? null : f && h && typeof f == "number" && typeof h == "number" ? f / h : f, x = ne(n, r), _ = U(r, u), M = (c && a[c] !== void 0 ? a[c] : se(x || new te({ fieldName: _ }), this.popupTemplate?.expressionInfos)) ?? "", F = a[_] ?? "", b = typeof g == "number" ? g : Number(g);
+    const { value: t, values: i, formattedValues: a, fieldName: r, relatedFieldName: s, fieldInfos: n, chartType: o, hasMultipleRelatedFeatures: d, color: p } = e, m = this.layer, l = this.fieldInfoMap ?? /* @__PURE__ */ new Map(), { normalizeField: u, tooltipField: c } = t, h = u ? $(u) ? i[V(u).fieldName] : i[u] : null, f = re(r) && a?.[r] !== void 0 ? a[r] : s && i[s] !== void 0 ? i[s] : i[r] !== void 0 ? i[r] : a[r], g = f === void 0 ? null : f && h && typeof f == "number" && typeof h == "number" ? f / h : f, x = ne(n, r), _ = U(r, m), M = (c && a[c] !== void 0 ? a[c] : se(x || new te({ fieldName: _ }), this.popupTemplate?.expressionInfos)) ?? "", F = a[_] ?? "", b = g != null ? typeof g == "number" ? g : Number(g) : null;
     if ($(r)) {
       const k = l.get(r.toLowerCase()), D = c ? l.get(c.toLowerCase()) : null, B = k?.fieldName ?? r, L = d && c ? V(c).fieldName : D?.fieldName ?? c, H = (d && L ? i[L] : a[L] ?? k?.label ?? k?.fieldName ?? s) ?? "", O = (d && s ? i[s] : a[B]) ?? "";
       return new P({
@@ -270,7 +270,7 @@ class he extends Q {
     return this._canAnimateChart() ? de : 0;
   }
   _getChartSeriesAnimationMS() {
-    return this._canAnimateChart() ? me : 0;
+    return this._canAnimateChart() ? ue : 0;
   }
   _getDirection() {
     return S(this.el) ? "rtl" : "ltr";
@@ -284,14 +284,14 @@ class he extends Q {
     }), e.label.setAll({
       direction: this._getDirection(),
       oversizedBehavior: "wrap",
-      maxWidth: ue
+      maxWidth: me
     });
   }
   async _createPieChart(e, t) {
     const [{ Tooltip: i }, { PieChart: a, PieSeries: r }] = await Promise.all([
       import("@amcharts/amcharts5/index.js"),
       import("@amcharts/amcharts5/percent.js")
-    ]), { mediaInfo: s, root: n } = e, { title: o } = s, d = 5, p = s?.altText || s?.title || "", u = n.container.children.push(a.new(n, {
+    ]), { mediaInfo: s, root: n } = e, { title: o } = s, d = 5, p = s?.altText || s?.title || "", m = n.container.children.push(a.new(n, {
       role: "figure",
       ariaLabel: p,
       focusable: !0,
@@ -300,28 +300,28 @@ class he extends Q {
       paddingLeft: d,
       paddingRight: d
     })), l = `{category}: {valuePercentTotal.formatNumber('0.00')}%
- ({value})`, m = i.new(n, {
+ ({value})`, u = i.new(n, {
       labelText: l
-    }), c = u.series.push(r.new(n, {
+    }), c = m.series.push(r.new(n, {
       name: o,
       valueField: T,
       categoryField: w,
-      tooltip: m
+      tooltip: u
     }));
     c.ticks.template.set("forceHidden", !0), c.labels.template.set("forceHidden", !0), c.slices.template.states.create("active", {
       shiftRadius: d
-    }), this._customizeChartTooltip(m), c.slices.template.setAll({
+    }), this._customizeChartTooltip(u), c.slices.template.setAll({
       ariaLabel: l,
       focusable: !0,
       templateField: "columnSettings"
-    }), c.data.setAll(t), c.appear(this._getChartSeriesAnimationMS()), u.appear(this._getChartAnimationMS()), u.root.dom.classList.toggle(v.mediaChartRendered, !0);
+    }), c.data.setAll(t), c.appear(this._getChartSeriesAnimationMS()), m.appear(this._getChartAnimationMS()), m.root.dom.classList.toggle(v.mediaChartRendered, !0);
   }
   _getMinSeriesValue(e) {
     let t = 0;
     return e.forEach((i) => t = Math.min(i.value, t)), t;
   }
   async _createColumnChart(e, t, i) {
-    const [{ Tooltip: a, Scrollbar: r }, { CategoryAxis: s, AxisRendererX: n, AxisRendererY: o, ValueAxis: d, ColumnSeries: p }] = await Promise.all([import("@amcharts/amcharts5/index.js"), import("@amcharts/amcharts5/xy.js")]), { mediaInfo: u, root: l } = t, { value: m, title: c } = u;
+    const [{ Tooltip: a, Scrollbar: r }, { CategoryAxis: s, AxisRendererX: n, AxisRendererY: o, ValueAxis: d, ColumnSeries: p }] = await Promise.all([import("@amcharts/amcharts5/index.js"), import("@amcharts/amcharts5/xy.js")]), { mediaInfo: m, root: l } = t, { value: u, title: c } = m;
     e.setAll({
       wheelX: "panX",
       wheelY: "zoomX"
@@ -337,7 +337,7 @@ class he extends Q {
     });
     const f = e.yAxes.push(d.new(l, {
       renderer: o.new(l, { inside: !1 }),
-      min: this._getMinSeriesValue(m.series)
+      min: this._getMinSeriesValue(u.series)
     }));
     f.get("renderer").labels.template.setAll({
       direction: this._getDirection()
@@ -356,12 +356,12 @@ class he extends Q {
       ariaLabel: g,
       focusable: !0,
       templateField: "columnSettings"
-    }), m.series.length > z && e.set("scrollbarX", r.new(l, {
+    }), u.series.length > z && e.set("scrollbarX", r.new(l, {
       orientation: "horizontal"
     })), h.data.setAll(i), _.data.setAll(i), _.appear(this._getChartSeriesAnimationMS()), e.appear(this._getChartAnimationMS());
   }
   async _createBarChart(e, t, i) {
-    const [{ Tooltip: a, Scrollbar: r }, { CategoryAxis: s, AxisRendererX: n, AxisRendererY: o, ValueAxis: d, ColumnSeries: p }] = await Promise.all([import("@amcharts/amcharts5/index.js"), import("@amcharts/amcharts5/xy.js")]), { mediaInfo: u, root: l } = t, { value: m, title: c } = u;
+    const [{ Tooltip: a, Scrollbar: r }, { CategoryAxis: s, AxisRendererX: n, AxisRendererY: o, ValueAxis: d, ColumnSeries: p }] = await Promise.all([import("@amcharts/amcharts5/index.js"), import("@amcharts/amcharts5/xy.js")]), { mediaInfo: m, root: l } = t, { value: u, title: c } = m;
     e.setAll({
       wheelX: "panY",
       wheelY: "zoomY"
@@ -380,7 +380,7 @@ class he extends Q {
         inside: !1,
         inversed: S(this.el)
       }),
-      min: this._getMinSeriesValue(m.series)
+      min: this._getMinSeriesValue(u.series)
     }));
     f.get("renderer").labels.template.setAll({
       direction: this._getDirection()
@@ -399,18 +399,18 @@ class he extends Q {
       ariaLabel: g,
       focusable: !0,
       templateField: "columnSettings"
-    }), m.series.length > z && e.set("scrollbarY", r.new(l, {
+    }), u.series.length > z && e.set("scrollbarY", r.new(l, {
       orientation: "vertical"
     })), h.data.setAll(i), _.data.setAll(i), _.appear(this._getChartSeriesAnimationMS()), e.appear(this._getChartAnimationMS());
   }
   async _createLineChart(e, t, i) {
-    const [{ Tooltip: a, Scrollbar: r }, { CategoryAxis: s, AxisRendererX: n, AxisRendererY: o, ValueAxis: d, LineSeries: p }] = await Promise.all([import("@amcharts/amcharts5/index.js"), import("@amcharts/amcharts5/xy.js")]), { root: u, mediaInfo: l } = t, { value: m, title: c } = l;
+    const [{ Tooltip: a, Scrollbar: r }, { CategoryAxis: s, AxisRendererX: n, AxisRendererY: o, ValueAxis: d, LineSeries: p }] = await Promise.all([import("@amcharts/amcharts5/index.js"), import("@amcharts/amcharts5/xy.js")]), { root: m, mediaInfo: l } = t, { value: u, title: c } = l;
     e.setAll({
       wheelX: "panX",
       wheelY: "zoomX"
     });
-    const h = e.xAxes.push(s.new(u, {
-      renderer: n.new(u, {
+    const h = e.xAxes.push(s.new(m, {
+      renderer: n.new(m, {
         inversed: S(this.el)
       }),
       categoryField: w
@@ -418,21 +418,21 @@ class he extends Q {
     h.get("renderer").labels.template.setAll({
       forceHidden: !0
     });
-    const f = e.yAxes.push(d.new(u, {
-      renderer: o.new(u, { inside: !1 }),
-      min: this._getMinSeriesValue(m.series)
+    const f = e.yAxes.push(d.new(m, {
+      renderer: o.new(m, { inside: !1 }),
+      min: this._getMinSeriesValue(u.series)
     }));
     f.get("renderer").labels.template.setAll({
       direction: this._getDirection()
     });
-    const g = "{categoryX}", x = i[0]?.lineSettings?.stroke, _ = a.new(u, {
+    const g = "{categoryX}", x = i[0]?.lineSettings?.stroke, _ = a.new(m, {
       getFillFromSprite: !x,
       labelText: g
     });
     x && _.get("background")?.setAll({
       fill: x
     });
-    const M = e.series.push(p.new(u, {
+    const M = e.series.push(p.new(m, {
       name: c,
       xAxis: h,
       yAxis: f,
@@ -442,7 +442,7 @@ class he extends Q {
     }));
     M.strokes.template.setAll({
       templateField: "lineSettings"
-    }), this._customizeChartTooltip(_, "vertical"), m.series.length > z && e.set("scrollbarX", r.new(u, {
+    }), this._customizeChartTooltip(_, "vertical"), u.series.length > z && e.set("scrollbarX", r.new(m, {
       orientation: "horizontal"
     })), h.data.setAll(i), M.data.setAll(i), M.appear(this._getChartSeriesAnimationMS()), e.appear(this._getChartAnimationMS());
   }
@@ -507,8 +507,8 @@ class he extends Q {
   _renderImageMediaInfo(e) {
     if (!e.value)
       return null;
-    const { _refreshIntervalInfo: t } = this, { value: i, refreshInterval: a, altText: r, title: s } = e, { sourceURL: n, linkURL: o } = i, p = oe(o ?? void 0) ? "_blank" : "_self", u = p === "_blank" ? "noreferrer" : "", l = a ? t : null, m = l ? l.sourceURL : n, c = y`<img alt=${(r || s) ?? A} src=${m ?? void 0 ?? A}>`;
-    return (o ? y`<a href=${o ?? A} rel=${u ?? A} target=${p ?? A} title=${s ?? A}>${c}</a>` : null) ?? c;
+    const { _refreshIntervalInfo: t } = this, { value: i, refreshInterval: a, altText: r, title: s } = e, { sourceURL: n, linkURL: o } = i, p = oe(o ?? void 0) ? "_blank" : "_self", m = p === "_blank" ? "noreferrer" : "", l = a ? t : null, u = l ? l.sourceURL : n, c = y`<img alt=${(r || s) ?? A} src=${u ?? void 0 ?? A}>`;
+    return (o ? y`<a href=${o ?? A} rel=${m ?? A} target=${p ?? A} title=${s ?? A}>${c}</a>` : null) ?? c;
   }
   _renderChartMediaInfo(e) {
     const { activeMediaInfoIndex: t, formattedMediaInfoCount: i } = this;
@@ -529,16 +529,16 @@ class he extends Q {
     return y`<button .ariaLabel=${i} class=${C(v.mediaPaginationButton)} @click=${r} tabindex=0 title=${i ?? A} type=button><calcite-icon flip-rtl class=${C(v.mediaPaginationIcon)} .icon=${a} scale=s></calcite-icon></button>`;
   }
   async _renderChart(e) {
-    const { root: t, mediaInfo: i } = e, { value: a, type: r } = i, [{ default: s }, { default: n }, { default: o }, { esriChartColorSet: d }, { ColorSet: p, Theme: u }] = await Promise.all([
+    const { root: t, mediaInfo: i } = e, { value: a, type: r } = i, [{ default: s }, { default: n }, { default: o }, { esriChartColorSet: d }, { ColorSet: p, Theme: m }] = await Promise.all([
       import("@amcharts/amcharts5/themes/Animated.js"),
       import("@amcharts/amcharts5/themes/Dark.js"),
       import("@amcharts/amcharts5/themes/Responsive.js"),
       import("../../chunks/chartCommon.js"),
       import("@amcharts/amcharts5/index.js")
-    ]), l = u.new(t);
+    ]), l = m.new(t);
     l.rule("ColorSet").set("colors", d), l.rule("ColorSet").set("reuse", !0);
-    const m = [o.new(t), l];
-    ie(this.el) === "dark" && m.push(n.new(t)), this._canAnimateChart() && m.push(s.new(t)), t.setThemes(m);
+    const u = [o.new(t), l];
+    ie(this.el) === "dark" && u.push(n.new(t)), this._canAnimateChart() && u.push(s.new(t)), t.setThemes(u);
     const c = await this._getRendererColors(), h = await this._getSeriesColors(a.series), f = p.new(t, {}), g = h.get(a.series[0]), x = g ? {
       lineSettings: {
         stroke: g

package/dist/components/arcgis-feature-relationship/customElement.d.ts

@@ -29,25 +29,13 @@ type RelatableFeatureSupportedLayer = {
 
 /** @private */
 export declare class ArcgisFeatureRelationship extends LitElement {
-    /**
-     * If true, the component will not be destroyed automatically when it is
-     * disconnected from the document. This is useful when you want to move the
-     * component to a different place on the page, or temporarily hide it. If this
-     * is set, make sure to call the [destroy](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-feature-relationship/#destroy) method when you are done to
-     * prevent memory leaks.
-     *
-     * @default false
-     */
     autoDestroyDisabled: boolean;
     get allItemsDescription(): string;
     get featurePage(): number;
     set featurePage(value: number);
-    /** @default 10 */
     featuresPerPage: number;
     flowItems?: __esri.Collection<FlowItemComponent>;
-    /** @default "feature-relationship" */
     flowType: FlowItemType;
-    /** @default 2 */
     headingLevel: HeadingLevel;
     messages?: ArcgisFeature["messages"];
     get heading(): string | undefined;
@@ -55,17 +43,7 @@ export declare class ArcgisFeatureRelationship extends LitElement {
     description?: string;
     values?: HashMap<number | string>;
     activeCategory?: FeatureRelationshipCategory;
-    /**
-     * This property provides the ability to turn individual elements of the component's display on/off.
-     *
-     * @default false
-     */
     hideHeading: boolean;
-    /**
-     * This property provides the ability to turn individual elements of the component's display on/off.
-     *
-     * @default false
-     */
     hideDescription: boolean;
     get displayCount(): number;
     set displayCount(value: number);
@@ -77,11 +55,8 @@ export declare class ArcgisFeatureRelationship extends LitElement {
     timeZone?: string;
     orderByFields?: __esri.RelatedRecordsInfoFieldOrder[];
     relationshipId?: number;
-    /** @default false */
     showAllEnabled: boolean;
-    /** The component's default label. */
     label?: string;
-    /** Permanently destroy the component. */
     destroy(): Promise<void>;
 }
 export {};

package/dist/components/arcgis-feature-relationship/customElement.js

@@ -16,7 +16,7 @@ import { classes as j } from "@arcgis/toolkit/dom";
 import { createRef as Y, ref as ee } from "lit/directives/ref.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.127 */
+v4.34.0-next.129 */
 const te = K`:host{position:relative;flex:1 1 auto}.arcgis-feature-relationship__list{min-height:var(--calcite-spacing-xxxl)}.arcgis-feature-relationship__list-item--hidden{display:none}.arcgis-feature-relationship__feature-observer{position:relative;bottom:var(--calcite-spacing-xxl);z-index:2;text-align:center}.arcgis-feature-relationship__sticky-loading-container{display:flex;position:sticky;bottom:var(--calcite-spacing-sm);align-items:center;justify-content:center;z-index:2;margin:0;padding:0;height:var(--calcite-spacing-xxxl);pointer-events:none}`, re = (m) => {
   const e = [];
   if (m.formTemplate) {