@arcgis/map-components 5.0.0-next.135 → 5.0.0-next.137

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

@@ -0,0 +1,145 @@
+import { c as l } from "../../chunks/runtime.js";
+import s from "@arcgis/core/Graphic.js";
+import { html as o } from "lit";
+import { createRef as m, ref as g } from "lit-html/directives/ref.js";
+import { LitElement as u, safeStyleMap as c } from "@arcgis/lumina";
+import p from "@arcgis/core/symbols/SimpleFillSymbol.js";
+import y from "@arcgis/core/symbols/SimpleLineSymbol.js";
+import d from "@arcgis/core/symbols/SimpleMarkerSymbol.js";
+import * as n from "@arcgis/toolkit/log";
+import { previewGraphic as i } from "@arcgis/core/applications/Components/symbolUtils.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/5.0/esri/copyright.txt for details.
+v5.0.0-next.137 */
+const f = new p(), I = new y(), _ = new d();
+function b(a) {
+  if (!a)
+    return null;
+  switch (a.geometryType) {
+    case "multipoint":
+    case "point":
+      return _;
+    case "polygon":
+      return f;
+    case "polyline":
+      return I;
+    default:
+      return null;
+  }
+}
+class S extends u {
+  constructor() {
+    super(...arguments), this._lastRun = 0, this._attempted = !1, this._isCurrentlyInView = !1, this._io = null, this._imageContainerDiv = m(), this._generatedImageData = null, this.useTrueShape = !1, this.widthInPixels = 16, this.heightInPixels = 16;
+  }
+  static {
+    this.properties = { _generatedImageData: 16, graphic: 0, layer: 0, tableSymbolIcon: 0, minWidth: 9, useTrueShape: 5, actualSymbol: 0, widthInPixels: 9, heightInPixels: 9 };
+  }
+  get rootLayer() {
+    return this.layer?.type === "subtype-sublayer" ? this.layer.parent : this.layer;
+  }
+  loaded() {
+    this.manager.onLifecycle(() => (this._addIntersectionObserver(), () => {
+      this._removeIntersectionObserver();
+    }));
+  }
+  willUpdate(e) {
+    e.has("graphic") && (this.hasUpdated || this.graphic !== null) && this._changeGraphic();
+  }
+  updated() {
+    !this._attempted && this._isCurrentlyInView && (this._attempted = !0, this._handleImage().catch((e) => {
+      n.log("warn", this, "Failed processing image");
+    }));
+  }
+  _changeGraphic() {
+    this._changeData();
+  }
+  _changeData() {
+    this._generatedImageData = null, this._attempted = !1;
+  }
+  async _generateImage() {
+    return this.actualSymbol && this.graphic?.geometry && this.useTrueShape && !this.layer ? await i(new s({
+      attributes: this.graphic.attributes,
+      geometry: this.graphic.geometry
+    }), {
+      format: "string",
+      widthInPixels: this.widthInPixels,
+      heightInPixels: this.heightInPixels,
+      useGeometryForShape: this.useTrueShape,
+      fallbackSymbol: this.actualSymbol
+    }) : this.actualSymbol ? await i(null, {
+      format: "string",
+      widthInPixels: this.widthInPixels,
+      heightInPixels: this.heightInPixels,
+      useGeometryForShape: !1,
+      fallbackSymbol: this.actualSymbol
+    }) : this.layer && this.graphic ? this.rootLayer.isTable ? this.tableSymbolIcon ? await i(null, {
+      format: "string",
+      widthInPixels: this.widthInPixels,
+      heightInPixels: this.heightInPixels,
+      useGeometryForShape: !1,
+      fallbackSymbol: this.tableSymbolIcon
+    }) : "" : this.useTrueShape ? this.graphic.geometry ? await this._generatePreviewGraphic() : "" : await this._generatePreviewGraphic() : "";
+  }
+  async _generatePreviewGraphic() {
+    return await i(new s({
+      attributes: this.graphic.attributes,
+      geometry: this.graphic.geometry,
+      layer: this.layer
+    }), {
+      format: "string",
+      widthInPixels: this.widthInPixels,
+      heightInPixels: this.heightInPixels,
+      useGeometryForShape: this.useTrueShape,
+      fallbackSymbol: b(this.layer)
+    });
+  }
+  async _handleImage() {
+    const e = ++this._lastRun;
+    if (!this._generatedImageData || this._generatedImageData === "")
+      try {
+        const t = await this._generateImage();
+        if (this._lastRun !== e || this._generatedImageData === t)
+          return;
+        this._generatedImageData = t;
+      } finally {
+        this._attempted = !0;
+      }
+  }
+  _addIntersectionObserver() {
+    const e = {
+      // If the image gets within 50px in the Y axis, start the download.
+      rootMargin: "50px 0px",
+      threshold: 0.01
+    };
+    this._imageContainerDiv.value && requestAnimationFrame(() => {
+      this.isConnected && (this._io = new IntersectionObserver((t) => {
+        let r = !1;
+        t.forEach((h) => {
+          h.intersectionRatio > 0 && !r ? (r = !0, this._isCurrentlyInView = !0, this._handleImage().catch((w) => {
+            n.log("warn", this, "Failed processing image");
+          })) : this._isCurrentlyInView = !1;
+        });
+      }, e), this._io?.observe(this._imageContainerDiv.value));
+    });
+  }
+  _removeIntersectionObserver() {
+    this._io?.disconnect(), this._io = null;
+  }
+  _generateInnerHTML() {
+    return this._generatedImageData ? this._generatedImageData.startsWith("<") ? this._generatedImageData : `
+            <img
+                alt=''
+                src=${this._generatedImageData}
+                style="width: 100%;" >
+            </img>
+            ` : "";
+  }
+  render() {
+    const e = this._generateInnerHTML();
+    return o`<div style=${c(this.minWidth ? { "min-width": `${this.minWidth.toString()}px` } : {})} .innerHTML=${e ?? ""} ${g(this._imageContainerDiv)}></div>`;
+  }
+}
+l("arcgis-feature-image", S);
+export {
+  S as ArcgisFeatureImage
+};

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

