@ynput/ayon-frontend-shared 0.6.5 → 0.6.7

package/dist/chunks/ReviewablesSelector.es.js

@@ -1,32 +1,32 @@
 import { jsxs as w, jsx as n, Fragment as me } from "react/jsx-runtime";
 import g, { css as It, keyframes as Wn } from "styled-components";
 import { forwardRef as le, useRef as K, useState as U, useEffect as Z, useMemo as X, Fragment as Xn, useCallback as ee, useImperativeHandle as Qn } from "react";
-import { Icon as G, InputNumber as pn, Button as H, IconSelect as Jn, InputText as Ae, Dialog as qe, FormLayout as Et, FormRow as te, Dropdown as pe, LockedInput as Zn, InputSwitch as De, Spacer as mn, SaveButton as gn, theme as fe } from "@ynput/ayon-react-components";
+import { Icon as Y, InputNumber as pn, Button as H, IconSelect as Jn, InputText as Ae, Dialog as qe, FormLayout as Et, FormRow as te, Dropdown as pe, LockedInput as Zn, InputSwitch as De, Spacer as mn, SaveButton as gn, theme as fe } from "@ynput/ayon-react-components";
 import { U as eo } from "./PlayableIcon.es.js";
 import J from "clsx";
-import { kebabCase as Me, isEqual as Bt, uniqueId as Ge, startCase as Tt, camelCase as ut, upperFirst as to } from "lodash";
+import { kebabCase as Me, isEqual as Bt, uniqueId as Ye, startCase as Tt, camelCase as ut, upperFirst as to } from "lodash";
 import { createPortal as hn } from "react-dom";
 import { DndContext as We, closestCenter as Xe, DragOverlay as Nt, useSensors as Pt, useSensor as _t, PointerSensor as Dt } from "@dnd-kit/core";
-import { useSortable as Qe, SortableContext as Re, verticalListSortingStrategy as Oe, arrayMove as At } from "@dnd-kit/sortable";
+import { useSortable as Qe, SortableContext as Oe, verticalListSortingStrategy as Le, arrayMove as At } from "@dnd-kit/sortable";
 import { CSS as Je } from "@dnd-kit/utilities";
 import { I as no } from "./InfoMessage.es.js";
 import { S as vn } from "./SimpleForm.es.js";
 import { br as oo, aY as ro, bp as fn, bn, bq as Ut, bg as io, b1 as ao, bm as yn, bj as xn, bi as so } from "./searchTerms.es.js";
 import { bk as lo, bq as co, cD as uo, be as po, dB as ae, cl as mo } from "./getUris.es.js";
 import "primereact/confirmdialog";
-import { u as go, g as ho, v as vo } from "./Watchers.es.js";
+import { l as go, b as ho, v as vo } from "./Watchers.es.js";
 import { matchSorter as Ht } from "match-sorter";
 import { J as fo } from "./JsonViewer.es.js";
 import "@module-federation/enhanced/runtime";
-import { d as wn, a as bo, a9 as Ze, u as et, x as Sn } from "./DeleteEntitiesContextInstance.es.js";
-import { toast as yo } from "react-toastify";
+import { toast as bo } from "react-toastify";
+import { d as wn, a as yo, a9 as Ze, u as et, x as Sn } from "./DeleteEntitiesContextInstance.es.js";
 import "uuid";
 import "semver";
 import "./ContextMenuContextInstance.es.js";
 import "react-redux";
 import { g as ve } from "./iconUtils.es.js";
 import { Link as xo } from "react-router-dom";
-import { aX as Q, a as ke, b as tt, b3 as wo, b8 as So, aw as xe, aY as oe, ad as ko, a$ as zt, aZ as jt, b0 as Kt, b9 as Co } from "./MetaWidget.es.js";
+import { aY as Q, a as ke, b as tt, b4 as wo, b9 as So, ax as xe, aZ as oe, ae as ko, b0 as zt, a_ as jt, b1 as Kt, ba as Co } from "./MetaWidget.es.js";
 import "@tanstack/react-table";
 import "date-fns";
 import "lexical";
@@ -43,11 +43,11 @@ import { useDebounce as To } from "primereact/hooks";
 import { c as No, a as kn, C as Cn, g as Po } from "./ColumnDropIndicator.es.js";
 import { M as _o, D as Do, R as Ao } from "./realtimeUpdatesUtils.es.js";
 import "@tanstack/react-virtual";
-import { a as Ro } from "./ColumnDropIndicator.styled.es.js";
+import { a as Oo } from "./ColumnDropIndicator.styled.es.js";
 import { g as In } from "./getEntityTypeIcon.es.js";
 import "./MenuItem.es.js";
 import "./EmptyPlaceholder.es.js";
-import { M as Oo, a as Lo, c as $o } from "./Menu.es.js";
+import { M as Lo, a as Ro, c as $o } from "./Menu.es.js";
 import { a as En } from "./VersionUploadContextInstance.es.js";
 import { Skeleton as Fo } from "primereact/skeleton";
 import Mo from "react-perfect-scrollbar";
