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

package/dist/chunks/attachment-utils.js

@@ -1,7 +1,7 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 function l(i) {
   const a = i.toLowerCase();
-  return a === "image/bmp" || a === "image/emf" || a === "image/exif" || a === "image/gif" || a === "image/x-icon" || a === "image/jpeg" || a === "image/png" || a === "image/tiff" || a === "image/x-wmf";
+  return a === "image/bmp" || a === "image/emf" || a === "image/exif" || a === "image/gif" || a === "image/x-icon" || a === "image/jpeg" || a === "image/png" || a === "image/tiff" || a === "image/x-wmf" || a === "image/avif";
 }
 function r(i) {
   return i ? i === "text/plain" ? "file-text" : i === "application/pdf" ? "file-pdf" : i === "text/csv" ? "file-csv" : i === "application/gpx+xml" ? "file-gpx" : i === "application/x-dwf" ? "file-cad" : i === "application/postscript" || i === "application/json" || i === "text/xml" || i === "model/vrml" ? "file-code" : i === "application/x-zip-compressed" || i === "application/x-7z-compressed" || i === "application/x-gzip" || i === "application/x-tar" || i === "application/x-gtar" || i === "application/x-bzip2" || i === "application/gzip" || i === "application/x-compress" || i === "application/x-apple-diskimage" || i === "application/x-rar-compressed" || i === "application/zip" ? "file-zip" : i.includes("image/") ? "file-image" : i.includes("audio/") ? "file-sound" : i.includes("video/") ? "file-video" : i.includes("msexcel") || i.includes("ms-excel") || i.includes("spreadsheetml") ? "file-excel" : i.includes("msword") || i.includes("ms-word") || i.includes("wordprocessingml") ? "file-word" : i.includes("powerpoint") || i.includes("presentationml") ? "file-ppt" : "file" : "file";

package/dist/chunks/feature-utils.js

@@ -3,7 +3,7 @@ import { replace as a } from "@arcgis/core/applications/Components/stringUtils.j
 import { fieldFormatFromFieldInfo as m } from "@arcgis/core/applications/Components/fieldFormatUtils.js";
 import { g } from "./layer-utils.js";
 import { log as F } from "@arcgis/toolkit/log";
-const u = /^\s*expression\//iu, y = /href=(""|'')/giu, C = /(\{([^{\r\n]+)\})/gu, h = /href\s*=\s*(?:"([^"]+)"|'([^']+)')/giu, L = /'/gu, N = "relationships/", b = /^(?:mailto:|tel:)/u;
+const u = /^\s*expression\//iu, y = /href=(""|'')/giu, h = /(\{([^{\r\n]+)\})/gu, C = /href\s*=\s*(?:"([^"]+)"|'([^']+)')/giu, L = /'/gu, N = "relationships/", b = /^(?:mailto:|tel:)/u;
 function j(e, n) {
   const t = /* @__PURE__ */ new Map();
   if (!e)
@@ -41,6 +41,7 @@ const w = /* @__PURE__ */ new Set([
   "link-chart",
   "map-image",
   "map-notes",
+  "sketch",
   "subtype-group",
   "tile"
 ]);
@@ -48,7 +49,7 @@ function _(e) {
   const n = e?.origin;
   return (n == null ? void 0 : w.has(n.type ?? "") ? n.sublayer : n.layer) ?? e?.layer;
 }
-function A(e = "") {
+function k(e = "") {
   return e ? e.includes(N) : !1;
 }
 function B(e = "") {
@@ -65,7 +66,7 @@ function D(e, n) {
 function c(e) {
   return e ? u.test(e) : !1;
 }
-function I(e, n) {
+function A(e, n) {
   if (!n || !c(n) || !e)
     return;
   const t = n.replace(u, "").toLowerCase();
@@ -75,12 +76,12 @@ function G(e, n) {
   if (!(!e?.length || !n))
     return e.find((t) => t.fieldName?.toLowerCase() === n.toLowerCase());
 }
-function T(e) {
+function I(e) {
   const { fieldInfo: n, graphic: t, layer: r } = e;
-  return k({ fieldInfo: n, graphic: t }) ? g(r, { graphic: t }) : null;
+  return T({ fieldInfo: n, graphic: t }) ? g(r, { graphic: t }) : null;
 }
-function k({ fieldInfo: e, graphic: n }) {
-  return !!e?.fieldName && !c(e.fieldName) && !A(e.fieldName) && !n?.popupTemplate;
+function T({ fieldInfo: e, graphic: n }) {
+  return !!e?.fieldName && !c(e.fieldName) && !k(e.fieldName) && !n?.popupTemplate;
 }
 function J({
   expressionInfos: e,
@@ -91,10 +92,10 @@ function J({
 }) {
   if (!n?.fieldName)
     return null;
-  const o = I(e, n?.fieldName);
+  const o = A(e, n?.fieldName);
   if (o)
     return o.title || null;
-  const s = T({ fieldInfo: n, graphic: t, layer: i });
+  const s = I({ fieldInfo: n, graphic: t, layer: i });
   if (s) {
     const l = s.getFieldAlias(n.fieldName);
     return r ? n.label || l || n.fieldName : l || n.fieldName;
@@ -135,7 +136,7 @@ function p(e, n) {
   return !(e && "getField" in e && typeof e.getField == "function") || !n ? null : e.getField(n) ?? null;
 }
 function v(e, n) {
-  return e.replaceAll(C, (t, r, i) => {
+  return e.replaceAll(h, (t, r, i) => {
     const o = p(n, i);
     return o ? `{${o.name}}` : r;
   });
@@ -162,7 +163,7 @@ function P(e, n, t) {
 function S(e, n, t) {
   const r = v(e, t);
   return r && r.replaceAll(
-    h,
+    C,
     (i, o, s) => P(i, o || s, n)
   );
 }
@@ -210,12 +211,12 @@ export {
   W as c,
   j as d,
   U as e,
-  A as f,
+  k as f,
   _ as g,
   q as h,
   c as i,
   J as j,
-  T as k,
+  I as k,
   K as l,
   v as m,
   E as n,

package/dist/chunks/useArcgisViewReadyError.js

@@ -1,91 +1,106 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { html as b } from "lit";
-import { initializeProjection as w } from "@arcgis/core/applications/Components/featureUtils.js";
-import { signal as g } from "@arcgis/core/applications/Components/reactiveUtils.js";
-import { when as v, watch as s } from "@arcgis/core/core/reactiveUtils.js";
-import m from "@arcgis/core/geometry/Point.js";
-import P from "@arcgis/core/Graphic.js";
-import { GenericController as y, useDirection as _, makeController as S, makeGenericController as f } from "@arcgis/lumina/controllers";
-import { getSlotAssignedElements as C } from "@arcgis/toolkit/dom/slots";
-import { whenOrAbort as R } from "@arcgis/toolkit/promise";
-import { createRef as A } from "lit/directives/ref.js";
-import { c as L, S as F } from "./slots.js";
-import { observeAncestorsMutation as G, unsafeGetCalciteModeName as O } from "@arcgis/toolkit/dom";
-import { createEvent as d } from "@arcgis/lumina";
-async function* M(n, o) {
-  for (const e of n) {
-    const t = await R(e, o).catch(() => {
+import { html as O } from "lit";
+import { initializeProjection as S } from "@arcgis/core/applications/Components/featureUtils.js";
+import { signal as R } from "@arcgis/core/applications/Components/reactiveUtils.js";
+import { when as A, watch as c } from "@arcgis/core/core/reactiveUtils.js";
+import P from "@arcgis/core/geometry/Point.js";
+import F from "@arcgis/core/Graphic.js";
+import { GenericController as L, useDirection as G, makeController as M, makeGenericController as _ } from "@arcgis/lumina/controllers";
+import { getSlotAssignedElements as V } from "@arcgis/toolkit/dom/slots";
+import { whenOrAbort as y } from "@arcgis/toolkit/promise";
+import { createRef as D } from "lit/directives/ref.js";
+import { c as k, S as x } from "./slots.js";
+import { i as T, t as H } from "./async-utils.js";
+import { observeAncestorsMutation as j, unsafeGetCalciteModeName as q } from "@arcgis/toolkit/dom";
+import { createEvent as C } from "@arcgis/lumina";
+async function* U(i, t) {
+  for (const e of i) {
+    const o = await y(e, t).catch(() => {
     });
-    if (o.aborted)
+    if (t.aborted)
       return;
-    yield* Array.isArray(t) ? t.filter((i) => i instanceof P) : [];
+    yield* Array.isArray(o) ? o.filter((r) => r instanceof F) : [];
   }
 }
-async function* V(n, o, e, t) {
-  let i;
-  e instanceof m ? (await w(e.spatialReference, n.spatialReference), i = n.toScreen(e)) : i = e;
-  const p = i ? n.fetchPopupFeatures(i, {
-    ...t,
-    defaultPopupTemplateEnabled: o.defaultPopupTemplateEnabled
-  }) : void 0;
-  p && (yield* p);
+async function* v() {
+  yield* [];
 }
-function u(n, o) {
-  if (o instanceof m)
-    return o;
-  const e = "width" in o ? { x: o.x + o.width / 2, y: o.y + o.height / 2 } : o;
-  return n.toMap(e) ?? void 0;
+async function* K(i, t) {
+  await y(i, t).catch(() => {
+  });
+}
+async function N(i, t, e, o) {
+  let r;
+  if (e instanceof P ? (await S(e.spatialReference, i.spatialReference), H(o.signal), r = i.toScreen(e)) : r = e, !r)
+    return v();
+  const n = Promise.withResolvers(), a = i.fetchPopupFeatures(r, {
+    ...o,
+    defaultPopupTemplateEnabled: t.defaultPopupTemplateEnabled,
+    hitTestResolver: n
+  }) ?? v();
+  return await n.promise, a;
+}
+function d(i, t) {
+  if (t instanceof P)
+    return t;
+  const e = "width" in t ? { x: t.x + t.width / 2, y: t.y + t.height / 2 } : t;
+  return i.toMap(e) ?? void 0;
 }
-function D(n, o, e, t) {
-  const i = {};
+async function $(i, t, e, o) {
+  const r = {};
   return {
-    diagnostics: i,
-    featureStream: V(n, o, e, {
-      diagnostics: i,
-      signal: t
+    diagnostics: r,
+    featureStream: await N(i, t, e, {
+      diagnostics: r,
+      signal: o
     }),
-    location: u(n, e)
+    location: d(i, e)
   };
 }
-class J extends y {
+class ne extends L {
   //#endregion
   //#region Lifecycle
-  constructor(o) {
-    super(o), this.direction = _(), this.popupRef = A(), this._popupElement = g(void 0), this._popupAbortController = null, this.slotGroupRefs = L(), this.attributionHeight = 0, this._uiContainer = null, this.component.listenOn(globalThis, "unhandledrejection", (e) => {
-      const t = e.reason;
-      if (t?.name === "webgl:required") {
-        const { name: i } = t;
-        this.webGLError = { name: i };
+  constructor(t) {
+    super(t), this.direction = G(), this.popupRef = D(), this._popupElement = R(void 0), this._popupAbortController = null, this._popupClickOpenCount = 0, this.slotGroupRefs = k(), this.attributionHeight = 0, this._uiContainer = null, this.component.listenOn(globalThis, "unhandledrejection", (e) => {
+      const o = e.reason;
+      if (o?.name === "webgl:required") {
+        const { name: r } = o;
+        this.webGLError = { name: r };
       }
     });
   }
   get popupElement() {
     return this._popupElement.value;
   }
-  set popupElement(o) {
-    this._popupElement.value = o;
+  set popupElement(t) {
+    this._popupElement.value = t;
   }
   //#endregion
   //#region Private Methods
   hostLifecycle() {
     return [
-      v(() => this.component.view.ready, () => {
+      A(() => this.component.view.ready, () => {
         this._assignDefaultPopup();
       }),
-      s(() => this.component.view.popup?.visible, (e, t) => {
-        (e || t) && this._cancelPopupOperation(), e && this.popupElement?.open && (this.popupElement.open = !1);
+      c(() => this.component.view.popup?.visible, (e, o) => {
+        (e || o) && this._cancelPopupOperation(), e && this.popupElement?.open && (this.popupElement.open = !1);
       }, { initial: !0 }),
-      // Cancel the closing operation before openPopup() installs its replacement.
-      s(() => this.component.popupElement?.open, (e, t) => {
-        t && !e && this._cancelPopupOperation();
-      }, { initial: !0, sync: !0 }),
+      c(
+        () => this.component.popupElement?.open,
+        (e, o) => {
+          o && !e && this._cancelPopupOperation();
+        },
+        // Using sync to preemptively prevent a close notification from canceling a replacement operation.
+        { initial: !0, sync: !0 }
+      ),
       this.component.view.on("focus-region-select", (e) => this._handleFocusRegionSelect(e)),
       this.component.view.on(
         "click",
         [],
         (e) => {
-          const t = e.native;
-          e.button !== 0 || t?.ctrlKey || t?.metaKey || this._handleOpenPopup(e);
+          const o = e.native;
+          e.button !== 0 || o?.ctrlKey || o?.metaKey || this._handleOpenPopup(e).catch(() => {
+          });
         },
         // @ts-ignore: Core supports a click listener priority argument, needed for Popup click
         -2
@@ -95,22 +110,46 @@ class J extends y {
   hostDestroy() {
     this._cancelPopupOperation();
   }
-  async openPopup(o = {}) {
-    this._assignDefaultPopup(), this.closePopup();
-    const e = new AbortController();
-    if (this._popupAbortController = e, this.popupElement) {
-      if (await this.popupElement.componentOnReady(), e.signal.aborted)
+  async openPopup(t = {}) {
+    this._assignDefaultPopup();
+    const e = this.popupElement, o = t.location ?? e?.location, r = !!e && !t.featureStream && !t.promises?.length && !!t.fetchFeatures && !!o;
+    r ? (this._cancelPopupOperation(), this.component.view.closePopup()) : this.closePopup();
+    const n = new AbortController();
+    if (this._popupAbortController = n, e) {
+      const { fetchFeatures: a, shouldFocus: h, title: u, featureStream: w, promises: b, location: l, ...E } = t, m = l ? d(this.component.view, l) : void 0, g = l ?? o, p = r && g ? $(this.component.view, e, g, n.signal) : null, f = p ? Promise.withResolvers() : null;
+      p && f && (p.catch(() => {
+      }), e.featureStream = K(f.promise, n.signal));
+      try {
+        await e.componentOnReady();
+      } catch (s) {
+        throw p && this._isCurrentPopupOperation(n) && (n.abort(), e.open = !1, await e.clear()), s;
+      }
+      if (!this._isCurrentPopupOperation(n))
         return;
-      const { fetchFeatures: t, shouldFocus: i, title: p, featureStream: l, promises: h, location: r, ...E } = o, a = r ? u(this.component.view, r) : void 0, c = r ?? this.popupElement.location;
-      Object.assign(this.popupElement, E), p !== void 0 && (this.popupElement.heading = p), l ? await this.popupElement.openFeatureStream({ featureStream: l, location: a }) : h?.length ? await this.popupElement.openFeatureStream({
-        featureStream: M(h, e.signal),
-        location: a
-      }) : t && c ? await this.popupElement.openFeatureStream(D(this.component.view, this.popupElement, c, e.signal)) : (this.popupElement.featureStream = null, r !== void 0 && (this.popupElement.location = a), this.popupElement.open = !0), i && !e.signal.aborted && await this.popupElement.setFocus();
+      if (p)
+        try {
+          const s = await p;
+          if (!this._isCurrentPopupOperation(n))
+            return;
+          Object.assign(e, E), u !== void 0 && (e.heading = u), await e.openFeatureStream(s);
+        } catch (s) {
+          if (!T(s))
+            throw this._isCurrentPopupOperation(n) && (e.open = !1, await e.clear()), s;
+          return;
+        } finally {
+          f?.resolve();
+        }
+      else
+        Object.assign(e, E), u !== void 0 && (e.heading = u), w ? await e.openFeatureStream({ featureStream: w, location: m }) : b?.length ? await e.openFeatureStream({
+          featureStream: U(b, n.signal),
+          location: m
+        }) : (e.featureStream = null, l !== void 0 && (e.location = m), e.open = !0);
+      h && this._isCurrentPopupOperation(n) && await e.setFocus();
     } else {
-      const { location: t, ...i } = o;
+      const { location: a, ...h } = t;
       await this.component.view.openPopup({
-        ...i,
-        location: t ? u(this.component.view, t) : void 0
+        ...h,
+        location: a ? d(this.component.view, a) : void 0
       });
     }
   }
@@ -120,12 +159,15 @@ class J extends y {
   _cancelPopupOperation() {
     this._popupAbortController?.abort(), this._popupAbortController = null;
   }
+  _isCurrentPopupOperation(t) {
+    return this._popupAbortController === t && !t.signal.aborted;
+  }
   _assignDefaultPopup() {
     this.popupRef.value && !this.popupElement && (this.popupElement = this.popupRef.value, this.popupElement.referenceElement = this.component.el, this.popupElement.view = this.component.view);
   }
-  handleAttributionHeightChange(o) {
-    if (!(this.attributionHeight === o || !this.component.el.shadowRoot)) {
-      if (this.attributionHeight = o, !this._uiContainer) {
+  handleAttributionHeightChange(t) {
+    if (!(this.attributionHeight === t || !this.component.el.shadowRoot)) {
+      if (this.attributionHeight = t, !this._uiContainer) {
         const e = this.component.el.shadowRoot.querySelector(".arcgis-map-container-ui");
         this._uiContainer = e;
       }
@@ -133,90 +175,91 @@ class J extends y {
     }
   }
   _maybeDisableViewPopup() {
-    this.component.view && (this.component.popupComponentEnabled || this.popupElement) && (this.previousViewPopupEnabled = this.component.view.popupEnabled, this.component.view.popupEnabled = !1);
+    this.component.view && (this.component.popupComponentEnabled || this.popupElement) && (this.previousViewPopupEnabled ??= this.component.view.popupEnabled, this.component.view.popupEnabled = !1);
   }
   _maybeResetViewPopup() {
     this.component.view && this.previousViewPopupEnabled !== void 0 && (this.component.view.popupEnabled = this.previousViewPopupEnabled, this.previousViewPopupEnabled = void 0);
   }
-  async _handleOpenPopup(o) {
+  async _handleOpenPopup(t) {
     if (this._assignDefaultPopup(), !this.component.popupDisabled) {
-      this._maybeDisableViewPopup();
+      this._popupClickOpenCount++, this._maybeDisableViewPopup();
       try {
         this.popupElement && await this.openPopup({
           fetchFeatures: !0,
-          location: { x: o.x, y: o.y }
+          location: { x: t.x, y: t.y }
         });
       } finally {
-        this._maybeResetViewPopup();
+        this._popupClickOpenCount--, this._popupClickOpenCount || this._maybeResetViewPopup();
       }
     }
   }
-  _handleFocusRegionSelect(o) {
+  _handleFocusRegionSelect(t) {
     queueMicrotask(() => {
       const { focusRegion: e } = this.component.view;
-      !o.defaultPrevented && e && this.openPopup({ fetchFeatures: !0, location: e });
+      !t.defaultPrevented && e && this.openPopup({ fetchFeatures: !0, location: e }).catch(() => {
+      });
     });
   }
-  _handlePopupSlotChange(o) {
-    const e = C(o.target, "arcgis-popup");
+  _handlePopupSlotChange(t) {
+    const e = V(t.target, "arcgis-popup");
     !this.popupElement && e.length ? this.popupElement = e[0] : e.length || (this.popupElement = void 0);
   }
   _webGLErrorAlert() {
-    return this.webGLError ? b`<arcgis-webgl-error .errorName=${this.webGLError.name}></arcgis-webgl-error>` : null;
+    return this.webGLError ? O`<arcgis-webgl-error .errorName=${this.webGLError.name}></arcgis-webgl-error>` : null;
   }
   //#endregion
   //#region Rendering
   render() {
-    return F({ direction: this.direction, popupComponentEnabled: this.component.popupComponentEnabled, slotGroupRefs: this.slotGroupRefs, handlePopupSlotChange: (o) => this._handlePopupSlotChange(o), webGLErrorElement: this._webGLErrorAlert(), popupElement: this.popupRef });
+    return x({ direction: this.direction, popupComponentEnabled: this.component.popupComponentEnabled, slotGroupRefs: this.slotGroupRefs, handlePopupSlotChange: (t) => this._handlePopupSlotChange(t), webGLErrorElement: this._webGLErrorAlert(), popupElement: this.popupRef });
   }
 }
-function Q(n) {
-  S((o, e) => {
-    const t = () => {
-      if (n.attributionMode !== "auto")
+function pe(i) {
+  M((t, e) => {
+    const o = () => {
+      if (i.attributionMode !== "auto")
         return;
-      const i = O(n.el);
-      n.view.attributionMode !== i && (n.view.attributionMode = i);
+      const r = q(i.el);
+      i.view.attributionMode !== r && (i.view.attributionMode = r);
     };
-    e.onLifecycle(() => (t(), G(n.el, ["class"], t))), e.onUpdate((i) => {
-      i.has("attributionMode") && n.attributionMode === "auto" && t();
+    e.onLifecycle(() => (o(), j(i.el, ["class"], o))), e.onUpdate((r) => {
+      r.has("attributionMode") && i.attributionMode === "auto" && o();
     });
   });
 }
-const W = f((n, o) => {
-  const e = d();
-  return o.onLifecycle(
-    () => s(
+const se = _((i, t) => {
+  const e = C();
+  return t.onLifecycle(
+    () => c(
       () => {
-        const { map: t } = n;
-        if (!t || t.destroyed)
+        const { map: o } = i;
+        if (!o || o.destroyed)
           return [];
-        const i = [];
-        return t.loadError && i.push(t), t.basemap?.loadError && i.push(t.basemap), t.ground.loadError && i.push(t.ground), [...t.allLayers, ...t.allTables].forEach((p) => {
-          p.loadError && i.push(p);
-        }), i;
+        const r = [];
+        return o.loadError && r.push(o), o.basemap?.loadError && r.push(o.basemap), o.ground.loadError && r.push(o.ground), [...o.allLayers, ...o.allTables].forEach((n) => {
+          n.loadError && r.push(n);
+        }), r;
       },
-      (t) => {
-        t.length && (n.loadErrorSources = t, e.emit());
+      (o) => {
+        o.length && (i.loadErrorSources = o, e.emit());
       }
     )
   ), e;
-}), X = f(
-  (n, o) => {
-    const e = d();
-    return o.onLifecycle(
-      () => s(
-        () => n.view?.readyState,
-        (t) => {
-          (t === "map-content-error" || t === "rendering-error") && e.emit();
+}), ae = _(
+  (i, t) => {
+    const e = C();
+    return t.onLifecycle(
+      () => c(
+        () => i.view?.readyState,
+        (o) => {
+          (o === "map-content-error" || o === "rendering-error") && e.emit();
         }
       )
     ), e;
   }
 );
 export {
-  J as U,
-  X as a,
-  Q as b,
-  W as u
+  ne as U,
+  ae as a,
+  pe as b,
+  se as u
 };

package/dist/components/arcgis-add-attachment-view/customElement.d.ts

@@ -30,6 +30,7 @@ export abstract class ArcgisAddAttachmentView extends LitElement {
               fileToBeReplaced: string;
               heading: string;
           };
+          "attachment-preview": { noPreview: string; };
           thumbnail: { fileTypes: {
               "file-cad": string;
               "file-code": string;
@@ -73,6 +74,7 @@ export abstract class ArcgisAddAttachmentView extends LitElement {
               fileToBeReplaced: string;
               heading: string;
           };
+          "attachment-preview": { noPreview: string; };
           thumbnail: { fileTypes: {
               "file-cad": string;
               "file-code": string;
@@ -126,6 +128,7 @@ export abstract class ArcgisAddAttachmentView extends LitElement {
               fileToBeReplaced?: string | undefined;
               heading?: string | undefined;
           } | undefined;
+          "attachment-preview"?: { noPreview?: string | undefined; } | undefined;
           thumbnail?: { fileTypes?: {
               "file-cad"?: string | undefined;
               "file-code"?: string | undefined;

package/dist/components/arcgis-attachment-preview/customElement.d.ts

@@ -0,0 +1,154 @@
+/// <reference path="../../index.d.ts" />
+import type AttachmentInfo from "@arcgis/core/rest/query/support/AttachmentInfo.js";
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { AttachmentElementInputLike as AttachmentThumbnailInput } from "../arcgis-attachment-thumbnail/customElement.js";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+
+/**
+ * Displays a preview of an attachment.
+ *
+ * @internal
+ */
+export abstract class ArcgisAttachmentPreview extends LitElement {
+  /** @internal */
+  protected _messages: {
+      componentLabel: string;
+      components: { attachments: {
+          "attachment-validation-view": { validations: {
+              errorFileUnsupported: string;
+              maximumAudioLength: string;
+              maximumImageSize: string;
+              maximumFileSize: string;
+              maximumNumberOfFiles: string;
+              maximumVideoLength: string;
+              minimumNumberOfFiles: string;
+          }; };
+          "add-attachment-view": {
+              captureMethodNotSupported: string;
+              fileToBeReplaced: string;
+              heading: string;
+          };
+          "attachment-preview": { noPreview: string; };
+          thumbnail: { fileTypes: {
+              "file-cad": string;
+              "file-code": string;
+              "file-csv": string;
+              "file-excel": string;
+              "file-gpx": string;
+              "file-image": string;
+              "file-pdf": string;
+              "file-ppt": string;
+              "file-sound": string;
+              "file-text": string;
+              "file-video": string;
+              "file-word": string;
+              "file-zip": string;
+              file: string;
+          }; };
+      }; };
+      units: { bytes: {
+          B: string;
+          kB: string;
+          MB: string;
+          GB: string;
+          TB: string;
+      }; };
+      differentValuesPlaceholder: string;
+      empty: string;
+  } & T9nMeta<{
+      componentLabel: string;
+      components: { attachments: {
+          "attachment-validation-view": { validations: {
+              errorFileUnsupported: string;
+              maximumAudioLength: string;
+              maximumImageSize: string;
+              maximumFileSize: string;
+              maximumNumberOfFiles: string;
+              maximumVideoLength: string;
+              minimumNumberOfFiles: string;
+          }; };
+          "add-attachment-view": {
+              captureMethodNotSupported: string;
+              fileToBeReplaced: string;
+              heading: string;
+          };
+          "attachment-preview": { noPreview: string; };
+          thumbnail: { fileTypes: {
+              "file-cad": string;
+              "file-code": string;
+              "file-csv": string;
+              "file-excel": string;
+              "file-gpx": string;
+              "file-image": string;
+              "file-pdf": string;
+              "file-ppt": string;
+              "file-sound": string;
+              "file-text": string;
+              "file-video": string;
+              "file-word": string;
+              "file-zip": string;
+              file: string;
+          }; };
+      }; };
+      units: { bytes: {
+          B: string;
+          kB: string;
+          MB: string;
+          GB: string;
+          TB: string;
+      }; };
+      differentValuesPlaceholder: string;
+      empty: string;
+  }>;
+  accessor attachment: AttachmentInfo | undefined;
+  accessor input: AttachmentElementInputLike | undefined;
+  accessor messageOverrides: {
+      componentLabel?: string | undefined;
+      components?: { attachments?: {
+          "attachment-validation-view"?: { validations?: {
+              errorFileUnsupported?: string | undefined;
+              maximumAudioLength?: string | undefined;
+              maximumImageSize?: string | undefined;
+              maximumFileSize?: string | undefined;
+              maximumNumberOfFiles?: string | undefined;
+              maximumVideoLength?: string | undefined;
+              minimumNumberOfFiles?: string | undefined;
+          } | undefined; } | undefined;
+          "add-attachment-view"?: {
+              captureMethodNotSupported?: string | undefined;
+              fileToBeReplaced?: string | undefined;
+              heading?: string | undefined;
+          } | undefined;
+          "attachment-preview"?: { noPreview?: string | undefined; } | undefined;
+          thumbnail?: { fileTypes?: {
+              "file-cad"?: string | undefined;
+              "file-code"?: string | undefined;
+              "file-csv"?: string | undefined;
+              "file-excel"?: string | undefined;
+              "file-gpx"?: string | undefined;
+              "file-image"?: string | undefined;
+              "file-pdf"?: string | undefined;
+              "file-ppt"?: string | undefined;
+              "file-sound"?: string | undefined;
+              "file-text"?: string | undefined;
+              "file-video"?: string | undefined;
+              "file-word"?: string | undefined;
+              "file-zip"?: string | undefined;
+              file?: string | undefined;
+          } | undefined; } | undefined;
+      } | undefined; } | undefined;
+      units?: { bytes?: {
+          B?: string | undefined;
+          kB?: string | undefined;
+          MB?: string | undefined;
+          GB?: string | undefined;
+          TB?: string | undefined;
+      } | undefined; } | undefined;
+      differentValuesPlaceholder?: string | undefined;
+      empty?: string | undefined;
+  };
+  pause(): void;
+}
+
+/** @internal */
+export type AttachmentElementInputLike = AttachmentThumbnailInput;