@orangelogic/design-system 2.62.0 → 2.63.0-pr81192.7

package/library/chunks/{file-on-demand.DJwg2Cpk.js → file-on-demand.BiC4cymk.js}

@@ -5,12 +5,12 @@ import { n as d, C as H } from "./lib-cortex-element.CVMmyPMC.js";
 import { c as tt } from "./component.styles.DMSLciL5.js";
 import { c as W } from "./custom-element.L4WJXn1j.js";
 import { L as q } from "./i18n.BMRLOAZR.js";
-import { k as Dt, a as bt, i as $t, w as P, S as Tt, b as Pt, c as zt, d as Et, e as Ft, f as Lt } from "./watch.q1sEjPWL.js";
+import { k as Dt, a as bt, i as $t, w as P, S as Tt, b as Pt, c as zt, d as Et, e as Lt, f as Ft } from "./watch.q1sEjPWL.js";
 import { p as R } from "./string.Cp_XNbnV.js";
-import { x as n, i as at, E as Ut } from "./lit-element.jLBm65_O.js";
+import { x as o, i as at, E as Ut } from "./lit-element.jLBm65_O.js";
 import { r as u } from "./state.CSDxrqLd.js";
 import { e as z } from "./query.BBf1UFkC.js";
-import { e as A } from "./class-map.BiVq-cVR.js";
+import { e as C } from "./class-map.BiVq-cVR.js";
 import { c as U } from "./repeat.DbF2p5ae.js";
 import { n as p } from "./when.Dr1es41R.js";
 import { a as Rt, c as kt, b as dt } from "./_baseUniq.Df-fLIBx.js";
@@ -19,10 +19,10 @@ import { C as Nt } from "./button.SoX-7UYy.js";
 import { C as jt } from "./dialog.eN3RUbwx.js";
 import Bt from "../components/divider.js";
 import ot from "../components/format-bytes.js";
-import St from "../components/icon-button.js";
+import It from "../components/icon-button.js";
 import Mt from "../components/input.js";
 import { C as Vt } from "./option.Ce_wlnZj.js";
-import It from "../components/relative-time.js";
+import St from "../components/relative-time.js";
 import Ht from "../components/select.js";
 import Wt from "../components/space.js";
 import qt from "../components/tab.js";