@@ -180,7 +180,7 @@ const Bo = g.div`
     padding: 2px;
     font-size: 20px;
   }
-`, Ko = "__everyone__", Go = "__guests__", Gt = "group:", Yt = "team:", qt = "user:", Wt = "guest:", Yo = g(G)`
+`, Ko = "__everyone__", Yo = "__guests__", Yt = "group:", Gt = "team:", qt = "user:", Wt = "guest:", Go = g(Y)`
   font-size: ${({ $size: e }) => `${e}px`};
   &.withBackground {
     display: flex;
@@ -199,9 +199,9 @@ const Bo = g.div`
   withTooltip: s = !0
 }) => {
   let i = e, v = t;
-  i || (t.startsWith(qt) ? (i = "user", v = t.slice(qt.length)) : t.startsWith(Gt) ? (i = "group", v = t.slice(Gt.length)) : t.startsWith(Yt) ? (i = "team", v = t.slice(Yt.length)) : t.startsWith(Wt) && (i = "guest", v = t.slice(Wt.length)));
+  i || (t.startsWith(qt) ? (i = "user", v = t.slice(qt.length)) : t.startsWith(Yt) ? (i = "group", v = t.slice(Yt.length)) : t.startsWith(Gt) ? (i = "team", v = t.slice(Gt.length)) : t.startsWith(Wt) && (i = "guest", v = t.slice(Wt.length)));
   const f = (c, l) => /* @__PURE__ */ n(
-    Yo,
+    Go,
     {
       className: J({ withBackground: a }),
       icon: c,
@@ -210,7 +210,7 @@ const Bo = g.div`
       $size: a ? r - 6 : r
     }
   );
-  return i === "user" ? /* @__PURE__ */ n(eo, { name: v, fullName: s ? o : void 0, size: r }) : i === "group" ? f("shield_person", "Access group") : i === "team" ? f("groups", "Team") : i === "guest" || t === Go ? f("badge", "Guest user") : t === Ko ? f("groups", "Everyone with access to the project") : f("person");
+  return i === "user" ? /* @__PURE__ */ n(eo, { name: v, fullName: s ? o : void 0, size: r }) : i === "group" ? f("shield_person", "Access group") : i === "team" ? f("groups", "Team") : i === "guest" || t === Yo ? f("badge", "Guest user") : t === Ko ? f("groups", "Everyone with access to the project") : f("person");
 }, ys = le(
   ({
     name: e,
@@ -288,7 +288,7 @@ const Bo = g.div`
   flex-direction: column;
   align-items: center;
   gap: 8px;
-`, Rt = It`
+`, Ot = It`
   display: flex;
   align-items: center;
   gap: 8px;
@@ -317,7 +317,7 @@ const Bo = g.div`
     opacity: 0;
   }
 `, er = g.div`
-  ${Rt}
+  ${Ot}
   cursor: pointer;
   user-select: none;
   padding: 8px;
@@ -378,13 +378,13 @@ const Bo = g.div`
   user-select: none;
   min-width: 80px;
 `, _e = g.div`
-  ${Rt}
+  ${Ot}
   &.footer {
     justify-content: space-between;
     padding: 0 8px;
   }
 `, Xt = g.div`
-  ${Rt}
+  ${Ot}
   gap: 4px;
 `, or = g.div`
   border-radius: 4px;
@@ -635,16 +635,16 @@ const Bo = g.div`
             className: J(i?.header?.className, { expanded: u }),
             children: [
               p && /* @__PURE__ */ n(or, { style: { backgroundColor: p } }),
-              l && /* @__PURE__ */ n(G, { className: "icon", icon: l }),
+              l && /* @__PURE__ */ n(Y, { className: "icon", icon: l }),
               /* @__PURE__ */ w("span", { children: [
                 " ",
                 c,
                 " "
               ] }),
               /* @__PURE__ */ n("span", { className: "spacer" }),
-              /* @__PURE__ */ n(G, { className: "icon toggle-expand", icon: u ? "collapse_all" : "expand_all" }),
+              /* @__PURE__ */ n(Y, { className: "icon toggle-expand", icon: u ? "collapse_all" : "expand_all" }),
               /* @__PURE__ */ n(
-                G,
+                Y,
                 {
                   ...d,
                   ...y,
@@ -695,7 +695,7 @@ const Bo = g.div`
   }, [t, s, a]), {
     items: i,
     handleAddItem: (h) => {
-      f([...i, { ...e(), ...h, id: Ge() }]);
+      f([...i, { ...e(), ...h, id: Ye() }]);
     },
     handleRemoveItem: (h) => () => {
       f([...i.slice(0, h), ...i.slice(h + 1)]);
@@ -714,7 +714,7 @@ const Bo = g.div`
     handleDuplicateItem: (h, k) => {
       f([
         ...i.slice(0, h + 1),
-        { ...i[h], id: Ge(), ...k },
+        { ...i[h], id: Ye(), ...k },
         ...i.slice(h + 1)
       ]);
     },
@@ -744,7 +744,7 @@ const Bo = g.div`
     v = i + o + s++;
   return v;
 }, lr = () => ({
-  id: Ge(),
+  id: Ye(),
   isExpanded: !0,
   label: "",
   value: "",
@@ -756,7 +756,7 @@ const Bo = g.div`
   icon: r || void 0,
   color: a || void 0
 })), dr = (e) => e.map(({ label: t, value: o, icon: r, color: a }) => ({
-  id: Ge(),
+  id: Ye(),
   isExpanded: !1,
   label: t,
   value: o.toString(),
@@ -805,7 +805,7 @@ const Bo = g.div`
         onDragStart: u,
         onDragEnd: y,
         children: [
-          /* @__PURE__ */ n(Re, { items: s, strategy: Oe, children: s.map((C, b) => /* @__PURE__ */ n(
+          /* @__PURE__ */ n(Oe, { items: s, strategy: Le, children: s.map((C, b) => /* @__PURE__ */ n(
             Zt,
             {
               item: C,
@@ -851,7 +851,7 @@ const Bo = g.div`
       }
     )
   ] }) });
-}, Pn = ({ icon: e, color: t, reserveSpace: o }) => oo(e) ? /* @__PURE__ */ n("img", { src: e, alt: "" }) : e ? /* @__PURE__ */ n(G, { icon: e, style: { color: t } }) : o ? /* @__PURE__ */ n("span", { className: "icon-slot" }) : null, nt = g.div`
+}, Pn = ({ icon: e, color: t, reserveSpace: o }) => oo(e) ? /* @__PURE__ */ n("img", { src: e, alt: "" }) : e ? /* @__PURE__ */ n(Y, { icon: e, style: { color: t } }) : o ? /* @__PURE__ */ n("span", { className: "icon-slot" }) : null, nt = g.div`
   display: flex;
   align-items: center;
   gap: var(--base-gap-small);
@@ -998,7 +998,7 @@ const Bo = g.div`
     [x, P]
   ), N = $.some((T) => !!T.icon), B = (T) => {
     T.stopPropagation(), T.key === "Escape" && o();
-  }, R = () => !d.length && !h ? /* @__PURE__ */ n(we, { children: "This resolver has no context params." }) : /* @__PURE__ */ w(Et, { children: [
+  }, O = () => !d.length && !h ? /* @__PURE__ */ n(we, { children: "This resolver has no context params." }) : /* @__PURE__ */ w(Et, { children: [
     h && /* @__PURE__ */ n(te, { label: "user", children: /* @__PURE__ */ n(
       Dn,
       {
@@ -1012,7 +1012,7 @@ const Bo = g.div`
         V,
         {
           value: r[T],
-          onChange: (F) => a((L) => ({ ...L, [T]: F }))
+          onChange: (F) => a((R) => ({ ...R, [T]: F }))
         }
       ) : /* @__PURE__ */ n(we, { children: "Not supported in debug." }) }, T);
     })
@@ -1050,7 +1050,7 @@ const Bo = g.div`
         /* @__PURE__ */ w(hr, { children: [
           /* @__PURE__ */ w(pt, { children: [
             /* @__PURE__ */ n(mt, { children: "Context Params" }),
-            R()
+            O()
           ] }),
           /* @__PURE__ */ w(pt, { children: [
             /* @__PURE__ */ n(mt, { children: "Form" }),
@@ -1085,7 +1085,7 @@ const Bo = g.div`
   flex-direction: column;
   gap: var(--base-gap-large);
   flex: 1;
-`, Ye = g.span`
+`, Ge = g.span`
   color: var(--md-sys-color-outline);
   white-space: pre-line;
 `, He = g.div`
@@ -1143,14 +1143,14 @@ const Bo = g.div`
   if (i)
     return /* @__PURE__ */ n(He, { children: Array.from({ length: gt + 1 }).map((d, h) => /* @__PURE__ */ n(Dr, { className: "loading" }, h)) });
   if (v)
-    return /* @__PURE__ */ n(He, { children: /* @__PURE__ */ w(Ye, { children: [
+    return /* @__PURE__ */ n(He, { children: /* @__PURE__ */ w(Ge, { children: [
       'Could not load options for "',
       e,
       '"',
       f ? `: ${f}` : "."
     ] }) });
   if (!c.length)
-    return /* @__PURE__ */ n(He, { children: /* @__PURE__ */ w(Ye, { children: [
+    return /* @__PURE__ */ n(He, { children: /* @__PURE__ */ w(Ge, { children: [
       Ir,
       l.length > 0 && ` This could be because in context parameters (${l.join(
         ", "
@@ -1168,7 +1168,7 @@ const Bo = g.div`
       " more"
     ] })
   ] });
-}, Rr = ({
+}, Or = ({
   enumValues: e,
   enumResolver: t,
   enumResolverSettings: o,
@@ -1206,12 +1206,12 @@ const Bo = g.div`
         onChange: (m) => r(m?.length ? m : void 0)
       }
     ) : /* @__PURE__ */ w(me, { children: [
-      !v && !d && /* @__PURE__ */ w(Ye, { children: [
+      !v && !d && /* @__PURE__ */ w(Ge, { children: [
         'Resolver "',
         t,
         '" is not available on this server. Options will be empty.'
       ] }),
-      d?.description && /* @__PURE__ */ n(Ye, { children: d.description }),
+      d?.description && /* @__PURE__ */ n(Ge, { children: d.description }),
       C && /* @__PURE__ */ n(
         _r,
         {
@@ -1287,13 +1287,13 @@ const Bo = g.div`
   { value: "number", label: "Number", icon: ve("number", "integer") },
   { value: "checkbox", label: "Checkbox", icon: ve("checkbox", "boolean") },
   { value: "datetime", label: "Date and time", icon: ve("datetime", "datetime") }
-], Or = {
+], Lr = {
   text: ["minLength", "maxLength", "regex"],
   select: ["enum"],
   number: ["ge", "gt", "le", "lt"],
   checkbox: [],
   datetime: []
-}, Lr = {
+}, Rr = {
   checkbox: ["example"]
 }, wt = (e, t, o) => {
   switch (e) {
@@ -1421,13 +1421,13 @@ const Bo = g.div`
     ), k(e.data?.type === "float"));
   }, [e]);
   const C = !e, b = (I, _) => {
-    u((O) => O && { ...O, [I]: _ });
+    u((L) => L && { ...L, [I]: _ });
   }, m = (I, _) => {
-    u((O) => {
-      if (!O || !O.data)
-        return O;
-      const M = { ...O.data, [I]: _ };
-      return { ...O, data: M };
+    u((L) => {
+      if (!L || !L.data)
+        return L;
+      const M = { ...L.data, [I]: _ };
+      return { ...L, data: M };
     });
   };
   let x = "";
@@ -1463,34 +1463,34 @@ const Bo = g.div`
     (!I?.scope || I?.scope?.some((_) => p?.scope?.includes(_))) && $.push(I.value);
   });
   const N = [
-    ...Or[y] ?? [],
+    ...Lr[y] ?? [],
     ...y === "select" && p?.data?.type === "list_of_strings" ? ["minItems", "maxItems"] : []
-  ], B = Lr[y] ?? [];
+  ], B = Rr[y] ?? [];
   $ = [...$, ...N].filter((I) => !B.includes(I));
-  const R = {
+  const O = {
     enum: (I = [], _) => /* @__PURE__ */ n(
-      Rr,
+      Or,
       {
         enumValues: I,
         enumResolver: p?.data?.enumResolver,
         enumResolverSettings: p?.data?.enumResolverSettings,
         onChangeEnum: _,
         onChangeResolver: z,
-        onChangeResolverSettings: (O) => m("enumResolverSettings", O)
+        onChangeResolverSettings: (L) => m("enumResolverSettings", L)
       }
     ),
     inherit: (I, _) => /* @__PURE__ */ n(
       De,
       {
         checked: I,
-        onChange: (O) => _(O.target.checked)
+        onChange: (L) => _(L.target.checked)
       }
     ),
     booleanDefault: (I, _) => /* @__PURE__ */ n(
       De,
       {
         checked: I,
-        onChange: (O) => _(O.target.checked)
+        onChange: (L) => _(L.target.checked)
       }
     )
   }, z = (I) => {
@@ -1501,7 +1501,7 @@ const Bo = g.div`
   }, V = (I) => {
     const _ = I[0];
     d(_), m("type", $r(_, h)), _ !== "select" && (m("enum", void 0), m("enumResolver", void 0), m("enumResolverSettings", void 0), m("minItems", void 0), m("maxItems", void 0)), _ !== "text" && p?.data?.regex && m("regex", ""), m("widget", void 0);
-  }, L = Ke.find((I) => I.value === y)?.widgets;
+  }, R = Ke.find((I) => I.value === y)?.widgets;
   return /* @__PURE__ */ n(
     qe,
     {
@@ -1551,15 +1551,15 @@ const Bo = g.div`
               style: { flex: 1 }
             }
           ),
-          L && L.length > 0 && /* @__PURE__ */ n(
+          R && R.length > 0 && /* @__PURE__ */ n(
             pe,
             {
               value: [
-                p.data.widget || L.find((I) => I.isDefault)?.value || xt
+                p.data.widget || R.find((I) => I.isDefault)?.value || xt
               ],
               disabled: p.builtin,
               dataKey: "value",
-              options: L,
+              options: R,
               onChange: (I) => m("widget", I[0] === xt ? void 0 : I[0]),
               style: { flex: 0.5 }
             }
@@ -1589,12 +1589,12 @@ const Bo = g.div`
         ) }),
         $.map((I) => {
           if (s.includes(I)) return null;
-          let _ = null, O = to(I);
+          let _ = null, L = to(I);
           if (I === "enum" || I === "inherit") {
-            const M = R[I];
-            _ = M(p?.data[I], (Y) => m(I, Y));
+            const M = O[I];
+            _ = M(p?.data[I], (G) => m(I, G));
           } else if (I === "default" && p?.data?.type === "boolean")
-            _ = R.booleanDefault(
+            _ = O.booleanDefault(
               p?.data[I],
               (M) => m(I, M)
             );
@@ -1607,9 +1607,9 @@ const Bo = g.div`
                 isMin: I === "ge",
                 isFloat: p?.data?.type === "float",
                 onChange: (M) => {
-                  const Y = M.ge !== void 0 ? Number(M.ge) : void 0, ne = M.le !== void 0 ? Number(M.le) : void 0;
+                  const G = M.ge !== void 0 ? Number(M.ge) : void 0, ne = M.le !== void 0 ? Number(M.le) : void 0;
                   // @ts-expect-error
-                  M.ge !== void 0 && isNaN(Y) || // @ts-expect-error
+                  M.ge !== void 0 && isNaN(G) || // @ts-expect-error
                   M.le !== void 0 && isNaN(ne) || u((re) => {
                     if (!re || !re.data) return re;
                     const be = { ...re.data, ...M };
@@ -1617,10 +1617,10 @@ const Bo = g.div`
                   });
                 }
               }
-            ), O = I === "ge" ? "Min" : "Max";
+            ), L = I === "ge" ? "Min" : "Max";
           } else {
-            const M = (Y) => {
-              const ne = Y.target.value;
+            const M = (G) => {
+              const ne = G.target.value;
               switch (I) {
                 case "minLength":
                 case "maxLength":
@@ -1646,7 +1646,7 @@ const Bo = g.div`
           return /* @__PURE__ */ n(
             te,
             {
-              label: O,
+              label: L,
               style: {
                 alignItems: "flex-start"
               },
@@ -1703,7 +1703,7 @@ const Bo = g.div`
     width: 24px;
     height: 24px;
   }
-`, Cs = g(G)`
+`, Cs = g(Y)`
   width: 20px;
   height: 20px;
   min-width: 20px;
@@ -1813,7 +1813,7 @@ const Bo = g.div`
   { value: "hero", label: "Hero", short: "Hero", icon: "star" },
   { value: "latestDone", label: "Latest Done", short: "Done", icon: "check_circle" },
   { value: "latest", label: "Latest", short: "Latest", icon: "fiber_new" }
-], As = St.map((e) => e.value), Gr = ({ id: e, label: t }) => {
+], As = St.map((e) => e.value), Yr = ({ id: e, label: t }) => {
   const { attributes: o, listeners: r, setNodeRef: a, transform: s, transition: i, isDragging: v } = Qe({
     id: e
   }), f = {
@@ -1829,12 +1829,12 @@ const Bo = g.div`
       ...o,
       ...r,
       children: /* @__PURE__ */ w(An, { children: [
-        /* @__PURE__ */ n(Rn, { children: /* @__PURE__ */ n(G, { icon: "drag_indicator" }) }),
-        /* @__PURE__ */ n(On, { children: t })
+        /* @__PURE__ */ n(On, { children: /* @__PURE__ */ n(Y, { icon: "drag_indicator" }) }),
+        /* @__PURE__ */ n(Ln, { children: t })
       ] })
     }
   );
-}, Rs = ({ value: e, onChange: t }) => {
+}, Os = ({ value: e, onChange: t }) => {
   const [o, r] = U(null), a = Pt(
     _t(Dt, {
       activationConstraint: {
@@ -1860,11 +1860,11 @@ const Bo = g.div`
     }
     r(null);
   }, f = o ? St.find((c) => c.value === o) : null;
-  return /* @__PURE__ */ w(Yr, { children: [
+  return /* @__PURE__ */ w(Gr, { children: [
     /* @__PURE__ */ w(Xr, { children: [
       /* @__PURE__ */ n("span", { className: "label", children: "Product's featured version priority" }),
       /* @__PURE__ */ n(
-        G,
+        Y,
         {
           icon: "info",
           "data-tooltip": "Choose which version will be displayed on the product card. The first available from the list will be used.",
@@ -1881,22 +1881,22 @@ const Bo = g.div`
         onDragEnd: v,
         children: [
           /* @__PURE__ */ n(
-            Re,
+            Oe,
             {
               items: s.map((c) => c.value),
-              strategy: Oe,
-              children: /* @__PURE__ */ n(qr, { children: s.map((c) => /* @__PURE__ */ n(Gr, { id: c.value, label: c.label }, c.value)) })
+              strategy: Le,
+              children: /* @__PURE__ */ n(qr, { children: s.map((c) => /* @__PURE__ */ n(Yr, { id: c.value, label: c.label }, c.value)) })
             }
           ),
           /* @__PURE__ */ n(Nt, { children: f && /* @__PURE__ */ w(An, { className: "overlay", children: [
-            /* @__PURE__ */ n(Rn, { children: /* @__PURE__ */ n(G, { icon: "drag_indicator" }) }),
-            /* @__PURE__ */ n(On, { children: f.label })
+            /* @__PURE__ */ n(On, { children: /* @__PURE__ */ n(Y, { icon: "drag_indicator" }) }),
+            /* @__PURE__ */ n(Ln, { children: f.label })
           ] }) })
         ]
       }
     )
   ] });
-}, Yr = g.div`
+}, Gr = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-small);
@@ -1931,11 +1931,11 @@ const Bo = g.div`
   &:active {
     cursor: grabbing;
   }
-`, Rn = g.div`
+`, On = g.div`
   display: flex;
   align-items: center;
   color: var(--md-sys-color-outline);
-`, On = g.span`
+`, Ln = g.span`
   font-weight: 500;
   color: var(--md-sys-color-on-surface);
 `, Xr = g.div`
@@ -1952,8 +1952,8 @@ const Bo = g.div`
   .icon {
     cursor: pointer;
   }
-`, Os = le(
-  ({ tooltip: e = "This page will deprecated in a future version", ...t }, o) => /* @__PURE__ */ n(G, { icon: "ad_off", "data-tooltip": e, ...t, ref: o })
+`, Ls = le(
+  ({ tooltip: e = "This page will deprecated in a future version", ...t }, o) => /* @__PURE__ */ n(Y, { icon: "ad_off", "data-tooltip": e, ...t, ref: o })
 ), Qr = g(H)`
   transition: color 0.2s, background-color 0.2s, opacity 0.2s;
 
@@ -1987,9 +1987,9 @@ const Bo = g.div`
   &.rounded {
     border-radius: var(--border-radius-xl);
   }
-`, Ls = le(
+`, Rs = le(
   ({ feature: e, variant: t = "outline", rounded: o = !0, bolt: r = !1, ...a }, s) => {
-    const { setPowerpackDialog: i } = bo(), v = (f) => {
+    const { setPowerpackDialog: i } = yo(), v = (f) => {
       i(e), a.onClick?.(f);
     };
     return /* @__PURE__ */ w(
@@ -2007,7 +2007,7 @@ const Bo = g.div`
         "data-tooltip-delay": 0,
         children: [
           a.children,
-          r && /* @__PURE__ */ n(G, { icon: "bolt", filled: !0, className: "bolt" })
+          r && /* @__PURE__ */ n(Y, { icon: "bolt", filled: !0, className: "bolt" })
         ]
       }
     );
@@ -2042,7 +2042,7 @@ const Bo = g.div`
   }
 
   .icon {
-    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;
+    font-variation-settings: 'FILL' 1;
   }
 
   .cancelButton {
@@ -2144,7 +2144,7 @@ const Bo = g.div`
         "Update ",
         i,
         " ",
-        /* @__PURE__ */ n(G, { icon: "arrow_right_alt" })
+        /* @__PURE__ */ n(Y, { icon: "arrow_right_alt" })
       ] }) })
     ] }) : `Required ${i} version installed already.`;
   }
@@ -2211,10 +2211,10 @@ const Bo = g.div`
         variant: "text",
         className: "setting-option",
         children: [
-          u.icon && /* @__PURE__ */ n(G, { icon: u.icon }),
+          u.icon && /* @__PURE__ */ n(Y, { icon: u.icon }),
           /* @__PURE__ */ n("span", { className: "title", children: u.title }),
           !!u.preview?.toString() && /* @__PURE__ */ n("span", { className: "preview", children: u.preview }),
-          /* @__PURE__ */ n(G, { icon: "chevron_right", className: "arrow" })
+          /* @__PURE__ */ n(Y, { icon: "chevron_right", className: "arrow" })
         ]
       },
       u.id
@@ -2301,7 +2301,7 @@ const Bo = g.div`
 
   &.active {
     .icon {
-      font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 10;
+      font-variation-settings: 'FILL' 1;
     }
   }
 
@@ -2331,7 +2331,7 @@ const Bo = g.div`
       ref: c,
       children: [
         o,
-        e.icon && /* @__PURE__ */ n(G, { icon: e.icon }),
+        e.icon && /* @__PURE__ */ n(Y, { icon: e.icon }),
         /* @__PURE__ */ w("span", { className: "label", children: [
           e.path && /* @__PURE__ */ w("span", { className: "label-path", children: [
             e.path,
@@ -2346,7 +2346,7 @@ const Bo = g.div`
             onClick: s ? void 0 : y,
             ...d,
             children: [
-              l && /* @__PURE__ */ n(G, { icon: l }),
+              l && /* @__PURE__ */ n(Y, { icon: l }),
               d.children
             ]
           },
@@ -2461,7 +2461,7 @@ const Bo = g.div`
         // the row actions arm their own gestures
         h.target.closest(".action") ? void 0 : y?.(h)
       ),
-      startContent: f ? y ? /* @__PURE__ */ n(G, { icon: "drag_indicator", className: "hover-swap" }) : void 0 : /* @__PURE__ */ n("div", { ...i, className: "drag-handle", children: /* @__PURE__ */ n(G, { icon: "drag_indicator" }) })
+      startContent: f ? y ? /* @__PURE__ */ n(Y, { icon: "drag_indicator", className: "hover-swap" }) : void 0 : /* @__PURE__ */ n("div", { ...i, className: "drag-handle", children: /* @__PURE__ */ n(Y, { icon: "drag_indicator" }) })
     }
   );
 }, nn = ({
@@ -2513,10 +2513,10 @@ const Bo = g.div`
     z-index: 1;
     opacity: 0;
   }
-`, Ln = "text_fields", $n = ({
+`, Rn = "text_fields", $n = ({
   field: e,
   parentScope: t
-}) => e ? Q(e) : t ? In(t) : Ln, mi = (e) => e.length === 1 ? `${e[0].charAt(0).toUpperCase() + e[0].slice(1)} attributes` : "Attributes", Fn = (e = [], t = []) => [
+}) => e ? Q(e) : t ? In(t) : Rn, mi = (e) => e.length === 1 ? `${e[0].charAt(0).toUpperCase() + e[0].slice(1)} attributes` : "Attributes", Fn = (e = [], t = []) => [
   {
     id: "attributes",
     label: mi(e),
@@ -2599,7 +2599,7 @@ const Bo = g.div`
   const { menuOpen: o, setMenuOpen: r } = et();
   return Z(() => {
     !t.length && o === e && r(!1);
-  }, [t.length, o, e, r]), /* @__PURE__ */ n(Oo, { targetId: e, id: e, align: "left", children: /* @__PURE__ */ n(Lo, { menu: t, onClose: () => r(!1) }) });
+  }, [t.length, o, e, r]), /* @__PURE__ */ n(Lo, { targetId: e, id: e, align: "left", children: /* @__PURE__ */ n(Ro, { menu: t, onClose: () => r(!1) }) });
 }, gi = 300, Bn = ({
   columnVisibility: e,
   defaultColumnVisibility: t,
@@ -2715,25 +2715,25 @@ const Bo = g.div`
   search: S,
   onSearchChange: P
 }) => {
-  const [$, N] = U(null), [B, R] = U(!1), [z, T] = U(!1), [V, F] = U(!1), L = (E) => !!c && E === "name", {
+  const [$, N] = U(null), [B, O] = U(!1), [z, T] = U(!1), [V, F] = U(!1), R = (E) => !!c && E === "name", {
     baseVisibility: I,
     displayVisibility: _,
-    isVisible: O,
+    isVisible: L,
     onPaintStart: M,
-    onPaintEnter: Y,
+    onPaintEnter: G,
     toggle: ne,
     cancelPaint: re
   } = Bn({
     columnVisibility: o,
     defaultColumnVisibility: u,
     updateColumnVisibility: r,
-    isLocked: L
+    isLocked: R
   }), { toggleMenuOpen: be } = et(), ye = K(null), ue = K({ columnVisibility: o, updateColumnVisibility: r });
   ue.current = { columnVisibility: o, updateColumnVisibility: r };
-  const Le = K(null);
+  const Re = K(null);
   Z(() => {
-    if (!t || Le.current === t || !e.some((j) => j.value === t)) return;
-    Le.current = t;
+    if (!t || Re.current === t || !e.some((j) => j.value === t)) return;
+    Re.current = t;
     const { columnVisibility: E, updateColumnVisibility: D } = ue.current;
     ae(E, t, u) || D({ ...E, [t]: !0 });
   }, [t, e, u]), Z(() => {
@@ -2745,7 +2745,7 @@ const Bo = g.div`
         distance: 5
       }
     })
-  ), $e = I, Ce = (E) => !O(E), { visibleColumns: ge, pinnedColumns: ce } = X(() => {
+  ), $e = I, Ce = (E) => !L(E), { visibleColumns: ge, pinnedColumns: ce } = X(() => {
     const E = e.filter(
       (W) => ae($e, W.value, u)
     ), D = E.filter((W) => a.left?.includes(W.value));
@@ -2782,13 +2782,13 @@ const Bo = g.div`
     () => Vn({
       columns: e,
       onToggle: ne,
-      isColumnVisible: O,
+      isColumnVisible: L,
       onPaintStart: M,
-      onPaintEnter: Y,
+      onPaintEnter: G,
       scopes: x
     }),
-    [e, _, ne, M, Y, x]
-  ), Te = C ?? Ee, Lt = typeof S == "string" ? /* @__PURE__ */ n(
+    [e, _, ne, M, G, x]
+  ), Te = C ?? Ee, Rt = typeof S == "string" ? /* @__PURE__ */ n(
     yi,
     {
       value: S,
@@ -2845,32 +2845,32 @@ const Bo = g.div`
         j.id,
         u
       ), se = a.left?.includes(j.id) || !1;
-      R(W && se), F(W && !se);
+      O(W && se), F(W && !se);
     } else
       F(!1);
   }, Kn = (E) => {
-    R(!1), T(!1), F(!1);
+    O(!1), T(!1), F(!1);
     const { active: D, over: j } = E;
     if (j && D.id !== j.id) {
       const W = [...ge, ...ce].find(
         (de) => de.value === D.id
       ), se = [...ge, ...ce].find((de) => de.value === j.id);
       if (W && se) {
-        const de = D.id, at = j.id, Gn = ae(
+        const de = D.id, at = j.id, Yn = ae(
           o,
           de,
           u
-        ), Yn = ae(
+        ), Gn = ae(
           o,
           at,
           u
         ), st = a.left?.includes(de) || !1, lt = a.left?.includes(at) || !1, Ne = $t({});
-        if (Gn && Yn) {
+        if (Yn && Gn) {
           let Pe = [...Ne.columnPinning.left || []];
           st !== lt && (st && !lt ? Pe = Pe.filter((dt) => dt !== de) : !st && lt && (Pe = [...Pe, de]));
           const ct = [...q, ...A], Ft = ct.indexOf(de), Mt = ct.indexOf(at);
           if (Ft === -1 || Mt === -1) {
-            console.error("Invalid column order state"), yo.error("Invalid column order state");
+            console.error("Invalid column order state"), bo.error("Invalid column order state");
             return;
           }
           const Vt = At(ct, Ft, Mt), qn = Vt.filter((dt) => Pe.includes(dt));
@@ -2884,7 +2884,7 @@ const Bo = g.div`
     N(null);
   }, Fe = $ ? [...ge, ...ce].find((E) => E.value === $) : null;
   return typeof S == "string" ? /* @__PURE__ */ w(on, { ref: ye, "data-column-drag-origin": !0, children: [
-    Lt,
+    Rt,
     /* @__PURE__ */ n(Ct, { menuId: ze, menuItems: Te }),
     /* @__PURE__ */ w(vt, { children: [
       /* @__PURE__ */ n(ft, { children: "All Columns" }),
@@ -2896,12 +2896,12 @@ const Bo = g.div`
           isPinned: a.left?.includes(E.value) || !1,
           isHidden: Ce(E.value),
           isHighlighted: t === E.value,
-          isDisabled: L(E.value),
+          isDisabled: R(E.value),
           hideDragHandle: !0,
           onTogglePinning: it,
           onToggleVisibility: ne,
           onPaintStart: M,
-          onPaintEnter: Y,
+          onPaintEnter: G,
           onDragStart: (D) => b?.(E, D)
         },
         E.value
@@ -2916,15 +2916,15 @@ const Bo = g.div`
       onDragOver: jn,
       onDragEnd: Kn,
       children: /* @__PURE__ */ w(on, { ref: ye, "data-column-drag-origin": !0, children: [
-        Lt,
+        Rt,
         /* @__PURE__ */ n(Ct, { menuId: ze, menuItems: Te }),
         ce.length > 0 && /* @__PURE__ */ w(vt, { className: B && !z ? "drop-target" : "", children: [
           /* @__PURE__ */ n(ft, { children: "Pinned Columns" }),
           /* @__PURE__ */ n(
-            Re,
+            Oe,
             {
               items: Ie.map((E) => E.value),
-              strategy: Oe,
+              strategy: Le,
               children: /* @__PURE__ */ n(ht, { children: Ie.map((E) => /* @__PURE__ */ n(
                 nn,
                 {
@@ -2932,12 +2932,12 @@ const Bo = g.div`
                   column: je(E, x),
                   isPinned: !0,
                   isHidden: Ce(E.value),
-                  isDisabled: L(E.value),
+                  isDisabled: R(E.value),
                   isHighlighted: t === E.value,
                   onTogglePinning: it,
                   onToggleVisibility: ne,
                   onPaintStart: M,
-                  onPaintEnter: Y,
+                  onPaintEnter: G,
                   onDragStart: (D) => b?.(E, D)
                 },
                 E.value
@@ -2948,10 +2948,10 @@ const Bo = g.div`
         /* @__PURE__ */ w(vt, { className: z && V ? "drop-target" : "", children: [
           /* @__PURE__ */ n(ft, { children: "Visible Columns" }),
           /* @__PURE__ */ n(
-            Re,
+            Oe,
             {
               items: ie.map((E) => E.value),
-              strategy: Oe,
+              strategy: Le,
               children: /* @__PURE__ */ n(ht, { children: ie.map((E) => /* @__PURE__ */ n(
                 nn,
                 {
@@ -2960,11 +2960,11 @@ const Bo = g.div`
                   isPinned: !1,
                   isHidden: Ce(E.value),
                   isHighlighted: t === E.value,
-                  isDisabled: L(E.value),
+                  isDisabled: R(E.value),
                   onTogglePinning: it,
                   onToggleVisibility: ne,
                   onPaintStart: M,
-                  onPaintEnter: Y,
+                  onPaintEnter: G,
                   onDragStart: (D) => b?.(E, D)
                 },
                 E.value
@@ -3258,7 +3258,7 @@ const Bo = g.div`
       "data-sort-id": e.value,
       className: c ? "dragging" : void 0,
       style: { transform: Je.Translate.toString(v), transition: f },
-      startContent: /* @__PURE__ */ n("div", { ...a, ...s, className: "drag-handle", children: /* @__PURE__ */ n(G, { icon: "drag_indicator" }) }),
+      startContent: /* @__PURE__ */ n("div", { ...a, ...s, className: "drag-handle", children: /* @__PURE__ */ n(Y, { icon: "drag_indicator" }) }),
       actions: [
         {
           icon: t ? "arrow_downward" : "arrow_upward",
@@ -3302,10 +3302,10 @@ const Bo = g.div`
           collisionDetection: Xe,
           onDragEnd: f,
           children: /* @__PURE__ */ n(
-            Re,
+            Oe,
             {
               items: e.map((u) => u.id),
-              strategy: Oe,
+              strategy: Le,
               children: /* @__PURE__ */ n(ln, { children: e.map((u) => /* @__PURE__ */ n(
                 Di,
                 {
@@ -3339,7 +3339,7 @@ const Bo = g.div`
       ] })
     ] })
   ] });
-}, Ri = (e = []) => {
+}, Oi = (e = []) => {
   const { sorting: t, updateSorting: o } = ke(), { attribFields: r, scopes: a } = tt(), s = [
     ...wo(a, e).map((l) => ({
       value: l.id,
@@ -3366,11 +3366,11 @@ const Bo = g.div`
     preview: t.length ? f(t[0].id) + (t.length > 1 ? ` +${t.length - 1}` : "") : "None",
     component: /* @__PURE__ */ n(Ai, { sorting: t, options: v, onChange: o })
   };
-}, Ot = [Do, Ao], cn = 5, Oi = `#${$o}, [data-column-drag-origin]`, Li = (e, t) => {
+}, Lt = [Do, Ao], cn = 5, Li = `#${$o}, [data-column-drag-origin]`, Ri = (e, t) => {
   const r = document.querySelector(`[${kn}]`)?.getBoundingClientRect();
   if (!r || e < r.left || e > r.right || t < r.top || t > r.bottom) return;
   const a = Array.from(document.querySelectorAll(Cn)).filter(
-    (v) => !Ot.includes(v.dataset.columnId || "")
+    (v) => !Lt.includes(v.dataset.columnId || "")
   ), s = a.find((v) => {
     const f = v.getBoundingClientRect();
     return e >= f.left && e < f.right;
@@ -3379,8 +3379,8 @@ const Bo = g.div`
   const i = a[a.length - 1];
   return e >= i.getBoundingClientRect().right ? i : a[0];
 }, dn = (e, t) => {
-  const o = document.elementsFromPoint(e, t).map((i) => i.closest?.(Cn)).find(Boolean) ?? Li(e, t), r = o?.dataset.columnId;
-  if (!o || !r || Ot.includes(r)) return null;
+  const o = document.elementsFromPoint(e, t).map((i) => i.closest?.(Cn)).find(Boolean) ?? Ri(e, t), r = o?.dataset.columnId;
+  if (!o || !r || Lt.includes(r)) return null;
   const a = o.getBoundingClientRect(), s = e < a.left + a.width / 2 ? "left" : "right";
   return {
     columnId: r,
@@ -3438,31 +3438,31 @@ const Bo = g.div`
     getAllColumns: u
   };
   const m = ee((N, B) => {
-    const R = b.current, z = $i(R.columnOrder, R.getAllColumns()).filter(
-      (I) => I !== N && !Ot.includes(I)
-    ), T = z.indexOf(B.columnId), V = T === -1 ? z.length : T + (B.side === "left" ? 0 : 1), F = [...z.slice(0, V), N, ...z.slice(V)], L = new Set(R.columnPinning.left || []);
-    L.has(B.columnId) ? L.add(N) : L.delete(N), R.setColumnsConfig({
-      columnVisibility: { ...R.columnVisibility, [N]: !0 },
+    const O = b.current, z = $i(O.columnOrder, O.getAllColumns()).filter(
+      (I) => I !== N && !Lt.includes(I)
+    ), T = z.indexOf(B.columnId), V = T === -1 ? z.length : T + (B.side === "left" ? 0 : 1), F = [...z.slice(0, V), N, ...z.slice(V)], R = new Set(O.columnPinning.left || []);
+    R.has(B.columnId) ? R.add(N) : R.delete(N), O.setColumnsConfig({
+      columnVisibility: { ...O.columnVisibility, [N]: !0 },
       columnOrder: F,
-      columnPinning: { ...R.columnPinning, left: F.filter((I) => L.has(I)) },
-      columnSizing: R.columnSizing,
-      columnSummaries: R.columnSummaries,
-      columnSummaryScopes: R.columnSummaryScopes,
-      columnSummaryFormats: R.columnSummaryFormats,
-      groupBy: R.groupBy,
-      groupByConfig: R.groupByConfig,
-      sorting: R.sorting,
-      rowHeight: R.rowHeight
+      columnPinning: { ...O.columnPinning, left: F.filter((I) => R.has(I)) },
+      columnSizing: O.columnSizing,
+      columnSummaries: O.columnSummaries,
+      columnSummaryScopes: O.columnSummaryScopes,
+      columnSummaryFormats: O.columnSummaryFormats,
+      groupBy: O.groupBy,
+      groupByConfig: O.groupByConfig,
+      sorting: O.sorting,
+      rowHeight: O.rowHeight
     });
   }, []), x = ee(() => {
     k.current = null, C.current && h(null);
   }, []), S = ee((N, B) => {
-    const R = B.currentTarget, z = R.getBoundingClientRect();
+    const O = B.currentTarget, z = O.getBoundingClientRect();
     k.current = {
       column: N,
       x: B.clientX,
       y: B.clientY,
-      origin: R.closest(Oi),
+      origin: O.closest(Li),
       immediate: !!B.target.closest?.(".hover-swap"),
       grab: {
         x: B.clientX - z.left,
@@ -3472,7 +3472,7 @@ const Bo = g.div`
     };
   }, []);
   Z(() => {
-    const N = (T, V, F) => !!F && document.elementsFromPoint(T, V).some((L) => F.contains(L)), B = (T) => {
+    const N = (T, V, F) => !!F && document.elementsFromPoint(T, V).some((R) => F.contains(R)), B = (T) => {
       const { clientX: V, clientY: F } = T;
       if (C.current) {
         h(
@@ -3480,16 +3480,16 @@ const Bo = g.div`
         );
         return;
       }
-      const L = k.current;
-      L && (Math.abs(V - L.x) < cn && Math.abs(F - L.y) < cn || !L.immediate && N(V, F, L.origin) || h({ column: L.column, x: V, y: F, grab: L.grab, target: dn(V, F) }));
-    }, R = () => {
+      const R = k.current;
+      R && (Math.abs(V - R.x) < cn && Math.abs(F - R.y) < cn || !R.immediate && N(V, F, R.origin) || h({ column: R.column, x: V, y: F, grab: R.grab, target: dn(V, F) }));
+    }, O = () => {
       const T = C.current;
       k.current = null, T && (Vi(), T.target && (m(T.column.value, T.target), y(!1)), h(null));
     }, z = (T) => {
       T.key === "Escape" && x();
     };
-    return window.addEventListener("pointermove", B), window.addEventListener("pointerup", R), window.addEventListener("pointercancel", x), window.addEventListener("keydown", z), () => {
-      window.removeEventListener("pointermove", B), window.removeEventListener("pointerup", R), window.removeEventListener("pointercancel", x), window.removeEventListener("keydown", z);
+    return window.addEventListener("pointermove", B), window.addEventListener("pointerup", O), window.addEventListener("pointercancel", x), window.addEventListener("keydown", z), () => {
+      window.removeEventListener("pointermove", B), window.removeEventListener("pointerup", O), window.removeEventListener("pointercancel", x), window.removeEventListener("keydown", z);
     };
   }, [m, x, y]);
   const P = d ? document.querySelector(`[${kn}]`)?.getBoundingClientRect() : void 0, $ = d ? hn(
@@ -3515,12 +3515,12 @@ const Bo = g.div`
           },
           className: Mi(d),
           children: [
-            d.column.icon && /* @__PURE__ */ n(G, { icon: d.column.icon }),
+            d.column.icon && /* @__PURE__ */ n(Y, { icon: d.column.icon }),
             /* @__PURE__ */ n("span", { children: d.column.label })
           ]
         }
       ),
-      d.target && /* @__PURE__ */ n(Ro, { style: d.target.line })
+      d.target && /* @__PURE__ */ n(Oo, { style: d.target.line })
     ] }),
     document.body
   ) : null;
@@ -3736,7 +3736,7 @@ const Bo = g.div`
       ),
       ...e.map((c) => ({
         ...c,
-        icon: c.icon ?? Ln
+        icon: c.icon ?? Rn
       }))
     ],
     [i, s, a, o, r, e]
@@ -3794,8 +3794,8 @@ const Bo = g.div`
     hiddenColumns: o,
     includeLinks: s,
     parentColumns: l
-  }), B = a && Co(a, p), R = N.filter(
-    (O) => ae(y, O.value, d)
+  }), B = a && Co(a, p), O = N.filter(
+    (L) => ae(y, L.value, d)
   ).length, {
     menuItems: z,
     dragOverlay: T,
@@ -3805,12 +3805,12 @@ const Bo = g.div`
     columns: N,
     scopes: u,
     extraItems: c
-  }), L = Ei({ scope: f }), I = Ri($), _ = [
+  }), R = Ei({ scope: f }), I = Oi($), _ = [
     {
       id: "columns",
       title: "Columns",
       icon: "view_column",
-      preview: `${R}/${N.length}`,
+      preview: `${O}/${N.length}`,
       headerActions: /* @__PURE__ */ n(
         Ki,
         {
@@ -3839,7 +3839,7 @@ const Bo = g.div`
       ] })
     },
     i ? null : I,
-    L,
+    R,
     {
       id: "row-height",
       component: /* @__PURE__ */ n(
@@ -3854,12 +3854,12 @@ const Bo = g.div`
       )
     }
   ].filter(Boolean);
-  return e.forEach((O) => {
-    if (r.includes(O.id)) return;
-    const M = _.findIndex((Y) => Y && "id" in Y && Y.id === O.id);
-    M !== -1 ? _[M] = O : _.push(O);
+  return e.forEach((L) => {
+    if (r.includes(L.id)) return;
+    const M = _.findIndex((G) => G && "id" in G && G.id === L.id);
+    M !== -1 ? _[M] = L : _.push(L);
   }), /* @__PURE__ */ n(si, { settings: _, order: v });
-}, yt = "add-column-menu-table", Gi = g.div`
+}, yt = "add-column-menu-table", Yi = g.div`
   position: absolute;
   top: 4px;
   right: 24px;
@@ -3869,7 +3869,7 @@ const Bo = g.div`
     padding: 2px;
     border-radius: 12px;
   }
-`, Gs = ({
+`, Ys = ({
   extraColumns: e,
   hiddenColumns: t,
   includeLinks: o,
@@ -3886,7 +3886,7 @@ const Bo = g.div`
     scopes: f,
     extraItems: r
   });
-  return s ? null : /* @__PURE__ */ w(Gi, { children: [
+  return s ? null : /* @__PURE__ */ w(Yi, { children: [
     /* @__PURE__ */ n(
       H,
       {
@@ -3901,7 +3901,7 @@ const Bo = g.div`
     /* @__PURE__ */ n(Ct, { menuId: yt, menuItems: c }),
     p
   ] });
-}, Ys = g.a`
+}, Gs = g.a`
   color: var(--md-sys-color-primary, #0066cc);
   text-decoration: none;
   cursor: pointer;
@@ -3913,7 +3913,7 @@ const Bo = g.div`
   &:hover {
     text-decoration: underline;
   }
-`, Yi = g.div`
+`, Gi = g.div`
   display: flex;
   gap: var(--base-gap-small);
   background-color: var(--md-sys-color-surface-container-high);
@@ -3933,7 +3933,7 @@ const Bo = g.div`
       i.tagName === "INPUT" || i.tagName === "TEXTAREA" || i.isContentEditable || i.getAttribute("role") === "textbox" || i.tagName === "LI" || s.ctrlKey || s.metaKey || s.altKey || (s.key.toLowerCase() === "t" ? t(!1) : s.key.toLowerCase() === "c" && t(!0));
     };
     return window.addEventListener("keydown", a), () => window.removeEventListener("keydown", a);
-  }, [t]), /* @__PURE__ */ w(Yi, { ...o, ref: r, children: [
+  }, [t]), /* @__PURE__ */ w(Gi, { ...o, ref: r, children: [
     /* @__PURE__ */ n(
       un,
       {
@@ -4059,7 +4059,7 @@ const Bo = g.div`
     folderProducts: P,
     isFolderProductsLoading: $,
     matchedProduct: N
-  } = En(), [B, R] = U(!1), z = X(
+  } = En(), [B, O] = U(!1), z = X(
     () => P.map((A) => ({ value: A.name, label: A.name })),
     [P]
   ), T = ee(
@@ -4067,10 +4067,10 @@ const Bo = g.div`
       t("name", A.length > 0 ? A[0] : "");
     },
     [t]
-  ), V = N?.latestVersion ? `v${String(N.latestVersion.version).padStart(3, "0")}` : "", { data: F, isFetching: L } = mo(
+  ), V = N?.latestVersion ? `v${String(N.latestVersion.version).padStart(3, "0")}` : "", { data: F, isFetching: R } = mo(
     { projectName: a, taskId: k },
     { skip: !k }
-  ), I = b || !!k && L && !C, _ = F?.folderId || S, O = Sn(), M = F?.label || F?.name || C?.label || C?.name || "", Y = F?.taskType || C?.taskType, ne = Y ? O.getTaskType(Y) : void 0, re = ne?.icon || "task_alt", be = F?.path ? F.path.substring(0, F.path.lastIndexOf("/")) : "", ye = O.getProductTypeOptions(), ue = X(() => O.productTypes.reduce((A, q) => (A[q.name] = q, A), {}), [O.productTypes]);
+  ), I = b || !!k && R && !C, _ = F?.folderId || S, L = Sn(), M = F?.label || F?.name || C?.label || C?.name || "", G = F?.taskType || C?.taskType, ne = G ? L.getTaskType(G) : void 0, re = ne?.icon || "task_alt", be = F?.path ? F.path.substring(0, F.path.lastIndexOf("/")) : "", ye = L.getProductTypeOptions(), ue = X(() => L.productTypes.reduce((A, q) => (A[q.name] = q, A), {}), [L.productTypes]);
   Z(() => {
     const A = f.current, q = ue[A]?.name || "", he = ue[e.productType]?.name || "";
     if (e.productType !== A && q && e.name.startsWith(q)) {
@@ -4079,7 +4079,7 @@ const Bo = g.div`
     }
     f.current = e.productType;
   }, [e.productType, e.name, t]);
-  const Le = (A) => {
+  const Re = (A) => {
     A.preventDefault();
     const q = A.nativeEvent.submitter;
     q && q.closest(".dropdown") || o(e);
@@ -4102,7 +4102,7 @@ const Bo = g.div`
     {
       id: "upload-version-form",
       ref: l,
-      onSubmit: Le,
+      onSubmit: Re,
       noValidate: !0,
       onKeyDown: (A) => {
         if (A.key === "Enter" && (A.metaKey || A.ctrlKey)) {
@@ -4197,11 +4197,11 @@ const Bo = g.div`
               na,
               {
                 type: "button",
-                onClick: () => R(!0),
+                onClick: () => O(!0),
                 disabled: ie,
                 variant: "text",
                 children: [
-                  /* @__PURE__ */ n(G, { icon: re, style: { color: ne?.color } }),
+                  /* @__PURE__ */ n(Y, { icon: re, style: { color: ne?.color } }),
                   /* @__PURE__ */ w(oa, { children: [
                     be && /* @__PURE__ */ w(ra, { children: [
                       be.split("/").filter(Boolean).join(" / "),
@@ -4232,7 +4232,7 @@ const Bo = g.div`
               icon: "link",
               label: "Link task",
               variant: "text",
-              onClick: () => R(!0),
+              onClick: () => O(!0),
               disabled: ie
             }
           ) }) })
@@ -4247,9 +4247,9 @@ const Bo = g.div`
               ...k ? { task: { [k]: !0 } } : {}
             },
             onSubmit: (A) => {
-              A.length > 0 && m(A[0]), R(!1);
+              A.length > 0 && m(A[0]), O(!1);
             },
-            onClose: () => R(!1)
+            onClose: () => O(!1)
           }
         ),
         /* @__PURE__ */ n(te, { label: "Reviewable files" }),
@@ -4344,6 +4344,8 @@ const Bo = g.div`
     }
   );
 }, ca = g.div`
+  --reviewable-card-width: 62px;
+
   position: relative;
   flex: 1;
   z-index: 1000;
@@ -4358,6 +4360,7 @@ const Bo = g.div`
   gap: var(--base-gap-small);
 `, ua = g.div`
   position: relative;
+  flex-shrink: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -4379,9 +4382,8 @@ const Bo = g.div`
   }
 
   .file-thumbnail {
-    width: 100%;
-    height: 62px;
-    width: 62px;
+    width: var(--reviewable-card-width);
+    aspect-ratio: 16 / 9;
     object-fit: cover;
     border-radius: var(--border-radius-m);
   }
@@ -4418,8 +4420,9 @@ const Bo = g.div`
   transform: translateX(-100%) translateY(-50%);
   z-index: 1000;
 `, ma = g(H)`
-  width: 62px;
-  min-height: 62px;
+  width: var(--reviewable-card-width);
+  aspect-ratio: 16 / 9;
+  flex-shrink: 0;
   background-color: var(--md-sys-color-surface-container-high);
 
   &:hover {
@@ -4573,21 +4576,21 @@ export {
   Is as D,
   Ko as E,
   Vs as F,
-  Gt as G,
+  Yt as G,
   ni as H,
   zs as I,
   si as J,
   ot as K,
-  Os as L,
+  Ls as L,
   Ms as M,
   qo as N,
   Ii as O,
-  Ls as P,
-  Ys as Q,
+  Rs as P,
+  Gs as Q,
   Hs as R,
   bs as S,
   ks as T,
-  Yt as U,
+  Gt as U,
   qs as V,
   qt as W,
   Ws as X,
@@ -4604,18 +4607,18 @@ export {
   $s as j,
   Us as k,
   St as l,
-  Gs as m,
+  Ys as m,
   vs as n,
   ws as o,
   fi as p,
   xi as q,
   js as r,
   As as s,
-  Go as t,
+  Yo as t,
   Ds as u,
   pr as v,
   ar as w,
-  Rs as x,
+  Os as x,
   Wt as y,
   Ks as z
 };