@@ -1,4 +1,4 @@
-import { c as W } from "../../chunks/runtime.js";
+import { c as j } from "../../chunks/runtime.js";
 import { css as G, html as y } from "lit";
 import { ref as q } from "lit/directives/ref.js";
 import { keyed as K } from "lit/directives/keyed.js";
@@ -11,10 +11,10 @@ import ae from "@arcgis/core/popup/FieldInfo.js";
 import P from "@arcgis/core/popup/content/support/ChartMediaInfoValueSeries.js";
 import { unsafeGetCalciteModeName as re } from "@arcgis/toolkit/dom";
 import { renderingSanitizer as X } from "@arcgis/core/applications/Components/sanitizerUtils.js";
-import { f as $, e as L, j as E, k as Y, l as ne, h as U, i as se, m as oe, n as B, s as le } from "../../chunks/feature-utils.js";
+import { d as $, s as L, l as E, m as Y, n as ne, o as U, i as se, p as oe, h as B, f as le } from "../../chunks/feature-utils.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.135 */
+v5.0.0-next.137 */
 const ce = G`.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);font-size:var(--calcite-font-size-sm);line-height:var(--calcite-font-line-height-relative-snug)}.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 N(F) {
   if (!$(F))
@@ -210,12 +210,12 @@ class fe extends ee {
       layer: d
     })) ?? "", S = a[g] ?? "", z = I != null ? typeof I == "number" ? I : Number(I) : null;
     if ($(r)) {
-      const R = m.get(r.toLowerCase()), H = h ? m.get(h.toLowerCase()) : null, D = R?.fieldName ?? r, k = c && h ? N(h).fieldName : H?.fieldName ?? h, O = (c && k ? i[k] : a[k] ?? (R && B({ fieldInfo: R, layer: d, graphic: l })) ?? R?.fieldName ?? s) ?? "", j = (c && s ? i[s] : a[D]) ?? "";
+      const R = m.get(r.toLowerCase()), H = h ? m.get(h.toLowerCase()) : null, D = R?.fieldName ?? r, k = c && h ? N(h).fieldName : H?.fieldName ?? h, O = (c && k ? i[k] : a[k] ?? (R && B({ fieldInfo: R, layer: d, graphic: l })) ?? R?.fieldName ?? s) ?? "", W = (c && s ? i[s] : a[D]) ?? "";
       return new P({
         fieldName: r,
         tooltip: this._getTooltip({
           label: O,
-          value: j,
+          value: W,
           chartType: o
         }),
         color: _,
@@ -559,7 +559,7 @@ class fe extends ee {
     r === "pie-chart" ? this._createPieChart(e, x) : this._createXYChart(e, x);
   }
 }
-W("arcgis-feature-media", fe);
+j("arcgis-feature-media", fe);
 export {
   fe as ArcgisFeatureMedia
 };

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

@@ -7,7 +7,7 @@ import { templateHasKey as S, stripHTML as N } from "@arcgis/core/applications/C
 import { isRelatableFeatureSupportedLayer as Z, findRelatedLayer as z } from "@arcgis/core/applications/Components/featureUtils.js";
 import { substitute as G, formatNumber as V } from "@arcgis/core/intl.js";
 import { watch as C, on as J } from "@arcgis/core/core/reactiveUtils.js";
-import { h as U } from "../../chunks/feature-utils.js";
+import { o as U } from "../../chunks/feature-utils.js";
 import Q from "@arcgis/core/core/Collection.js";
 import M from "@arcgis/core/rest/support/RelationshipQuery.js";
 import { ignoreAbortErrors as P } from "@arcgis/core/core/promiseUtils.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/5.0/esri/copyright.txt for details.
-v5.0.0-next.135 */
+v5.0.0-next.137 */
 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) {