@ynput/ayon-frontend-shared 0.6.6 → 0.6.8

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 { U as eo } from "./PlayableIcon.es.js";
+import g, { css as It, keyframes as Wn, createGlobalStyle as Xn } from "styled-components";
+import { forwardRef as le, useRef as K, useState as U, useEffect as Z, useMemo as X, Fragment as Qn, useCallback as ee, useImperativeHandle as Jn } from "react";
+import { Icon as G, InputNumber as pn, Button as H, IconSelect as Zn, InputText as Ae, Dialog as qe, FormLayout as Et, FormRow as te, Dropdown as pe, LockedInput as eo, InputSwitch as De, Spacer as mn, SaveButton as gn, theme as fe } from "@ynput/ayon-react-components";
+import { U as to } 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 Ge, startCase as Tt, camelCase as ut, upperFirst as no } 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 Re, arrayMove as At } from "@dnd-kit/sortable";
 import { CSS as Je } from "@dnd-kit/utilities";
-import { I as no } from "./InfoMessage.es.js";
+import { I as oo } 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 { bs as ro, aZ as io, bq as fn, bo as bn, br as Ut, bh as ao, b2 as so, bn as yn, bk as xn, bj as lo } from "./searchTerms.es.js";
+import { bk as co, bq as uo, cE as po, be as mo, dC as ae, cl as go } from "./getUris.es.js";
 import "primereact/confirmdialog";
-import { u as go, g as ho, v as vo } from "./Watchers.es.js";
+import { l as ho, b as vo, v as fo } from "./Watchers.es.js";
 import { matchSorter as Ht } from "match-sorter";
-import { J as fo } from "./JsonViewer.es.js";
+import { J as bo } 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 { d as wn, a as xo, 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 { Link as wo } from "react-router-dom";
+import { aY as Q, a as ke, b as tt, b4 as So, b9 as ko, ax as xe, aZ as oe, ae as Co, b0 as zt, a_ as jt, b1 as Kt, ba as Io } from "./MetaWidget.es.js";
 import "@tanstack/react-table";
 import "date-fns";
 import "lexical";
@@ -38,27 +38,27 @@ import "@lexical/list";
 import "@lexical/rich-text";
 import "@lexical/selection";
 import "@lexical/utils";
-import { T as Io, E as Eo } from "./EntityPickerDialog.es.js";
-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 { T as Eo, E as To } from "./EntityPickerDialog.es.js";
+import { useDebounce as No } from "primereact/hooks";
+import { c as Po, a as kn, C as Cn, g as _o } from "./ColumnDropIndicator.es.js";
+import { M as Do, D as Ao, R as Oo } from "./realtimeUpdatesUtils.es.js";
 import "@tanstack/react-virtual";
 import { a as Ro } 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 $o, c as Fo } 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";
-import { u as Vo } from "./useCreateContextMenu.es.js";
-const Bo = g.div`
+import { Skeleton as Mo } from "primereact/skeleton";
+import Vo from "react-perfect-scrollbar";
+import { u as Bo } from "./useCreateContextMenu.es.js";
+const Uo = g.div`
   display: flex;
   width: 100%;
   height: 100%;
   gap: 0;
   padding: ${(e) => e.$padding};
-`, Uo = g.div`
+`, Ho = g.div`
   width: ${(e) => e.$config.width || "15%"};
   min-width: ${(e) => e.$config.minWidth || "2%"};
   max-width: ${(e) => e.$config.maxWidth || "600px"};
@@ -66,7 +66,7 @@ const Bo = g.div`
   flex-shrink: 0;
   border-radius: 4px;
   background-color: var(--md-sys-color-surface-container);
-`, Ho = g.div`
+`, zo = g.div`
   display: grid;
   grid-template-columns: repeat(${(e) => e.$config.columns}, 1fr);
   grid-template-rows: repeat(${(e) => e.$config.rows}, 1fr);
@@ -74,11 +74,11 @@ const Bo = g.div`
   flex: 1;
   padding: 1rem;
   overflow: auto;
-`, zo = g.div`
+`, jo = g.div`
   border-radius: 4px;
   min-height: ${(e) => e.$minHeight};
   background-color: var(--md-sys-color-surface-container);
-`, vs = ({
+`, fs = ({
   showSidebar: e = !0,
   sidebarConfig: t = {},
   gridConfig: o = { columns: 3, rows: 3 },
@@ -87,10 +87,10 @@ const Bo = g.div`
   ...s
 }) => {
   const i = o.columns * o.rows;
-  return /* @__PURE__ */ w(Bo, { $padding: r, ...s, children: [
-    e && /* @__PURE__ */ n(Uo, { className: "loading", $config: t, ...a?.sidebar }),
-    /* @__PURE__ */ n(Ho, { $config: o, ...a?.grid, children: Array.from({ length: i }).map((v, f) => /* @__PURE__ */ n(
-      zo,
+  return /* @__PURE__ */ w(Uo, { $padding: r, ...s, children: [
+    e && /* @__PURE__ */ n(Ho, { className: "loading", $config: t, ...a?.sidebar }),
+    /* @__PURE__ */ n(zo, { $config: o, ...a?.grid, children: Array.from({ length: i }).map((v, f) => /* @__PURE__ */ n(
+      jo,
       {
         className: "loading",
         $minHeight: o.itemMinHeight || "200px",
@@ -99,7 +99,7 @@ const Bo = g.div`
       f
     )) })
   ] });
-}, fs = g.div`
+}, bs = g.div`
   position: relative;
   width: 100%;
 
@@ -107,7 +107,7 @@ const Bo = g.div`
     min-height: 32px;
     max-height: 32px;
   }
-`, bs = g.ul`
+`, ys = g.ul`
   position: absolute;
   top: 100%;
   left: 0;
@@ -136,7 +136,7 @@ const Bo = g.div`
   .tip {
     color: var(--md-sys-color-outline);
   }
-`, jo = g.div`
+`, Ko = g.div`
   display: flex;
   align-items: center;
   gap: var(--base-gap-medium);
@@ -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)`
+`, Go = "__everyone__", Yo = "__guests__", Gt = "group:", Yt = "team:", qt = "user:", Wt = "guest:", qo = g(G)`
   font-size: ${({ $size: e }) => `${e}px`};
   &.withBackground {
     display: flex;
@@ -190,7 +190,7 @@ const Bo = g.div`
     background-color: var(--md-sys-color-surface-container-high);
     padding: 3px;
   }
