@opencxh/ui-kit 3.107.0 → 3.108.1

package/dist/index.js

@@ -824,7 +824,7 @@ const xt = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
         N?.(v);
       } else
         N?.(D), _(!1), J("");
-    }, A = u ? null : V.find((D) => D.value === x), z = u ? V.filter(
+    }, A = u ? null : V.find((D) => D.value === x), M = u ? V.filter(
       (D) => Array.isArray(x) && x.includes(D.value)
     ) : [], q = d && j ? V.filter(
       (D) => D.label.toLowerCase().includes(j.toLowerCase())
@@ -840,7 +840,7 @@ const xt = () => /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none",
         return;
       }
       K((T) => [...T, v]), S(v.value), J(""), u || _(!1);
-    }, ne = () => u ? z.length > 0 ? z.map((D) => D.label).join(", ") : i || "Select options" : A?.label || i || "Select an option";
+    }, ne = () => u ? M.length > 0 ? M.map((D) => D.label).join(", ") : i || "Select options" : A?.label || i || "Select an option";
     return /* @__PURE__ */ c(
       "div",
       {
@@ -1182,7 +1182,7 @@ const de = (...t) => t.filter(Boolean).join(" "), Nt = (t) => /* @__PURE__ */ e(
     Z(() => {
       p !== void 0 && $(p);
     }, [p]);
-    const z = ue(() => {
+    const M = ue(() => {
       if (y && !S || !J) return d;
       const v = String(J).toLowerCase();
       return d.filter(
@@ -1220,7 +1220,7 @@ const de = (...t) => t.filter(Boolean).join(" "), Nt = (t) => /* @__PURE__ */ e(
       $(v.label), K(!1), A(!1), x && x(v.value);
     }, re = () => {
       (d.length > 0 || u) && (K(!0), A(!1));
-    }, ne = i || w, D = V && (z.length > 0 || ne), I = ue(() => G || j, [G]);
+    }, ne = i || w, D = V && (M.length > 0 || ne), I = ue(() => G || j, [G]);
     return /* @__PURE__ */ c(
       "div",
       {
@@ -1326,7 +1326,7 @@ const de = (...t) => t.filter(Boolean).join(" "), Nt = (t) => /* @__PURE__ */ e(
             {
               className: "absolute z-10 mt-1 w-full bg-surface border border-border rounded-lg shadow-lg max-h-60 overflow-auto top-full",
               role: "listbox",
-              children: z.length > 0 ? z.map((v) => /* @__PURE__ */ e(
+              children: M.length > 0 ? M.map((v) => /* @__PURE__ */ e(
                 "li",
                 {
                   className: "px-4 py-2 cursor-pointer text-text hover:bg-accent-soft hover:text-accent transition-colors",
@@ -1406,7 +1406,7 @@ function St({
     ] })
   ] }) });
 }
-const zt = ({
+const Mt = ({
   trigger: t,
   options: r,
   value: n,
@@ -1514,7 +1514,7 @@ const zt = ({
                 "button",
                 {
                   "data-option-value": w.value,
-                  onClick: (z) => _(z, w),
+                  onClick: (M) => _(M, w),
                   onMouseEnter: () => j(w),
                   onMouseLeave: () => J(w),
                   disabled: w.disabled,
@@ -1557,8 +1557,8 @@ const zt = ({
                       u(null);
                     }, 150);
                   },
-                  children: /* @__PURE__ */ e("div", { className: "p-2", children: w.children.map((z, q) => {
-                    if (z.divider)
+                  children: /* @__PURE__ */ e("div", { className: "p-2", children: w.children.map((M, q) => {
+                    if (M.divider)
                       return /* @__PURE__ */ e(
                         "div",
                         {
@@ -1567,35 +1567,35 @@ const zt = ({
                         `divider-${q}`
                       );
                     const L = typeof n == "object" && n[w.value] && n[w.value].includes(
-                      z.value
-                    ) || n === z.value;
+                      M.value
+                    ) || n === M.value;
                     return /* @__PURE__ */ c(
                       "button",
                       {
                         onClick: (re) => $(
                           re,
-                          z,
+                          M,
                           w.value
                         ),
-                        disabled: z.disabled,
+                        disabled: M.disabled,
                         className: f(
                           "flex w-full items-center justify-between rounded-md px-3 py-1.5 text-sm text-text transition-colors duration-fast ease-out hover:bg-surface-hover",
                           {
-                            "opacity-50 cursor-not-allowed": z.disabled
+                            "opacity-50 cursor-not-allowed": M.disabled
                           }
                         ),
                         children: [
                           /* @__PURE__ */ c("div", { className: "flex items-center space-x-2 min-w-0", children: [
-                            z.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: z.icon }),
+                            M.icon && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: M.icon }),
                             /* @__PURE__ */ c("div", { className: "flex flex-col items-start min-w-0", children: [
-                              /* @__PURE__ */ e("span", { className: "font-base truncate", children: z.label }),
-                              z.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: z.description })
+                              /* @__PURE__ */ e("span", { className: "font-base truncate", children: M.label }),
+                              M.description && /* @__PURE__ */ e("span", { className: "text-xs text-text-muted", children: M.description })
                             ] })
                           ] }),
                           b && L && /* @__PURE__ */ e(ke, { className: "size-icon-md shrink-0 text-success-fg", "aria-hidden": !0 })
                         ]
                       },
-                      z.value
+                      M.value
                     );
                   }) })
                 }
@@ -1605,7 +1605,7 @@ const zt = ({
           (() => {
             const w = r.reduce((m, S) => {
               if (S.divider) return m;
-              const A = S.children ? S.children.filter((z) => !z.divider).length : 0;
+              const A = S.children ? S.children.filter((M) => !M.divider).length : 0;
               return m + 1 + A;
             }, 0);
             return w > 1 && /* @__PURE__ */ e("div", { className: "border-t border-border mt-2 pt-2", children: /* @__PURE__ */ c("div", { className: "text-xs text-text-muted px-3 py-1", children: [
@@ -1617,7 +1617,7 @@ const zt = ({
       ]
     }
   );
-}, Mt = () => /* @__PURE__ */ e(
+}, zt = () => /* @__PURE__ */ e(
   "svg",
   {
     className: "h-4 w-4",
@@ -1806,7 +1806,7 @@ const zt = ({
       )
     ] })
   ] }) }) });
-}, ze = ({
+}, Me = ({
   data: t,
   columns: r,
   loading: n = !1,
@@ -1838,48 +1838,48 @@ const zt = ({
   }), K = te(null), w = ue(() => {
     let o = t;
     if (s && Y.trim()) {
-      const M = r.filter(
+      const z = r.filter(
         (H) => H.searchable !== !1
       ), F = Y.toLowerCase();
-      o = o.filter((H) => M.some((P) => {
-        const Q = typeof P.accessor == "function" ? P.accessor(H) : H[P.accessor];
-        return String(Q || "").toLowerCase().includes(F);
+      o = o.filter((H) => z.some((P) => {
+        const X = typeof P.accessor == "function" ? P.accessor(H) : H[P.accessor];
+        return String(X || "").toLowerCase().includes(F);
       }));
     }
-    return l.forEach((M) => {
-      M.value && M.value !== "all" && (o = o.filter((F) => {
-        const H = r.find((Q) => Q.id === M.id);
+    return l.forEach((z) => {
+      z.value && z.value !== "all" && (o = o.filter((F) => {
+        const H = r.find((X) => X.id === z.id);
         if (!H) return !0;
         const P = typeof H.accessor == "function" ? H.accessor(F) : F[H.accessor];
-        return String(P || "") === M.value;
+        return String(P || "") === z.value;
       }));
     }), o;
   }, [t, Y, r, s, l]), m = ue(() => {
     if (!j.column || !j.direction) return w;
-    const o = r.find((M) => M.id === j.column);
-    return o ? [...w].sort((M, F) => {
-      const H = typeof o.accessor == "function" ? o.accessor(M) : M[o.accessor], P = typeof o.accessor == "function" ? o.accessor(F) : F[o.accessor];
-      let Q = 0;
-      return H < P ? Q = -1 : H > P && (Q = 1), j.direction === "desc" ? -Q : Q;
+    const o = r.find((z) => z.id === j.column);
+    return o ? [...w].sort((z, F) => {
+      const H = typeof o.accessor == "function" ? o.accessor(z) : z[o.accessor], P = typeof o.accessor == "function" ? o.accessor(F) : F[o.accessor];
+      let X = 0;
+      return H < P ? X = -1 : H > P && (X = 1), j.direction === "desc" ? -X : X;
     }) : w;
   }, [w, j, r]), S = ue(() => {
     if (!i) return m;
-    const o = $.page * $.pageSize, M = o + $.pageSize;
-    return m.slice(o, M);
+    const o = $.page * $.pageSize, z = o + $.pageSize;
+    return m.slice(o, z);
   }, [m, $, i]), A = le(
     (o) => {
       r.find((F) => F.id === o)?.sortable && J((F) => F.column !== o ? { column: o, direction: "asc" } : F.direction === "asc" ? { column: o, direction: "desc" } : { column: null, direction: null });
     },
     [r]
-  ), z = le((o) => {
-    V((M) => ({ ...M, page: o }));
+  ), M = le((o) => {
+    V((z) => ({ ...z, page: o }));
   }, []), q = le((o) => {
     V({ page: 0, pageSize: o });
   }, []), L = le(
-    (o, M) => {
+    (o, z) => {
       if (!x) return;
       const F = N(o, 0);
-      u.map((H, P) => N(H, P)), x(M ? [...u, o] : u.filter(
+      u.map((H, P) => N(H, P)), x(z ? [...u, o] : u.filter(
         (H, P) => N(u[P], P) !== F
       ));
     },
@@ -1896,19 +1896,19 @@ const zt = ({
     V((o) => ({ ...o, page: 0 }));
   }, [l.map((o) => o.value).join(",")]);
   const ne = m.length, D = Math.ceil(ne / $.pageSize), I = $.page * $.pageSize + 1, v = Math.min(I + $.pageSize - 1, ne), T = S.length > 0 && S.every((o) => {
-    const M = N(o, 0);
+    const z = N(o, 0);
     return u.some(
-      (F, H) => N(F, H) === M
+      (F, H) => N(F, H) === z
     );
   }), B = S.some((o) => {
-    const M = N(o, 0);
+    const z = N(o, 0);
     return u.some(
-      (F, H) => N(F, H) === M
+      (F, H) => N(F, H) === z
     );
   }), W = f(
     "w-full text-sm leading-5 text-text border-collapse",
     G
-  ), X = f("bg-surface"), R = f(
+  ), Q = f("bg-surface"), R = f(
     "text-text p-3 border-b border-border"
   ), oe = f("h-row-lg", {
     "hover:bg-surface-sunk": p,
@@ -1923,7 +1923,7 @@ const zt = ({
           placeholder: a,
           value: Y,
           onChange: (o) => _(o.target.value),
-          startIcon: /* @__PURE__ */ e(Mt, {}),
+          startIcon: /* @__PURE__ */ e(zt, {}),
           className: "max-w-sm"
         }
       ) })
@@ -1938,7 +1938,7 @@ const zt = ({
         }
       ) }),
       /* @__PURE__ */ c("table", { ref: K, className: f(W, "min-w-full"), children: [
-        /* @__PURE__ */ e("thead", { className: X, children: /* @__PURE__ */ c("tr", { children: [
+        /* @__PURE__ */ e("thead", { className: Q, children: /* @__PURE__ */ c("tr", { children: [
           d && /* @__PURE__ */ e("th", { className: f(R, "w-12"), children: /* @__PURE__ */ e(
             "input",
             {
@@ -2010,9 +2010,9 @@ const zt = ({
             ),
             children: y || "No data available"
           }
-        ) }) : S.map((o, M) => {
-          const F = N(o, M), H = u.some(
-            (P, Q) => N(P, Q) === F
+        ) }) : S.map((o, z) => {
+          const F = N(o, z), H = u.some(
+            (P, X) => N(P, X) === F
           );
           return /* @__PURE__ */ c(
             "tr",
@@ -2020,10 +2020,10 @@ const zt = ({
               className: f(
                 oe,
                 { "bg-accent-soft": H },
-                O?.(o, M)
+                O?.(o, z)
               ),
               onClick: (P) => {
-                P.stopPropagation(), h?.(o, M);
+                P.stopPropagation(), h?.(o, z);
               },
               children: [
                 d && /* @__PURE__ */ e("td", { className: R, children: /* @__PURE__ */ e(
@@ -2038,7 +2038,7 @@ const zt = ({
                   }
                 ) }),
                 r.map((P) => {
-                  const Q = typeof P.accessor == "function" ? P.accessor(o) : o[P.accessor];
+                  const X = typeof P.accessor == "function" ? P.accessor(o) : o[P.accessor];
                   return /* @__PURE__ */ e(
                     "td",
                     {
@@ -2049,13 +2049,13 @@ const zt = ({
                         "sticky left-0 bg-surface": P.sticky === "left",
                         "sticky right-0 bg-surface": P.sticky === "right"
                       }),
-                      children: P.cell ? P.cell(Q, o, M) : String(Q || "")
+                      children: P.cell ? P.cell(X, o, z) : String(X || "")
                     },
                     P.id
                   );
                 }),
                 k.length > 0 && /* @__PURE__ */ e("td", { className: R, children: /* @__PURE__ */ e(
-                  zt,
+                  Mt,
                   {
                     trigger: /* @__PURE__ */ c("div", { className: "inline-flex items-center gap-1 px-2 py-1 text-sm text-text-muted hover:text-text", children: [
                       /* @__PURE__ */ e("span", { children: "Options" }),
@@ -2068,10 +2068,10 @@ const zt = ({
                       disabled: P.disabled?.(o)
                     })),
                     onSelect: (P) => {
-                      const Q = k.find(
+                      const X = k.find(
                         (pe) => pe.id === P
                       );
-                      Q && Q.onClick(o, M);
+                      X && X.onClick(o, z);
                     },
                     placement: "bottom-end"
                   }
@@ -2113,7 +2113,7 @@ const zt = ({
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => z(0),
+            onClick: () => M(0),
             disabled: $.page === 0,
             iconOnly: !0,
             children: /* @__PURE__ */ e(jt, {})
@@ -2124,7 +2124,7 @@ const zt = ({
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => z($.page - 1),
+            onClick: () => M($.page - 1),
             disabled: $.page === 0,
             iconOnly: !0,
             children: /* @__PURE__ */ e($t, {})
@@ -2141,7 +2141,7 @@ const zt = ({
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => z($.page + 1),
+            onClick: () => M($.page + 1),
             disabled: $.page >= D - 1,
             iconOnly: !0,
             children: /* @__PURE__ */ e(Tt, {})
@@ -2152,7 +2152,7 @@ const zt = ({
           {
             size: "sm",
             variant: "ghost",
-            onClick: () => z(D - 1),
+            onClick: () => M(D - 1),
             disabled: $.page >= D - 1,
             iconOnly: !0,
             children: /* @__PURE__ */ e(Dt, {})
@@ -2450,7 +2450,7 @@ const Ht = ({
 }) => {
   const [u, x] = U(!1), [N, y] = U([]), [p, E] = U(null), [C, G] = U("/"), [O, Y] = U([]), [_, j] = U(!1), [J, $] = U(""), [V, K] = U(
     typeof t == "object" ? t : null
-  ), [w, m] = U(!1), [S, A] = U(""), z = te(null);
+  ), [w, m] = U(!1), [S, A] = U(""), M = te(null);
   Z(() => {
     u && q();
   }, [u]), Z(() => {
@@ -2479,19 +2479,19 @@ const Ht = ({
       }
     }
   }, re = async (o) => {
-    const M = o.target.files?.[0];
-    if (M) {
+    const z = o.target.files?.[0];
+    if (z) {
       j(!0);
       try {
-        const F = await M.arrayBuffer(), H = new Uint8Array(F), P = {
+        const F = await z.arrayBuffer(), H = new Uint8Array(F), P = {
           id: `local-${Date.now()}`,
-          name: M.name,
+          name: z.name,
           type: "file",
           path: "/",
-          mimeType: M.type || "application/octet-stream",
-          size: M.size,
+          mimeType: z.type || "application/octet-stream",
+          size: z.size,
           mountId: "local",
-          providerKey: M.name,
+          providerKey: z.name,
           ownerId: "me"
         };
         K(P), r(P, H), x(!1);
@@ -2502,14 +2502,14 @@ const Ht = ({
       }
     }
   }, ne = async (o) => {
-    const M = o.target.files?.[0];
-    if (!(!M || !p)) {
+    const z = o.target.files?.[0];
+    if (!(!z || !p)) {
       j(!0);
       try {
-        const F = await M.arrayBuffer(), H = await k?.({
+        const F = await z.arrayBuffer(), H = await k?.({
           file: new Uint8Array(F),
-          filename: M.name,
-          mimeType: M.type || "application/octet-stream",
+          filename: z.name,
+          mimeType: z.type || "application/octet-stream",
           mountId: p.id,
           path: C
         });
@@ -2547,42 +2547,42 @@ const Ht = ({
   }, I = async (o) => {
     j(!0);
     try {
-      const M = await h?.(o.id);
-      K(o), r(o, M), x(!1);
-    } catch (M) {
-      console.error("Failed to download file", M);
+      const z = await h?.(o.id);
+      K(o), r(o, z), x(!1);
+    } catch (z) {
+      console.error("Failed to download file", z);
     } finally {
       j(!1);
     }
   }, v = (o) => {
     o.stopPropagation(), K(null), r(null);
   }, T = ue(() => {
-    const o = /* @__PURE__ */ new Set(), M = [];
+    const o = /* @__PURE__ */ new Set(), z = [];
     return O.forEach((F) => {
       if (F.type === "folder") {
         F.path === C && o.add(F.name);
         return;
       }
-      const H = F.providerKey || F.name, Q = (C ? H.substring(C.length) : H).split("/").filter((pe) => pe !== "");
-      Q.length > 1 ? o.add(Q[0]) : Q.length === 1 && M.push(F);
+      const H = F.providerKey || F.name, X = (C ? H.substring(C.length) : H).split("/").filter((pe) => pe !== "");
+      X.length > 1 ? o.add(X[0]) : X.length === 1 && z.push(F);
     }), {
       folders: Array.from(o).sort(),
-      files: M.sort((F, H) => F.name.localeCompare(H.name))
+      files: z.sort((F, H) => F.name.localeCompare(H.name))
     };
   }, [O, C]), B = (o) => {
-    G((M) => `${M}${o}/`);
+    G((z) => `${z}${o}/`);
   }, W = () => {
-    const o = C.split("/").filter((M) => M !== "");
+    const o = C.split("/").filter((z) => z !== "");
     o.pop(), o.length === 0 ? G("/") : G(`${o.join("/")}/`);
-  }, X = ue(() => {
-    const o = T.folders.map((M) => ({
-      id: `folder-${M}`,
-      name: M,
+  }, Q = ue(() => {
+    const o = T.folders.map((z) => ({
+      id: `folder-${z}`,
+      name: z,
       type: "folder"
     }));
-    return T.files.forEach((M) => {
+    return T.files.forEach((z) => {
       o.push({
-        ...M,
+        ...z,
         type: "file"
       });
     }), o;
@@ -2591,16 +2591,16 @@ const Ht = ({
       id: "name",
       header: "Name",
       accessor: "name",
-      cell: (o, M) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
+      cell: (o, z) => /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ e(
           ce,
           {
-            icon: M.type === "folder" ? Se : ge,
+            icon: z.type === "folder" ? Se : ge,
             size: "sm",
-            color: M.type === "folder" ? "warning" : "secondary"
+            color: z.type === "folder" ? "warning" : "secondary"
           }
         ),
-        /* @__PURE__ */ e("span", { className: f(M.type === "folder" && "font-medium"), children: o })
+        /* @__PURE__ */ e("span", { className: f(z.type === "folder" && "font-medium"), children: o })
       ] })
     },
     {
@@ -2618,16 +2618,16 @@ const Ht = ({
       header: "",
       accessor: "id",
       align: "right",
-      cell: (o, M) => /* @__PURE__ */ e(
+      cell: (o, z) => /* @__PURE__ */ e(
         ee,
         {
           size: "sm",
           variant: "outline",
           onClick: (F) => {
-            F.stopPropagation(), M.type === "folder" ? B(M.name) : I(M);
+            F.stopPropagation(), z.type === "folder" ? B(z.name) : I(z);
           },
-          loading: _ && M.type === "file" && V?.id === M.id,
-          children: M.type === "folder" ? "Open" : "Select"
+          loading: _ && z.type === "file" && V?.id === z.id,
+          children: z.type === "folder" ? "Open" : "Select"
         }
       )
     }
@@ -2646,7 +2646,7 @@ const Ht = ({
       header: "",
       accessor: "id",
       align: "right",
-      cell: (o, M) => /* @__PURE__ */ e(ee, { size: "sm", variant: "outline", onClick: () => E(M), children: "Open" })
+      cell: (o, z) => /* @__PURE__ */ e(ee, { size: "sm", variant: "outline", onClick: () => E(z), children: "Open" })
     }
   ];
   return /* @__PURE__ */ c("div", { className: "space-y-1", children: [
@@ -2735,7 +2735,7 @@ const Ht = ({
                         {
                           variant: "primary",
                           size: "sm",
-                          onClick: () => z.current?.click(),
+                          onClick: () => M.current?.click(),
                           leftIcon: /* @__PURE__ */ e(ce, { icon: Ke, size: "xs" }),
                           loading: _,
                           children: "Upload"
@@ -2746,7 +2746,7 @@ const Ht = ({
                         {
                           type: "file",
                           className: "hidden",
-                          ref: z,
+                          ref: M,
                           onChange: ne,
                           accept: i
                         }
@@ -2769,9 +2769,9 @@ const Ht = ({
                     /* @__PURE__ */ e(ee, { size: "sm", variant: "ghost", onClick: () => m(!1), children: "Cancel" })
                   ] }),
                   /* @__PURE__ */ e("div", { className: "max-h-100 overflow-auto rounded-lg border border-border", children: /* @__PURE__ */ e(
-                    ze,
+                    Me,
                     {
-                      data: X,
+                      data: Q,
                       columns: R,
                       loading: _,
                       emptyContent: "This folder is empty",
@@ -2779,7 +2779,7 @@ const Ht = ({
                     }
                   ) })
                 ] }) : /* @__PURE__ */ e("div", { className: "max-h-100 overflow-auto rounded-lg border border-border", children: /* @__PURE__ */ e(
-                  ze,
+                  Me,
                   {
                     data: N,
                     columns: oe,
@@ -2897,7 +2897,7 @@ const Ht = ({
   }
 );
 Ne.displayName = "TextArea";
-function Me(t, r) {
+function ze(t, r) {
   return r.split(".").reduce(
     (n, s) => n && typeof n == "object" && s in n ? n[s] : void 0,
     t
@@ -2946,21 +2946,21 @@ const Or = ({
   }, [r]);
   const _ = le(
     (m, S, A) => {
-      const z = t.flatMap((q) => q.items).find((q) => q.name === m);
-      if (!z) return null;
-      if (z.required && (S == null || S === ""))
-        return `${z.label} is required`;
-      if (z.type === "array") {
-        if (z.required && (!S || S.length === 0))
-          return `${z.label} cannot be empty.`;
+      const M = t.flatMap((q) => q.items).find((q) => q.name === m);
+      if (!M) return null;
+      if (M.required && (S == null || S === ""))
+        return `${M.label} is required`;
+      if (M.type === "array") {
+        if (M.required && (!S || S.length === 0))
+          return `${M.label} cannot be empty.`;
         if (S && !Array.isArray(S))
-          return `${z.label} must be an array.`;
-        if (Array.isArray(S) && z.arrayFields) {
+          return `${M.label} must be an array.`;
+        if (Array.isArray(S) && M.arrayFields) {
           const q = [];
           let L = !1;
           if (S.forEach((re, ne) => {
             const D = {};
-            for (const I of z.arrayFields) {
+            for (const I of M.arrayFields) {
               const v = re?.[I.name];
               if (I.required && (v == null || v === ""))
                 D[I.name] = `${I.label} is required`, L = !0;
@@ -2974,7 +2974,7 @@ const Or = ({
             return JSON.stringify(q);
         }
       }
-      return z.validator ? z.validator(S, A) : null;
+      return M.validator ? M.validator(S, A) : null;
     },
     [t]
   ), j = le(
@@ -3001,7 +3001,7 @@ const Or = ({
           continue;
         const L = _(
           q.name,
-          Me(p, q.name),
+          ze(p, q.name),
           p
         );
         L && (S[q.name] = L);
@@ -3012,15 +3012,15 @@ const Or = ({
       }
       if (G(S), Object.keys(S).some((q) => S[q]))
         return;
-      const z = l ? l(p) : p;
-      await n?.(p, z);
+      const M = l ? l(p) : p;
+      await n?.(p, M);
     },
     [p, t, _, i, l, n, u]
   ), $ = le(
     (m) => {
-      const S = Me(p, m.name), A = O[m.name] ? C[m.name] : void 0, z = m.disabled || u, q = {
+      const S = ze(p, m.name), A = O[m.name] ? C[m.name] : void 0, M = m.disabled || u, q = {
         value: S || "",
-        disabled: z,
+        disabled: M,
         required: m.required,
         placeholder: m.placeholder,
         ...m.fieldProps
@@ -3095,7 +3095,7 @@ const Or = ({
                     value: L.value,
                     checked: S === L.value,
                     onChange: () => j(m.name, L.value),
-                    disabled: z || L.disabled,
+                    disabled: M || L.disabled,
                     className: "size-checkbox shrink-0 border border-border-strong bg-surface-input accent-accent focus-visible:outline-none focus-visible:focus-ring"
                   }
                 ),
@@ -3157,7 +3157,7 @@ const Or = ({
                 method: "GET",
                 action: "storage.mount"
               }),
-              disabled: z,
+              disabled: M,
               size: d,
               placeholder: m.placeholder
             }
@@ -3167,7 +3167,7 @@ const Or = ({
             value: S,
             onChange: (L) => j(m.name, L),
             error: A,
-            disabled: z
+            disabled: M
           });
         case "array": {
           const L = S || [];
@@ -3205,9 +3205,9 @@ const Or = ({
                         B.required && /* @__PURE__ */ e("span", { className: "ml-1 text-danger-fg", children: "*" })
                       ] }),
                       (() => {
-                        const X = {
+                        const Q = {
                           value: v?.[B.name] || "",
-                          disabled: z,
+                          disabled: M,
                           required: B.required,
                           placeholder: B.placeholder,
                           ...B.fieldProps
@@ -3222,7 +3222,7 @@ const Or = ({
                             return /* @__PURE__ */ e(
                               me,
                               {
-                                ...X,
+                                ...Q,
                                 onChange: (R) => I(
                                   T,
                                   B.name,
@@ -3238,7 +3238,7 @@ const Or = ({
                             return /* @__PURE__ */ e(
                               Ne,
                               {
-                                ...X,
+                                ...Q,
                                 onChange: (R) => I(
                                   T,
                                   B.name,
@@ -3253,7 +3253,7 @@ const Or = ({
                             return /* @__PURE__ */ e(
                               be,
                               {
-                                ...X,
+                                ...Q,
                                 onChange: (R) => I(
                                   T,
                                   B.name,
@@ -3276,7 +3276,7 @@ const Or = ({
                             return /* @__PURE__ */ e(
                               fe,
                               {
-                                ...X,
+                                ...Q,
                                 checked: !!v?.[B.name],
                                 onChange: (R) => I(
                                   T,
@@ -3304,7 +3304,7 @@ const Or = ({
                                         B.name,
                                         R.value
                                       ),
-                                      disabled: z || R.disabled,
+                                      disabled: M || R.disabled,
                                       className: "size-checkbox shrink-0 border border-border-strong bg-surface-input accent-accent focus-visible:outline-none focus-visible:focus-ring"
                                     }
                                   ),
@@ -3318,7 +3318,7 @@ const Or = ({
                             return /* @__PURE__ */ e(
                               ye,
                               {
-                                ...X,
+                                ...Q,
                                 value: R ? new Date(R) : null,
                                 onChange: (oe) => I(
                                   T,
@@ -3338,7 +3338,7 @@ const Or = ({
                                 R
                               ),
                               error: W,
-                              disabled: z
+                              disabled: M
                             });
                           // Add other field types here as needed
                           default:
@@ -3364,7 +3364,7 @@ const Or = ({
                   size: "md",
                   "aria-label": `${m.label} verwijderen`,
                   onClick: () => D(T),
-                  disabled: z,
+                  disabled: M,
                   className: f("shrink-0", T === 0 && "mt-5"),
                   children: /* @__PURE__ */ e(Ge, { className: "size-icon-md" })
                 }
@@ -3378,7 +3378,7 @@ const Or = ({
                 size: "sm",
                 leftIcon: /* @__PURE__ */ e(Je, { className: "size-icon-sm" }),
                 onClick: ne,
-                disabled: z,
+                disabled: M,
                 children: [
                   m.label,
                   " toevoegen"
@@ -3396,7 +3396,7 @@ const Or = ({
     (m) => {
       if (m.conditional && !m.conditional(p))
         return null;
-      const S = m.items.filter((z) => !(z.hidden || z.conditional && !z.conditional(p)));
+      const S = m.items.filter((M) => !(M.hidden || M.conditional && !M.conditional(p)));
       if (S.length === 0) return null;
       const A = f(
         m.layout === "flex" ? "flex flex-wrap gap-3" : "grid gap-3",
@@ -3417,26 +3417,26 @@ const Or = ({
               /* @__PURE__ */ e("span", { className: "text-sm font-semibold text-text", children: m.title }),
               m.description && /* @__PURE__ */ e("p", { className: "mt-1 text-xs leading-4 text-text-subtle", children: m.description })
             ] }),
-            /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ e("div", { className: A, children: S.map((z) => (O[z.name] && C[z.name], /* @__PURE__ */ c(
+            /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ e("div", { className: A, children: S.map((M) => (O[M.name] && C[M.name], /* @__PURE__ */ c(
               "div",
               {
                 className: f(
                   "flex min-w-0 flex-col gap-1.5",
-                  z.type === "checkbox" && "justify-center"
+                  M.type === "checkbox" && "justify-center"
                 ),
                 style: {
-                  width: typeof z.width == "string" ? z.width : void 0,
-                  gridColumn: typeof z.width == "number" ? `span ${z.width} / span ${z.width}` : void 0
+                  width: typeof M.width == "string" ? M.width : void 0,
+                  gridColumn: typeof M.width == "number" ? `span ${M.width} / span ${M.width}` : void 0
                 },
                 children: [
-                  z.type !== "custom" && z.type !== "checkbox" && /* @__PURE__ */ c("label", { className: "block text-xs font-semibold uppercase tracking-label text-text-subtle", children: [
-                    z.label,
-                    z.required && /* @__PURE__ */ e("span", { className: "ml-1 text-danger-fg", children: "*" })
+                  M.type !== "custom" && M.type !== "checkbox" && /* @__PURE__ */ c("label", { className: "block text-xs font-semibold uppercase tracking-label text-text-subtle", children: [
+                    M.label,
+                    M.required && /* @__PURE__ */ e("span", { className: "ml-1 text-danger-fg", children: "*" })
                   ] }),
-                  $(z)
+                  $(M)
                 ]
               },
-              z.name
+              M.name
             ))) }) })
           ]
         },
@@ -3962,7 +3962,7 @@ function Gr({
     () => Object.fromEntries(
       (d ?? []).filter((v) => v.defaultCollapsed).map((v) => [v.id, !0])
     )
-  ), S = (v, T) => r ? r(v, T) : T, A = (v) => E.includes(v), z = (v, T) => {
+  ), S = (v, T) => r ? r(v, T) : T, A = (v) => E.includes(v), M = (v, T) => {
     C && C(
       T ? [...E, v] : E.filter((B) => B !== v)
     );
@@ -3991,7 +3991,7 @@ function Gr({
   if (t.length === 0 && j)
     return /* @__PURE__ */ e("div", { className: L, children: j });
   const re = t.length > 0 && E.length === t.length, ne = E.length > 0 && !re, D = (v, T, B) => {
-    const W = b?.(v, T) ?? !1, X = g?.(v, T) ?? !1, R = k?.(v, T) ?? !1, oe = p && A(v);
+    const W = b?.(v, T) ?? !1, Q = g?.(v, T) ?? !1, R = k?.(v, T) ?? !1, oe = p && A(v);
     return /* @__PURE__ */ c(
       "li",
       {
@@ -4002,7 +4002,7 @@ function Gr({
           n === "divided" && !B && "border-t border-border-subtle",
           i && "cursor-pointer",
           W || oe ? "bg-accent-soft text-text" : i && "hover:bg-surface-hover",
-          X && "font-bold",
+          Q && "font-bold",
           R && "opacity-55"
         ),
         children: [
@@ -4010,7 +4010,7 @@ function Gr({
             fe,
             {
               checked: A(v),
-              onChange: (o) => z(v, o.target.checked),
+              onChange: (o) => M(v, o.target.checked),
               "aria-label": "Rij selecteren"
             }
           ) }),
@@ -4022,14 +4022,6 @@ function Gr({
             }
           ),
           s && /* @__PURE__ */ e("span", { className: "shrink-0", children: s(v, T) }),
-          X && /* @__PURE__ */ e(
-            "span",
-            {
-              "aria-hidden": !0,
-              className: "size-1.5 shrink-0 rounded-full bg-accent",
-              title: "Ongelezen"
-            }
-          ),
           /* @__PURE__ */ e("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: a ? a(v, T) : String(v) }),
           l && /* @__PURE__ */ e("span", { className: "shrink-0 text-xs text-text-subtle", children: l(v, T) })
         ]
@@ -4038,18 +4030,18 @@ function Gr({
     );
   }, I = (() => {
     if (!h)
-      return t.map((W, X) => D(W, X, X === 0));
+      return t.map((W, Q) => D(W, Q, Q === 0));
     const v = /* @__PURE__ */ new Map();
-    t.forEach((W, X) => {
-      const R = h(W, X);
-      v.has(R) || v.set(R, []), v.get(R).push({ item: W, index: X });
+    t.forEach((W, Q) => {
+      const R = h(W, Q);
+      v.has(R) || v.set(R, []), v.get(R).push({ item: W, index: Q });
     });
     const T = d ?? [];
     return [
       ...T.filter((W) => v.has(W.id)),
-      ...[...v.keys()].filter((W) => !T.some((X) => X.id === W)).map((W) => ({ id: W }))
-    ].flatMap((W, X) => {
-      const R = v.get(W.id) ?? [], oe = N && w[W.id], o = W.title ?? W.id, M = W.count ?? R.length, F = /* @__PURE__ */ e(
+      ...[...v.keys()].filter((W) => !T.some((Q) => Q.id === W)).map((W) => ({ id: W }))
+    ].flatMap((W, Q) => {
+      const R = v.get(W.id) ?? [], oe = N && w[W.id], o = W.title ?? W.id, z = W.count ?? R.length, F = /* @__PURE__ */ e(
         "li",
         {
           onClick: N ? () => m((H) => ({ ...H, [W.id]: !H[W.id] })) : void 0,
@@ -4057,7 +4049,7 @@ function Gr({
             "flex items-center gap-2 bg-surface-sunk px-4 py-1.5",
             "text-xs font-semibold uppercase tracking-label text-text-subtle",
             "border-border-subtle",
-            X > 0 && "border-t",
+            Q > 0 && "border-t",
             "border-b",
             x && "sticky z-10",
             N && "cursor-pointer select-none hover:text-text"
@@ -4076,7 +4068,7 @@ function Gr({
               }
             ),
             /* @__PURE__ */ e("span", { children: o }),
-            !y && /* @__PURE__ */ e("span", { className: "ml-auto font-normal tabular-nums", children: M })
+            !y && /* @__PURE__ */ e("span", { className: "ml-auto font-normal tabular-nums", children: z })
           ] })
         },
         `group-${W.id}`
@@ -4084,7 +4076,7 @@ function Gr({
       return oe ? [F] : [
         F,
         ...R.map(
-          ({ item: H, index: P }, Q) => D(H, P, Q === 0)
+          ({ item: H, index: P }, X) => D(H, P, X === 0)
         )
       ];
     });
@@ -4110,7 +4102,7 @@ function Gr({
       "div",
       {
         className: f(
-          "flex items-center gap-3 border-b border-border-subtle bg-surface-sunk px-4 py-1.5",
+          "flex items-center gap-3 border-b border-border-subtle px-4 py-1.5",
           "text-xs font-semibold uppercase tracking-label text-text-subtle",
           Y && "sticky top-0 z-20"
         ),
@@ -4164,7 +4156,7 @@ const Yr = ({
     "div",
     {
       className: f(
-        "p-5 pb-3 border-b border-border",
+        "p-5 pb-3",
         a
       ),
       children: [
@@ -4565,8 +4557,7 @@ const Qr = ({
       "div",
       {
         className: f(
-          "flex items-center gap-2 px-2 pt-4 pb-1 text-xs font-semibold uppercase tracking-label text-text-subtle",
-          s > 0 && "pl-6"
+          "flex items-center gap-2 px-2 pt-4 pb-1 text-xs font-semibold uppercase tracking-label text-text-subtle"
         ),
         children: [
           /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate", children: t.label }),
@@ -4598,7 +4589,7 @@ const Qr = ({
         "transition-colors duration-fast ease-out",
         "focus-visible:outline-none focus-visible:focus-ring",
         l ? "bg-accent-soft font-semibold text-accent" : "text-text-muted hover:bg-surface-hover hover:text-text",
-        s > 0 && "pl-6"
+        s === 0 && "font-ui-450"
       ),
       children: [
         t.icon && /* @__PURE__ */ e("span", { className: "flex w-5 shrink-0 items-center justify-center", children: t.icon }),
@@ -4623,7 +4614,7 @@ const Qr = ({
   isSelectedHandler: s,
   onClick: a,
   preMenuItemsComponent: l
-}) => /* @__PURE__ */ c("nav", { className: "flex h-full w-sidebar shrink-0 flex-col bg-page p-3", children: [
+}) => /* @__PURE__ */ c("nav", { className: "flex h-full shrink-0 flex-col p-3 pt-4", children: [
   /* @__PURE__ */ c("div", { className: "flex items-center gap-2 px-2 pb-3", children: [
     /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate text-lg font-semibold text-text", children: t }),
     r && r.length > 0 && /* @__PURE__ */ e("div", { className: "flex shrink-0 items-center gap-1", children: r.map((i, b) => /* @__PURE__ */ e(
@@ -5015,7 +5006,7 @@ export {
   rn as CommandPalette,
   St as ContentLoading,
   ye as DatePicker,
-  zt as Dropdown,
+  Mt as Dropdown,
   Wr as EmptyState,
   an as ErrorBoundary,
   sn as FederatedResource,
@@ -5045,7 +5036,7 @@ export {
   De as SplitButton,
   Ht as StorageInput,
   Br as TabBar,
-  ze as Table,
+  Me as Table,
   Pt as Tabs,
   ae as Text,
   Ne as TextArea,