@@ -42,7 +42,7 @@ import ee from "../components/spinner.js";
 import { o as se } from "./style-map.llVFPd__.js";
 import { r as ie } from "./choose.BTbF6BAn.js";
 function ae(t, e, i, a) {
-  for (var s = -1, o = t == null ? 0 : t.length; ++s < o; ) {
+  for (var s = -1, n = t == null ? 0 : t.length; ++s < n; ) {
     var l = t[s];
     e(a, l, i(l), t);
   }
@@ -50,9 +50,9 @@ function ae(t, e, i, a) {
 }
 function oe(t) {
   return function(e, i, a) {
-    for (var s = -1, o = Object(e), l = a(e), h = l.length; h--; ) {
+    for (var s = -1, n = Object(e), l = a(e), h = l.length; h--; ) {
       var _ = l[++s];
-      if (i(o[_], _, o) === !1)
+      if (i(n[_], _, n) === !1)
         break;
     }
     return e;
@@ -68,21 +68,21 @@ function ce(t, e) {
       return i;
     if (!bt(i))
       return t(i, a);
-    for (var s = i.length, o = -1, l = Object(i); ++o < s && a(l[o], o, l) !== !1; )
+    for (var s = i.length, n = -1, l = Object(i); ++n < s && a(l[n], n, l) !== !1; )
       ;
     return i;
   };
 }
 var le = ce(re);
 function de(t, e, i, a) {
-  return le(t, function(s, o, l) {
+  return le(t, function(s, n, l) {
     e(a, s, i(s), l);
   }), a;
 }
 function he(t, e) {
   return function(i, a) {
-    var s = $t(i) ? ae : de, o = e ? e() : {};
-    return s(i, t, Rt(a), o);
+    var s = $t(i) ? ae : de, n = e ? e() : {};
+    return s(i, t, Rt(a), n);
   };
 }
 var pe = he(function(t, e, i) {
@@ -101,7 +101,7 @@ const ue = {
   UPLOADS: "uploads"
 }, X = 20, ge = {
   GET_CONTENT: "/webapi/extensibility/integrations/contentBrowserSDK/getcontent_4bw_v1"
-}, C = {
+}, A = {
   ASSET_PATH: "Document.AssetPath",
   CHILD_COUNT: "Document.ChildCount",
   CORTEX_PATH: "Document.CortexPath",
@@ -120,7 +120,7 @@ const ue = {
     e.getDate() + 1
   ).getTime();
   return pe(
-    t.toSorted((s, o) => o.uploadTimestamp - s.uploadTimestamp),
+    t.toSorted((s, n) => n.uploadTimestamp - s.uploadTimestamp),
     (s) => s.uploadTimestamp >= i && s.uploadTimestamp < a
   );
 }, me = ({
@@ -130,7 +130,7 @@ const ue = {
   let i = "";
   e?.trim() && (i = `Story_Title:${e}`);
   let a = "";
-  t?.length && (a = t.map((o) => `RecordID:NOT ${o}`).join(" AND "));
+  t?.length && (a = t.map((n) => `RecordID:NOT ${n}`).join(" AND "));
   let s = i ? ` AND (${[i].filter(Boolean).join(" OR ")})` : "";
   return a && (s = `${s} AND (${a})`), `(MediaType:Story OR MediaType:Album)${s}`;
 }, _e = 10, Ct = async ({
@@ -139,7 +139,7 @@ const ue = {
   folderPath: i = [],
   folderPathsSet: a,
   limit: s = _e,
-  searchText: o,
+  searchText: n,
   seeThru: l,
   siteUrl: h,
   start: _ = 0,
@@ -149,31 +149,31 @@ const ue = {
     return { data: [], totalCount: 0 };
   let g = h;
   g.endsWith("/") && (g = g.slice(0, -1));
-  const b = ge.GET_CONTENT, f = [
+  const $ = ge.GET_CONTENT, f = [
     ["Token", m],
     [
       "extraFilters",
       me({
         excludesRecordIDs: t,
-        searchText: o
+        searchText: n
       })
     ],
-    ["fields", C.ASSET_PATH],
-    ["fields", C.CORTEX_PATH],
-    ["fields", C.DOC_TYPE],
-    ["fields", C.TITLE_WITH_FALLBACK],
-    ["fields", C.HAS_BROWSER_CHILDREN],
-    ["fields", C.PARENT_FOLDER_IDENTIFIER],
-    ["fields", C.CHILD_COUNT],
+    ["fields", A.ASSET_PATH],
+    ["fields", A.CORTEX_PATH],
+    ["fields", A.DOC_TYPE],
+    ["fields", A.TITLE_WITH_FALLBACK],
+    ["fields", A.HAS_BROWSER_CHILDREN],
+    ["fields", A.PARENT_FOLDER_IDENTIFIER],
+    ["fields", A.CHILD_COUNT],
     ["objectRecordID", e],
-    ["seeThru", o?.trim() || l ? "true" : "false"],
+    ["seeThru", n?.trim() || l ? "true" : "false"],
     ["limit", s.toString()],
     ["start", _.toString()]
-  ], L = new URL(`${g}${b}`);
+  ], F = new URL(`${g}${$}`);
   f.forEach(([w, E]) => {
-    L.searchParams.append(w, E);
+    F.searchParams.append(w, E);
   });
-  const k = await fetch(L.toString(), {
+  const k = await fetch(F.toString(), {
     headers: {
       Authorization: `Bearer ${m}`
     },
@@ -189,11 +189,11 @@ const ue = {
   const rt = G.contentItems?.map((w) => {
     let E = M(
       w.fields,
-      C.TITLE_WITH_FALLBACK
+      A.TITLE_WITH_FALLBACK
     ) ?? "", B = ve(
       (M(
         w.fields,
-        C.ASSET_PATH
+        A.ASSET_PATH
       ) ?? "").replace(/^Root\//i, "")
     ) || E;
     if (a) {
@@ -201,29 +201,29 @@ const ue = {
         const ct = B.split("/"), At = ct.pop();
         B = `${ct.join("/")}/${w.recordID}-${At}`, E = `${w.recordID}-${E}`;
       }
-      o?.trim() && Y.has(E) && (E = B), a.add(B), Y.add(E);
+      n?.trim() && Y.has(E) && (E = B), a.add(B), Y.add(E);
     }
     return {
       childCount: Number(
         M(
           w.fields,
-          C.CHILD_COUNT
+          A.CHILD_COUNT
         ) ?? 0
       ),
       children: [],
       docType: M(
         w.fields,
-        C.DOC_TYPE
+        A.DOC_TYPE
       ) ?? "",
       fullPath: B,
       hasChildren: M(
         w.fields,
-        C.HAS_BROWSER_CHILDREN
+        A.HAS_BROWSER_CHILDREN
       ) === "1",
       id: w.recordID,
       parentFolderIdentifier: M(
         w.fields,
-        C.PARENT_FOLDER_IDENTIFIER
+        A.PARENT_FOLDER_IDENTIFIER
       ) ?? "",
       parents: [],
       path: [...i, E],
@@ -238,7 +238,7 @@ function M(t, e) {
   );
   return a ? t[a] : void 0;
 }
-const it = "-", S = (t) => {
+const it = "-", I = (t) => {
   const e = t.split(it), i = e.pop() ?? "", a = e.join(it);
   return { id: i, path: a };
 }, N = ({ id: t, path: e }) => [e, t].join(it), fe = (t) => {
@@ -265,12 +265,12 @@ const it = "-", S = (t) => {
 function mt(t) {
   return t.toSorted((e, i) => i.uploadTimestamp - e.uploadTimestamp);
 }
-var $e = Object.defineProperty, Se = Object.getOwnPropertyDescriptor, D = (t, e, i, a) => {
-  for (var s = a > 1 ? void 0 : a ? Se(e, i) : e, o = t.length - 1, l; o >= 0; o--)
-    (l = t[o]) && (s = (a ? l(e, i, s) : l(s)) || s);
+var $e = Object.defineProperty, Ie = Object.getOwnPropertyDescriptor, D = (t, e, i, a) => {
+  for (var s = a > 1 ? void 0 : a ? Ie(e, i) : e, n = t.length - 1, l; n >= 0; n--)
+    (l = t[n]) && (s = (a ? l(e, i, s) : l(s)) || s);
   return a && s && $e(e, i, s), s;
 };
-let v = class extends H {
+let y = class extends H {
   constructor() {
     super(...arguments), this.localize = new q(this), this.role = "treeitem", this.siteUrl = "", this.token = "", this.searchText = "", this.folder = null, this.currentRootIDsSet = /* @__PURE__ */ new Set(), this.folderPathsSet = /* @__PURE__ */ new Set(), this.removedIDs = [], this.data = null, this.totalCount = 0, this.isLoading = !1, this.fetchFolders = async ({
       folderId: t,
@@ -301,8 +301,8 @@ let v = class extends H {
       });
       if (this.data = e, this.totalCount = i, await this.updateComplete, !this.treeItem.selected && !this.treeItem.indeterminate) {
         let a = !0, s = !0;
-        for (const o of this.treeItem.getChildrenItems())
-          o.selected ? (vt(o, !0, "multiple"), s = !1) : a = !1;
+        for (const n of this.treeItem.getChildrenItems())
+          n.selected ? (vt(n, !0, "multiple"), s = !1) : a = !1;
         this.treeItem.indeterminate = !a && !s;
       }
     };
@@ -336,24 +336,24 @@ let v = class extends H {
     if (await this.updateComplete, !this.treeItem)
       return;
     let t = !1;
-    const e = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), a = xt(this.folder?.path ?? [], this.folder?.fullPath ?? ""), s = [...this.currentRootIDsSet], o = (m, g) => {
-      m.forEach((b) => {
-        const f = S(b);
+    const e = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), a = xt(this.folder?.path ?? [], this.folder?.fullPath ?? ""), s = [...this.currentRootIDsSet], n = (m, g) => {
+      m.forEach(($) => {
+        const f = I($);
         if (!f.path.trim() || !f.id.trim())
           return !1;
-        const L = R(f.path), k = R(a);
-        a && L.startsWith(k) && L !== k && g.add(be(f.path, a));
+        const F = R(f.path), k = R(a);
+        a && F.startsWith(k) && F !== k && g.add(be(f.path, a));
       });
     };
-    o(this.removedIDs, i), o(s, e);
+    n(this.removedIDs, i), n(s, e);
     let l = !!s.some((m) => {
-      const g = S(m);
+      const g = I(m);
       if (!g.path.trim() || !g.id.trim())
         return !1;
-      const b = N({
+      const $ = N({
         id: this.folder?.id ?? "",
         path: a
-      }), f = R(g.path), L = R(a), k = g.id === this.folder?.id, G = !this.removedIDs.includes(b) && L.startsWith(f);
+      }), f = R(g.path), F = R(a), k = g.id === this.folder?.id, G = !this.removedIDs.includes($) && F.startsWith(f);
       return k || G;
     });
     const h = this.folder?.childCount && e.size === this.folder?.childCount;
@@ -365,7 +365,7 @@ let v = class extends H {
         })
       );
       const m = this.parentElement?.parentElement;
-      m && m instanceof v && m.syncBoxes(), l = !1;
+      m && m instanceof y && m.syncBoxes(), l = !1;
     } else if (!l)
       if (h) {
         this.currentRootIDsSet.add(
@@ -375,16 +375,16 @@ let v = class extends H {
           })
         );
         const m = this.parentElement?.parentElement;
-        m && m instanceof v && m.syncBoxes(), l = !0;
+        m && m instanceof y && m.syncBoxes(), l = !0;
       } else e.size > 0 && (t = !0);
     l ? (t = i.size > 0, this.treeItem.selected = !0) : (t = e.size > 0, this.treeItem.selected = !1, await this.treeItem.updateComplete), t ? (this.treeItem.selected = !1, await this.treeItem.updateComplete, this.treeItem.indeterminate = !0) : this.treeItem.indeterminate = !1;
   }
   render() {
     const t = xt(this.folder?.path ?? [], this.folder?.fullPath ?? "");
-    return n`
+    return o`
       <cx-tree-item
         aria-label=${this.folder?.title ?? ""}
-        class=${A({
+        class=${C({
       "folder-tree__item": !0,
       selectable: !0
     })}
@@ -402,7 +402,7 @@ let v = class extends H {
         ${U(
       this.data ?? [],
       (e) => e.id,
-      (e) => n`<cx-folder-item
+      (e) => o`<cx-folder-item
               slot="children"
               .folder=${e}
               .siteUrl=${this.siteUrl}
@@ -414,7 +414,7 @@ let v = class extends H {
     )}
         ${p(
       this.data && this.data.length < this.totalCount,
-      () => n`
+      () => o`
             <div slot="children" class="load-more-button">
               <cx-button
                 data-testid="load-more-button"
@@ -431,40 +431,40 @@ let v = class extends H {
     `;
   }
 };
-v.styles = [tt];
-v.dependencies = {
+y.styles = [tt];
+y.dependencies = {
   "cx-icon": J,
   "cx-line-clamp": Q,
   "cx-tree-item": ft
 };
 D([
   z("cx-tree-item")
-], v.prototype, "treeItem", 2);
+], y.prototype, "treeItem", 2);
 D([
   d({
     attribute: "site-url",
     reflect: !0,
     type: String
   })
-], v.prototype, "siteUrl", 2);
+], y.prototype, "siteUrl", 2);
 D([
   d({ reflect: !0, type: String })
-], v.prototype, "token", 2);
+], y.prototype, "token", 2);
 D([
   d({ attribute: "search-text", reflect: !0, type: String })
-], v.prototype, "searchText", 2);
+], y.prototype, "searchText", 2);
 D([
   d({ type: Object })
-], v.prototype, "folder", 2);
+], y.prototype, "folder", 2);
 D([
   d({
     attribute: "current-root-ids-set",
     type: Object
   })
-], v.prototype, "currentRootIDsSet", 2);
+], y.prototype, "currentRootIDsSet", 2);
 D([
   d({ attribute: "folder-paths-set", type: Object })
-], v.prototype, "folderPathsSet", 2);
+], y.prototype, "folderPathsSet", 2);
 D([
   d({
     attribute: "removed-ids",
@@ -474,23 +474,23 @@ D([
     },
     type: String
   })
-], v.prototype, "removedIDs", 2);
+], y.prototype, "removedIDs", 2);
 D([
   u()
-], v.prototype, "data", 2);
+], y.prototype, "data", 2);
 D([
   u()
-], v.prototype, "totalCount", 2);
+], y.prototype, "totalCount", 2);
 D([
   u()
-], v.prototype, "isLoading", 2);
+], y.prototype, "isLoading", 2);
 D([
   P(["currentRootIDsSet", "removedIDs"])
-], v.prototype, "syncBoxes", 1);
-v = D([
+], y.prototype, "syncBoxes", 1);
+y = D([
   W("cx-folder-item")
-], v);
-const Ie = at`
+], y);
+const Se = at`
   .folder-tree {
     overflow: auto;
     flex: 1;
@@ -545,15 +545,15 @@ const Ie = at`
     line-height: var(--cx-line-height-small);
   }
 `;
-var we = Object.defineProperty, Ce = Object.getOwnPropertyDescriptor, I = (t, e, i, a) => {
-  for (var s = a > 1 ? void 0 : a ? Ce(e, i) : e, o = t.length - 1, l; o >= 0; o--)
-    (l = t[o]) && (s = (a ? l(e, i, s) : l(s)) || s);
+var we = Object.defineProperty, Ce = Object.getOwnPropertyDescriptor, S = (t, e, i, a) => {
+  for (var s = a > 1 ? void 0 : a ? Ce(e, i) : e, n = t.length - 1, l; n >= 0; n--)
+    (l = t[n]) && (s = (a ? l(e, i, s) : l(s)) || s);
   return a && s && we(e, i, s), s;
 };
-let y = class extends H {
+let b = class extends H {
   constructor() {
     super(...arguments), this.localize = new q(this), this.role = "tree", this.siteUrl = "", this.bearerToken = "", this.token = "", this.searchText = "", this.folders = [], this.rootIDs = [], this.totalCount = 0, this.loadMore = () => {
-    }, this.isLoading = !1, this.folderPathsSet = /* @__PURE__ */ new Set(), this.removedIDs = [], this.currentRootIDsSet = /* @__PURE__ */ new Set(), this.renderFolder = (t) => n`<cx-folder-item
+    }, this.isLoading = !1, this.folderPathsSet = /* @__PURE__ */ new Set(), this.removedIDs = [], this.currentRootIDsSet = /* @__PURE__ */ new Set(), this.renderFolder = (t) => o`<cx-folder-item
       .currentRootIDsSet=${this.currentRootIDsSet}
       .folder=${t}
       .folderPathsSet=${this.folderPathsSet}
@@ -592,30 +592,30 @@ let y = class extends H {
       if (e.selected) {
         if (!this.currentRootIDsSet.has(s)) {
           lt(e, "multiple"), this.currentRootIDsSet.add(s);
-          for (const o of e.getChildrenItems())
-            !o.id.trim() || !o.dataset.path?.trim() || this.currentRootIDsSet.add(
+          for (const n of e.getChildrenItems())
+            !n.id.trim() || !n.dataset.path?.trim() || this.currentRootIDsSet.add(
               N({
-                id: o.id,
-                path: o.dataset.path ?? ""
+                id: n.id,
+                path: n.dataset.path ?? ""
               })
             );
         }
         this.removedIDs = this.removedIDs.filter(
-          (o) => o !== s && !S(o).path.startsWith(a + "/")
+          (n) => n !== s && !I(n).path.startsWith(a + "/")
         );
       } else
         this.removedIDs.push(s), this.currentRootIDsSet.has(s) && (this.currentRootIDsSet.delete(s), lt(e, "multiple"));
-      [...this.currentRootIDsSet].forEach((o) => {
-        const l = R(a), h = S(o).path, _ = R(h);
-        _.startsWith(l) && _ !== l && (e.selected || this.currentRootIDsSet.delete(o));
+      [...this.currentRootIDsSet].forEach((n) => {
+        const l = R(a), h = I(n).path, _ = R(h);
+        _.startsWith(l) && _ !== l && (e.selected || this.currentRootIDsSet.delete(n));
       }), this.currentRootIDsSet = new Set(this.currentRootIDsSet);
     }
   }
   render() {
-    return n`
+    return o`
       <div class="folder-tree selectable">
         <cx-tree
-          class=${A({
+          class=${C({
       selectable: !0
     })}
           @cx-selected-change=${this.handleSelectedChange}
@@ -630,7 +630,7 @@ let y = class extends H {
     )}
           ${p(
       this.folders && this.folders.length < this.totalCount,
-      () => n`
+      () => o`
               <div class="load-more-button">
                 <cx-button
                   variant="text"
@@ -647,71 +647,71 @@ let y = class extends H {
     `;
   }
 };
-y.styles = [tt, Ie];
-y.dependencies = {
-  "cx-folder-item": v,
+b.styles = [tt, Se];
+b.dependencies = {
+  "cx-folder-item": y,
   "cx-tree": yt
 };
-I([
+S([
   z("cx-tree")
-], y.prototype, "tree", 2);
-I([
+], b.prototype, "tree", 2);
+S([
   d({ attribute: "site-url", reflect: !0, type: String })
-], y.prototype, "siteUrl", 2);
-I([
+], b.prototype, "siteUrl", 2);
+S([
   d({ attribute: "bearer-token", reflect: !0, type: String })
-], y.prototype, "bearerToken", 2);
-I([
+], b.prototype, "bearerToken", 2);
+S([
   d({ attribute: "token", reflect: !0, type: String })
-], y.prototype, "token", 2);
-I([
+], b.prototype, "token", 2);
+S([
   d({ attribute: "search-text", reflect: !0, type: String })
-], y.prototype, "searchText", 2);
-I([
+], b.prototype, "searchText", 2);
+S([
   d({ type: Array })
-], y.prototype, "folders", 2);
-I([
+], b.prototype, "folders", 2);
+S([
   d({ attribute: "root-ids", reflect: !0, type: Array })
-], y.prototype, "rootIDs", 2);
-I([
+], b.prototype, "rootIDs", 2);
+S([
   d({ attribute: "total-count", reflect: !0, type: Number })
-], y.prototype, "totalCount", 2);
-I([
+], b.prototype, "totalCount", 2);
+S([
   d({ attribute: "load-more", type: Function })
-], y.prototype, "loadMore", 2);
-I([
+], b.prototype, "loadMore", 2);
+S([
   d({ attribute: "is-loading", reflect: !0, type: Boolean })
-], y.prototype, "isLoading", 2);
-I([
+], b.prototype, "isLoading", 2);
+S([
   d({ attribute: "folder-paths-set", type: Object })
-], y.prototype, "folderPathsSet", 2);
-I([
+], b.prototype, "folderPathsSet", 2);
+S([
   u()
-], y.prototype, "removedIDs", 2);
-I([
+], b.prototype, "removedIDs", 2);
+S([
   u()
-], y.prototype, "currentRootIDsSet", 2);
-I([
+], b.prototype, "currentRootIDsSet", 2);
+S([
   P("rootIDs")
-], y.prototype, "handleRootIDsChange", 1);
-y = I([
+], b.prototype, "handleRootIDsChange", 1);
+b = S([
   W("cx-folder-tree")
-], y);
+], b);
 var Ae = 200;
 function De(t, e, i, a) {
-  var s = -1, o = kt, l = !0, h = t.length, _ = [], m = e.length;
+  var s = -1, n = kt, l = !0, h = t.length, _ = [], m = e.length;
   if (!h)
     return _;
-  i && (e = Jt(e, Pt(i))), e.length >= Ae && (o = zt, l = !1, e = new Tt(e));
+  i && (e = Jt(e, Pt(i))), e.length >= Ae && (n = zt, l = !1, e = new Tt(e));
   t:
     for (; ++s < h; ) {
-      var g = t[s], b = i == null ? g : i(g);
-      if (g = g !== 0 ? g : 0, l && b === b) {
+      var g = t[s], $ = i == null ? g : i(g);
+      if (g = g !== 0 ? g : 0, l && $ === $) {
         for (var f = m; f--; )
-          if (e[f] === b)
+          if (e[f] === $)
             continue t;
         _.push(g);
-      } else o(e, b, a) || _.push(g);
+      } else n(e, $, a) || _.push(g);
     }
   return _;
 }
@@ -720,10 +720,10 @@ function Te(t) {
   return $t(t) || Et(t) || !!(_t && t && t[_t]);
 }
 function Pe(t, e, i, a, s) {
-  var o = -1, l = t.length;
-  for (i || (i = Te), s || (s = []); ++o < l; ) {
-    var h = t[o];
-    i(h) ? Ft(s, h) : a || (s[s.length] = h);
+  var n = -1, l = t.length;
+  for (i || (i = Te), s || (s = []); ++n < l; ) {
+    var h = t[n];
+    i(h) ? Lt(s, h) : a || (s[s.length] = h);
   }
   return s;
 }
@@ -731,20 +731,20 @@ function ze(t, e, i) {
   var a = t.length;
   if (a < 2)
     return a ? dt(t[0]) : [];
-  for (var s = -1, o = Array(a); ++s < a; )
+  for (var s = -1, n = Array(a); ++s < a; )
     for (var l = t[s], h = -1; ++h < a; )
-      h != s && (o[s] = De(o[s] || l, t[h], e, i));
-  return dt(Pe(o), e, i);
+      h != s && (n[s] = De(n[s] || l, t[h], e, i));
+  return dt(Pe(n), e, i);
 }
 function Ee(t) {
   return Qt(t) && bt(t);
 }
 var st = Zt(function(t) {
-  return ze(Lt(t, Ee));
-}), $ = /* @__PURE__ */ ((t) => (t.Canceled = "CANCELED", t.Failed = "FAILED", t.InProgress = "INPROGRESS", t.PendingComplete = "PENDINGCOMPLETE", t.Success = "SUCCESS", t))($ || {}), Fe = Object.defineProperty, Le = Object.getOwnPropertyDescriptor, j = (t, e, i, a) => {
-  for (var s = a > 1 ? void 0 : a ? Le(e, i) : e, o = t.length - 1, l; o >= 0; o--)
-    (l = t[o]) && (s = (a ? l(e, i, s) : l(s)) || s);
-  return a && s && Fe(e, i, s), s;
+  return ze(Ft(t, Ee));
+}), v = /* @__PURE__ */ ((t) => (t.Canceled = "CANCELED", t.Failed = "FAILED", t.InProgress = "INPROGRESS", t.PendingComplete = "PENDINGCOMPLETE", t.Success = "SUCCESS", t))(v || {}), Le = Object.defineProperty, Fe = Object.getOwnPropertyDescriptor, j = (t, e, i, a) => {
+  for (var s = a > 1 ? void 0 : a ? Fe(e, i) : e, n = t.length - 1, l; n >= 0; n--)
+    (l = t[n]) && (s = (a ? l(e, i, s) : l(s)) || s);
+  return a && s && Le(e, i, s), s;
 };
 let T = class extends H {
   constructor() {
@@ -754,27 +754,27 @@ let T = class extends H {
     return Math.max(0, this.size - this.remainingSize);
   }
   get percentage() {
-    return this.size ? this.cachedSize / this.size * 100 : 0;
+    return this.size ? Math.round(this.cachedSize / this.size * 100) : 0;
   }
   createRenderRoot() {
     return this;
   }
   renderFolderSuccessText() {
-    return n`${this.childrenCount} ${this.localize.term("subfolders")},
+    return o`${this.childrenCount} ${this.localize.term("subfolders")},
     ${this.assetsCount} ${this.localize.term("assets")}`;
   }
   renderSuccess() {
-    return n`<div class="file-on-demand-pinned-status__success progress">
+    return o`<div class="file-on-demand-pinned-status__success progress">
       <cx-icon name="file_download" variant="filled"></cx-icon>
       <cx-typography variant="small">
         <cx-line-clamp lines="1">
-          ${p(this.isFolder, this.renderFolderSuccessText.bind(this), () => n`${this.localize.term("cached")}`)}
+          ${p(this.isFolder, this.renderFolderSuccessText.bind(this), () => o`${this.localize.term("cached")}`)}
         </cx-line-clamp>
       </cx-typography>
     </div>`;
   }
   renderFailed() {
-    return n`<div class="file-on-demand-pinned-status__failed progress">
+    return o`<div class="file-on-demand-pinned-status__failed progress">
       <cx-icon name="file_download_off" variant="filled"></cx-icon>
       <cx-typography variant="small">
         <cx-line-clamp lines="1">
@@ -784,7 +784,7 @@ let T = class extends H {
     </div>`;
   }
   renderCanceled() {
-    return n`<div class="file-on-demand-pinned-status__canceled progress">
+    return o`<div class="file-on-demand-pinned-status__canceled progress">
       <cx-icon name="file_download_off" variant="filled"></cx-icon>
       <cx-typography variant="small">
         <cx-line-clamp lines="1">
@@ -794,7 +794,7 @@ let T = class extends H {
     </div>`;
   }
   renderInProgress() {
-    return n`<div class="file-on-demand-pinned-status__in-progress progress">
+    return o`<div class="file-on-demand-pinned-status__in-progress progress">
       <cx-icon name="downloading" variant="filled"></cx-icon>
       <cx-typography variant="small">
         <cx-line-clamp lines="1">
@@ -805,13 +805,13 @@ let T = class extends H {
     </div>`;
   }
   render() {
-    return n`<div class="file-on-demand-pinned-status">
+    return o`<div class="file-on-demand-pinned-status">
       ${ie(this.uploadStatus, [
-      [$.Success, this.renderSuccess.bind(this)],
-      [$.Failed, this.renderFailed.bind(this)],
-      [$.InProgress, this.renderInProgress.bind(this)],
-      [$.PendingComplete, this.renderInProgress.bind(this)],
-      [$.Canceled, this.renderCanceled.bind(this)]
+      [v.Success, this.renderSuccess.bind(this)],
+      [v.Failed, this.renderFailed.bind(this)],
+      [v.InProgress, this.renderInProgress.bind(this)],
+      [v.PendingComplete, this.renderInProgress.bind(this)],
+      [v.Canceled, this.renderCanceled.bind(this)]
     ])}
     </div>`;
   }
@@ -870,7 +870,7 @@ const Ue = at`
     display: flex;
     gap: var(--cx-spacing-small);
   }
-  .asset:hover {
+  :host(:hover) {
     background-color: var(--cx-input-filled-background-color-hover);
   }
 
@@ -1020,10 +1020,14 @@ const Ue = at`
     line-height: var(--cx-font-size-medium);
   }
 
-  .uploading-progress cx-icon {
+  .uploading-progress.in-progress cx-icon {
     color: var(--cx-color-primary-500);
   }
 
+  .uploading-progress.paused cx-icon {
+    color: var(--cx-color-warning-500);
+  }
+
   .syncing-progress cx-icon {
     color: var(--cx-color-warning);
   }
@@ -1056,22 +1060,23 @@ const Ue = at`
   }
 `;
 var Re = Object.defineProperty, ke = Object.getOwnPropertyDescriptor, V = (t, e, i, a) => {
-  for (var s = a > 1 ? void 0 : a ? ke(e, i) : e, o = t.length - 1, l; o >= 0; o--)
-    (l = t[o]) && (s = (a ? l(e, i, s) : l(s)) || s);
+  for (var s = a > 1 ? void 0 : a ? ke(e, i) : e, n = t.length - 1, l; n >= 0; n--)
+    (l = t[n]) && (s = (a ? l(e, i, s) : l(s)) || s);
   return a && s && Re(e, i, s), s;
 };
-let F = class extends H {
+let L = class extends H {
   constructor() {
     super(...arguments), this.localize = new q(this), this.favoriteInProgressAssets = [], this.pinInProgressAssets = [], this.thumbnailLoadError = !1;
   }
-  get showFailedActions() {
-    return this.listType === x.PINNED ? !1 : this.asset.uploadStatus === $.Failed;
+  /** Failed or canceled uploads: show open-in-drive and retry. */
+  get showRetryableUploadActions() {
+    return this.listType === x.PINNED ? !1 : this.asset.uploadStatus === v.Failed || this.asset.uploadStatus === v.Canceled;
   }
   get showInProgressActions() {
-    return this.listType === x.PINNED ? !1 : this.asset.uploadStatus === $.InProgress;
+    return this.listType === x.PINNED ? !1 : this.asset.uploadStatus === v.InProgress;
   }
   get showNormalActions() {
-    return this.listType === x.PINNED ? !1 : [$.Success, $.PendingComplete].includes(
+    return this.listType === x.PINNED ? !1 : [v.Success, v.PendingComplete].includes(
       this.asset.uploadStatus
     ) || !this.asset.uploadStatus?.trim();
   }
@@ -1166,33 +1171,46 @@ let F = class extends H {
       }
     });
   }
+  cancelUpload(t) {
+    this.emit("cx-cancel-upload", {
+      detail: {
+        assetId: t
+      }
+    });
+  }
   handlePauseUploadClick() {
     this.asset.uploadId && (this.asset.isPaused ? this.resumeUpload(this.asset.uploadId) : this.pauseUpload(this.asset.uploadId));
   }
+  handleCancelUploadClick() {
+    this.asset.uploadId && this.cancelUpload(this.asset.uploadId);
+  }
   renderProgress({
     isPaused: t = !1,
     progress: e = 0,
     remainingTime: i,
     size: a = 0,
     timestamp: s = Date.now(),
-    uploadErrorMessage: o,
-    uploadStatus: l = $.InProgress
+    uploadErrorMessage: n,
+    uploadStatus: l = v.InProgress
   }) {
-    const h = a > 0 ? e * 100 / a : 0, _ = l === $.InProgress ? h : 100, m = n`
-      <div class="progress uploading-progress">
-        ${p(!t, () => n`<cx-icon name="arrow_upward"></cx-icon>`)}
+    const h = a > 0 ? e * 100 / a : 0, _ = l === v.InProgress ? h : 100, m = o`
+      <div class=${C({
+      "in-progress": l === v.InProgress,
+      paused: t,
+      progress: !0,
+      "uploading-progress": !0
+    })}>
+        ${p(t, () => o`<cx-icon name="pause" variant="filled"></cx-icon>`, () => o`<cx-icon name="arrow_upward"></cx-icon>`)}
         <cx-typography variant="small">
           <cx-line-clamp lines="1">
-            ${p(t, () => n`${this.localize.term("paused")} ‧`)}
+            ${p(t, () => o`${this.localize.term("paused")} ‧`)}
             <cx-format-bytes .value=${e}></cx-format-bytes>
             ${this.localize.term("of")}
             <cx-format-bytes .value=${a}></cx-format-bytes>
-            (${new Intl.NumberFormat(void 0, {
-      maximumFractionDigits: 2
-    }).format(h)}%)
+            (${Math.round(h)}%)
             ${p(
       !!i && !t,
-      () => n`‧
+      () => o`‧
                   <cx-relative-time
                     format="narrow"
                     numeric="always"
@@ -1204,7 +1222,7 @@ let F = class extends H {
           </cx-line-clamp>
         </cx-typography>
       </div>
-    `, g = n`
+    `, g = o`
       <div class="progress syncing-progress">
         <cx-icon name="cached"></cx-icon>
         <cx-typography variant="small">
@@ -1220,7 +1238,7 @@ let F = class extends H {
           </cx-line-clamp>
         </cx-typography>
       </div>
-    `, b = n`
+    `, $ = o`
       <div class="progress completed-progress">
         <cx-icon name="check"></cx-icon>
         <cx-typography variant="small">
@@ -1236,11 +1254,13 @@ let F = class extends H {
           </cx-line-clamp>
         </cx-typography>
       </div>
-    `, f = n`
+    `, f = o`
       <div class="progress failed-progress">
         <cx-typography variant="small">
           <cx-line-clamp lines="1">
-            <cx-tooltip content=${o || this.localize.term("uploadFailed")}>
+            <cx-tooltip
+              content=${n || this.localize.term("uploadFailed")}
+            >
               <span class="failed-progress__text">
                 ${this.localize.term("uploadFailed")} ‧
               </span>
@@ -1255,7 +1275,7 @@ let F = class extends H {
           </cx-line-clamp>
         </cx-typography>
       </div>
-    `, L = n`
+    `, F = o`
       <div class="progress canceled-progress">
         <cx-icon name="cancel"></cx-icon>
         <cx-typography variant="small">
@@ -1272,10 +1292,10 @@ let F = class extends H {
         </cx-typography>
       </div>
     `;
-    return n`
+    return o`
       ${p(
-      l === $.InProgress,
-      () => n`<cx-progress-bar
+      l === v.InProgress,
+      () => o`<cx-progress-bar
               style=${se({
         "--color": t ? "var(--cx-color-warning-500)" : "var(--cx-color-primary-500)"
       })}
@@ -1285,16 +1305,16 @@ let F = class extends H {
             >${m}`
     )}
       ${p(
-      l === $.PendingComplete,
+      l === v.PendingComplete,
       () => g
     )}
-      ${p(l === $.Success, () => b)}
-      ${p(l === $.Failed, () => f)}
-      ${p(l === $.Canceled, () => L)}
+      ${p(l === v.Success, () => $)}
+      ${p(l === v.Failed, () => f)}
+      ${p(l === v.Canceled, () => F)}
     `;
   }
   renderUploadingStatus() {
-    return n`
+    return o`
       ${this.renderProgress({
       isPaused: this.asset.isPaused,
       progress: (this.asset.size ?? 0) - (this.asset.remainingSize ?? 0),
@@ -1307,7 +1327,7 @@ let F = class extends H {
     `;
   }
   renderPinnedStatus() {
-    return n`<cx-file-on-demand-pinned-status
+    return o`<cx-file-on-demand-pinned-status
       size=${this.asset.size ?? 0}
       remaining-size=${this.asset.remainingSize ?? 0}
       upload-status=${this.asset.uploadStatus}
@@ -1317,18 +1337,18 @@ let F = class extends H {
     ></cx-file-on-demand-pinned-status>`;
   }
   renderThumbnailContent() {
-    return this.isFolder ? this.listType === x.FAVORITES ? n`<cx-icon
+    return this.isFolder ? this.listType === x.FAVORITES ? o`<cx-icon
           class="asset__folder__icon"
           name="folder_special"
-        ></cx-icon>` : n`<cx-icon class="asset__folder__icon" name="topic"></cx-icon>` : n`${p(
+        ></cx-icon>` : o`<cx-icon class="asset__folder__icon" name="topic"></cx-icon>` : o`${p(
       !!this.thumbnailUrl,
-      () => n`<img
-          alt=${this.asset.fileName}
-          class="asset__thumbnail__image"
-          src=${this.thumbnailUrl}
-          @error=${this.handleImgError}
-          @load=${this.handleImgLoad}
-        />`
+      () => o`<img
+            alt=${this.asset.fileName}
+            class="asset__thumbnail__image"
+            src=${this.thumbnailUrl}
+            @error=${this.handleImgError}
+            @load=${this.handleImgLoad}
+          />`
     )}
       <cx-icon
         class="asset__thumbnail__icon"
@@ -1350,8 +1370,8 @@ let F = class extends H {
       </div>`;
   }
   renderThumbnail() {
-    return n`<div
-      class=${A({
+    return o`<div
+      class=${C({
       asset__thumbnail: !0,
       "asset__thumbnail--folder": this.isFolder,
       "asset__thumbnail--placeholder": this.showThumbnailPlaceholder
@@ -1360,18 +1380,21 @@ let F = class extends H {
       ${this.renderThumbnailContent()}
     </div>`;
   }
+  renderOpenDriveButton() {
+    return o`<cx-tooltip content=${this.localize.term("openInDrive")} hoist>
+      <cx-icon-button
+        data-testid="asset__drive-button"
+        name="folder_open"
+        @click=${this.handleOpenDriveClick}
+      ></cx-icon-button>
+    </cx-tooltip>`;
+  }
   renderNormalActions() {
-    return n`<cx-tooltip content=${this.localize.term("openInDrive")} hoist>
-        <cx-icon-button
-          data-testid="asset__drive-button"
-          name="folder_open"
-          @click=${this.handleOpenDriveClick}
-        ></cx-icon-button>
-      </cx-tooltip>
+    return o`${this.renderOpenDriveButton()}
       ${p(
       this.favoriteInProgressAssets.includes(this.asset.recordId),
-      () => n`<cx-spinner class="asset__actions__spinner"></cx-spinner>`,
-      () => n`<cx-tooltip
+      () => o`<cx-spinner class="asset__actions__spinner"></cx-spinner>`,
+      () => o`<cx-tooltip
             content=${this.asset.isInFavorite ? this.localize.term("unfavorite") : this.localize.term("favorite")}
             hoist
           >
@@ -1384,33 +1407,43 @@ let F = class extends H {
           </cx-tooltip>`
     )} `;
   }
-  renderFailedActions() {
-    return n`<cx-tooltip content=${this.localize.term("retry")} hoist>
-      <cx-icon-button
-        data-testid="asset__retry-button"
-        name="refresh"
-        @click=${this.handleRetryUploadClick}
-      ></cx-icon-button>
-    </cx-tooltip>`;
+  renderRetryableUploadActions() {
+    return o`${this.renderOpenDriveButton()}
+      <cx-tooltip content=${this.localize.term("retry")} hoist>
+        <cx-icon-button
+          data-testid="asset__retry-button"
+          name="refresh"
+          @click=${this.handleRetryUploadClick}
+        ></cx-icon-button>
+      </cx-tooltip>`;
   }
   renderInProgressActions() {
-    return n`<cx-tooltip
-      content=${this.asset.isPaused ? this.localize.term("resume") : this.localize.term("pause")}
-      hoist
-    >
-      <cx-icon-button
-        data-testid=${this.asset.isPaused ? "asset__resume-button" : "asset__pause-button"}
-        name=${this.asset.isPaused ? "play_arrow" : "pause"}
-        variant="filled"
-        @click=${this.handlePauseUploadClick}
-      ></cx-icon-button>
-    </cx-tooltip>`;
+    return o`
+      <cx-tooltip
+        content=${this.asset.isPaused ? this.localize.term("resume") : this.localize.term("pause")}
+        hoist
+      >
+        <cx-icon-button
+          data-testid=${this.asset.isPaused ? "asset__resume-button" : "asset__pause-button"}
+          name=${this.asset.isPaused ? "play_arrow" : "pause"}
+          variant="filled"
+          @click=${this.handlePauseUploadClick}
+        ></cx-icon-button>
+      </cx-tooltip>
+      <cx-tooltip content=${this.localize.term("cancel")} hoist>
+        <cx-icon-button
+          data-testid="asset__cancel-button"
+          name="close"
+          @click=${this.handleCancelUploadClick}
+        ></cx-icon-button>
+      </cx-tooltip>
+    `;
   }
   renderPinnedActions() {
-    return n`${p(
+    return o`${p(
       this.pinInProgressAssets.includes(this.asset.recordId),
-      () => n`<cx-spinner class="asset__actions__spinner"></cx-spinner>`,
-      () => n`<cx-tooltip
+      () => o`<cx-spinner class="asset__actions__spinner"></cx-spinner>`,
+      () => o`<cx-tooltip
           content=${this.asset.isPinned ? this.localize.term("unpin") : this.localize.term("pin")}
           hoist
         >
@@ -1424,7 +1457,7 @@ let F = class extends H {
     )} `;
   }
   render() {
-    return n`
+    return o`
       <div
         data-id=${this.asset.recordId}
         data-testid=${`asset-${this.asset.uploadStatus}`}
@@ -1442,7 +1475,7 @@ let F = class extends H {
           <div class="asset__description__status">
             ${p(
       this.listType === x.RECENT,
-      () => n`
+      () => o`
                 <cx-typography
                   variant="small"
                   class="asset__description__status__time"
@@ -1473,35 +1506,38 @@ let F = class extends H {
       this.showInProgressActions,
       () => this.renderInProgressActions()
     )}
-          ${p(this.showFailedActions, () => this.renderFailedActions())}
+          ${p(
+      this.showRetryableUploadActions,
+      () => this.renderRetryableUploadActions()
+    )}
           ${p(this.showPinnedActions, () => this.renderPinnedActions())}
         </div>
       </div>
     `;
   }
 };
-F.styles = [tt, Ue];
-F.dependencies = {
+L.styles = [tt, Ue];
+L.dependencies = {
   "cx-file-on-demand-pinned-status": T,
   "cx-format-bytes": ot,
   "cx-icon": J,
-  "cx-icon-button": St,
+  "cx-icon-button": It,
   "cx-line-clamp": Q,
   "cx-progress-bar": te,
-  "cx-relative-time": It,
+  "cx-relative-time": St,
   "cx-spinner": ee,
   "cx-tooltip": wt,
   "cx-typography": nt
 };
 V([
   d({ type: Object })
-], F.prototype, "asset", 2);
+], L.prototype, "asset", 2);
 V([
   d({
     attribute: "list-type",
     type: String
   })
-], F.prototype, "listType", 2);
+], L.prototype, "listType", 2);
 V([
   d({
     attribute: "favorite-in-progress-assets",
@@ -1511,7 +1547,7 @@ V([
     },
     type: String
   })
-], F.prototype, "favoriteInProgressAssets", 2);
+], L.prototype, "favoriteInProgressAssets", 2);
 V([
   d({
     attribute: "pin-in-progress-assets",
@@ -1521,13 +1557,13 @@ V([
     },
     type: String
   })
-], F.prototype, "pinInProgressAssets", 2);
+], L.prototype, "pinInProgressAssets", 2);
 V([
   u()
-], F.prototype, "thumbnailLoadError", 2);
-F = V([
+], L.prototype, "thumbnailLoadError", 2);
+L = V([
   W("cx-file-on-demand-asset")
-], F);
+], L);
 const Oe = at`
   :host {
     --asset-height: 40px;
@@ -1723,6 +1759,7 @@ const Oe = at`
     display: flex;
     flex-direction: column;
     overflow-y: auto;
+    overflow-x: hidden;
     padding: 0 0 var(--cx-spacing-x-small) 0;
   }
 
@@ -2069,8 +2106,8 @@ const Oe = at`
   }
 `;
 var Ne = Object.defineProperty, je = Object.getOwnPropertyDescriptor, c = (t, e, i, a) => {
-  for (var s = a > 1 ? void 0 : a ? je(e, i) : e, o = t.length - 1, l; o >= 0; o--)
-    (l = t[o]) && (s = (a ? l(e, i, s) : l(s)) || s);
+  for (var s = a > 1 ? void 0 : a ? je(e, i) : e, n = t.length - 1, l; n >= 0; n--)
+    (l = t[n]) && (s = (a ? l(e, i, s) : l(s)) || s);
   return a && s && Ne(e, i, s), s;
 };
 let r = class extends H {
@@ -2116,8 +2153,8 @@ let r = class extends H {
           start: s,
           token: this.token
         });
-      } catch (o) {
-        o instanceof Error && o.message === "Failed to fetch" && this.emit("cx-renew-token");
+      } catch (n) {
+        n instanceof Error && n.message === "Failed to fetch" && this.emit("cx-renew-token");
       }
       return {
         data: this.availableFolderIdentifiers,
@@ -2338,7 +2375,7 @@ let r = class extends H {
     const t = () => {
       this.openDrive();
     };
-    return n`
+    return o`
       <div class="header">
         <div class="header__user">
           <cx-avatar
@@ -2376,7 +2413,7 @@ let r = class extends H {
             >
               ${p(
       this.hasNewVersion,
-      () => n`<cx-badge
+      () => o`<cx-badge
                     class="settings__version__badge"
                     slot="badge"
                     variant="danger"
@@ -2392,7 +2429,7 @@ let r = class extends H {
   }
   // #region Assets
   renderAsset(t, e) {
-    return n`<cx-file-on-demand-asset
+    return o`<cx-file-on-demand-asset
       .asset=${t}
       .listType=${e}
       .favoriteInProgressAssets=${this.favoriteInProgressAssets}
@@ -2400,7 +2437,7 @@ let r = class extends H {
     ></cx-file-on-demand-asset>`;
   }
   renderRecentAssets() {
-    const t = n`
+    const t = o`
       <div class="recent-empty assets-list__tab-group__empty-message">
         <cx-icon class="empty-icon" name="explore"></cx-icon>
         <cx-typography variant="body2">
@@ -2409,10 +2446,10 @@ let r = class extends H {
       </div>
     `, [e, i] = ut(
       this.recentAssets.assets
-    ), a = n`
+    ), a = o`
       <div class="recent__list" @scroll=${this.requestMoreRecentAssets}>
         <div
-          class=${A({
+          class=${C({
       empty: e.length === 0,
       recent__today: !0
     })}
@@ -2430,7 +2467,7 @@ let r = class extends H {
     )}
         </div>
         <div
-          class=${A({
+          class=${C({
       empty: i.length === 0,
       recent__other: !0
     })}
@@ -2448,7 +2485,7 @@ let r = class extends H {
         </div>
       </div>
     `;
-    return n`
+    return o`
       <cx-tab-panel
         name=${x.RECENT}
         class="assets-list__recent-tab-panel"
@@ -2462,14 +2499,14 @@ let r = class extends H {
     `;
   }
   renderFavoriteAssets() {
-    const t = n`
+    const t = o`
       <div class="favorites-empty assets-list__tab-group__empty-message">
         <cx-icon class="empty-icon" name="star"></cx-icon>
         <cx-typography variant="body2">
           ${this.localize.term("allFavoriteAssetsWillBeVisibleHere")}
         </cx-typography>
       </div>
-    `, e = mt(this.favoriteAssets.assets), i = n`
+    `, e = mt(this.favoriteAssets.assets), i = o`
       <div class="favorites__list" @scroll=${this.requestMoreFavoriteAssets}>
         ${U(
       e,
@@ -2478,7 +2515,7 @@ let r = class extends H {
     )}
       </div>
     `;
-    return n`
+    return o`
       <cx-tab-panel
         name=${x.FAVORITES}
         class="assets-list__favorites-tab-panel"
@@ -2506,7 +2543,7 @@ let r = class extends H {
     `;
   }
   renderUploadingAssets() {
-    const t = n`
+    const t = o`
       <div class="uploads-empty assets-list__tab-group__empty-message">
         <cx-icon class="empty-icon" name="arrow_upward"></cx-icon>
         <cx-typography variant="body2">
@@ -2515,10 +2552,10 @@ let r = class extends H {
       </div>
     `, [e, i] = ut(
       this.uploadingAssets.assets
-    ), a = n`
+    ), a = o`
       <div class="uploads__list" @scroll=${this.requestMoreUploadingAssets}>
         <div
-          class=${A({
+          class=${C({
       empty: e.length === 0,
       recent__today: !0
     })}
@@ -2544,7 +2581,7 @@ let r = class extends H {
     )}
         </div>
         <div
-          class=${A({
+          class=${C({
       empty: i.length === 0,
       uploads__other: !0
     })}
@@ -2562,7 +2599,7 @@ let r = class extends H {
         </div>
       </div>
     `;
-    return n`
+    return o`
       <cx-tab-panel
         name=${x.UPLOADS}
         class="assets-list__uploads-tab-panel"
@@ -2576,14 +2613,14 @@ let r = class extends H {
     `;
   }
   renderPinnedAssets() {
-    const t = n`
+    const t = o`
       <div class="pinned-empty assets-list__tab-group__empty-message">
         <cx-icon class="empty-icon" name="keep"></cx-icon>
         <cx-typography variant="body2">
           ${this.localize.term("allPinnedAssetsWillBeVisibleHere")}
         </cx-typography>
       </div>
-    `, e = mt(this.pinnedAssets.assets), i = n`
+    `, e = mt(this.pinnedAssets.assets), i = o`
       <div class="pinned__list" @scroll=${this.requestMorePinnedAssets}>
         ${U(
       e,
@@ -2592,7 +2629,7 @@ let r = class extends H {
     )}
       </div>
     `;
-    return n`
+    return o`
       <cx-tab-panel
         name=${x.PINNED}
         class="assets-list__pinned-tab-panel"
@@ -2608,7 +2645,7 @@ let r = class extends H {
     `;
   }
   renderAssetsList() {
-    return n`
+    return o`
       <div class="assets-list">
         <cx-tab-group
           @cx-tab-show=${async (e) => {
@@ -2666,7 +2703,7 @@ let r = class extends H {
     `;
   }
   renderAssetsView() {
-    return n`
+    return o`
       <div class="assets">
         ${this.renderHeader()}${this.renderAssetsList()}${this.renderStatusFooter()}
       </div>
@@ -2689,47 +2726,47 @@ let r = class extends H {
       this.isAddingRootIDs = !0, await this.updateComplete, this.searchText = "";
       const s = this.rootIDs.filter((h) => {
         if (!this.folderTree.shadowRoot?.querySelector(
-          `[data-id="${S(h).id}"]`
+          `[data-id="${I(h).id}"]`
         ))
           return !0;
-      }), o = /* @__PURE__ */ new Set([
+      }), n = /* @__PURE__ */ new Set([
         ...this.folderTree.currentRootIDs,
         ...s
       ]);
-      for (const h of o) {
-        const _ = R(S(h).path), m = this.folderTree.removedIDs.filter(
-          (g) => R(S(g).path).startsWith(_)
+      for (const h of n) {
+        const _ = R(I(h).path), m = this.folderTree.removedIDs.filter(
+          (g) => R(I(g).path).startsWith(_)
         );
         if (m.length > 0) {
           const { totalCount: g } = await this.fetchFolders({
-            excludes: m.map((f) => S(f).id),
-            folderId: S(h).id,
+            excludes: m.map((f) => I(f).id),
+            folderId: I(h).id,
             start: 0
-          }), { data: b } = await this.fetchFolders({
-            excludes: m.map((f) => S(f).id),
-            folderId: S(h).id,
+          }), { data: $ } = await this.fetchFolders({
+            excludes: m.map((f) => I(f).id),
+            folderId: I(h).id,
             limit: g || 10,
             start: 0
           });
-          b.forEach((f) => {
-            o.add(
+          $.forEach((f) => {
+            n.add(
               N({ id: f.id, path: f.fullPath })
             );
-          }), o.delete(h);
+          }), n.delete(h);
         }
       }
-      const l = Array.from(o);
+      const l = Array.from(n);
       this.updateActiveFolderIdentifiers(l), this.removedIds = l.filter(
         (h) => [...l].some((_) => {
-          const m = S(h), g = S(_), b = R(g.path);
-          return _ !== h && m.path.startsWith(b);
+          const m = I(h), g = I(_), $ = R(g.path);
+          return _ !== h && m.path.startsWith($);
         })
       ), e(), this.isAddingRootIDs = !1;
     }, a = (s) => {
-      const o = s.target;
-      this.searchText = (o.value ?? "").trim();
+      const n = s.target;
+      this.searchText = (n.value ?? "").trim();
     };
-    return n`
+    return o`
       <cx-dialog
         class="select-folders-popup"
         no-header
@@ -2767,7 +2804,7 @@ let r = class extends H {
   }
   renderSelectableFolderTree() {
     const t = this.availableFolderIdentifiers;
-    return n`
+    return o`
       <cx-folder-tree
         class="selectable-folder-tree"
         .siteUrl=${this.settings.config.siteUrl}
@@ -2790,24 +2827,24 @@ let r = class extends H {
     ), e = (a) => {
       this.updateActiveFolderIdentifiers(
         t.filter(
-          (s) => S(s).id !== a
+          (s) => I(s).id !== a
         )
       ), this.folderTree.rootIDs = this.rootIDs, this.folderTree.resetTree();
     }, i = (a) => {
-      const { id: s, path: o } = S(a), l = () => {
+      const { id: s, path: n } = I(a), l = () => {
         e(s);
       };
-      return n`
+      return o`
         <cx-tree-item
           data-id=${s}
-          class=${A({
+          class=${C({
         "folder-tree__item": !0
       })}
         >
           <div class="folder-tree__label">
             <cx-icon class="folder-tree__icon" name="folder"></cx-icon>
             <cx-line-clamp lines="1" class="folder-tree__label__value">
-              ${o}
+              ${n}
             </cx-line-clamp>
           </div>
           <cx-tooltip
@@ -2823,7 +2860,7 @@ let r = class extends H {
         </cx-tree-item>
       `;
     };
-    return n`
+    return o`
       <div data-testid="root-folder-tree" class="folder-tree">
         <cx-tree selection="none">
           ${U(
@@ -2840,7 +2877,7 @@ let r = class extends H {
     t.target.value === "custom" ? (this._activeFoldersMode = !0, this.rootIDs = this.settings.config.rootIDs ?? []) : (this._activeFoldersMode = !1, this.rootIDs = []);
   }
   renderGeneralSettings() {
-    const t = n`
+    const t = o`
       <div class="settings-group settings__active-folder">
         <cx-typography variant="h5">
           ${this.localize.term("activeFolders")}
@@ -2862,13 +2899,13 @@ let r = class extends H {
         </cx-select>
         ${p(
       this._activeFoldersMode,
-      () => n`
+      () => o`
             ${this.renderRootFolderTree()} ${this.renderSelectFoldersPopup()}
           `
     )}
       </div>
     `;
-    return n`
+    return o`
       <div class="settings__general">
         ${t}
         <div class="settings-group settings__software">
@@ -2889,7 +2926,7 @@ let r = class extends H {
             </div>
             ${p(
       this.hasNewVersion,
-      () => n`<div class="settings__software__version__value">
+      () => o`<div class="settings__software__version__value">
                   <cx-badge
                     class="settings__version__badge"
                     slot="badge"
@@ -2991,7 +3028,7 @@ let r = class extends H {
     await this.updateComplete, this.cacheLocationValueText?.handleResize();
   }
   renderAdvancedSettings() {
-    const t = n`<cx-tooltip
+    const t = o`<cx-tooltip
       content=${this.localize.term("openDrive")}
       hoist
     >
@@ -3002,7 +3039,7 @@ let r = class extends H {
         @click=${this.openCacheLocation}
       ></cx-icon-button>
     </cx-tooltip>`;
-    return n`
+    return o`
       <div class="settings__advanced">
         <div class="settings-group settings__proxy">
           <cx-typography variant="h5">Proxy</cx-typography>
@@ -3155,7 +3192,7 @@ let r = class extends H {
     const t = () => {
       this.hideSettings();
     };
-    return n`
+    return o`
       <div class="settings">
         <form class="settings__form" @submit=${(i) => {
       i.preventDefault(), this.saveSettings();
@@ -3208,34 +3245,34 @@ let r = class extends H {
   }
   // #endregion
   renderStatusFooter() {
-    const t = n`
+    const t = o`
       <cx-typography class="error-message" variant="small">
         ${this.localize.term("fileOnDemandSyncErrorMessage")}
       </cx-typography>
     `, e = () => {
       switch (this.connectionStatus) {
         case "excellent":
-          return n`
+          return o`
             <cx-icon variant="filled" name="check_circle"></cx-icon>
           `;
         case "good":
-          return n` <cx-icon variant="filled" name="circle"></cx-icon> `;
+          return o` <cx-icon variant="filled" name="circle"></cx-icon> `;
         case "bad":
-          return n` <cx-icon variant="filled" name="circle"></cx-icon> `;
+          return o` <cx-icon variant="filled" name="circle"></cx-icon> `;
       }
     }, i = () => {
       switch (this.assetIndexSyncStatus) {
         case "loaded":
-          return n`
+          return o`
             <cx-icon variant="filled" name="check_circle"></cx-icon>
           `;
         case "loading":
-          return n` <cx-icon variant="filled" name="cached"></cx-icon> `;
+          return o` <cx-icon variant="filled" name="cached"></cx-icon> `;
         case "error":
-          return n` <cx-icon variant="filled" name="error"></cx-icon> `;
+          return o` <cx-icon variant="filled" name="error"></cx-icon> `;
       }
-    }, a = n`<div
-      class=${A({
+    }, a = o`<div
+      class=${C({
       "connection-status": !0,
       "connection-status--bad": this.connectionStatus === "bad",
       "connection-status--excellent": this.connectionStatus === "excellent",
@@ -3259,7 +3296,7 @@ let r = class extends H {
         </div>
       </cx-tooltip>
     </div>`, s = this.settings.cacheUsage >= this.settings.cacheSize;
-    return n`
+    return o`
       <cx-divider class="status-footer__divider"></cx-divider>
       <div class="status-footer">
         <div class="connected-url">
@@ -3274,7 +3311,7 @@ let r = class extends H {
         </div>
         ${a}
         <div
-          class=${A({
+          class=${C({
       "asset-index-sync-status": !0,
       "asset-index-sync-status--error": this.assetIndexSyncStatus === "error",
       "asset-index-sync-status--loaded": this.assetIndexSyncStatus === "loaded",
@@ -3304,7 +3341,7 @@ let r = class extends H {
                   <cx-format-bytes .value=${this.settings.cacheSize}></cx-format-bytes>
                 </cx-typography>
               </cx-line-clamp>
-              ${p(s, () => n`<cx-icon class="cache-usage__warning-icon" name="warning" variant="filled"></cx-icon>`)}
+              ${p(s, () => o`<cx-icon class="cache-usage__warning-icon" name="warning" variant="filled"></cx-icon>`)}
             </cx-space>
           </cx-tooltip>
         </div>
@@ -3318,7 +3355,7 @@ let r = class extends H {
     K(e) || (this.validConnectionUrl = !1);
   }
   renderWelcomeView() {
-    return n`
+    return o`
       <div class="welcome">
         <div class="welcome__message">
           <cx-typography variant="h5">
@@ -3345,7 +3382,7 @@ let r = class extends H {
               type="submit"
               ?loading=${this.isConnecting}
               variant="primary"
-              class=${A({
+              class=${C({
       "welcome__connect-button": !0,
       "welcome__connect-button--disabled": !this.siteUrl.trim() || !this.validConnectionUrl
     })}
@@ -3358,7 +3395,7 @@ let r = class extends H {
             type="button"
             ?loading=${this.isCancellingConnection}
             variant="text"
-            class=${A({
+            class=${C({
       "welcome__cancel-connection-button": !0
     })}
             ?disabled=${!this.isConnecting}
@@ -3381,16 +3418,16 @@ let r = class extends H {
     return this.connectionEstablished ? this.isSettingsOpened ? this.renderSettingsView() : this.renderAssetsView() : this.renderWelcomeView();
   }
   renderLoadingOverlay() {
-    return n`
+    return o`
       <div class="loading-overlay">
         <cx-spinner></cx-spinner>
       </div>
     `;
   }
   render() {
-    return n`
+    return o`
       <div
-        class=${A({
+        class=${C({
       container: !0,
       "container--connected": this.connectionEstablished,
       "container--user-interaction-blocked": this.userInteractionBlocked
@@ -3410,15 +3447,15 @@ r.dependencies = {
   "cx-confirm-popover": Kt,
   "cx-dialog": jt,
   "cx-divider": Bt,
-  "cx-file-on-demand-asset": F,
-  "cx-folder-tree": y,
+  "cx-file-on-demand-asset": L,
+  "cx-folder-tree": b,
   "cx-format-bytes": ot,
   "cx-icon": J,
-  "cx-icon-button": St,
+  "cx-icon-button": It,
   "cx-input": Mt,
   "cx-line-clamp": Q,
   "cx-option": Vt,
-  "cx-relative-time": It,
+  "cx-relative-time": St,
   "cx-select": Ht,
   "cx-space": Wt,
   "cx-tab": qt,