-`, qo = ({
+`, Wo = ({
   shareType: e,
   name: t,
   label: o,
@@ -201,7 +201,7 @@ const Bo = g.div`
   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)));
   const f = (c, l) => /* @__PURE__ */ n(
-    Yo,
+    qo,
     {
       className: J({ withBackground: a }),
       icon: c,
@@ -210,8 +210,8 @@ 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");
-}, ys = le(
+  return i === "user" ? /* @__PURE__ */ n(to, { 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 === Go ? f("groups", "Everyone with access to the project") : f("person");
+}, xs = le(
   ({
     name: e,
     label: t,
@@ -227,8 +227,8 @@ const Bo = g.div`
     ...p
   }, u) => {
     const y = r === "user" || r === "guest", d = y || v, h = y ? e : r;
-    return /* @__PURE__ */ w(jo, { ...p, ref: u, className: J(l, { compact: i }), children: [
-      /* @__PURE__ */ n(qo, { shareType: r, name: e, label: t, icon: o }),
+    return /* @__PURE__ */ w(Ko, { ...p, ref: u, className: J(l, { compact: i }), children: [
+      /* @__PURE__ */ n(Wo, { shareType: r, name: e, label: t, icon: o }),
       /* @__PURE__ */ w("span", { className: "title-label", children: [
         t || e,
         a ? /* @__PURE__ */ n("span", { className: "name", children: "(you)" }) : d && /* @__PURE__ */ n("span", { className: J("name", { "float-right": v }), children: h }),
@@ -238,7 +238,7 @@ const Bo = g.div`
       s && /* @__PURE__ */ n("span", { className: "owner", children: "Owner" })
     ] });
   }
-), Wo = g.div`
+), Xo = g.div`
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -248,7 +248,7 @@ const Bo = g.div`
   input {
     width: 100%;
   }
-`, Xo = ({ value: e = {}, isMin: t, isFloat: o = !1, onChange: r }) => {
+`, Qo = ({ value: e = {}, isMin: t, isFloat: o = !1, onChange: r }) => {
   const { le: a, lt: s, ge: i, gt: v } = e, f = i ?? v, c = a ?? s, l = K(null), p = t ? f : c, u = t ? "g" : "l", y = u + "e", d = u + "t", [h, k] = U(e[y] != null || !o);
   Z(() => {
     o ? (p !== void 0 && r({ [y]: String(p), [d]: void 0 }), k(!0)) : (r({ [y]: parseInt(String(p))?.toString(), [d]: void 0 }), k(!0));
@@ -260,7 +260,7 @@ const Bo = g.div`
     const $ = !h;
     k($), r($ ? { [d]: void 0, [y]: p } : { [d]: p, [y]: void 0 });
   }, m = t ? "greater" : "less", x = t ? ">" : "<", S = t ? "≥" : "≤", P = `Determines if the value should be '${m} than or equal to' (${S}) or 'strictly ${m} than' (${x}). Currently: ${h ? S : x}`;
-  return /* @__PURE__ */ w(Wo, { children: [
+  return /* @__PURE__ */ w(Xo, { children: [
     /* @__PURE__ */ n(
       pn,
       {
@@ -283,12 +283,12 @@ const Bo = g.div`
       }
     )
   ] });
-}, Qo = It`
+}, Jo = It`
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 8px;
-`, Rt = It`
+`, Ot = It`
   display: flex;
   align-items: center;
   gap: 8px;
@@ -303,12 +303,12 @@ const Bo = g.div`
   &:hover {
     background-color: var(--md-sys-color-surface-container-low-hover);
   }
-`, Jo = g.div`
+`, Zo = g.div`
   display: flex;
   flex-direction: column;
   justify-content: stretch;
   gap: 4px;
-`, Zo = g.div`
+`, er = g.div`
   justify-content: stretch;
   border-radius: 4px;
   overflow: hidden;
@@ -316,8 +316,8 @@ const Bo = g.div`
   &.dragged {
     opacity: 0;
   }
-`, er = g.div`
-  ${Rt}
+`, tr = g.div`
+  ${Ot}
   cursor: pointer;
   user-select: none;
   padding: 8px;
@@ -357,7 +357,7 @@ const Bo = g.div`
   .spacer {
     flex-grow: 1;
   }
-`, tr = g.div`
+`, nr = g.div`
   display: grid;
   grid-template-rows: 0fr;
   overflow: hidden;
@@ -365,8 +365,8 @@ const Bo = g.div`
   &.expanded {
     grid-template-rows: 1fr;
   }
-`, nr = g.div`
-  ${Qo}
+`, or = g.div`
+  ${Jo}
   align-items: stretch;
   padding: 0 8px;
   min-height: 0;
@@ -378,19 +378,19 @@ 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`
+`, rr = g.div`
   border-radius: 4px;
   width: 14px;
   height: 14px;
-`, rr = g(Jn)`
+`, ir = g(Zn)`
   flex-grow: 1;
   width: 100%;
   button div {
@@ -421,7 +421,7 @@ const Bo = g.div`
   width: 100%;
   padding-left: 8px;
   user-select: none;
-`, ir = g(Nn)`
+`, ar = g(Nn)`
   ${Tn}
   position: relative;
   cursor: pointer;
@@ -432,7 +432,7 @@ const Bo = g.div`
     position: absolute;
     visibility: hidden;
   }
-`, ar = ({
+`, sr = ({
   item: e,
   onChange: t,
   onCommit: o,
@@ -452,7 +452,7 @@ const Bo = g.div`
   }, [v, e.isNewAttribute]), Z(() => {
     f && !v && !e.isNewAttribute && setTimeout(() => C.current?.focus(), 250);
   }, [f, v, e.isNewAttribute]), /* @__PURE__ */ w(
-    nr,
+    or,
     {
       ...l?.wrapper,
       ...p,
@@ -524,7 +524,7 @@ const Bo = g.div`
               }
             ),
             /* @__PURE__ */ n(
-              rr,
+              ir,
               {
                 ref: x,
                 value: [d || "question_mark"],
@@ -557,7 +557,7 @@ const Bo = g.div`
           /* @__PURE__ */ n(Ve, { ...l?.color?.label, children: "Color" }),
           /* @__PURE__ */ w(Jt, { style: { position: "relative" }, children: [
             /* @__PURE__ */ w(
-              ir,
+              ar,
               {
                 className: h ? "active" : "",
                 style: { backgroundColor: h || void 0 },
@@ -617,7 +617,7 @@ const Bo = g.div`
     transform: Je.Translate.toString(k)
   };
   return /* @__PURE__ */ w(
-    Zo,
+    er,
     {
       ref: h,
       style: b,
@@ -626,7 +626,7 @@ const Bo = g.div`
       className: J(v.className, i?.wrapper?.className, { dragged: t }),
       children: [
         /* @__PURE__ */ w(
-          er,
+          tr,
           {
             ...i?.header,
             onClick: () => {
@@ -634,7 +634,7 @@ const Bo = g.div`
             },
             className: J(i?.header?.className, { expanded: u }),
             children: [
-              p && /* @__PURE__ */ n(or, { style: { backgroundColor: p } }),
+              p && /* @__PURE__ */ n(rr, { style: { backgroundColor: p } }),
               l && /* @__PURE__ */ n(G, { className: "icon", icon: l }),
               /* @__PURE__ */ w("span", { children: [
                 " ",
@@ -656,8 +656,8 @@ const Bo = g.div`
             ]
           }
         ),
-        /* @__PURE__ */ n(tr, { className: J({ expanded: u }), children: /* @__PURE__ */ n(
-          ar,
+        /* @__PURE__ */ n(nr, { className: J({ expanded: u }), children: /* @__PURE__ */ n(
+          sr,
           {
             item: e,
             onChange: o,
@@ -674,7 +674,7 @@ const Bo = g.div`
       ]
     }
   );
-}, sr = ({
+}, lr = ({
   creator: e,
   initialData: t,
   onChange: o,
@@ -743,19 +743,19 @@ const Bo = g.div`
   for (; t.includes(v); )
     v = i + o + s++;
   return v;
-}, lr = () => ({
+}, cr = () => ({
   id: Ge(),
   isExpanded: !0,
   label: "",
   value: "",
   isLabelFocused: !0,
   isNewAttribute: !1
-}), cr = (e) => e.filter((t) => t.label !== "" && t.value !== "").map(({ label: t, value: o, icon: r, color: a }) => ({
+}), dr = (e) => e.filter((t) => t.label !== "" && t.value !== "").map(({ label: t, value: o, icon: r, color: a }) => ({
   label: t,
   value: o,
   icon: r || void 0,
   color: a || void 0
-})), dr = (e) => e.map(({ label: t, value: o, icon: r, color: a }) => ({
+})), ur = (e) => e.map(({ label: t, value: o, icon: r, color: a }) => ({
   id: Ge(),
   isExpanded: !1,
   label: t,
@@ -764,7 +764,7 @@ const Bo = g.div`
   color: a,
   isLabelFocused: !1,
   isNewAttribute: !1
-})), ur = (e, t) => t.map((o, r) => {
+})), pr = (e, t) => t.map((o, r) => {
   const a = e[r];
   return a ? {
     ...o,
@@ -773,7 +773,7 @@ const Bo = g.div`
     isLabelFocused: a.isLabelFocused,
     isNewAttribute: a.isNewAttribute
   } : o;
-}), pr = ({ values: e, onChange: t, onCommit: o, pt: r, ...a }) => {
+}), mr = ({ values: e, onChange: t, onCommit: o, pt: r, ...a }) => {
   if (!e)
     return null;
   const {
@@ -784,20 +784,20 @@ const Bo = g.div`
     handleCommitItem: c,
     handleDuplicateItem: l,
     handleDraggableEnd: p
-  } = sr({
-    creator: lr,
-    initialData: dr(e),
+  } = lr({
+    creator: cr,
+    initialData: ur(e),
     onChange: t,
     onCommit: o,
-    normalizer: cr,
-    mergeIncomingData: ur
+    normalizer: dr,
+    mergeIncomingData: pr
   }), u = (C) => {
     h(C.active.id);
   }, y = (C) => {
     h(null), p(C);
   }, [d, h] = U();
   let k;
-  return d && (k = s.find((C) => C.id === d)), /* @__PURE__ */ n(me, { children: /* @__PURE__ */ w(Jo, { ...a, children: [
+  return d && (k = s.find((C) => C.id === d)), /* @__PURE__ */ n(me, { children: /* @__PURE__ */ w(Zo, { ...a, children: [
     /* @__PURE__ */ w(
       We,
       {
@@ -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: Re, 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 }) => ro(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`
   display: flex;
   align-items: center;
   gap: var(--base-gap-small);
@@ -876,12 +876,12 @@ const Bo = g.div`
     flex: none;
     width: 20px;
   }
-`, mr = 8, _n = 10, gr = g.div`
+`, gr = 8, _n = 10, hr = g.div`
   display: flex;
   gap: var(--base-gap-large);
   flex: 1;
   min-height: 0;
-`, hr = g.div`
+`, vr = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-large);
@@ -907,15 +907,15 @@ const Bo = g.div`
   font-weight: 500;
   color: var(--md-sys-color-outline);
   padding: 4px 0;
-`, vr = g.div`
+`, fr = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-large);
   flex: 1;
   min-width: 0;
-`, fr = g.span`
+`, br = g.span`
   color: var(--md-sys-color-outline);
-`, br = g.div`
+`, yr = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-large);
@@ -925,7 +925,7 @@ const Bo = g.div`
   padding: var(--padding-m);
   border-radius: var(--border-radius-m);
   background-color: var(--md-sys-color-surface-container);
-`, yr = g(nt)`
+`, xr = g(nt)`
   .value {
     margin-left: auto;
     flex: none;
@@ -934,7 +934,7 @@ const Bo = g.div`
   }
 `, we = g.span`
   color: var(--md-sys-color-outline);
-`, xr = ({ value: e, onChange: t }) => {
+`, wr = ({ value: e, onChange: t }) => {
   const { projects: o } = wn(), r = o.active.map((a) => ({
     value: a.name,
     label: a.label || a.name
@@ -952,7 +952,7 @@ const Bo = g.div`
     }
   );
 }, Dn = ({ value: e, onChange: t }) => {
-  const { data: o = [], isLoading: r } = lo({}), a = o.map((s) => ({
+  const { data: o = [], isLoading: r } = co({}), a = o.map((s) => ({
     value: s.name,
     label: s.fullName || s.name
   }));
@@ -968,10 +968,10 @@ const Bo = g.div`
       widthExpand: !0
     }
   );
-}, wr = {
-  project_name: xr,
+}, Sr = {
+  project_name: wr,
   user: Dn
-}, Sr = ["label", (e) => String(e.value), "description", "fulltext"], kr = ({ resolver: e, settings: t, onClose: o }) => {
+}, kr = ["label", (e) => String(e.value), "description", "fulltext"], Cr = ({ resolver: e, settings: t, onClose: o }) => {
   const [r, a] = U({}), [s, i] = U(t), [v, f] = U(""), { user: c } = wn(), l = e.settingsForm || [], p = new Set(l.map((T) => T.name)), u = e.acceptedParams || {}, y = !!c?.data?.isAdmin, d = Object.keys(u).filter(
     (T) => !p.has(T) && (T !== "user" || y)
   ), h = y && !("user" in u), k = X(
@@ -981,7 +981,7 @@ const Bo = g.div`
     data: C,
     isFetching: b,
     isError: m
-  } = ro({
+  } = io({
     enumName: e.name,
     params: k
   }), x = X(
@@ -992,13 +992,13 @@ const Bo = g.div`
     [C]
   ), S = m || !!C?.error, P = v.trim(), $ = X(
     () => P ? Ht(x, P, {
-      keys: Sr,
+      keys: kr,
       threshold: Ht.rankings.CONTAINS
     }) : x,
     [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,
       {
@@ -1007,7 +1007,7 @@ const Bo = g.div`
       }
     ) }),
     d.map((T) => {
-      const V = Ut(T) ? wr[T] : void 0;
+      const V = Ut(T) ? Sr[T] : void 0;
       return /* @__PURE__ */ n(te, { label: T, children: V && Ut(T) ? /* @__PURE__ */ n(
         V,
         {
@@ -1018,8 +1018,8 @@ const Bo = g.div`
     })
   ] }), z = () => {
     if (b)
-      return Array.from({ length: mr }).map((T, V) => /* @__PURE__ */ n(nt, { className: "loading" }, V));
-    if (S) return /* @__PURE__ */ n(we, { children: io(C?.error) });
+      return Array.from({ length: gr }).map((T, V) => /* @__PURE__ */ n(nt, { className: "loading" }, V));
+    if (S) return /* @__PURE__ */ n(we, { children: ao(C?.error) });
     if (!x.length) {
       const T = "project_name" in (e.acceptedParams || {}) && !r.project_name ? " Try selecting a project." : "";
       return /* @__PURE__ */ w(we, { children: [
@@ -1027,7 +1027,7 @@ const Bo = g.div`
         T
       ] });
     }
-    return $.length ? $.map((T) => /* @__PURE__ */ w(yr, { title: T.description, children: [
+    return $.length ? $.map((T) => /* @__PURE__ */ w(xr, { title: T.description, children: [
       /* @__PURE__ */ n(Pn, { icon: T.icon, color: T.color, reserveSpace: N }),
       /* @__PURE__ */ n("span", { className: "label", children: T.label }),
       /* @__PURE__ */ n("span", { className: "value", children: String(T.value) })
@@ -1046,11 +1046,11 @@ const Bo = g.div`
       size: "full",
       style: { width: "95vw", maxWidth: "95vw", height: "95vh", maxHeight: "95vh" },
       onKeyDown: B,
-      children: /* @__PURE__ */ w(gr, { children: [
-        /* @__PURE__ */ w(hr, { children: [
+      children: /* @__PURE__ */ w(hr, { children: [
+        /* @__PURE__ */ w(vr, { children: [
           /* @__PURE__ */ w(pt, { children: [
             /* @__PURE__ */ n(mt, { children: "Context Params" }),
-            R()
+            O()
           ] }),
           /* @__PURE__ */ w(pt, { children: [
             /* @__PURE__ */ n(mt, { children: "Form" }),
@@ -1058,10 +1058,10 @@ const Bo = g.div`
           ] }),
           /* @__PURE__ */ w(pt, { children: [
             /* @__PURE__ */ n(mt, { children: "Enum Resolver Data" }),
-            /* @__PURE__ */ n(fo, { value: e, wrap: !0 })
+            /* @__PURE__ */ n(bo, { value: e, wrap: !0 })
           ] })
         ] }),
-        /* @__PURE__ */ w(vr, { children: [
+        /* @__PURE__ */ w(fr, { children: [
           /* @__PURE__ */ n(
             Ae,
             {
@@ -1071,16 +1071,16 @@ const Bo = g.div`
               autoFocus: !0
             }
           ),
-          !b && !S && x.length > 0 && /* @__PURE__ */ n(fr, { children: P ? `${$.length} of ${x.length} ${x.length === 1 ? "item" : "items"}` : `${x.length} ${x.length === 1 ? "item" : "items"}` }),
-          /* @__PURE__ */ n(br, { children: z() })
+          !b && !S && x.length > 0 && /* @__PURE__ */ n(br, { children: P ? `${$.length} of ${x.length} ${x.length === 1 ? "item" : "items"}` : `${x.length} ${x.length === 1 ? "item" : "items"}` }),
+          /* @__PURE__ */ n(yr, { children: z() })
         ] })
       ] })
     }
   );
-}, Ue = "__custom__", gt = 5, Cr = [], Ir = "No preview items found.", Er = 5, Tr = {
+}, Ue = "__custom__", gt = 5, Ir = [], Er = "No preview items found.", Tr = 5, Nr = {
   project_name: "The select options will change based on the project it is used in.",
   user: "The select options will change based on the current user."
-}, Nr = g.div`
+}, Pr = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-large);
@@ -1095,7 +1095,7 @@ const Bo = g.div`
   padding: var(--padding-m);
   border-radius: var(--border-radius-m);
   background-color: var(--md-sys-color-surface-container);
-`, Pr = g.button`
+`, _r = g.button`
   display: flex;
   align-items: center;
   align-self: flex-start;
@@ -1111,7 +1111,7 @@ const Bo = g.div`
     color: var(--md-sys-color-on-surface);
     text-decoration: underline;
   }
-`, _r = g(no)`
+`, Dr = g(oo)`
   cursor: pointer;
   padding: var(--padding-s) var(--padding-m);
 
@@ -1122,7 +1122,7 @@ const Bo = g.div`
   &:hover {
     filter: brightness(1.15);
   }
-`, Dr = g(nt)`
+`, Ar = g(nt)`
   &:nth-child(2n) {
     width: 80%;
   }
@@ -1130,7 +1130,7 @@ const Bo = g.div`
   &:last-of-type {
     width: 64px;
   }
-`, Ar = ({
+`, Or = ({
   resolver: e,
   acceptedParams: t,
   settings: o,
@@ -1139,9 +1139,9 @@ const Bo = g.div`
   const a = X(
     () => ({ enumResolver: e, enumResolverSettings: o }),
     [e, o]
-  ), { options: s, isLoading: i, isError: v, errorMessage: f } = go(a), c = fn(s), l = yn(t);
+  ), { options: s, isLoading: i, isError: v, errorMessage: f } = ho(a), c = fn(s), l = yn(t);
   if (i)
-    return /* @__PURE__ */ n(He, { children: Array.from({ length: gt + 1 }).map((d, h) => /* @__PURE__ */ n(Dr, { className: "loading" }, h)) });
+    return /* @__PURE__ */ n(He, { children: Array.from({ length: gt + 1 }).map((d, h) => /* @__PURE__ */ n(Ar, { className: "loading" }, h)) });
   if (v)
     return /* @__PURE__ */ n(He, { children: /* @__PURE__ */ w(Ye, { children: [
       'Could not load options for "',
@@ -1151,7 +1151,7 @@ const Bo = g.div`
     ] }) });
   if (!c.length)
     return /* @__PURE__ */ n(He, { children: /* @__PURE__ */ w(Ye, { children: [
-      Ir,
+      Er,
       l.length > 0 && ` This could be because in context parameters (${l.join(
         ", "
       )}) are required to get the items.`
@@ -1162,7 +1162,7 @@ const Bo = g.div`
       /* @__PURE__ */ n(Pn, { icon: h, color: d.color, reserveSpace: y }),
       /* @__PURE__ */ n("span", { className: "label", children: d.label })
     ] }, String(d.value))),
-    p > 0 && /* @__PURE__ */ w(Pr, { type: "button", onClick: r, children: [
+    p > 0 && /* @__PURE__ */ w(_r, { type: "button", onClick: r, children: [
       "+",
       p,
       " more"
@@ -1176,14 +1176,14 @@ const Bo = g.div`
   onChangeResolver: a,
   onChangeResolverSettings: s
 }) => {
-  const { data: i = [], isLoading: v, isError: f } = ao(), [c, l] = U(!1), p = () => l(!0), u = [
+  const { data: i = [], isLoading: v, isError: f } = so(), [c, l] = U(!1), p = () => l(!0), u = [
     { value: Ue, label: "Custom" },
     ...i.map((m) => ({
       value: m.name,
       label: m.label || Tt(m.name)
     }))
-  ], y = t || Ue, d = i.find((m) => m.name === t), h = d?.settingsForm || Cr, k = o || {}, C = yn(d?.acceptedParams).map((m) => Tr[m]).join(" ");
-  return /* @__PURE__ */ w(Nr, { children: [
+  ], y = t || Ue, d = i.find((m) => m.name === t), h = d?.settingsForm || Ir, k = o || {}, C = yn(d?.acceptedParams).map((m) => Nr[m]).join(" ");
+  return /* @__PURE__ */ w(Pr, { children: [
     /* @__PURE__ */ n(
       pe,
       {
@@ -1195,12 +1195,12 @@ const Bo = g.div`
         },
         disabled: v || f,
         minSelected: 1,
-        searchOnNumber: Er,
+        searchOnNumber: Tr,
         widthExpand: !0
       }
     ),
     y === Ue ? /* @__PURE__ */ n(
-      pr,
+      mr,
       {
         values: e || [],
         onChange: (m) => r(m?.length ? m : void 0)
@@ -1213,7 +1213,7 @@ const Bo = g.div`
       ] }),
       d?.description && /* @__PURE__ */ n(Ye, { children: d.description }),
       C && /* @__PURE__ */ n(
-        _r,
+        Dr,
         {
           message: C,
           role: "button",
@@ -1235,7 +1235,7 @@ const Bo = g.div`
       ),
       d && /* @__PURE__ */ w(me, { children: [
         /* @__PURE__ */ n(
-          Ar,
+          Or,
           {
             resolver: d.name,
             acceptedParams: d.acceptedParams,
@@ -1255,7 +1255,7 @@ const Bo = g.div`
         )
       ] }),
       c && d && /* @__PURE__ */ n(
-        kr,
+        Cr,
         {
           resolver: d,
           settings: k,
@@ -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 = {
+}, $r = {
   checkbox: ["example"]
 }, wt = (e, t, o) => {
   switch (e) {
@@ -1311,7 +1311,7 @@ const Bo = g.div`
     default:
       return "text";
   }
-}, $r = (e, t) => {
+}, Fr = (e, t) => {
   switch (e) {
     case "text":
       return "string";
@@ -1324,24 +1324,24 @@ const Bo = g.div`
     case "datetime":
       return "datetime";
   }
-}, Fr = [
+}, Mr = [
   "string",
   "integer",
   "float",
   "boolean",
   "datetime",
   "list_of_strings"
-], xs = (e, t, o) => {
-  if (!e || !Fr.includes(e)) return e ?? "";
+], ws = (e, t, o) => {
+  if (!e || !Mr.includes(e)) return e ?? "";
   if (e === "list_of_strings") return "Select (multiple)";
   const r = wt(e, t, o);
   return Ke.find((a) => a.value === r)?.label ?? e;
-}, Mr = g.div`
+}, Vr = g.div`
   display: flex;
   flex-direction: row;
   gap: var(--base-gap-large);
   align-items: center;
-`, Vr = /^[a-zA-Z0-9]{2,64}$/, Br = [
+`, Br = /^[a-zA-Z0-9]{2,64}$/, Ur = [
   { value: "project", label: "Project" },
   { value: "folder", label: "Folder" },
   { value: "task", label: "Task" },
@@ -1350,7 +1350,7 @@ const Bo = g.div`
   { value: "representation", label: "Representation" },
   { value: "user", label: "User" },
   { value: "list", label: "List" }
-], Ur = [
+], Hr = [
   { value: "description", scope: null },
   { value: "example", scope: null },
   { value: "default", scope: ["project"] },
@@ -1358,7 +1358,7 @@ const Bo = g.div`
     value: "inherit",
     scope: ["project", "folder", "task", "product", "version", "representation", "user"]
   }
-], Hr = {
+], zr = {
   name: "",
   scope: ["folder", "task"],
   builtin: !1,
@@ -1383,8 +1383,8 @@ const Bo = g.div`
     le: void 0,
     lt: void 0
   }
-}, zr = (e, t) => {
-  const o = JSON.parse(JSON.stringify(Hr)), r = ["name"];
+}, jr = (e, t) => {
+  const o = JSON.parse(JSON.stringify(zr)), r = ["name"];
   Object.keys(o).forEach((s) => {
     !r.includes(s) && e.includes(s) && s !== "data" && delete o[s];
   });
@@ -1395,7 +1395,7 @@ const Bo = g.div`
     const i = s;
     i === "data" && t.data && o.data ? o.data = { ...o.data, ...t.data } : t[i] !== void 0 && (o[i] = t[i]);
   }), o;
-}, ws = ({
+}, Ss = ({
   attribute: e,
   defaultData: t,
   existingNames: o,
@@ -1409,7 +1409,7 @@ const Bo = g.div`
   const c = t ? {
     ...t,
     name: t.name || (t.data?.title ? ut(t.data.title) : void 0)
-  } : void 0, l = e || zr(s, {
+  } : void 0, l = e || jr(s, {
     position: o.length,
     ...c
   }), [p, u] = U(l), [y, d] = U(
@@ -1421,17 +1421,17 @@ const Bo = g.div`
     ), k(e.data?.type === "float"));
   }, [e]);
   const C = !e, b = (I, _) => {
-    u((O) => O && { ...O, [I]: _ });
+    u((R) => R && { ...R, [I]: _ });
   }, m = (I, _) => {
-    u((O) => {
-      if (!O || !O.data)
-        return O;
-      const M = { ...O.data, [I]: _ };
-      return { ...O, data: M };
+    u((R) => {
+      if (!R || !R.data)
+        return R;
+      const M = { ...R.data, [I]: _ };
+      return { ...R, data: M };
     });
   };
   let x = "";
-  p && C && (o.includes(p.name) ? x = "This attribute already exists" : Vr.test(p.name) || (x = "Invalid attribute name: use 2-64 letters or digits, no spaces or symbols"));
+  p && C && (o.includes(p.name) ? x = "This attribute already exists" : Br.test(p.name) || (x = "Invalid attribute name: use 2-64 letters or digits, no spaces or symbols"));
   const S = () => {
     p && v(p);
   }, P = /* @__PURE__ */ w("div", { style: { display: "flex", width: "100%", flexDirection: "row" }, children: [
@@ -1459,15 +1459,15 @@ const Bo = g.div`
     )
   ] });
   let $ = [];
-  Ur.forEach((I) => {
+  Hr.forEach((I) => {
     (!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 = $r[y] ?? [];
   $ = [...$, ...N].filter((I) => !B.includes(I));
-  const R = {
+  const O = {
     enum: (I = [], _) => /* @__PURE__ */ n(
       Rr,
       {
@@ -1476,21 +1476,21 @@ const Bo = g.div`
         enumResolverSettings: p?.data?.enumResolverSettings,
         onChangeEnum: _,
         onChangeResolver: z,
-        onChangeResolverSettings: (O) => m("enumResolverSettings", O)
+        onChangeResolverSettings: (R) => m("enumResolverSettings", R)
       }
     ),
     inherit: (I, _) => /* @__PURE__ */ n(
       De,
       {
         checked: I,
-        onChange: (O) => _(O.target.checked)
+        onChange: (R) => _(R.target.checked)
       }
     ),
     booleanDefault: (I, _) => /* @__PURE__ */ n(
       De,
       {
         checked: I,
-        onChange: (O) => _(O.target.checked)
+        onChange: (R) => _(R.target.checked)
       }
     )
   }, z = (I) => {
@@ -1500,7 +1500,7 @@ const Bo = g.div`
     m("title", _), C && b("name", ut(_));
   }, 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);
+    d(_), m("type", Fr(_, 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;
   return /* @__PURE__ */ n(
     qe,
@@ -1518,7 +1518,7 @@ const Bo = g.div`
       children: p && /* @__PURE__ */ w(Et, { children: [
         !s.includes("title") && /* @__PURE__ */ n(te, { label: "Title", children: /* @__PURE__ */ n(Ae, { value: p?.data.title, onChange: T, autoFocus: !0 }) }, "title"),
         !s.includes("name") && /* @__PURE__ */ n(te, { label: "Name", children: /* @__PURE__ */ n(
-          Zn,
+          eo,
           {
             value: p.name,
             disabled: !C,
@@ -1529,7 +1529,7 @@ const Bo = g.div`
         !s.includes("scope") && /* @__PURE__ */ n(te, { label: "Scope", children: /* @__PURE__ */ n(
           pe,
           {
-            options: Br,
+            options: Ur,
             disabled: p.builtin,
             value: p.scope || [],
             onChange: (I) => b("scope", I),
@@ -1537,7 +1537,7 @@ const Bo = g.div`
             widthExpand: !0
           }
         ) }),
-        !s.includes("type") && /* @__PURE__ */ n(te, { label: "Type", children: /* @__PURE__ */ w(Mr, { children: [
+        !s.includes("type") && /* @__PURE__ */ n(te, { label: "Type", children: /* @__PURE__ */ w(Vr, { children: [
           /* @__PURE__ */ n(
             pe,
             {
@@ -1589,19 +1589,19 @@ const Bo = g.div`
         ) }),
         $.map((I) => {
           if (s.includes(I)) return null;
-          let _ = null, O = to(I);
+          let _ = null, R = no(I);
           if (I === "enum" || I === "inherit") {
-            const M = R[I];
+            const M = O[I];
             _ = M(p?.data[I], (Y) => m(I, Y));
           } else if (I === "default" && p?.data?.type === "boolean")
-            _ = R.booleanDefault(
+            _ = O.booleanDefault(
               p?.data[I],
               (M) => m(I, M)
             );
           else if (["ge", "gt", "le", "lt"].includes(I)) {
             if (["gt", "lt"].includes(I)) return null;
             _ = /* @__PURE__ */ n(
-              Xo,
+              Qo,
               {
                 value: p?.data,
                 isMin: I === "ge",
@@ -1617,7 +1617,7 @@ const Bo = g.div`
                   });
                 }
               }
-            ), O = I === "ge" ? "Min" : "Max";
+            ), R = I === "ge" ? "Min" : "Max";
           } else {
             const M = (Y) => {
               const ne = Y.target.value;
@@ -1646,7 +1646,7 @@ const Bo = g.div`
           return /* @__PURE__ */ n(
             te,
             {
-              label: O,
+              label: R,
               style: {
                 alignItems: "flex-start"
               },
@@ -1659,7 +1659,7 @@ const Bo = g.div`
       ] })
     }
   );
-}, jr = Wn`
+}, Kr = Wn`
   from {
     opacity: 0;
     transform: translateY(-4px);
@@ -1668,10 +1668,10 @@ const Bo = g.div`
     opacity: 1;
     transform: translateY(0);
   }
-`, Ss = g.div`
+`, ks = g.div`
   position: relative;
   display: inline-flex;
-`, ks = g.button`
+`, Cs = g.button`
   background: none;
   border: none;
   padding: 0;
@@ -1703,7 +1703,7 @@ const Bo = g.div`
     width: 24px;
     height: 24px;
   }
-`, Cs = g(G)`
+`, Is = g(G)`
   width: 20px;
   height: 20px;
   min-width: 20px;
@@ -1719,13 +1719,13 @@ const Bo = g.div`
   &:hover {
     background-color: var(--md-sys-color-surface-container-highest-hover);
   }
-`, Is = g.div`
+`, Es = g.div`
   position: fixed;
   z-index: 1001;
   background-color: var(--md-sys-color-surface-container-highest);
   border-radius: var(--border-radius-l);
   box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.2);
-  animation: ${jr} 0.15s ease-out;
+  animation: ${Kr} 0.15s ease-out;
 
   &.right {
     transform-origin: top right;
@@ -1734,13 +1734,13 @@ const Bo = g.div`
   &.left {
     transform-origin: top left;
   }
-`, Es = g.div`
+`, Ts = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-small);
   padding: var(--padding-m);
   position: relative;
-`, Ts = g(H)`
+`, Ns = g(H)`
   &.hasIcon {
     padding: 4px;
   }
@@ -1756,7 +1756,7 @@ const Bo = g.div`
   &:hover {
     background-color: var(--md-sys-color-surface-container-highest-hover);
   }
-`, Ns = g.div`
+`, Ps = g.div`
   display: flex;
   flex-direction: column;
   gap: 4px;
@@ -1765,7 +1765,7 @@ const Bo = g.div`
     ${fe.labelSmall}
     color: var(--md-sys-color-outline);
   }
-`, Ps = g.input`
+`, _s = g.input`
   background-color: var(--md-sys-color-surface-container-low);
   border: 1px solid var(--md-sys-color-outline-variant);
   border-radius: var(--border-radius-m);
@@ -1787,11 +1787,11 @@ const Bo = g.div`
     cursor: pointer;
     filter: invert(0.5);
   }
-`, _s = g(H)`
+`, Ds = g(H)`
   &:hover {
     background-color: var(--md-sys-color-surface-container-highest-hover);
   }
-`, Kr = g.div`
+`, Gr = g.div`
   position: fixed;
   bottom: 14px;
   left: 14px;
@@ -1807,13 +1807,13 @@ const Bo = g.div`
 
   box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
   font-weight: 700;
-`, Ds = le(
-  ({ tooltip: e, ...t }, o) => /* @__PURE__ */ n(Kr, { "data-tooltip": e, "data-tooltip-delay": 0, ...t, ref: o, children: "Early preview" })
+`, As = le(
+  ({ tooltip: e, ...t }, o) => /* @__PURE__ */ n(Gr, { "data-tooltip": e, "data-tooltip-delay": 0, ...t, ref: o, children: "Early preview" })
 ), St = [
   { 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 }) => {
+], Os = 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 = {
@@ -1821,7 +1821,7 @@ const Bo = g.div`
     transition: i
   };
   return /* @__PURE__ */ n(
-    Wr,
+    Xr,
     {
       ref: a,
       style: f,
@@ -1829,8 +1829,8 @@ 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(G, { icon: "drag_indicator" }) }),
+        /* @__PURE__ */ n(Rn, { children: t })
       ] })
     }
   );
@@ -1860,8 +1860,8 @@ const Bo = g.div`
     }
     r(null);
   }, f = o ? St.find((c) => c.value === o) : null;
-  return /* @__PURE__ */ w(Yr, { children: [
-    /* @__PURE__ */ w(Xr, { children: [
+  return /* @__PURE__ */ w(qr, { children: [
+    /* @__PURE__ */ w(Qr, { children: [
       /* @__PURE__ */ n("span", { className: "label", children: "Product's featured version priority" }),
       /* @__PURE__ */ n(
         G,
@@ -1881,30 +1881,30 @@ 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: Re,
+              children: /* @__PURE__ */ n(Wr, { 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(G, { icon: "drag_indicator" }) }),
+            /* @__PURE__ */ n(Rn, { children: f.label })
           ] }) })
         ]
       }
     )
   ] });
-}, Yr = g.div`
+}, qr = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-small);
-`, qr = g.div`
+`, Wr = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-small);
-`, Wr = g.div`
+`, Xr = g.div`
   &.dragging {
     opacity: 0;
   }
@@ -1931,14 +1931,14 @@ 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`
+`, Rn = g.span`
   font-weight: 500;
   color: var(--md-sys-color-on-surface);
-`, Xr = g.div`
+`, Qr = g.div`
   color: var(--md-sys-color-outline);
   display: flex;
   align-items: center;
@@ -1952,9 +1952,9 @@ const Bo = g.div`
   .icon {
     cursor: pointer;
   }
-`, Os = le(
+`, Ls = 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 })
-), Qr = g(H)`
+), Jr = g(H)`
   transition: color 0.2s, background-color 0.2s, opacity 0.2s;
 
   .bolt {
@@ -1987,13 +1987,13 @@ const Bo = g.div`
   &.rounded {
     border-radius: var(--border-radius-xl);
   }
-`, Ls = le(
+`, $s = le(
   ({ feature: e, variant: t = "outline", rounded: o = !0, bolt: r = !1, ...a }, s) => {
-    const { setPowerpackDialog: i } = bo(), v = (f) => {
+    const { setPowerpackDialog: i } = xo(), v = (f) => {
       i(e), a.onClick?.(f);
     };
     return /* @__PURE__ */ w(
-      Qr,
+      Jr,
       {
         icon: a.icon || "bolt",
         ...a,
@@ -2012,21 +2012,21 @@ const Bo = g.div`
       }
     );
   }
-), Jr = "https://ynput.cloud/free-trial", Zr = ({
+), Zr = "https://ynput.cloud/free-trial", ei = ({
   addon: e
   // an addon they are trying to access, e.g. 'powerpack'
 }) => {
-  const { data: t } = co(), o = t?.data?.isAdmin || t?.data?.isManager, { data: r } = uo(void 0, { skip: !t?.name }), { data: a } = po(
+  const { data: t } = uo(), o = t?.data?.isAdmin || t?.data?.isManager, { data: r } = po(void 0, { skip: !t?.name }), { data: a } = mo(
     {},
     { skip: !o || !r?.instanceId }
-  ), s = new URL(Jr), i = r?.instanceId, v = a || 10;
+  ), s = new URL(Zr), i = r?.instanceId, v = a || 10;
   return s.searchParams.append("seats", v.toString()), i && s.searchParams.append("instance_id", i), e && s.searchParams.append("addon", e), s.toString();
-}, $s = le(
+}, Fs = le(
   ({ children: e, addon: t, ...o }, r) => {
-    const a = Zr({ addon: t });
+    const a = ei({ addon: t });
     return /* @__PURE__ */ n("a", { href: a, target: "_blank", rel: "noopener noreferrer", ...o, ref: r, children: e });
   }
-), Fs = g(qe)`
+), Ms = g(qe)`
   background: linear-gradient(180deg, rgb(0 121 181 / 0%) -12.03%, rgb(4 255 227 / 26%) 105.38%),
     #15171c;
 
@@ -2042,13 +2042,13 @@ const Bo = g.div`
   }
 
   .icon {
-    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;
+    font-variation-settings: 'FILL' 1;
   }
 
   .cancelButton {
     background-color: unset;
   }
-`, Ms = g.div`
+`, Vs = g.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -2078,7 +2078,7 @@ const Bo = g.div`
     font-size: 32px;
     color: var(--md-sys-color-tertiary);
   }
-`, Vs = g.div`
+`, Bs = g.div`
   width: 100%;
 
   h3 {
@@ -2106,7 +2106,7 @@ const Bo = g.div`
       gap: 8px;
     }
   }
-`, Bs = g.div`
+`, Us = g.div`
   cursor: pointer;
   text-align: center;
   margin-top: 16px;
@@ -2116,7 +2116,7 @@ const Bo = g.div`
   &:hover {
     text-decoration: underline;
   }
-`, ei = g(H)`
+`, ti = g(H)`
   background-color: var(--md-sys-color-tertiary);
   color: var(--md-sys-color-on-tertiary);
   padding: 12px 20px;
@@ -2128,19 +2128,19 @@ const Bo = g.div`
   &:hover {
     background-color: var(--md-sys-color-tertiary-hover);
   }
-`, Us = le(({ ...e }, t) => /* @__PURE__ */ n(ei, { ...e, children: "Try for free!" })), ti = g.div`
+`, Hs = le(({ ...e }, t) => /* @__PURE__ */ n(ti, { ...e, children: "Try for free!" })), ni = g.div`
   display: flex;
   flex-direction: column;
   gap: 8px;
   border-radius: var(--border-radius-l);
   background-color: var(--md-sys-color-secondary-container);
   padding: var(--padding-m);
-`, Hs = le(
+`, zs = le(
   ({ requiredVersion: e, addonName: t, addonLabel: o, ...r }, a) => {
     const s = t || "powerpack", i = o || "Power Features";
-    return e ? /* @__PURE__ */ w(ti, { ...r, ref: a, children: [
+    return e ? /* @__PURE__ */ w(ni, { ...r, ref: a, children: [
       /* @__PURE__ */ n("span", { children: `${i} version ${e} is required to use this feature.` }),
-      /* @__PURE__ */ n(xo, { to: `/market?selected=${s}`, children: /* @__PURE__ */ w(H, { variant: "tertiary", children: [
+      /* @__PURE__ */ n(wo, { to: `/market?selected=${s}`, children: /* @__PURE__ */ w(H, { variant: "tertiary", children: [
         "Update ",
         i,
         " ",
@@ -2148,7 +2148,7 @@ const Bo = g.div`
       ] }) })
     ] }) : `Required ${i} version installed already.`;
   }
-), ni = g(H)`
+), oi = g(H)`
   width: 100%;
   justify-content: flex-start;
   margin-bottom: 8px;
@@ -2166,7 +2166,7 @@ const Bo = g.div`
   .arrow {
     color: var(--md-sys-color-outline);
   }
-`, oi = g.div`
+`, ri = g.div`
   height: 100%;
   /* fixed floor so the panel doesn't resize as its content changes */
   min-width: 260px;
@@ -2176,7 +2176,7 @@ const Bo = g.div`
   z-index: 10;
   display: flex;
   flex-direction: column;
-`, ri = g.div`
+`, ii = g.div`
   display: flex;
   align-items: center;
   gap: var(--base-gap-small);
@@ -2192,20 +2192,20 @@ const Bo = g.div`
   }
 `, tn = g(H)`
   padding: 4px !important;
-`, ii = g.h3`
+`, ai = g.h3`
   margin: 0;
   flex: 1;
-`, ai = g.div`
+`, si = g.div`
   padding: 8px;
   flex: 1;
   overflow-y: auto;
-`, si = ({ settings: e, order: t }) => {
+`, li = ({ settings: e, order: t }) => {
   const { isPanelOpen: o, selectedSetting: r, closePanel: a, backToMainMenu: s, selectSetting: i } = Ze(), v = () => r && e.find((u) => u.id === r)?.title || "Settings", f = t ? e.toSorted((p, u) => {
     const y = p.id ? t.indexOf(p.id) : -1, d = u.id ? t.indexOf(u.id) : -1;
     return y === -1 && d === -1 ? 0 : y === -1 ? 1 : d === -1 ? -1 : y - d;
   }) : e, c = e.find((p) => p.id === r), l = () => r ? e.find((u) => u.id === r)?.component : /* @__PURE__ */ n(me, { children: f.map(
     (u, y) => u.title ? /* @__PURE__ */ w(
-      ni,
+      oi,
       {
         onClick: () => i(u.id),
         variant: "text",
@@ -2218,16 +2218,16 @@ const Bo = g.div`
         ]
       },
       u.id
-    ) : /* @__PURE__ */ n(Xn, { children: u.component }, u.id)
+    ) : /* @__PURE__ */ n(Qn, { children: u.component }, u.id)
   ) });
-  return /* @__PURE__ */ w(oi, { open: o, children: [
-    /* @__PURE__ */ w(ri, { children: [
+  return /* @__PURE__ */ w(ri, { open: o, children: [
+    /* @__PURE__ */ w(ii, { children: [
       r && /* @__PURE__ */ n(tn, { variant: "text", icon: "arrow_back", onClick: s }),
-      /* @__PURE__ */ n(ii, { children: v() }),
+      /* @__PURE__ */ n(ai, { children: v() }),
       c?.headerActions,
       /* @__PURE__ */ n(tn, { variant: "text", icon: "close", onClick: a })
     ] }),
-    /* @__PURE__ */ n(ai, { children: l() })
+    /* @__PURE__ */ n(si, { children: l() })
   ] });
 }, ht = g.ul`
   display: flex;
@@ -2236,7 +2236,7 @@ const Bo = g.div`
   list-style-type: none;
   margin: 0;
   padding: 0;
-`, li = g.li`
+`, ci = g.li`
   display: flex;
   padding: 2px;
   padding-left: 8px;
@@ -2285,11 +2285,11 @@ const Bo = g.div`
       background-color: unset;
     }
   }
-`, ci = g.div`
+`, di = g.div`
   display: flex;
   gap: var(--base-gap-small);
   margin-left: auto;
-`, di = g(H)`
+`, ui = g(H)`
   && {
     background-color: unset;
     padding: 4px;
@@ -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;
     }
   }
 
@@ -2320,7 +2320,7 @@ const Bo = g.div`
     className: v,
     ...f
   }, c) => /* @__PURE__ */ w(
-    li,
+    ci,
     {
       className: J("setting-item", v, {
         highlighted: a,
@@ -2339,8 +2339,8 @@ const Bo = g.div`
           ] }),
           e.label
         ] }),
-        /* @__PURE__ */ n(ci, { className: "actions", children: t?.map(({ icon: l, className: p, active: u, onClick: y, ...d }, h) => /* @__PURE__ */ w(
-          di,
+        /* @__PURE__ */ n(di, { className: "actions", children: t?.map(({ icon: l, className: p, active: u, onClick: y, ...d }, h) => /* @__PURE__ */ w(
+          ui,
           {
             className: J("action", p, { active: u }),
             onClick: s ? void 0 : y,
@@ -2356,7 +2356,7 @@ const Bo = g.div`
       ]
     }
   )
-), ui = g(ot)`
+), pi = g(ot)`
   &:hover {
     .pin-action {
       opacity: 1;
@@ -2444,7 +2444,7 @@ const Bo = g.div`
     ]
   );
   return /* @__PURE__ */ n(
-    ui,
+    pi,
     {
       id: e,
       item: t,
@@ -2484,7 +2484,7 @@ const Bo = g.div`
     transition: h
   };
   return /* @__PURE__ */ n(
-    pi,
+    mi,
     {
       ref: y,
       style: C,
@@ -2508,7 +2508,7 @@ const Bo = g.div`
       )
     }
   );
-}, pi = g.div`
+}, mi = g.div`
   &.dragging {
     z-index: 1;
     opacity: 0;
@@ -2516,10 +2516,10 @@ const Bo = g.div`
 `, Ln = "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) : Ln, gi = (e) => e.length === 1 ? `${e[0].charAt(0).toUpperCase() + e[0].slice(1)} attributes` : "Attributes", Fn = (e = [], t = []) => [
   {
     id: "attributes",
-    label: mi(e),
+    label: gi(e),
     icon: "text_fields",
     match: (o) => !!o.attrib && !o.parentScope
   },
@@ -2599,8 +2599,8 @@ 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) }) });
-}, gi = 300, Bn = ({
+  }, [t.length, o, e, r]), /* @__PURE__ */ n(Lo, { targetId: e, id: e, align: "left", children: /* @__PURE__ */ n($o, { menu: t, onClose: () => r(!1) }) });
+}, hi = 300, Bn = ({
   columnVisibility: e,
   defaultColumnVisibility: t,
   updateColumnVisibility: o,
@@ -2618,7 +2618,7 @@ const Bo = g.div`
   }, u = ee(() => {
     v.current = null;
     const b = i.current;
-    b && (f.current = performance.now() + gi, c.current.updateColumnVisibility(b.next), s(null));
+    b && (f.current = performance.now() + hi, c.current.updateColumnVisibility(b.next), s(null));
   }, []), y = ee(() => {
     v.current = null, i.current && s(null);
   }, []);
@@ -2663,10 +2663,10 @@ const Bo = g.div`
     cancelPaint: y,
     isPainting: !!a
   };
-}, ze = "add-column-menu-list", hi = [], vi = (e, t) => e.parentScope && e.attrib ? `${e.parentScope.charAt(0).toUpperCase()}${e.parentScope.slice(1)} attributes` : Mn(e, t)?.label, je = (e, t) => {
-  const o = vi(e, t);
+}, ze = "add-column-menu-list", vi = [], fi = (e, t) => e.parentScope && e.attrib ? `${e.parentScope.charAt(0).toUpperCase()}${e.parentScope.slice(1)} attributes` : Mn(e, t)?.label, je = (e, t) => {
+  const o = fi(e, t);
   return { ...e, icon: e.icon ?? $n(e), ...o ? { path: o } : {} };
-}, zs = ({
+}, js = ({
   icon: e,
   label: t,
   checked: o,
@@ -2690,7 +2690,7 @@ const Bo = g.div`
     ),
     ...s
   }
-), fi = ({
+), bi = ({
   columns: e,
   highlighted: t,
   columnVisibility: o,
@@ -2711,14 +2711,14 @@ const Bo = g.div`
   addColumnMenuItems: C,
   onColumnDragStart: b,
   isColumnDragging: m,
-  scopes: x = hi,
+  scopes: x = vi,
   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), L = (E) => !!c && E === "name", {
     baseVisibility: I,
     displayVisibility: _,
-    isVisible: O,
+    isVisible: R,
     onPaintStart: M,
     onPaintEnter: Y,
     toggle: ne,
@@ -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) => !R(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,21 +2782,21 @@ const Bo = g.div`
     () => Vn({
       columns: e,
       onToggle: ne,
-      isColumnVisible: O,
+      isColumnVisible: R,
       onPaintStart: M,
       onPaintEnter: Y,
       scopes: x
     }),
     [e, _, ne, M, Y, x]
   ), Te = C ?? Ee, Lt = typeof S == "string" ? /* @__PURE__ */ n(
-    yi,
+    xi,
     {
       value: S,
       onChange: (E) => P?.(E),
       onClose: () => P?.(null)
     }
   ) : /* @__PURE__ */ n(
-    bi,
+    yi,
     {
       variant: "text",
       icon: "add",
@@ -2845,11 +2845,11 @@ 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(
@@ -2921,10 +2921,10 @@ const Bo = g.div`
         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: Re,
               children: /* @__PURE__ */ n(ht, { children: Ie.map((E) => /* @__PURE__ */ n(
                 nn,
                 {
@@ -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: Re,
               children: /* @__PURE__ */ n(ht, { children: ie.map((E) => /* @__PURE__ */ n(
                 nn,
                 {
@@ -3005,15 +3005,15 @@ const Bo = g.div`
   font-weight: 500;
   color: var(--md-sys-color-outline);
   padding: 4px 0;
-`, bi = g(H)`
+`, yi = g(H)`
   justify-content: flex-start;
-`, yi = g(Io)`
+`, xi = g(Eo)`
   padding: 0;
 
   input {
     height: 32px;
   }
-`, xi = (e) => {
+`, wi = (e) => {
   const {
     columnVisibility: t,
     defaultColumnVisibility: o,
@@ -3032,7 +3032,7 @@ const Bo = g.div`
     columnSummaryFormats: h
   } = ke();
   return /* @__PURE__ */ n(
-    fi,
+    bi,
     {
       ...e,
       columnVisibility: t,
@@ -3052,16 +3052,16 @@ const Bo = g.div`
       columnSummaryFormats: h
     }
   );
-}, wi = g.div`
+}, Si = g.div`
   padding: var(--padding-m);
   display: flex;
   flex-direction: column;
   gap: 12px;
-`, Si = g.div`
+`, ki = g.div`
   display: flex;
   align-items: center;
   gap: 12px;
-`, ki = g.input`
+`, Ci = g.input`
   flex: 1;
   height: 4px;
   border-radius: 2px;
@@ -3102,11 +3102,11 @@ const Bo = g.div`
   &:hover::-moz-range-thumb {
     background: var(--md-sys-color-primary-container);
   }
-`, Ci = g.span`
+`, Ii = g.span`
   color: var(--md-sys-color-on-surface-variant);
   min-width: 40px;
   text-align: right;
-`, Ii = ({
+`, Ei = ({
   value: e,
   onChange: t,
   onChangeComplete: o,
@@ -3124,7 +3124,7 @@ const Bo = g.div`
   const h = ee((x) => {
     const S = parseInt(x.target.value, 10);
     d(!0), u(S);
-  }, []), k = To(p, f);
+  }, []), k = No(p, f);
   Z(() => {
     y && t(p);
   }, [k, t, y, p]);
@@ -3133,11 +3133,11 @@ const Bo = g.div`
   }, []), b = ee(() => {
     l(!1), d(!1), o && o(p);
   }, [p, o]), m = (p - s) / (i - s) * 100;
-  return /* @__PURE__ */ w(wi, { children: [
+  return /* @__PURE__ */ w(Si, { children: [
     /* @__PURE__ */ n("label", { htmlFor: a, children: r }),
-    /* @__PURE__ */ w(Si, { children: [
+    /* @__PURE__ */ w(ki, { children: [
       /* @__PURE__ */ n(
-        ki,
+        Ci,
         {
           id: a,
           type: "range",
@@ -3153,17 +3153,17 @@ const Bo = g.div`
           }
         }
       ),
-      /* @__PURE__ */ n(Ci, { children: p })
+      /* @__PURE__ */ n(Ii, { children: p })
     ] })
   ] });
-}, Se = "hierarchy", bt = "folder", rn = "name", Ei = ({ scope: e }) => {
+}, Se = "hierarchy", bt = "folder", rn = "name", Ti = ({ scope: e }) => {
   const { groupBy: t, groupByConfig: o, updateGroupBy: r, updateGroupByConfig: a, sorting: s, updateSorting: i } = ke(), {
     modules: v,
     showHierarchy: f,
     updateShowHierarchy: c,
     hierarchyOptions: l,
     hierarchyActive: p
-  } = tt(), u = No({ scope: e });
+  } = tt(), u = Po({ scope: e });
   if (!v) return null;
   const { GroupSettings: y, requiredVersion: d } = v || {}, h = !!c, C = h ? [...l || [
     { value: Se, label: "Hierarchy", icon: "account_tree" },
@@ -3203,7 +3203,7 @@ const Bo = g.div`
       }
     )
   };
-}, Ti = g.div`
+}, Ni = g.div`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-large);
@@ -3221,10 +3221,10 @@ const Bo = g.div`
   list-style-type: none;
   margin: 0;
   padding: 0;
-`, Ni = g.span`
+`, Pi = g.span`
   color: var(--md-sys-color-outline);
   padding: 4px 0;
-`, Pi = g(ot)`
+`, _i = g(ot)`
   .drag-handle {
     cursor: grab;
     height: 20px;
@@ -3240,18 +3240,18 @@ const Bo = g.div`
       cursor: grabbing;
     }
   }
-`, _i = g(ot)`
+`, Di = g(ot)`
   cursor: pointer;
 
   .action {
     color: var(--md-sys-color-outline);
   }
-`, Di = ({ item: e, desc: t, onToggleDirection: o, onRemove: r }) => {
+`, Ai = ({ item: e, desc: t, onToggleDirection: o, onRemove: r }) => {
   const { attributes: a, listeners: s, setNodeRef: i, transform: v, transition: f, isDragging: c } = Qe({
     id: e.value
   });
   return /* @__PURE__ */ n(
-    Pi,
+    _i,
     {
       ref: i,
       item: e,
@@ -3273,11 +3273,11 @@ const Bo = g.div`
       ]
     }
   );
-}, Ai = ({
+}, Oi = ({
   sorting: e,
   options: t,
   onChange: o,
-  maxKeys: r = _o
+  maxKeys: r = Do
 }) => {
   const a = Pt(
     _t(Dt, {
@@ -3292,7 +3292,7 @@ const Bo = g.div`
     const d = e.findIndex((k) => k.id === u.id), h = e.findIndex((k) => k.id === y.id);
     d === -1 || h === -1 || o(At(e, d, h));
   }, c = (u) => o(e.map((y) => y.id === u ? { ...y, desc: !y.desc } : y)), l = (u) => o(e.filter((y) => y.id !== u)), p = (u) => o([...e, { id: u, desc: !1 }]);
-  return /* @__PURE__ */ w(Ti, { className: "sort-settings", children: [
+  return /* @__PURE__ */ w(Ni, { className: "sort-settings", children: [
     e.length > 0 && /* @__PURE__ */ w(an, { className: "sorted", children: [
       /* @__PURE__ */ n(sn, { children: "Sorted by" }),
       /* @__PURE__ */ n(
@@ -3302,12 +3302,12 @@ const Bo = g.div`
           collisionDetection: Xe,
           onDragEnd: f,
           children: /* @__PURE__ */ n(
-            Re,
+            Oe,
             {
               items: e.map((u) => u.id),
-              strategy: Oe,
+              strategy: Re,
               children: /* @__PURE__ */ n(ln, { children: e.map((u) => /* @__PURE__ */ n(
-                Di,
+                Ai,
                 {
                   item: s(u.id),
                   desc: u.desc,
@@ -3324,7 +3324,7 @@ const Bo = g.div`
     /* @__PURE__ */ w(an, { className: "available", children: [
       /* @__PURE__ */ n(sn, { children: e.length > 0 ? "Then sort by" : "Sort by" }),
       v ? /* @__PURE__ */ n(ln, { children: i.map((u) => /* @__PURE__ */ n(
-        _i,
+        Di,
         {
           item: u,
           "data-sort-id": u.value,
@@ -3332,7 +3332,7 @@ const Bo = g.div`
           actions: [{ icon: "add" }]
         },
         u.value
-      )) }) : /* @__PURE__ */ w(Ni, { children: [
+      )) }) : /* @__PURE__ */ w(Pi, { children: [
         "Sorting is limited to ",
         r,
         " columns."
@@ -3341,12 +3341,12 @@ const Bo = g.div`
   ] });
 }, Ri = (e = []) => {
   const { sorting: t, updateSorting: o } = ke(), { attribFields: r, scopes: a } = tt(), s = [
-    ...wo(a, e).map((l) => ({
+    ...So(a, e).map((l) => ({
       value: l.id,
       label: l.label
     })),
     ...r.filter(
-      (l) => l.scope?.some((p) => a.includes(p)) && !So(l)
+      (l) => l.scope?.some((p) => a.includes(p)) && !ko(l)
     ).map((l) => ({
       value: `attrib_${l.name}`,
       label: l.data.title || l.name
@@ -3364,13 +3364,13 @@ const Bo = g.div`
     title: "Sort",
     icon: "sort",
     preview: t.length ? f(t[0].id) + (t.length > 1 ? ` +${t.length - 1}` : "") : "None",
-    component: /* @__PURE__ */ n(Ai, { sorting: t, options: v, onChange: o })
+    component: /* @__PURE__ */ n(Oi, { sorting: t, options: v, onChange: o })
   };
-}, Ot = [Do, Ao], cn = 5, Oi = `#${$o}, [data-column-drag-origin]`, Li = (e, t) => {
+}, Rt = [Ao, Oo], cn = 5, Li = `#${Fo}, [data-column-drag-origin]`, $i = (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) => !Rt.includes(v.dataset.columnId || "")
   ), s = a.find((v) => {
     const f = v.getBoundingClientRect();
     return e >= f.left && e < f.right;
@@ -3379,18 +3379,18 @@ 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) ?? $i(e, t), r = o?.dataset.columnId;
+  if (!o || !r || Rt.includes(r)) return null;
   const a = o.getBoundingClientRect(), s = e < a.left + a.width / 2 ? "left" : "right";
   return {
     columnId: r,
     side: s,
-    line: Po(o, s)
+    line: _o(o, s)
   };
-}, $i = (e, t) => {
+}, Fi = (e, t) => {
   const o = e.length ? e : t;
   return [...o, ...t.filter((r) => !o.includes(r))];
-}, Fi = () => {
+}, Mi = () => {
   const {
     columnVisibility: e,
     columnOrder: t,
@@ -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 = Fi(O.columnOrder, O.getAllColumns()).filter(
+      (I) => I !== N && !Rt.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(O.columnPinning.left || []);
+    L.has(B.columnId) ? L.add(N) : L.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) => L.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,
@@ -3482,20 +3482,20 @@ const Bo = g.div`
       }
       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 = () => {
+    }, O = () => {
       const T = C.current;
-      k.current = null, T && (Vi(), T.target && (m(T.column.value, T.target), y(!1)), h(null));
+      k.current = null, T && (Bi(), 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(
     /* @__PURE__ */ w(me, { children: [
       P && /* @__PURE__ */ n(
-        Bi,
+        Ui,
         {
           style: {
             left: P.left,
@@ -3506,14 +3506,14 @@ const Bo = g.div`
         }
       ),
       /* @__PURE__ */ w(
-        Ui,
+        Hi,
         {
           style: {
             left: d.x - d.grab.x,
             top: d.y - d.grab.y,
             width: d.grab.width
           },
-          className: Mi(d),
+          className: Vi(d),
           children: [
             d.column.icon && /* @__PURE__ */ n(G, { icon: d.column.icon }),
             /* @__PURE__ */ n("span", { children: d.column.label })
@@ -3525,19 +3525,19 @@ const Bo = g.div`
     document.body
   ) : null;
   return { armDrag: S, cancelDrag: x, isDragging: !!d, dragOverlay: $ };
-}, Mi = (e) => e.target ? "over-target" : "", Vi = () => {
+}, Vi = (e) => e.target ? "over-target" : "", Bi = () => {
   const e = (t) => {
     t.stopPropagation(), t.preventDefault();
   };
   window.addEventListener("click", e, !0), setTimeout(() => window.removeEventListener("click", e, !0), 0);
-}, Bi = g.div`
+}, Ui = g.div`
   position: fixed;
   box-sizing: border-box;
   z-index: 999;
   pointer-events: none;
   border-radius: 4px;
   background-color: color-mix(in srgb, var(--md-sys-color-primary) 8%, transparent);
-`, Ui = g.div`
+`, Hi = g.div`
   position: fixed;
   box-sizing: border-box;
   z-index: 2000;
@@ -3568,7 +3568,7 @@ const Bo = g.div`
     columnVisibility: r,
     defaultColumnVisibility: a,
     updateColumnVisibility: s
-  }), { armDrag: y, cancelDrag: d, isDragging: h, dragOverlay: k } = Fi(), C = K({ isPainting: u, isDragging: h, cancelPaint: p });
+  }), { armDrag: y, cancelDrag: d, isDragging: h, dragOverlay: k } = Mi(), C = K({ isPainting: u, isDragging: h, cancelPaint: p });
   C.current = { isPainting: u, isDragging: h, cancelPaint: p };
   const b = ee(
     (S, P) => {
@@ -3610,9 +3610,9 @@ const Bo = g.div`
     onColumnDragStart: y,
     isColumnDragging: h
   };
-}, Hi = [], zi = [], Hn = ({
-  extraColumns: e = Hi,
-  hiddenColumns: t = zi,
+}, zi = [], ji = [], Hn = ({
+  extraColumns: e = zi,
+  hiddenColumns: t = ji,
   includeLinks: o = !0,
   parentColumns: r = []
 }) => {
@@ -3625,7 +3625,7 @@ const Bo = g.div`
       },
       {
         value: "name",
-        label: ko(i),
+        label: Co(i),
         icon: Q("name")
       },
       {
@@ -3745,14 +3745,14 @@ const Bo = g.div`
     [v, t]
   );
   return { columns: v, visibleColumns: f, scopes: i };
-}, ji = g(H)`
+}, Ki = g(H)`
   min-width: 120px;
-`, Ki = g(H)`
+`, Gi = g(H)`
   padding: 4px !important;
-`, js = ({ defaultSelected: e, className: t, ...o }) => {
+`, Ks = ({ defaultSelected: e, className: t, ...o }) => {
   const { togglePanel: r, isPanelOpen: a } = Ze();
   return /* @__PURE__ */ n(
-    ji,
+    Ki,
     {
       onClick: () => r(e),
       icon: "settings",
@@ -3761,7 +3761,7 @@ const Bo = g.div`
       children: "Customize"
     }
   );
-}, Ks = ({
+}, Gs = ({
   settings: e = [],
   extraColumns: t,
   hiddenColumns: o,
@@ -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 && Io(a, p), O = N.filter(
+    (R) => ae(y, R.value, d)
   ).length, {
     menuItems: z,
     dragOverlay: T,
@@ -3805,14 +3805,14 @@ const Bo = g.div`
     columns: N,
     scopes: u,
     extraItems: c
-  }), L = Ei({ scope: f }), I = Ri($), _ = [
+  }), L = Ti({ scope: f }), I = Ri($), _ = [
     {
       id: "columns",
       title: "Columns",
       icon: "view_column",
-      preview: `${R}/${N.length}`,
+      preview: `${O}/${N.length}`,
       headerActions: /* @__PURE__ */ n(
-        Ki,
+        Gi,
         {
           variant: "text",
           icon: "search",
@@ -3823,7 +3823,7 @@ const Bo = g.div`
       ),
       component: /* @__PURE__ */ w(me, { children: [
         /* @__PURE__ */ n(
-          xi,
+          wi,
           {
             columns: N,
             highlighted: B,
@@ -3843,7 +3843,7 @@ const Bo = g.div`
     {
       id: "row-height",
       component: /* @__PURE__ */ n(
-        Ii,
+        Ei,
         {
           value: h,
           onChange: k,
@@ -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);
-  }), /* @__PURE__ */ n(si, { settings: _, order: v });
-}, yt = "add-column-menu-table", Gi = g.div`
+  return e.forEach((R) => {
+    if (r.includes(R.id)) return;
+    const M = _.findIndex((Y) => Y && "id" in Y && Y.id === R.id);
+    M !== -1 ? _[M] = R : _.push(R);
+  }), /* @__PURE__ */ n(li, { settings: _, order: v });
+}, 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,94 @@ const Bo = g.div`
     /* @__PURE__ */ n(Ct, { menuId: yt, menuItems: c }),
     p
   ] });
-}, Ys = g.a`
+}, qs = Xn`
+  .p-splitter > .p-splitter-gutter {
+    position: relative;
+
+    /* widen the grab area without changing the layout gap */
+    &::after {
+      content: '';
+      position: absolute;
+      inset: 0;
+      z-index: 1;
+    }
+
+    /* subtle three dots in the middle (the other two are box-shadows, see layouts below) */
+    &::before {
+      content: '';
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 2px;
+      height: 2px;
+      border-radius: 50%;
+      translate: -50% -50%;
+      background: var(--md-sys-color-outline-variant);
+      pointer-events: none;
+      transition: opacity 0.1s ease-out;
+    }
+
+    /* short delay so the handle doesn't flash when the cursor just passes over */
+    &:hover::before {
+      opacity: 0;
+      transition-delay: 0.2s;
+    }
+
+    &.p-splitter-gutter-resizing::before {
+      opacity: 0;
+      transition-delay: 0s;
+    }
+
+    /* collapsed gutters (gutterSize 0) show no dots and have no grab area */
+    &[style*='width: 0px'],
+    &[style*='height: 0px'] {
+      &::before,
+      &::after {
+        display: none;
+      }
+    }
+  }
+
+  /* extra specificity to beat the PrimeReact and ayon-react-components handle styles in any load order */
+  .p-splitter.p-component > .p-splitter-gutter > .p-splitter-gutter-handle {
+    width: 100%;
+    height: 100%;
+    border-radius: 999px;
+    background: var(--md-sys-color-primary);
+    opacity: 0;
+    transition: opacity 0.1s ease-out;
+  }
+  .p-splitter.p-component > .p-splitter-gutter:hover > .p-splitter-gutter-handle {
+    opacity: 0.75;
+    transition-delay: 0.2s;
+  }
+  .p-splitter.p-component > .p-splitter-gutter.p-splitter-gutter-resizing > .p-splitter-gutter-handle {
+    opacity: 0.75;
+    transition-delay: 0s;
+  }
+
+  .p-splitter-horizontal > .p-splitter-gutter {
+    &::before {
+      box-shadow:
+        0 -5px 0 var(--md-sys-color-outline-variant),
+        0 5px 0 var(--md-sys-color-outline-variant);
+    }
+    &::after {
+      inset: 0 -3px;
+    }
+  }
+
+  .p-splitter-vertical > .p-splitter-gutter {
+    &::before {
+      box-shadow:
+        -5px 0 0 var(--md-sys-color-outline-variant),
+        5px 0 0 var(--md-sys-color-outline-variant);
+    }
+    &::after {
+      inset: -3px 0;
+    }
+  }
+`, Ws = g.a`
   color: var(--md-sys-color-primary, #0066cc);
   text-decoration: none;
   cursor: pointer;
@@ -3913,7 +4000,7 @@ const Bo = g.div`
   &:hover {
     text-decoration: underline;
   }
-`, Yi = g.div`
+`, qi = g.div`
   display: flex;
   gap: var(--base-gap-small);
   background-color: var(--md-sys-color-surface-container-high);
@@ -3926,14 +4013,14 @@ const Bo = g.div`
       background-color: var(--md-sys-color-surface-container-highest-hover);
     }
   }
-`, qs = le(
+`, Xs = le(
   ({ showGrid: e, onChange: t, ...o }, r) => (Z(() => {
     const a = (s) => {
       const i = s.target;
       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(qi, { ...o, ref: r, children: [
     /* @__PURE__ */ n(
       un,
       {
@@ -3957,13 +4044,13 @@ const Bo = g.div`
       }
     )
   ] }))
-), qi = g.form`
+), Wi = g.form`
   display: flex;
   flex-direction: column;
   gap: var(--base-gap-large);
   padding: var(--padding-m);
   width: 100%;
-`, Wi = g(Et)`
+`, Xi = g(Et)`
   width: 100%;
   margin: auto;
 
@@ -3974,12 +4061,12 @@ const Bo = g.div`
   input {
     width: 100%;
   }
-`, Xi = g.div`
+`, Qi = g.div`
   font-size: var(--font-size-xs);
   color: var(--md-sys-color-outline);
   margin-top: var(--base-gap-small);
   line-height: 1.3;
-`, Qi = g.button`
+`, Ji = g.button`
   background: none;
   border: none;
   color: var(--md-sys-color-primary);
@@ -3992,7 +4079,7 @@ const Bo = g.div`
   &:hover {
     color: var(--md-sys-color-primary-dark);
   }
-`, Ji = g.div`
+`, Zi = g.div`
   display: flex;
   align-items: start;
   gap: var(--base-gap-small);
@@ -4002,39 +4089,39 @@ const Bo = g.div`
     flex: 1;
     min-width: 0;
   }
-`, Zi = g.div`
+`, ea = g.div`
   font-size: var(--font-size-xs);
   color: var(--md-sys-color-primary);
   margin-top: var(--base-gap-small);
   line-height: 1.3;
-`, ea = g.div`
+`, ta = g.div`
   position: relative;
   min-height: 80px;
-`, ta = g.div`
+`, na = g.div`
   display: flex;
   align-items: center;
   gap: var(--base-gap-small);
   width: 100%;
-`, na = g(H)`
+`, oa = g(H)`
   flex: 1;
-`, oa = g.div`
+`, ra = g.div`
   width: 100%;
   overflow: hidden;
   display: flex;
   min-width: 0;
-`, ra = g.span`
+`, ia = g.span`
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: fit-content;
   margin-right: 4px;
   flex: 1;
-`, ia = g.span`
+`, aa = g.span`
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   font-weight: bold;
-`, aa = ({
+`, sa = ({
   formData: e,
   onChange: t,
   onSubmit: o,
@@ -4059,7 +4146,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 +4154,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: L } = go(
     { 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 && L && !C, _ = F?.folderId || S, R = Sn(), M = F?.label || F?.name || C?.label || C?.name || "", Y = F?.taskType || C?.taskType, ne = Y ? R.getTaskType(Y) : void 0, re = ne?.icon || "task_alt", be = F?.path ? F.path.substring(0, F.path.lastIndexOf("/")) : "", ye = R.getProductTypeOptions(), ue = X(() => R.productTypes.reduce((A, q) => (A[q.name] = q, A), {}), [R.productTypes]);
   Z(() => {
     const A = f.current, q = ue[A]?.name || "", he = ue[e.productType]?.name || "";
     if (e.productType !== A && q && e.name.startsWith(q)) {
@@ -4098,7 +4185,7 @@ const Bo = g.div`
     return e.name && !e.name.startsWith(A);
   }, ie = !!i;
   return /* @__PURE__ */ w(
-    qi,
+    Wi,
     {
       id: "upload-version-form",
       ref: l,
@@ -4111,8 +4198,8 @@ const Bo = g.div`
         }
       },
       children: [
-        /* @__PURE__ */ w(Wi, { children: [
-          !r.includes("name") && /* @__PURE__ */ n(te, { label: "Product Name", children: /* @__PURE__ */ w(Ji, { children: [
+        /* @__PURE__ */ w(Xi, { children: [
+          !r.includes("name") && /* @__PURE__ */ n(te, { label: "Product Name", children: /* @__PURE__ */ w(Zi, { children: [
             /* @__PURE__ */ w("div", { children: [
               /* @__PURE__ */ n(
                 Ae,
@@ -4127,17 +4214,17 @@ const Bo = g.div`
                   disabled: ie
                 }
               ),
-              N && /* @__PURE__ */ n(Zi, { children: N.latestVersion ? /* @__PURE__ */ w(me, { children: [
+              N && /* @__PURE__ */ n(ea, { children: N.latestVersion ? /* @__PURE__ */ w(me, { children: [
                 "Matched existing product (latest: ",
                 V,
                 ")"
               ] }) : "Matched existing product (no versions)" }),
-              !N && ce() && /* @__PURE__ */ w(Xi, { id: "name-recommendation", children: [
+              !N && ce() && /* @__PURE__ */ w(Qi, { id: "name-recommendation", children: [
                 'We recommend prefixing with "',
                 ue[e.productType]?.name,
                 '".',
                 " ",
-                /* @__PURE__ */ n(Qi, { type: "button", onClick: ge, children: "Apply prefix" })
+                /* @__PURE__ */ n(Ji, { type: "button", onClick: ge, children: "Apply prefix" })
               ] })
             ] }),
             !v && !ie && /* @__PURE__ */ n(
@@ -4192,23 +4279,23 @@ const Bo = g.div`
               disabled: ie
             }
           ) }),
-          /* @__PURE__ */ n(te, { label: "Task", children: /* @__PURE__ */ n(ta, { children: I ? /* @__PURE__ */ n(Fo, { height: "20px" }) : k && M ? /* @__PURE__ */ w(me, { children: [
+          /* @__PURE__ */ n(te, { label: "Task", children: /* @__PURE__ */ n(na, { children: I ? /* @__PURE__ */ n(Mo, { height: "20px" }) : k && M ? /* @__PURE__ */ w(me, { children: [
             /* @__PURE__ */ w(
-              na,
+              oa,
               {
                 type: "button",
-                onClick: () => R(!0),
+                onClick: () => O(!0),
                 disabled: ie,
                 variant: "text",
                 children: [
                   /* @__PURE__ */ n(G, { icon: re, style: { color: ne?.color } }),
-                  /* @__PURE__ */ w(oa, { children: [
-                    be && /* @__PURE__ */ w(ra, { children: [
+                  /* @__PURE__ */ w(ra, { children: [
+                    be && /* @__PURE__ */ w(ia, { children: [
                       be.split("/").filter(Boolean).join(" / "),
                       " /",
                       " "
                     ] }),
-                    /* @__PURE__ */ n(ia, { children: M })
+                    /* @__PURE__ */ n(aa, { children: M })
                   ] })
                 ]
               }
@@ -4232,13 +4319,13 @@ const Bo = g.div`
               icon: "link",
               label: "Link task",
               variant: "text",
-              onClick: () => R(!0),
+              onClick: () => O(!0),
               disabled: ie
             }
           ) }) })
         ] }),
         B && /* @__PURE__ */ n(
-          Eo,
+          To,
           {
             projectName: a,
             entityType: "task",
@@ -4247,14 +4334,14 @@ 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" }),
-        /* @__PURE__ */ n(ea, { children: /* @__PURE__ */ n(
-          ho,
+        /* @__PURE__ */ n(ta, { children: /* @__PURE__ */ n(
+          vo,
           {
             projectName: a,
             versionId: i,
@@ -4277,15 +4364,15 @@ const Bo = g.div`
       ]
     }
   );
-}, sa = (e) => {
+}, la = (e) => {
   let t = String(e), o = Math.max(0, 3 - t.length);
   return `v${"0".repeat(o)}${t}`;
-}, la = g.span`
+}, ca = g.span`
   background-color: var(--md-sys-color-error-container);
   color: var(--md-sys-color-on-error-container);
   padding: var(--padding-s);
   border-radius: var(--border-radius-m);
-`, Ws = () => {
+`, Qs = () => {
   const {
     isOpen: e,
     onCloseVersionUpload: t,
@@ -4309,7 +4396,7 @@ const Bo = g.div`
       {
         type: "submit",
         form: "upload-version-form",
-        label: `Create ${sa(s.version)}`,
+        label: `Create ${la(s.version)}`,
         icon: "upload",
         active: !0,
         saving: c
@@ -4327,7 +4414,7 @@ const Bo = g.div`
       style: { width: 600, maxHeight: "80vh" },
       children: [
         /* @__PURE__ */ n(
-          aa,
+          sa,
           {
             formData: s,
             minVersion: i,
@@ -4339,25 +4426,28 @@ const Bo = g.div`
             productId: d
           }
         ),
-        k && /* @__PURE__ */ n(la, { className: "error", children: so(l) })
+        k && /* @__PURE__ */ n(ca, { className: "error", children: lo(l) })
       ]
     }
   );
-}, ca = g.div`
+}, da = g.div`
+  --reviewable-card-width: 62px;
+
   position: relative;
   flex: 1;
   z-index: 1000;
   overflow: hidden;
   padding-bottom: var(--padding-m);
-`, da = g(Mo)`
+`, ua = g(Vo)`
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
   align-items: center;
   min-width: fit-content;
   gap: var(--base-gap-small);
-`, ua = g.div`
+`, pa = g.div`
   position: relative;
+  flex-shrink: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -4379,9 +4469,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);
   }
@@ -4406,7 +4495,7 @@ const Bo = g.div`
     border-color: var(--selection-border-color);
     color: var(--selection-color);
   }
-`, pa = g.span`
+`, ma = g.span`
   padding: var(--padding-m);
   border-radius: var(--border-radius-m);
   background-color: var(--md-sys-color-surface-container-low);
@@ -4417,15 +4506,16 @@ const Bo = g.div`
   left: -8px;
   transform: translateX(-100%) translateY(-50%);
   z-index: 1000;
-`, ma = g(H)`
-  width: 62px;
-  min-height: 62px;
+`, ga = g(H)`
+  width: var(--reviewable-card-width);
+  aspect-ratio: 16 / 9;
+  flex-shrink: 0;
   background-color: var(--md-sys-color-surface-container-high);
 
   &:hover {
     background-color: var(--md-sys-color-surface-container-high-hover);
   }
-`, ga = g.div`
+`, ha = g.div`
   border-radius: var(--border-radius-m);
   background-color: var(--md-sys-color-surface-container-high);
   position: absolute;
@@ -4433,7 +4523,7 @@ const Bo = g.div`
   right: var(--padding-s);
   padding: var(--padding-s);
 `;
-function ha({
+function va({
   fileId: e,
   label: t,
   selected: o,
@@ -4446,9 +4536,9 @@ function ha({
   selectionVariant: c = "primary",
   shortcut: l
 }) {
-  const [p] = Vo();
+  const [p] = Bo();
   return /* @__PURE__ */ w(
-    ua,
+    pa,
     {
       id: "preview-" + e,
       onClick: (u) => i?.(e, u.metaKey || u.ctrlKey),
@@ -4463,14 +4553,14 @@ function ha({
       },
       tabIndex: 0,
       children: [
-        /* @__PURE__ */ n(vo, { src: `/api/projects/${r}/files/${e}/thumbnail` }),
-        v && /* @__PURE__ */ n(ga, { children: v })
+        /* @__PURE__ */ n(fo, { src: `/api/projects/${r}/files/${e}/thumbnail` }),
+        v && /* @__PURE__ */ n(ha, { children: v })
       ]
     },
     e
   );
 }
-const Xs = le(({
+const Js = le(({
   reviewables: e = [],
   selected: t = [],
   projectName: o,
@@ -4483,7 +4573,7 @@ const Xs = le(({
     const S = m.getBoundingClientRect(), P = x.getBoundingClientRect();
     P.top < S.top ? m.scrollTop -= S.top - P.top : P.bottom > S.bottom && (m.scrollTop += P.bottom - S.bottom), i.current?.updateScroll?.();
   };
-  Qn(
+  Jn(
     s,
     () => ({
       notifyNavigation: ({ fileId: b, label: m }) => {
@@ -4525,9 +4615,9 @@ const Xs = le(({
     if (b === (k - 1 + m) % m) return "W";
     if (b === (k + 1) % m) return "S";
   };
-  return /* @__PURE__ */ w(ca, { children: [
+  return /* @__PURE__ */ w(da, { children: [
     /* @__PURE__ */ w(
-      da,
+      ua,
       {
         className: "reviewables",
         ref: i,
@@ -4536,7 +4626,7 @@ const Xs = le(({
         },
         children: [
           e.map(({ fileId: b, label: m, tag: x, selectionVariant: S, contextMenuItems: P }, $) => /* @__PURE__ */ n(
-            ha,
+            va,
             {
               shortcut: C($),
               projectName: o,
@@ -4553,7 +4643,7 @@ const Xs = le(({
             b
           )),
           !!a && /* @__PURE__ */ n(
-            ma,
+            ga,
             {
               icon: "add",
               onClick: a,
@@ -4563,59 +4653,60 @@ const Xs = le(({
         ]
       }
     ),
-    f && l && /* @__PURE__ */ n(pa, { style: { top: l }, children: f })
+    f && l && /* @__PURE__ */ n(ma, { style: { top: l }, children: f })
   ] });
 });
 export {
-  ys as A,
-  Xs as B,
-  fs as C,
-  Is as D,
-  Ko as E,
-  Vs as F,
+  xs as A,
+  Js as B,
+  bs as C,
+  Es as D,
+  Go as E,
+  Bs as F,
   Gt as G,
-  ni as H,
-  zs as I,
-  si as J,
+  oi as H,
+  js as I,
+  li as J,
   ot as K,
-  Os as L,
-  Ms as M,
-  qo as N,
-  Ii as O,
-  Ls as P,
-  Ys as Q,
-  Hs as R,
-  bs as S,
-  ks as T,
-  Yt as U,
-  qs as V,
-  qt as W,
-  Ws as X,
-  xs as Y,
-  Ss as a,
-  Es as b,
-  Ts as c,
-  Ns as d,
-  Ps as e,
-  _s as f,
-  Cs as g,
-  Fs as h,
-  Bs as i,
-  $s as j,
-  Us as k,
+  Ls as L,
+  Vs as M,
+  Wo as N,
+  Ei as O,
+  $s as P,
+  qs as Q,
+  zs as R,
+  ys as S,
+  Cs as T,
+  Ws as U,
+  Yt as V,
+  Xs as W,
+  qt as X,
+  Qs as Y,
+  ws as Z,
+  ks as a,
+  Ts as b,
+  Ns as c,
+  Ps as d,
+  _s as e,
+  Ds as f,
+  Is as g,
+  Ms as h,
+  Us as i,
+  Fs as j,
+  Hs as k,
   St as l,
-  Gs as m,
-  vs as n,
-  ws as o,
-  fi as p,
-  xi as q,
-  js as r,
-  As as s,
-  Go as t,
-  Ds as u,
-  pr as v,
-  ar as w,
+  Ys as m,
+  fs as n,
+  Ss as o,
+  bi as p,
+  wi as q,
+  Ks as r,
+  Os as s,
+  Yo as t,
+  As as u,
+  mr as v,
+  sr as w,
   Rs as x,
   Wt as y,
-  Ks as z
+  Gs as z
 };