@arcgis/map-components 5.2.0-next.11 → 5.2.0-next.111

package/dist/components/arcgis-version-management-version-list/customElement.js

@@ -1,94 +1,67 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c as y } from "../../chunks/runtime.js";
-import { css as B, html as i, nothing as U } from "lit";
-import { createRef as w, ref as x } from "lit/directives/ref.js";
-import { LitElement as A, createEvent as p } from "@arcgis/lumina";
-const M = B`:host{min-height:var(--arcgis-internal-panel-height-md, 420px);height:100%}calcite-block{margin-block:0;width:100%}calcite-pagination{justify-content:center;background-color:var(--calcite-color-surface-2)}.filter-container{width:100%}.fab-container{background-color:var(--calcite-color-surface-2);display:flex;justify-content:center}`;
-class T extends A {
+import { c as P } from "../../chunks/runtime.js";
+import { css as A, html as i } from "lit";
+import { LitElement as U, createEvent as s } from "@arcgis/lumina";
+const k = A`calcite-input-text,calcite-notice{background-color:var(--calcite-color-surface-2);padding:var(--calcite-space-sm)}calcite-pagination{background-color:var(--calcite-color-surface-2);justify-content:center}calcite-panel{height:fit-content;max-height:var(--arcgis-internal-panel-height-sm, 240px)}.current-version-div{background-color:var(--calcite-color-surface-2);border-color:var(--calcite-block-border-color, var(--calcite-color-border-3));border-style:solid;border-width:0 0 1px;padding:var(--calcite-space-2xs) 0}.current-version-div .current-version-description-label,.current-version-div .current-version-header-label{height:var(--calcite-font-size);margin:var(--calcite-space-2xs) var(--calcite-space-md)}.current-version-div .current-version-header-label{font-weight:var(--calcite-font-weight-medium)}`;
+class F extends U {
   constructor() {
-    super(...arguments), this._filterInputElement = w(), this._flowItemElement = w(), this.currentPage = 1, this.selected = !1, this.showBackButton = !1, this.arcgisFlowItemBack = p(), this.arcgisFlowItemClose = p(), this.arcgisGetVersions = p(), this.arcgisManageVersion = p(), this.arcgisNewVersion = p();
+    super(...arguments), this.#e = 1, this.hideFilter = !1, this.mode = "browse-versions", this.totalPages = 0, this.totalVersions = 0, this.arcgisInternalFilterVersions = s(), this.arcgisInternalGetVersions = s(), this.arcgisInternalManageVersion = s(), this.arcgisInternalNewVersion = s(), this.arcgisInternalPageChange = s();
   }
   static {
-    this.properties = { _filteredVersionInfos: 16, currentPage: 11, selected: 7, showBackButton: 7, versionListElementProps: 0 };
+    this.properties = { currentPage: 9, currentUser: 1, currentVersionInfo: 0, executionError: 1, featureServiceName: 1, featureServiceUrl: 1, hideFilter: 5, isVersionAdministrator: 5, isVersioningApiAvailable: 5, messages: 0, mode: 1, totalPages: 9, totalVersions: 9, versionInfos: 0 };
   }
   static {
-    this.styles = M;
-  }
-  load() {
-    this._filteredVersionInfos = this.versionListElementProps.versionInfos;
+    this.styles = k;
   }
+  #e;
   willUpdate(e) {
-    if (e.has("versionListElementProps")) {
-      const t = e.get("versionListElementProps"), n = this.versionListElementProps;
-      t?.versionInfos !== n.versionInfos && (this._filteredVersionInfos = n.versionInfos, this._filterInputElement.value && this._handleFilterChange());
+    if (e.has("mode")) {
+      const t = e.get("mode"), n = t === "browse-services" && this.mode === "browse-versions", a = t === "browse-versions" && (this.mode === "create-version" || this.mode === "edit-version");
+      (n || a) && this.executionError && (this.executionError = void 0);
     }
   }
-  updated() {
-    this._filterInputElement.value?.setFocus();
-  }
-  async setFocus() {
-    this._flowItemElement.value?.setFocus();
-  }
-  goBack() {
-  }
-  _handleFilterChange() {
-    const { versionListElementProps: { versionInfos: e } } = this, t = this._filterInputElement.value.value.toUpperCase();
-    this._filteredVersionInfos = t === "" ? e : e.filter((n) => n.versionIdentifier.name.toUpperCase().includes(t) || n.versionIdentifier.guid.toUpperCase().includes(t)), this._filteredVersionInfos.length && (this.currentPage = 1);
-  }
-  _handleNoticeClosed() {
-    this.versionListElementProps = { ...this.versionListElementProps, executionError: void 0 };
-  }
-  _handlePaginationChange(e) {
-    this.currentPage = e.target.startItem;
-  }
-  _getExecutionError(e) {
-    const { versionListElementProps: { strings: { executionErrors: t } } } = this;
+  #i(e) {
+    const { messages: t } = this;
     switch (e) {
       case "no-feature-service-found":
-        return t.noFeatureServiceFound;
+        return t?.executionErrors.noFeatureServiceFound ?? "";
       case "no-valid-enterprise-version":
-        return t.notValidEnterpriseVersion;
+        return t?.executionErrors.notValidEnterpriseVersion ?? "";
       case "no-valid-version-name":
-        return t.invalidVersionName;
+        return t?.executionErrors.invalidVersionName ?? "";
       default:
         return e;
     }
   }
-  _paginate(e, t, n) {
-    return e.slice((n - 1) * t, n * t);
+  #r() {
+    this.executionError = void 0;
   }
-  render() {
-    const { currentPage: e, selected: t, showBackButton: n, versionListElementProps: { closable: m, currentUser: v, currentVersionIdentifier: d, executionError: h, heading: o, isVersionAdministrator: f, isVersioningApiAvailable: u, pageSize: r, serviceName: s, serviceUrl: c, state: g, strings: { headers: l }, strings: a, versionInfos: $ } } = this, V = i`<calcite-block .description=${d.name} .heading=${l.currentVersion} overlay-positioning=fixed scale=s></calcite-block>`, I = i`<calcite-action icon=refresh .id=${`action-refresh-versions-${s}`} .label=${`action-refresh-versions-${s}`} slot=header-actions-end text @click=${() => this.arcgisGetVersions.emit({ serviceUrl: c })}><calcite-tooltip overlay-positioning=fixed .referenceElement=${`action-refresh-versions-${s}`}><span>${a.actions.refreshVersions}</span></calcite-tooltip></calcite-action>`;
-    this._paginatedVersionInfos = this._filteredVersionInfos.length > r ? this._paginate(this._filteredVersionInfos, r, e) : this._filteredVersionInfos;
-    const b = this._filteredVersionInfos.length > r ? i`<calcite-pagination @calcitePaginationChange=${this._handlePaginationChange} page-size=1 .startItem=${e} .totalItems=${Math.ceil(this._filteredVersionInfos.length / r)}></calcite-pagination>` : void 0, E = this._paginate(this._paginatedVersionInfos, r, 1).map((L) => {
-      const F = {
-        currentUser: v,
-        currentVersionIdentifier: d,
-        isCurrentVersionCard: !1,
-        isVersionAdministrator: f,
-        isVersioningApiAvailable: u,
-        serviceUrl: c,
-        strings: a,
-        versionInfo: L
-      };
-      return this._renderListItem(F);
-    }), _ = $.length > r ? i`<div class="filter-container" slot=content-top><calcite-input-text clearable icon=search .label=${l.filterVersions} @calciteInputTextInput=${this._handleFilterChange} .placeholder=${a.actions.searchVersions} ${x(this._filterInputElement)}></calcite-input-text></div>` : void 0, C = i`<calcite-list .label=${a.labels.versionList}>${E}</calcite-list>`, k = u ? i`<div class="fab-container"><calcite-fab appearance=outline-fill text-enabled .text=${a.actions.newVersion} @click=${() => this.arcgisNewVersion.emit({ serviceUrl: c })}></calcite-fab></div>` : void 0, P = h ? i`<calcite-notice @calciteNoticeClose=${this._handleNoticeClosed} closable kind=warning open scale=s width=full><div slot=message>${this._getExecutionError(h)}</div></calcite-notice>` : void 0;
-    return i`<calcite-flow-item .closable=${m} .description=${s} .heading=${o} .selected=${t} .showBackButton=${n} @calciteFlowItemBack=${() => this.arcgisFlowItemBack.emit()} @calciteFlowItemClose=${() => this.arcgisFlowItemClose.emit()} ${x(this._flowItemElement)}><calcite-panel .loading=${g === "executing"}>${V}<calcite-panel .heading=${this._filteredVersionInfos.length ? `${a.headers.manageVersions} (${this._filteredVersionInfos.length})` : a.headers.manageVersions} scale=s>${I}${_}${C}${k}${b}</calcite-panel>${P}</calcite-panel></calcite-flow-item>`;
+  #t(e) {
+    this.arcgisInternalPageChange.emit({ currentPage: e.target.startItem });
   }
-  _renderListItem(e) {
-    const { currentUser: t, currentVersionIdentifier: n, isVersionAdministrator: m, isVersioningApiAvailable: v, serviceUrl: d, strings: { actions: h }, versionInfo: o } = e, f = o.versionIdentifier.name, u = f.substring(f.lastIndexOf(".") + 1), r = f.substring(0, f.lastIndexOf(".")), s = o.versionIdentifier.guid, c = `action-start-switch-to-version-${s}`, g = r.toUpperCase() === t.toUpperCase() && v || m, l = n.guid === o.versionIdentifier.guid, a = f.toUpperCase() === "SDE.DEFAULT", $ = i`<calcite-action .disabled=${l} icon=code-branch .label=${`action-switch-to-version-${s}`} scale=s .text=${h.switchToVersion} text-enabled @click=${() => {
-      this.arcgisManageVersion.emit({ actionType: "changeVersion", serviceUrl: d, versionInfo: o });
-    }}></calcite-action>`, V = a ? void 0 : i`<calcite-action .disabled=${!g || g && l} icon=trash .label=${`action-delete-version-${s}`} scale=s .text=${h.deleteVersion} text-enabled @click=${() => {
-      this.arcgisManageVersion.emit({ actionType: "deleteVersion", serviceUrl: d, versionInfo: o });
-    }}></calcite-action>`, I = i`<calcite-action .disabled=${!g || l} icon=code-branch-edit .label=${`action-edit-version-${s}`} scale=s .text=${h.editVersion} text-enabled @click=${() => {
-      this.arcgisManageVersion.emit({ actionType: "editVersion", serviceUrl: d, versionInfo: o });
-    }}></calcite-action>`, b = i`<calcite-action-menu .label=${`action-version-menu-${s}`} overlay-positioning=fixed slot=actions-end>${$}${I}${V}</calcite-action-menu>`, E = l ? void 0 : i`<calcite-tooltip overlay-positioning=fixed .referenceElement=${c}><span>${h.switchToVersion}</span></calcite-tooltip>`, _ = i`<div slot=actions-start><calcite-action .disabled=${l} icon=code-branch id=${c ?? U} .label=${c} .text=${c} @click=${() => {
-      this.arcgisManageVersion.emit({ actionType: "changeVersion", serviceUrl: d, versionInfo: o });
-    }}></calcite-action>${E}</div>`;
-    return i`<calcite-list-item .description=${r} .label=${u} .value=${s}>${_}${b}</calcite-list-item>`;
+  #s(e) {
+    e.stopPropagation(), this.arcgisInternalManageVersion.emit({
+      actionType: e.detail.actionType,
+      serviceUrl: e.detail.serviceUrl,
+      versionInfo: e.detail.versionInfo
+    });
+  }
+  render() {
+    const { currentUser: e, currentPage: t, currentVersionInfo: n, executionError: a, featureServiceName: o, featureServiceUrl: c, hideFilter: h, isVersionAdministrator: u, isVersioningApiAvailable: v, messages: r, totalPages: d, totalVersions: m, versionInfos: g } = this, p = g?.map((l) => i`<arcgis-version-management-version-list-item .currentUser=${e} .currentVersionInfo=${n} .featureServiceUrl=${c} .isVersionAdministrator=${u} .isVersioningApiAvailable=${v} .messages=${r} .versionInfo=${l} @arcgisInternalManageVersion=${this.#s}></arcgis-version-management-version-list-item>`), f = i`<div class="current-version-div"><calcite-label scale=m class="current-version-header-label">${r?.headers.currentVersion}</calcite-label><calcite-label scale=s class="current-version-description-label">${n?.versionIdentifier.name}</calcite-label></div>`, $ = i`<calcite-action icon=refresh .id=${`action-refresh-versions-${o}`} .label=${`action-refresh-versions-${o}`} slot=actions-end text @click=${() => {
+      this.arcgisInternalGetVersions.emit({
+        serviceUrl: c
+      });
+    }}><calcite-tooltip overlay-positioning=fixed .referenceElement=${`action-refresh-versions-${o}`}><span>${r?.actions.refreshVersions}</span></calcite-tooltip></calcite-action>`, V = i`<calcite-block .heading=${g?.length ? `${r?.headers.manageVersions} (${m})` : r?.headers.manageVersions}>${$}</calcite-block>`, b = h ? void 0 : i`<calcite-input-text clearable icon=search .label=${r?.headers.filterVersions} .placeholder=${r?.actions.searchVersions} @calciteInputTextInput=${(l) => {
+      this.arcgisInternalFilterVersions.emit({ filterText: l.target.value });
+    }}></calcite-input-text>`, I = v ? i`<calcite-fab appearance=outline-fill slot=fab text-enabled .text=${r?.actions.newVersion} @click=${() => {
+      this.arcgisInternalNewVersion.emit({
+        serviceUrl: c ?? ""
+      });
+    }}></calcite-fab>` : void 0, x = d > 1 ? i`<calcite-pagination .pageSize=${this.#e} .startItem=${t} .totalItems=${d} @calcitePaginationChange=${this.#t}></calcite-pagination>` : void 0, w = a ? i`<calcite-notice closable icon kind=warning open scale=s width=full @calciteNoticeClose=${this.#r}><div slot=message>${this.#i(a)}</div></calcite-notice>` : void 0, E = i`<calcite-panel>${I}<calcite-list .label=${r?.labels.versionList ?? ""}>${p}</calcite-list></calcite-panel>`;
+    return i`${f}${V}${b}${E}${x}${w}`;
   }
 }
-y("arcgis-version-management-version-list", T);
+P("arcgis-version-management-version-list", F);
 export {
-  T as ArcgisVersionManagementVersionList
+  F as ArcgisVersionManagementVersionList
 };

package/dist/components/arcgis-version-management-version-list/index.js

@@ -1,13 +1,12 @@
-import "@esri/calcite-components/components/calcite-block";
+import "../arcgis-version-management-version-list-item/index.js";
+import "@esri/calcite-components/components/calcite-label";
 import "@esri/calcite-components/components/calcite-action";
 import "@esri/calcite-components/components/calcite-tooltip";
-import "@esri/calcite-components/components/calcite-pagination";
+import "@esri/calcite-components/components/calcite-block";
 import "@esri/calcite-components/components/calcite-input-text";
-import "@esri/calcite-components/components/calcite-list";
 import "@esri/calcite-components/components/calcite-fab";
+import "@esri/calcite-components/components/calcite-pagination";
 import "@esri/calcite-components/components/calcite-notice";
-import "@esri/calcite-components/components/calcite-flow-item";
 import "@esri/calcite-components/components/calcite-panel";
-import "@esri/calcite-components/components/calcite-action-menu";
-import "@esri/calcite-components/components/calcite-list-item";
+import "@esri/calcite-components/components/calcite-list";
 export * from "./customElement.js";

package/dist/components/arcgis-version-management-version-list-item/customElement.js

@@ -0,0 +1,44 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+import { c as A } from "../../chunks/runtime.js";
+import { html as i } from "lit";
+import { LitElement as x, createEvent as U, nothing as E } from "@arcgis/lumina";
+class T extends x {
+  constructor() {
+    super(...arguments), this.arcgisInternalManageVersion = U();
+  }
+  static {
+    this.properties = { currentUser: 1, currentVersionInfo: 0, featureServiceUrl: 1, isVersionAdministrator: 5, isVersioningApiAvailable: 5, messages: 0, versionInfo: 0 };
+  }
+  render() {
+    const { currentUser: d, currentVersionInfo: m, featureServiceUrl: o, isVersionAdministrator: g, isVersioningApiAvailable: $, messages: c, versionInfo: e } = this, n = e?.versionIdentifier.name ?? "", v = n.substring(n.lastIndexOf(".") + 1), l = n.substring(0, n.lastIndexOf(".")), t = e?.versionIdentifier.guid ?? "", s = m?.versionIdentifier.guid === e?.versionIdentifier.guid, V = n.toUpperCase() === "SDE.DEFAULT", a = l.toUpperCase() === d?.toUpperCase() && $ || g, r = `action-start-switch-to-version-${t}`, p = s ? void 0 : i`<calcite-tooltip overlay-positioning=fixed .referenceElement=${r}><span>${c?.actions.switchToVersion}</span></calcite-tooltip>`, u = i`<div slot=actions-start><calcite-action .disabled=${s} icon=code-branch id=${r ?? E} .label=${r} .text=${r} @click=${() => {
+      this.arcgisInternalManageVersion.emit({
+        actionType: "changeVersion",
+        serviceUrl: o,
+        versionInfo: e
+      });
+    }}></calcite-action>${p}</div>`, h = i`<calcite-action .disabled=${s} icon=code-branch .label=${`action-switch-to-version-${t}`} scale=s .text=${c?.actions.switchToVersion ?? ""} text-enabled @click=${() => {
+      this.arcgisInternalManageVersion.emit({
+        actionType: "changeVersion",
+        serviceUrl: o,
+        versionInfo: e
+      });
+    }}></calcite-action>`, b = i`<calcite-action .disabled=${!a || s} icon=code-branch-edit .label=${`action-edit-version-${t}`} scale=s .text=${c?.actions.editVersion ?? ""} text-enabled @click=${() => {
+      this.arcgisInternalManageVersion.emit({
+        actionType: "editVersion",
+        serviceUrl: o,
+        versionInfo: e
+      });
+    }}></calcite-action>`, f = V ? void 0 : i`<calcite-action .disabled=${!a || a && s} icon=trash .label=${`action-delete-version-${t}`} scale=s .text=${c?.actions.deleteVersion ?? ""} text-enabled @click=${() => {
+      this.arcgisInternalManageVersion.emit({
+        actionType: "deleteVersion",
+        serviceUrl: o,
+        versionInfo: e
+      });
+    }}></calcite-action>`, I = i`<calcite-action-menu .label=${`action-version-menu-${t}`} overlay-positioning=fixed slot=actions-end>${h}${b}${f}</calcite-action-menu>`;
+    return i`<calcite-list-item .description=${l} .label=${v} .value=${t}>${u}${I}</calcite-list-item>`;
+  }
+}
+A("arcgis-version-management-version-list-item", T);
+export {
+  T as ArcgisVersionManagementVersionListItem
+};

package/dist/components/arcgis-version-management-version-list-item/index.js

@@ -0,0 +1,5 @@
+import "@esri/calcite-components/components/calcite-tooltip";
+import "@esri/calcite-components/components/calcite-action";
+import "@esri/calcite-components/components/calcite-action-menu";
+import "@esri/calcite-components/components/calcite-list-item";
+export * from "./customElement.js";

package/dist/components/arcgis-version-management-version-properties/customElement.js

@@ -1,97 +1,107 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c as $ } from "../../chunks/runtime.js";
-import { css as V, html as l } from "lit";
-import { LitElement as C, createEvent as p } from "@arcgis/lumina";
-import { createRef as u, ref as v } from "lit/directives/ref.js";
-const I = V`:host{min-height:var(--arcgis-internal-panel-height-md, 420px);height:100%}`;
-class x extends C {
+import { c as p } from "../../chunks/runtime.js";
+import { html as r } from "lit";
+import { LitElement as m, createEvent as o } from "@arcgis/lumina";
+import { f as u } from "../../chunks/component-utils.js";
+class f extends m {
   constructor() {
-    super(...arguments), this._flowItemElement = u(), this._switchToVersion = !0, this._switchToVersionCheckboxElement = u(), this._versionNameInputElement = u(), this.selected = !1, this.showBackButton = !1, this.arcgisAlterVersion = p(), this.arcgisCreateVersion = p(), this.arcgisFlowItemBack = p(), this.arcgisFlowItemClose = p();
-  }
-  static {
-    this.properties = { _validationError: 16, selected: 7, showBackButton: 7, versionPropertiesElementProps: 0 };
+    super(...arguments), this.#e = {
+      access: void 0,
+      description: void 0,
+      featureServerUrl: "",
+      ownerName: void 0,
+      versionName: void 0,
+      versionIdentifier: { name: "", guid: "" }
+    }, this.#i = {
+      access: "public",
+      description: "",
+      featureServerUrl: "",
+      ownerName: "",
+      versionName: ""
+    }, this.#t = !0, this.mode = "browse-versions", this.arcgisInternalAlterVersion = o(), this.arcgisInternalCreateVersion = o(), this.arcgisInternalDiscardEdits = o();
   }
   static {
-    this.styles = I;
+    this.properties = { _validationError: 16, currentUser: 1, editVersionInfo: 0, featureServiceUrl: 1, messages: 0, mode: 1 };
   }
-  load() {
-    const { versionPropertiesElementProps: { versionInfo: t } } = this;
-    t ? (this._mode = "edit", this._fullVersionName = t.versionIdentifier.name, this._ownerName = this._fullVersionName.substring(0, this._fullVersionName.lastIndexOf(".")), this._versionName = this._fullVersionName.substring(this._fullVersionName.lastIndexOf(".") + 1)) : this._mode = "create";
-  }
-  updated() {
-    this._mode === "create" && this._versionNameInputElement.value?.setFocus();
-  }
-  async setFocus() {
-    this._flowItemElement.value?.setFocus();
-  }
-  goBack() {
+  #e;
+  #i;
+  #t;
+  willUpdate(i) {
+    const { editVersionInfo: t, featureServiceUrl: e } = this;
+    if (i.has("currentUser") && (this.#i.ownerName = this.currentUser ?? ""), i.has("featureServiceUrl") && (this.#i.featureServerUrl = e ?? ""), i.has("editVersionInfo")) {
+      const s = t?.versionIdentifier.name, c = s?.substring(0, s.lastIndexOf(".")), a = s?.substring(s.lastIndexOf(".") + 1);
+      this.#e = {
+        ...this.#e,
+        access: t?.access,
+        description: t?.description,
+        featureServerUrl: e ?? "",
+        ownerName: c,
+        versionName: a,
+        versionIdentifier: t?.versionIdentifier ?? { name: "", guid: "" }
+      };
+    }
+    i.has("mode") && this.#r();
   }
-  _handleCancel() {
-    this.arcgisFlowItemBack.emit();
+  #a() {
+    this.arcgisInternalDiscardEdits.emit(), this.#r();
   }
-  _handleChange(t) {
-    const { _mode: s, _ownerName: h, _versionName: d, versionPropertiesElementProps: { currentUser: m, isVersionAdministrator: e, serviceUrl: c, versionInfo: i } } = this;
-    let { _alterVersionParameters: r, _createVersionParameters: a } = this;
-    switch (s === "create" && (a || (a = {
-      access: "public",
-      description: "",
-      featureServerUrl: c,
-      ownerName: m,
-      versionName: ""
-    })), s === "edit" && (r || (r = {
-      featureServerUrl: c,
-      versionIdentifier: i.versionIdentifier,
-      ownerName: h,
-      versionName: d,
-      access: i.access,
-      description: i.description
-    })), t.type) {
+  #s(i) {
+    const { mode: t } = this;
+    switch (i.type) {
       case "calciteChipGroupSelect": {
-        const o = t.target.label, n = t.target.selectedItems[0].label;
-        s === "create" && (a = { ...a, [o]: n }), s === "edit" && (r = { ...r, [o]: n });
+        const e = i.target.selectedItems[0].label;
+        t === "create-version" && (this.#i.access = e), t === "edit-version" && (this.#e.access = e);
         break;
       }
       case "calciteInputTextInput": {
-        const o = t.target.name, n = t.target.value;
-        s === "create" && (a = { ...a, [o]: n }), s === "edit" && (r = { ...r, [o]: n });
+        const e = i.target.name, s = i.target.value;
+        t === "create-version" && (e === "versionName" || e === "ownerName") && (this.#i[e] = s), t === "edit-version" && (e === "versionName" || e === "ownerName") && (this.#e[e] = s);
         break;
       }
       case "calciteTextAreaInput": {
-        const o = t.target.name;
-        if (o != null) {
-          const n = t.target.value;
-          s === "create" && (a = { ...a, [o]: n }), s === "edit" && (r = { ...r, [o]: n });
-        }
+        const e = i.target.value;
+        t === "create-version" && (this.#i.description = e), t === "edit-version" && (this.#e.description = e);
         break;
       }
     }
-    s === "create" && (a.access !== "public" && m.toUpperCase() !== a.ownerName?.toUpperCase() && !e ? (this._switchToVersionCheckboxElement.value.checked = !1, this._switchToVersionCheckboxElement.value.disabled = !0, this._switchToVersion = !1) : this._switchToVersionCheckboxElement.value.disabled = !1, this._createVersionParameters = a), s === "edit" && (this._alterVersionParameters = r);
-  }
-  _handleClose() {
-    this.arcgisFlowItemClose.emit();
   }
-  _handleSave() {
-    const { _alterVersionParameters: t, _createVersionParameters: s, _mode: h, _switchToVersion: d, versionPropertiesElementProps: { strings: m } } = this, e = [".", ";", "'", '"'];
-    if (e.some((i) => s?.versionName?.includes(i)) || e.some((i) => t?.versionName?.includes(i))) {
-      this._validationError = m.validationErrors.invalidCharacters;
+  #c() {
+    const { messages: i, mode: t } = this, e = t === "create-version" ? this.#i?.versionName?.trim() ?? "" : this.#e?.versionName?.trim() ?? "", s = u(e), a = [".", ";", "'", '"'].some((n) => e.includes(n));
+    if (s) {
+      this._validationError = i?.validationErrors.emptyVersionName;
+      return;
+    }
+    if (a) {
+      this._validationError = i?.validationErrors.invalidCharacters;
       return;
     }
-    h === "create" && this.arcgisCreateVersion.emit({
-      createVersionParameters: s,
-      switchToVersion: d
-    }), h === "edit" && this.arcgisAlterVersion.emit({
-      alterVersionParameters: t
-    });
+    t === "create-version" && this.arcgisInternalCreateVersion.emit({
+      createVersionParameters: this.#i,
+      switchToVersion: this.#t
+    }), t === "edit-version" && this.arcgisInternalAlterVersion.emit({
+      alterVersionParameters: this.#e
+    }), this.#r();
   }
-  _handleSwitchToVersionChange(t) {
-    this._switchToVersion = t.target.checked;
+  #n(i) {
+    this.#t = i.target.checked;
+  }
+  #r() {
+    this.#i = {
+      ...this.#i,
+      access: "public",
+      description: "",
+      ownerName: this.currentUser,
+      versionName: ""
+    }, this.editVersionInfo = void 0, this.#t = !0, this._validationError = void 0;
   }
   render() {
-    const { selected: t, showBackButton: s, versionPropertiesElementProps: { closable: h, currentUser: d, state: m, strings: e, versionInfo: c }, _mode: i, _ownerName: r, _versionName: a } = this, o = l`<calcite-button appearance=outline slot=footer width=full @click=${this._handleCancel}>${e.actions.cancelSave}</calcite-button><calcite-button appearance=solid slot=footer width=full @click=${this._handleSave}>${e.actions.saveVersion}</calcite-button>`, n = l`<calcite-label>${e.input.versionAccess}<calcite-chip-group label=access @calciteChipGroupSelect=${this._handleChange} selection-mode=single-persist><calcite-chip .selected=${i === "edit" && c.access === "public" || i === "create"} label=public>${e.accessLevels.public}</calcite-chip><calcite-chip .selected=${i === "edit" && c.access === "protected"} label=protected>${e.accessLevels.protected}</calcite-chip><calcite-chip .selected=${i === "edit" && c.access === "private"} label=private>${e.accessLevels.private}</calcite-chip></calcite-chip-group></calcite-label>`, f = l`<calcite-label>${e.input.versionDescription}<calcite-text-area limit-text max-length=64 name=description resize=none rows=2 scale=s .value=${i === "edit" ? c.description : ""} @calciteTextAreaInput=${this._handleChange}></calcite-text-area></calcite-label>`, _ = l`<calcite-label>${e.input.versionName}<calcite-input-text max-length=62 name=versionName .value=${i === "edit" ? a : ""} @calciteInputTextInput=${this._handleChange} ${v(this._versionNameInputElement)}></calcite-input-text></calcite-label>`, b = l`<calcite-label>${e.input.versionOwner}<calcite-input-text name=ownerName .value=${i === "edit" ? r : d} @calciteInputTextInput=${this._handleChange}></calcite-input-text></calcite-label>`, g = i === "create" ? l`<calcite-label layout=inline><calcite-checkbox checked name=switchToVersion @calciteCheckboxChange=${this._handleSwitchToVersionChange} ${v(this._switchToVersionCheckboxElement)}></calcite-checkbox>${e.actions.switchToVersion}</calcite-label>` : void 0, w = this._validationError ? l`<calcite-notice closable kind=warning open scale=s width=full @calciteNoticeClose=${() => this._validationError = void 0}><div slot=message>${this._validationError}</div></calcite-notice>` : void 0;
-    return l`<calcite-flow-item .closable=${h} .description=${c ? c.versionIdentifier.name : ""} .heading=${c ? e.actions.editVersion : e.actions.newVersion} .selected=${t} .showBackButton=${s} @calciteFlowItemClose=${this._handleClose} ${v(this._flowItemElement)}><calcite-panel .loading=${m === "executing"}><calcite-block expanded .label=${e.headers.versionProperties}>${_}${f}${n}${b}${g}${w}</calcite-block>${o}</calcite-panel></calcite-flow-item>`;
+    const { _validationError: i, currentUser: t, messages: e, mode: s } = this, c = r`<calcite-label>${e?.input.versionName}<calcite-input-text max-length=62 name=versionName .value=${s === "create-version" ? this.#i?.versionName : this.#e?.versionName} @calciteInputTextInput=${this.#s}></calcite-input-text></calcite-label>`, a = r`<calcite-label>${e?.input.versionDescription}<calcite-text-area limit-text max-length=64 name=description resize=none rows=2 scale=s .value=${s === "create-version" ? this.#i?.description : this.#e?.description} @calciteTextAreaInput=${this.#s}></calcite-text-area></calcite-label>`, n = r`<calcite-label>${e?.input.versionAccess}<calcite-chip-group label=access @calciteChipGroupSelect=${this.#s} selection-mode=single-persist><calcite-chip .selected=${this.#e.access === "public" || s === "create-version"} label=public>${e?.accessLevels.public}</calcite-chip><calcite-chip .selected=${this.#e.access === "protected"} label=protected>${e?.accessLevels.protected}</calcite-chip><calcite-chip .selected=${this.#e.access === "private"} label=private>${e?.accessLevels.private}</calcite-chip></calcite-chip-group></calcite-label>`, l = r`<calcite-label>${e?.input.versionOwner}<calcite-input-text name=ownerName .value=${s === "create-version" ? t : this.#e.ownerName} @calciteInputTextInput=${this.#s}></calcite-input-text></calcite-label>`, h = s === "create-version" ? r`<calcite-label layout=inline><calcite-checkbox checked name=switchToVersion @calciteCheckboxChange=${this.#n}></calcite-checkbox>${e?.actions.switchToVersion}</calcite-label>` : void 0, v = i ? r`<calcite-notice closable kind=warning open scale=s width=full @calciteNoticeClose=${() => {
+      this._validationError = void 0;
+    }}><div slot=message>${i}</div></calcite-notice>` : void 0, d = r`<calcite-button appearance=outline slot=footer width=full @click=${this.#a}>${e?.actions.cancelSave}</calcite-button><calcite-button appearance=solid slot=footer width=full @click=${this.#c}>${e?.actions.saveVersion}</calcite-button>`;
+    return r`<calcite-panel><calcite-block expanded .label=${e?.headers.versionProperties}>${c}${a}${n}${l}${h}${v}</calcite-block>${d}</calcite-panel>`;
   }
 }
-$("arcgis-version-management-version-properties", x);
+p("arcgis-version-management-version-properties", f);
 export {
-  x as ArcgisVersionManagementVersionProperties
+  f as ArcgisVersionManagementVersionProperties
 };

package/dist/components/arcgis-version-management-version-properties/index.js

@@ -1,12 +1,11 @@
-import "@esri/calcite-components/components/calcite-button";
 import "@esri/calcite-components/components/calcite-label";
+import "@esri/calcite-components/components/calcite-input-text";
+import "@esri/calcite-components/components/calcite-text-area";
 import "@esri/calcite-components/components/calcite-chip-group";
 import "@esri/calcite-components/components/calcite-chip";
-import "@esri/calcite-components/components/calcite-text-area";
-import "@esri/calcite-components/components/calcite-input-text";
 import "@esri/calcite-components/components/calcite-checkbox";
 import "@esri/calcite-components/components/calcite-notice";
-import "@esri/calcite-components/components/calcite-flow-item";
+import "@esri/calcite-components/components/calcite-button";
 import "@esri/calcite-components/components/calcite-panel";
 import "@esri/calcite-components/components/calcite-block";
 export * from "./customElement.js";

package/dist/components/arcgis-video/customElement.d.ts

@@ -5,6 +5,25 @@ import type Map from "@arcgis/core/Map.js";
 import type WebMap from "@arcgis/core/WebMap.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 
+declare module "@arcgis/lumina" {
+export interface DeclareCssProperties {
+  /** _Since 4.34_ Specifies the top padding for the layout. */
+  "--arcgis-layout-overlay-space-top": "*";
+  /** _Since 4.34_ Specifies the bottom padding for the layout. */
+  "--arcgis-layout-overlay-space-bottom": "*";
+  /** _Since 4.34_ Specifies the left padding for the layout. */
+  "--arcgis-layout-overlay-space-left": "*";
+  /** _Since 4.34_ Specifies the right padding for the layout. */
+  "--arcgis-layout-overlay-space-right": "*";
+  /** _Since 5.0_ Specifies the focus outline color for the view. */
+  "--arcgis-view-color-focus": "*";
+  /** _Since 5.1_ Specifies the background color for table rows. */
+  "--arcgis-table-row-background-color": "*";
+  /** _Since 5.1_ Specifies the background color for alternate table rows. */
+  "--arcgis-table-row-alt-background-color": "*";
+}
+}
+
 /**
  * The ArcGIS Video component provides a view for displaying video feeds from a
  * [VideoLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/VideoLayer/).
@@ -14,13 +33,6 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
  * It supports various features such as navigating, zooming, and panning, making it suitable for
  * applications that require interactive video overlays.
  *
- * @cssproperty [--arcgis-layout-overlay-space-top] - _Since 4.34_ Specifies the top padding for the layout.
- * @cssproperty [--arcgis-layout-overlay-space-bottom] - _Since 4.34_ Specifies the bottom padding for the layout.
- * @cssproperty [--arcgis-layout-overlay-space-left] - _Since 4.34_ Specifies the left padding for the layout.
- * @cssproperty [--arcgis-layout-overlay-space-right] - _Since 4.34_ Specifies the right padding for the layout.
- * @cssproperty [--arcgis-view-color-focus] - _Since 5.0_ Specifies the focus outline color for the view.
- * @cssproperty [--arcgis-table-row-background-color] - _Since 5.1_ Specifies the background color for table rows.
- * @cssproperty [--arcgis-table-row-alt-background-color] - _Since 5.1_ Specifies the background color for alternate table rows.
  * @slot  - Default slot for adding components to the video. User is responsible for positioning the content via CSS.
  * @slot [top-left] - Slot for components positioned in the top-left corner.
  * @slot [top-right] - Slot for components positioned in the top-right corner.
@@ -57,9 +69,11 @@ export abstract class ArcgisVideo extends LitElement {
    */
   accessor aria: VideoView["aria"];
   /**
-   * The light or dark mode used to display the attribution.
-   * By default, the mode is inherited from the [Calcite's mode](https://developers.arcgis.com/calcite-design-system/core-concepts/#modes).
-   * You can override the value to style the attribution alongside the map or scene content.
+   * The display mode used for the attribution. Defaults to null.
+   *
+   * Set this property to "auto" to automatically synchronize the attribution with the nearest [Calcite mode](https://developers.arcgis.com/calcite-design-system/core-concepts/#modes). If no Calcite mode is detected, the attribution defaults to light mode. **The "auto" mode was added in version 5.2.**
+   *
+   * Set this property to "light" or "dark" to explicitly use that mode without synchronization.
    *
    * @since 5.0
    */
@@ -72,6 +86,15 @@ export abstract class ArcgisVideo extends LitElement {
    * prevent memory leaks.
    *
    * @default false
+   * @example
+   * ```html
+   * <arcgis-video auto-destroy-disabled></arcgis-video>
+   * ```
+   *
+   * ```js
+   * videoElement.autoDestroyDisabled = true;
+   * ```
+   * 
    */
   accessor autoDestroyDisabled: boolean;
   /** The [VideoLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/VideoLayer/) to display in the view. */

package/dist/components/arcgis-video-player/customElement.d.ts

@@ -68,6 +68,15 @@ export abstract class ArcgisVideoPlayer extends LitElement {
    * prevent memory leaks.
    *
    * @default false
+   * @example
+   * ```html
+   * <arcgis-video-player auto-destroy-disabled></arcgis-video-player>
+   * ```
+   *
+   * ```js
+   * videoPlayerElement.autoDestroyDisabled = true;
+   * ```
+   * 
    */
   accessor autoDestroyDisabled: boolean;
   /**
@@ -141,6 +150,7 @@ export abstract class ArcgisVideoPlayer extends LitElement {
       pause?: string | undefined;
       platformInfo?: string | undefined;
       play?: string | undefined;
+      playbackProgress?: string | undefined;
       playbackSpeed?: string | undefined;
       quality?: string | undefined;
       reverse?: string | undefined;
@@ -179,6 +189,7 @@ export abstract class ArcgisVideoPlayer extends LitElement {
       pause: string;
       platformInfo: string;
       play: string;
+      playbackProgress: string;
       playbackSpeed: string;
       quality: string;
       reverse: string;
@@ -215,6 +226,7 @@ export abstract class ArcgisVideoPlayer extends LitElement {
       pause: string;
       platformInfo: string;
       play: string;
+      playbackProgress: string;
       playbackSpeed: string;
       quality: string;
       reverse: string;
@@ -250,8 +262,8 @@ export abstract class ArcgisVideoPlayer extends LitElement {
   /** The current state of the component. */
   get state(): "error" | VideoState;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-video-player component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-video-player component will be associated with a map or scene component rather than using the `view` property.
    *
    * @example
    * // Set the video player view model's view to a map view.
@@ -262,7 +274,7 @@ export abstract class ArcgisVideoPlayer extends LitElement {
   destroy(): Promise<void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state" | "layer"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly arcgisVideoReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {

package/dist/components/arcgis-video-player/customElement.js

@@ -64,7 +64,7 @@ class T extends g {
     }} ${y(this._videoViewRef)}></arcgis-video>`;
   }
   _renderSlider() {
-    return this._isLive ? null : e`<arcgis-video-player-slider .buffered=${this._bufferedValue} .value=${this._currentValue * 100} .viewModel=${this.viewModel}></arcgis-video-player-slider>`;
+    return this._isLive ? null : e`<arcgis-video-player-slider .buffered=${this._bufferedValue} .messages=${this.messages} .value=${this._currentValue * 100} .viewModel=${this.viewModel}></arcgis-video-player-slider>`;
   }
   _renderActionBar() {
     return e`<arcgis-video-player-action-bar .currentTime=${this._currentTime} .duration=${this._duration} .messages=${this.messages} .toggleMetadata=${() => this._metadataVisible = !this._metadataVisible} .viewModel=${this.viewModel} .inline=${this.inline}></arcgis-video-player-action-bar>`;

package/dist/components/arcgis-video-player-actions-group/customElement.js

@@ -14,17 +14,17 @@ class f extends u {
   loaded() {
     this.manager.onLifecycle(() => [
       d(() => [this.viewModel.state, this.viewModel.playing], () => {
-        const { state: i, playing: e } = this.viewModel;
-        this._disabled = i === "not-ready" || i === "waiting", this._playing = e;
+        const { state: e, playing: i } = this.viewModel;
+        this._disabled = e === "not-ready" || e === "waiting", this._playing = i;
       }, { initial: !0 }),
-      d(() => this.viewModel.layer?.isLive, (i) => {
-        this._isLive = i ?? void 0;
+      d(() => this.viewModel.layer?.isLive, (e) => {
+        this._isLive = e ?? void 0;
       }, { initial: !0 })
     ]);
   }
   render() {
-    const { viewModel: i, messages: e, _disabled: n, _playing: a } = this, s = this._isLive, g = this._direction === "rtl", c = t`<calcite-action .active=${a} alignment=center .disabled=${n} .icon=${a ? "pause-f" : "play-f"} @click=${a ? () => i.pause() : () => i.play()} scale=s .text=${a ? e.pause : e.play}></calcite-action>`, p = s ? void 0 : t`<calcite-action alignment=center .disabled=${n} icon=reverse-f @click=${() => i.seekBackward()} scale=s .text=${e.reverse}></calcite-action>`, m = s ? void 0 : t`<calcite-action alignment=center .disabled=${n} icon=forward-f @click=${() => i.seekForward()} scale=s .text=${e.forward}></calcite-action>`, o = s ? void 0 : t`<calcite-action alignment=center .disabled=${n} icon=beginning-f @click=${() => i.seekToBeginning()} scale=s .text=${e.beginning}></calcite-action>`, l = s ? void 0 : t`<calcite-action alignment=center .disabled=${n} icon=end-f @click=${() => i.seekToEnding()} scale=s .text=${e.end}></calcite-action>`, r = this.inline ? [o, c, l] : [o, p, c, m, l];
-    return g && r.reverse(), t`<calcite-action-bar expand-disabled layout=horizontal scale=s>${r}</calcite-action-bar>`;
+    const { viewModel: e, messages: i, _disabled: n, _playing: a } = this, s = this._isLive, g = this._direction === "rtl", c = t`<calcite-action .active=${a} alignment=center .disabled=${n} .icon=${a ? "pause-f" : "play-f"} @click=${a ? () => e.pause() : () => e.play()} scale=s .text=${a ? i.pause : i.play}></calcite-action>`, p = s ? void 0 : t`<calcite-action alignment=center .disabled=${n} icon=reverse-f @click=${() => e.seekBackward()} scale=s .text=${i.reverse}></calcite-action>`, m = s ? void 0 : t`<calcite-action alignment=center .disabled=${n} icon=forward-f @click=${() => e.seekForward()} scale=s .text=${i.forward}></calcite-action>`, o = s ? void 0 : t`<calcite-action alignment=center .disabled=${n} icon=beginning-f @click=${() => e.seekToBeginning()} scale=s .text=${i.beginning}></calcite-action>`, l = s ? void 0 : t`<calcite-action alignment=center .disabled=${n} icon=end-f @click=${() => e.seekToEnding()} scale=s .text=${i.end}></calcite-action>`, r = this.inline ? [o, c, l] : [o, p, c, m, l];
+    return g && r.reverse(), t`<calcite-action-bar expand-toggle-disabled layout=horizontal scale=s>${r}</calcite-action-bar>`;
   }
 }
 v("arcgis-video-player-actions-group", f);

package/dist/components/arcgis-video-player-controls-group/customElement.js

@@ -44,7 +44,7 @@ class v extends h {
     }} .selected=${e.followingMode === "follow-frame"}><calcite-icon icon=follow scale=s slot=content-start></calcite-icon></calcite-list-item><calcite-list-item .disabled=${t && !s && !c} .label=${l.video} @click=${() => {
       e.followingMode = "follow-both";
     }} .selected=${e.followingMode === "follow-both"}><calcite-icon icon=video scale=s slot=content-start></calcite-icon></calcite-list-item></calcite-list></calcite-panel></calcite-popover><calcite-action alignment=center .disabled=${o} .icon=${u(e)} id=follow-action scale=s slot=trigger .text=${l.follow}></calcite-action></div>`, f = i`<arcgis-video-player-settings .messages=${l} .viewModel=${e}></arcgis-video-player-settings>`, p = i`<calcite-action alignment=center .disabled=${o} icon=feature-details @click=${() => this.toggleMetadata()} scale=s .text=${l.metadata}></calcite-action>`;
-    return i`<calcite-action-bar expand-disabled layout=horizontal scale=s>${[$, y, f, p]}</calcite-action-bar>`;
+    return i`<calcite-action-bar expand-toggle-disabled layout=horizontal scale=s>${[$, y, f, p]}</calcite-action-bar>`;
   }
 }
 b("arcgis-video-player-controls-group", v);