@mci-ui/mci-ui 0.0.88 → 0.0.89

package/dist/shared/ui/mciSelect/MciSelect.js

@@ -1,9 +1,9 @@
 import { jsxs as _, jsx as a } from "react/jsx-runtime";
 import { AltArrowDown as st } from "@solar-icons/react";
 import ot from "../../../assets/icons/close.svg.js";
-import { forwardRef as ct, useState as w, useRef as G, useMemo as O, useCallback as h, useEffect as J } from "react";
+import { forwardRef as ct, useState as w, useRef as G, useMemo as O, useCallback as p, useEffect as J } from "react";
 import { useClickOutside as it, useEscapeKey as ut, cn as s } from "../../lib/utils.js";
-import { getFilteredOptions as ft, getSelectStateStyles as mt, getSelectIconColor as ht, SELECT_SIZES as pt } from "./mci-select.utils.js";
+import { getFilteredOptions as ft, getSelectStateStyles as mt, getSelectIconColor as pt, SELECT_SIZES as ht } from "./mci-select.utils.js";
 const xt = ct(
   ({
     label: U,
@@ -14,7 +14,7 @@ const xt = ct(
     size: l = "base",
     darkMode: e = !1,
     error: o,
-    disabled: r = !1,
+    disabled: n = !1,
     required: Q = !1,
     value: m,
     onChange: b,
@@ -22,45 +22,45 @@ const xt = ct(
     onBlur: y,
     className: X,
     clearable: Y = !1,
-    searchable: p = !1,
+    searchable: h = !1,
     onSearch: N,
     name: k
   }, z) => {
-    const [n, S] = w(!1), [i, F] = w(!1), [M, $] = w(""), [T, x] = w(""), [C, u] = w(-1), H = G(null), K = G(null), d = m !== void 0 ? m : M, Z = L.find((t) => t.value === d), E = d !== "" && d !== void 0, D = Y && E && !r, I = !!(v && R === "right"), c = pt[l], tt = O(() => I && D ? l === "sm" || l === "md" ? "pr-16" : "pr-20" : I || D ? l === "sm" ? "pr-11" : l === "md" ? "pr-12" : "pr-14" : l === "sm" ? "pr-8" : l === "md" ? "pr-9" : "pr-10", [I, D, l]), f = O(() => ft(L, T, p, !!N), [L, T, p, N]), q = h(() => {
+    const [r, S] = w(!1), [i, F] = w(!1), [M, $] = w(""), [T, x] = w(""), [C, u] = w(-1), H = G(null), K = G(null), g = m !== void 0 ? m : M, Z = L.find((t) => t.value === g), E = g !== "" && g !== void 0, D = Y && E && !n, I = !!(v && R === "right"), c = ht[l], tt = O(() => I && D ? l === "sm" || l === "md" ? "pr-16" : "pr-20" : I || D ? l === "sm" ? "pr-11" : l === "md" ? "pr-12" : "pr-14" : l === "sm" ? "pr-8" : l === "md" ? "pr-9" : "pr-10", [I, D, l]), f = O(() => ft(L, T, h, !!N), [L, T, h, N]), q = p(() => {
       S(!1), F(!1), x(""), u(-1), y?.();
     }, [y]), { handleClick: V } = it(H, q), { handleEscape: j } = ut(q);
     J(() => {
-      if (n)
+      if (r)
         return document.addEventListener("mousedown", V), document.addEventListener("keydown", j), () => {
           document.removeEventListener("mousedown", V), document.removeEventListener("keydown", j);
         };
-    }, [n, V, j]), J(() => {
-      n && p && K.current && K.current.focus();
-    }, [n, p]);
-    const et = h(() => {
-      r || (S((t) => !t), n ? (x(""), u(-1)) : (F(!0), W?.()));
-    }, [r, n, W]), P = h(
+    }, [r, V, j]), J(() => {
+      r && h && K.current && K.current.focus();
+    }, [r, h]);
+    const et = p(() => {
+      n || (S((t) => !t), r ? (x(""), u(-1)) : (F(!0), W?.()));
+    }, [n, r, W]), P = p(
       (t) => {
         m === void 0 && $(t), b?.(t), S(!1), F(!1), x(""), u(-1), y?.();
       },
       [m, b, y]
-    ), nt = h(
+    ), nt = p(
       (t) => {
-        if (!r) {
-          if (!n && (t.key === "ArrowDown" || t.key === "ArrowUp" || t.key === "Enter")) {
+        if (!n) {
+          if (!r && (t.key === "ArrowDown" || t.key === "ArrowUp" || t.key === "Enter")) {
             t.preventDefault(), S(!0);
             return;
           }
-          if (n)
+          if (r)
             switch (t.key) {
               case "ArrowDown":
                 t.preventDefault(), u(
-                  (g) => g < f.length - 1 ? g + 1 : 0
+                  (d) => d < f.length - 1 ? d + 1 : 0
                 );
                 break;
               case "ArrowUp":
                 t.preventDefault(), u(
-                  (g) => g > 0 ? g - 1 : f.length - 1
+                  (d) => d > 0 ? d - 1 : f.length - 1
                 );
                 break;
               case "Enter":
@@ -69,23 +69,23 @@ const xt = ct(
             }
         }
       },
-      [n, f, C, r, P]
-    ), rt = h(
+      [r, f, C, n, P]
+    ), rt = p(
       (t) => {
-        t.stopPropagation(), !r && (m === void 0 && $(""), b?.(""), x(""), u(-1));
+        t.stopPropagation(), !n && (m === void 0 && $(""), b?.(""), x(""), u(-1));
       },
-      [m, b, r]
-    ), lt = h(
+      [m, b, n]
+    ), lt = p(
       (t) => {
         x(t), N?.(t), u(0);
       },
       [N]
     ), at = O(
-      () => mt(r, o, e),
-      [o, r, e]
+      () => mt(n, o, e),
+      [o, n, e]
     ), B = O(
-      () => ht(r, o, n, i, e),
-      [r, o, n, i, e]
+      () => pt(n, o, r, i, e),
+      [n, o, r, i, e]
     );
     return /* @__PURE__ */ _("div", { className: s("w-full", X), ref: z, children: [
       U && /* @__PURE__ */ _(
@@ -114,22 +114,23 @@ const xt = ct(
               "div",
               {
                 role: "combobox",
-                "aria-expanded": n,
+                "aria-expanded": r,
                 "aria-haspopup": "listbox",
                 "aria-controls": `${k}-listbox`,
-                "aria-disabled": r,
-                tabIndex: r ? -1 : 0,
+                "aria-disabled": n,
+                tabIndex: n ? -1 : 0,
                 onClick: et,
                 className: s(
                   "flex w-full items-center border font-normal transition-all duration-300 ease-in-out",
+                  n ? "cursor-not-allowed" : "cursor-pointer",
                   l === "base" ? "rounded-xl" : "rounded-lg",
                   c.container,
                   v && R === "left" ? c.iconPaddingLeft : c.padding,
                   tt,
                   at,
-                  e && !r && (i || n) && !o && "border-blue-500 shadow-[0_0_0_2px_var(--opacity-25,rgba(21,93,252,0.25))] text-white",
-                  e && !r && (i || n) && o && "border-red-500 shadow-[0_0_0_2px_rgba(231,0,11,0.25)]",
-                  !e && !r && i && "shadow-blue border-blue-600"
+                  e && !n && (i || r) && !o && "border-blue-500 shadow-[0_0_0_2px_var(--opacity-25,rgba(21,93,252,0.25))] text-white",
+                  e && !n && (i || r) && o && "border-red-500 shadow-[0_0_0_2px_rgba(231,0,11,0.25)]",
+                  !e && !n && i && "shadow-blue border-blue-600"
                 ),
                 children: [
                   v && /* @__PURE__ */ a(
@@ -143,7 +144,7 @@ const xt = ct(
                       children: v
                     }
                   ),
-                  p && n ? /* @__PURE__ */ a(
+                  h && r ? /* @__PURE__ */ a(
                     "input",
                     {
                       ref: K,
@@ -163,9 +164,9 @@ const xt = ct(
                       title: Z?.label || A,
                       className: s(
                         "block min-w-0 flex-1 truncate select-none",
-                        !E && !r && (e ? "text-neutral-100" : "text-slate-400"),
-                        e && E && (i || n) && "text-white",
-                        e && E && !i && !n && "text-neutral-50"
+                        !E && !n && (e ? "text-neutral-100" : "text-slate-400"),
+                        e && E && (i || r) && "text-white",
+                        e && E && !i && !r && "text-neutral-50"
                       ),
                       children: Z?.label || A
                     }
@@ -190,7 +191,7 @@ const xt = ct(
                       className: s(
                         "absolute top-1/2 -translate-y-1/2 pointer-events-none transition-all duration-300",
                         l === "sm" ? "right-2" : "right-3",
-                        n && "rotate-180",
+                        r && "rotate-180",
                         B
                       ),
                       children: /* @__PURE__ */ a(st, { className: c.iconSize })
@@ -199,7 +200,7 @@ const xt = ct(
                 ]
               }
             ),
-            n && !r && /* @__PURE__ */ a(
+            r && !n && /* @__PURE__ */ a(
               "div",
               {
                 id: `${k}-listbox`,
@@ -216,12 +217,12 @@ const xt = ct(
                   "div",
                   {
                     role: "option",
-                    "aria-selected": d === t.value,
+                    "aria-selected": g === t.value,
                     onClick: () => P(t.value),
                     title: t.label,
                     className: s(
                       "cursor-pointer truncate rounded-sm px-3 py-2 font-normal transition-colors",
-                      d === t.value ? e ? "bg-neutral-300 text-white" : "bg-slate-100" : e ? "hover:bg-neutral-300 hover:text-white" : "hover:bg-slate-100"
+                      g === t.value ? e ? "bg-neutral-300 text-white" : "bg-slate-100" : e ? "hover:bg-neutral-300 hover:text-white" : "hover:bg-slate-100"
                     ),
                     children: t.label
                   },

package/dist/shared/ui/mciTable/MciTable.js

@@ -1,65 +1,70 @@
 import { jsx as t, jsxs as c } from "react/jsx-runtime";
-import { ConfoundedSquare as I, SortVertical as W, SortFromTopToBottom as _, SortFromBottomToTop as H } from "@solar-icons/react";
-import { useState as J, useMemo as x, useEffect as K, useCallback as O } from "react";
+import { ConfoundedSquare as _, SortVertical as H, SortFromTopToBottom as J, SortFromBottomToTop as K } from "@solar-icons/react";
+import { useState as O, useMemo as v, useEffect as Q, useCallback as U } from "react";
 import { cn as a } from "../../lib/utils.js";
 /* empty css                 */
 import z from "../mciCheck/MciCheck.js";
-import A from "../mciSkeleton/MciSkeleton.js";
-import Q from "./MciTableClamp2.js";
-import { sortRows as U, normalizeColWidth as X } from "./mci-table.utils.js";
-function re({
-  columns: b,
-  data: v = [],
-  loading: p = !1,
-  skeletonRows: B = 5,
-  noDataText: D = "",
+import B from "../mciSkeleton/MciSkeleton.js";
+import X from "./MciTableClamp2.js";
+import { sortRows as Y, normalizeColWidth as Z } from "./mci-table.utils.js";
+const w = (o) => {
+  const b = String(o.key).toLowerCase(), d = o.title.toLowerCase();
+  return b === "action" || b === "actions" || b.includes("action") || d === "action" || d === "actions" || d.includes("action");
+};
+function ae({
+  columns: o,
+  data: b = [],
+  loading: d = !1,
+  skeletonRows: D = 5,
+  noDataText: P = "",
   sort: n,
   onSortChange: N,
-  className: L,
-  headerClassName: w,
-  bodyClassName: C,
-  darkMode: r = !1,
-  rowKey: u = "id",
-  rowSelection: s
+  className: F,
+  headerClassName: C,
+  bodyClassName: R,
+  darkMode: i = !1,
+  variant: j = "orange",
+  rowKey: p = "id",
+  rowSelection: l
 }) {
-  const [P, R] = J(null), d = n ?? P, g = x(() => Array.isArray(v) ? v : [], [v]), j = x(() => U(g, d, !!n), [g, d, n]);
-  K(() => {
-    n !== void 0 && R(null);
+  const [V, A] = O(null), h = n ?? V, x = v(() => Array.isArray(b) ? b : [], [b]), L = v(() => Y(x, h, !!n), [x, h, n]);
+  Q(() => {
+    n !== void 0 && A(null);
   }, [n]);
-  const m = x(
-    () => p ? [] : n ? g : j,
-    [p, n, g, j]
-  ), F = O(
+  const f = v(
+    () => d ? [] : n ? x : L,
+    [d, n, x, L]
+  ), q = U(
     (e) => {
       if (!e.sortable) return;
-      let l = null;
-      d?.key !== e.key ? l = { key: e.key, direction: "asc" } : d.direction === "asc" && (l = { key: e.key, direction: "desc" }), n !== void 0 ? N?.(l) : R(l);
+      let s = null;
+      h?.key !== e.key ? s = { key: e.key, direction: "asc" } : h.direction === "asc" && (s = { key: e.key, direction: "desc" }), n !== void 0 ? N?.(s) : A(s);
     },
-    [d, n, N]
-  ), V = (e) => {
-    if (!s) return;
-    const { onChange: l, getCheckboxProps: o } = s;
+    [h, n, N]
+  ), E = (e) => {
+    if (!l) return;
+    const { onChange: s, getCheckboxProps: m } = l;
     if (e.target.checked) {
-      const i = m.filter((h) => !o?.(h)?.disabled).map((h) => h[u]);
-      l(i);
+      const r = f.filter((u) => !m?.(u)?.disabled).map((u) => u[p]);
+      s(r);
     } else
-      l([]);
-  }, q = (e, l) => {
-    if (!s) return;
-    const { selectedRowKeys: o, onChange: y } = s, f = e[u], i = l ? [...o, f] : o.filter((h) => h !== f);
-    y(i);
-  }, E = x(() => {
-    if (!s || m.length === 0) return !1;
-    const e = m.filter((l) => !s.getCheckboxProps?.(l)?.disabled);
+      s([]);
+  }, G = (e, s) => {
+    if (!l) return;
+    const { selectedRowKeys: m, onChange: y } = l, g = e[p], r = s ? [...m, g] : m.filter((u) => u !== g);
+    y(r);
+  }, I = v(() => {
+    if (!l || f.length === 0) return !1;
+    const e = f.filter((s) => !l.getCheckboxProps?.(s)?.disabled);
     return e.length === 0 ? !1 : e.every(
-      (l) => s.selectedRowKeys.includes(l[u])
+      (s) => l.selectedRowKeys.includes(s[p])
     );
-  }, [s, m, u]), G = (e) => {
-    const l = a(r ? "text-neutral-100" : "text-slate-base", "shrink-0");
-    return e.sortable ? !d || d.key !== e.key ? /* @__PURE__ */ t(W, { weight: "Linear", size: 20, className: l }) : d.direction === "asc" ? /* @__PURE__ */ t(_, { weight: "Linear", size: 20, className: l }) : /* @__PURE__ */ t(H, { weight: "Linear", size: 20, className: l }) : null;
+  }, [l, f, p]), W = (e) => {
+    const s = a(i ? "text-neutral-100" : "text-slate-base", "shrink-0");
+    return e.sortable ? !h || h.key !== e.key ? /* @__PURE__ */ t(H, { weight: "Linear", size: 20, className: s }) : h.direction === "asc" ? /* @__PURE__ */ t(J, { weight: "Linear", size: 20, className: s }) : /* @__PURE__ */ t(K, { weight: "Linear", size: 20, className: s }) : null;
   }, T = () => /* @__PURE__ */ c("colgroup", { children: [
-    s && /* @__PURE__ */ t("col", { style: { width: 48 } }),
-    b.map((e) => /* @__PURE__ */ t("col", { style: { width: X(e.width) ?? "auto" } }, e.key))
+    l && /* @__PURE__ */ t("col", { style: { width: 48 } }),
+    o.map((e) => /* @__PURE__ */ t("col", { style: { width: Z(e.width) ?? (w(e) ? "1%" : "auto") } }, e.key))
   ] });
   return /* @__PURE__ */ t(
     "div",
@@ -68,10 +73,10 @@ function re({
         "w-full overflow-x-auto pb-0.5",
         "[&::-webkit-scrollbar]:h-1",
         "[&::-webkit-scrollbar-track]:bg-transparent",
-        r ? "[&::-webkit-scrollbar-thumb]:bg-neutral-200" : "[&::-webkit-scrollbar-thumb]:bg-slate-200",
+        i ? "[&::-webkit-scrollbar-thumb]:bg-neutral-200" : "[&::-webkit-scrollbar-thumb]:bg-slate-200",
         "[&::-webkit-scrollbar-thumb]:rounded-full",
-        r ? "hover:[&::-webkit-scrollbar-thumb]:bg-neutral-100" : "hover:[&::-webkit-scrollbar-thumb]:bg-slate-300",
-        L
+        i ? "hover:[&::-webkit-scrollbar-thumb]:bg-neutral-100" : "hover:[&::-webkit-scrollbar-thumb]:bg-slate-300",
+        F
       ),
       children: /* @__PURE__ */ c("div", { className: "inline-block min-w-full align-middle", children: [
         /* @__PURE__ */ t(
@@ -79,33 +84,34 @@ function re({
           {
             className: a(
               "overflow-hidden rounded-xl border",
-              r ? "border-neutral-200 bg-neutral-300" : "border-slate-200 bg-slate-100"
+              i ? "border-neutral-200 bg-neutral-300" : "border-slate-200 bg-slate-100"
             ),
             children: /* @__PURE__ */ c("table", { className: "w-full table-fixed", children: [
               T(),
               /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ c("tr", { children: [
-                s && /* @__PURE__ */ t("th", { className: a("w-12 px-4 py-3", w), children: /* @__PURE__ */ t("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ t(
+                l && /* @__PURE__ */ t("th", { className: a("w-12 px-4 py-3", C), children: /* @__PURE__ */ t("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ t(
                   z,
                   {
-                    checked: E,
-                    onChange: V,
-                    variant: "yellow",
-                    darkMode: r,
-                    disabled: p || m.length === 0
+                    checked: I,
+                    onChange: E,
+                    variant: j,
+                    darkMode: i,
+                    disabled: d || f.length === 0
                   }
                 ) }) }),
-                b.map((e) => /* @__PURE__ */ t(
+                o.map((e) => /* @__PURE__ */ t(
                   "th",
                   {
-                    onClick: () => F(e),
+                    onClick: () => q(e),
                     className: a(
                       "px-4 py-3 text-left text-sm font-medium transition-colors",
-                      r ? "text-neutral-50" : "text-slate-700",
+                      i ? "text-neutral-50" : "text-slate-700",
                       "whitespace-nowrap overflow-hidden text-ellipsis",
+                      w(e) && "w-px",
                       e.align === "center" && "text-center",
                       e.align === "right" && "text-right",
-                      e.sortable && (r ? "cursor-pointer hover:bg-neutral-200" : "cursor-pointer hover:bg-slate-200"),
-                      w
+                      e.sortable && (i ? "cursor-pointer hover:bg-neutral-200" : "cursor-pointer hover:bg-slate-200"),
+                      C
                     ),
                     children: /* @__PURE__ */ c(
                       "div",
@@ -113,7 +119,7 @@ function re({
                         className: a("flex items-center gap-2 min-w-0", e.align === "right" && "justify-end"),
                         children: [
                           /* @__PURE__ */ t("span", { className: "min-w-0 flex-1 truncate", title: e.title, children: e.title }),
-                          G(e)
+                          W(e)
                         ]
                       }
                     )
@@ -129,56 +135,57 @@ function re({
           {
             className: a(
               "overflow-hidden rounded-xl border border-t-0",
-              r ? "border-neutral-200 bg-transparent" : "border-slate-200 bg-white"
+              i ? "border-neutral-200 bg-transparent" : "border-slate-200 bg-white"
             ),
             children: /* @__PURE__ */ c("table", { className: "w-full table-fixed", children: [
               T(),
-              /* @__PURE__ */ t("tbody", { className: a("divide-y", r ? "divide-neutral-200" : "divide-slate-200"), children: p ? Array.from({ length: B }).map((e, l) => /* @__PURE__ */ c("tr", { children: [
-                s && /* @__PURE__ */ t("td", { className: "w-12 px-4 py-3", children: /* @__PURE__ */ t(A, { height: 20, width: 20, variant: "rounded" }) }),
-                b.map((o) => /* @__PURE__ */ t("td", { className: "px-4 py-3", children: /* @__PURE__ */ t(A, { height: 30, variant: "rounded" }) }, o.key))
-              ] }, l)) : m.length === 0 ? /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("td", { colSpan: b.length + (s ? 1 : 0), className: "py-20", children: /* @__PURE__ */ c("div", { className: "flex flex-col items-center justify-center", children: [
+              /* @__PURE__ */ t("tbody", { className: a("divide-y", i ? "divide-neutral-200" : "divide-slate-200"), children: d ? Array.from({ length: D }).map((e, s) => /* @__PURE__ */ c("tr", { children: [
+                l && /* @__PURE__ */ t("td", { className: "w-12 px-4 py-3", children: /* @__PURE__ */ t(B, { height: 20, width: 20, variant: "rounded" }) }),
+                o.map((m) => /* @__PURE__ */ t("td", { className: "px-4 py-3", children: /* @__PURE__ */ t(B, { height: 30, variant: "rounded" }) }, m.key))
+              ] }, s)) : f.length === 0 ? /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("td", { colSpan: o.length + (l ? 1 : 0), className: "py-20", children: /* @__PURE__ */ c("div", { className: "flex flex-col items-center justify-center", children: [
                 /* @__PURE__ */ t("div", { className: "relative mb-4", children: /* @__PURE__ */ t(
-                  I,
+                  _,
                   {
                     weight: "Bold",
                     size: 64,
-                    className: a("animate-float", r ? "text-neutral-100" : "text-slate-400")
+                    className: a("animate-float", i ? "text-neutral-100" : "text-slate-400")
                   }
                 ) }),
-                /* @__PURE__ */ t("p", { className: a("text-sm font-medium", r ? "text-neutral-100" : "text-slate-400"), children: D })
-              ] }) }) }) : m.map((e, l) => {
-                const o = e[u], y = s?.selectedRowKeys.includes(o), f = s?.getCheckboxProps?.(e)?.disabled;
-                return /* @__PURE__ */ c("tr", { className: a("group transition-colors", r ? "hover:bg-neutral-100/35" : "hover:bg-slate-50"), children: [
-                  s && /* @__PURE__ */ t("td", { className: a("w-12 px-4 py-3 align-top", C), children: /* @__PURE__ */ t("div", { className: "flex items-center justify-center pt-1", children: /* @__PURE__ */ t(
+                /* @__PURE__ */ t("p", { className: a("text-sm font-medium", i ? "text-neutral-100" : "text-slate-400"), children: P })
+              ] }) }) }) : f.map((e, s) => {
+                const m = e[p], y = l?.selectedRowKeys.includes(m), g = l?.getCheckboxProps?.(e)?.disabled;
+                return /* @__PURE__ */ c("tr", { className: a("group transition-colors", i ? "hover:bg-neutral-100/35" : "hover:bg-slate-50"), children: [
+                  l && /* @__PURE__ */ t("td", { className: a("w-12 px-4 py-3 align-top", R), children: /* @__PURE__ */ t("div", { className: "flex items-center justify-center pt-1", children: /* @__PURE__ */ t(
                     z,
                     {
                       checked: y,
-                      disabled: f,
-                      variant: "yellow",
-                      darkMode: r,
-                      onChange: (i) => q(e, i.target.checked)
+                      disabled: g,
+                      variant: j,
+                      darkMode: i,
+                      onChange: (r) => G(e, r.target.checked)
                     }
                   ) }) }),
-                  b.map((i) => {
-                    const h = e[i.key], k = i.render ? i.render(h, e) : String(h ?? "-");
+                  o.map((r) => {
+                    const u = e[r.key], k = r.render ? r.render(u, e) : String(u ?? "-");
                     return /* @__PURE__ */ t(
                       "td",
                       {
                         className: a(
-                          "align-top px-4 py-3 text-sm font-normal",
-                          r ? "text-neutral-50" : "text-black",
+                          "align-top px-4 py-3 text-sm font-normal overflow-visible",
+                          i ? "text-neutral-50" : "text-black",
                           "min-w-0 whitespace-normal",
-                          i.align === "center" && "text-center",
-                          i.align === "right" && "text-right",
-                          C,
-                          i.className
+                          w(r) && "w-px whitespace-nowrap",
+                          r.align === "center" && "text-center",
+                          r.align === "right" && "text-right",
+                          R,
+                          r.className
                         ),
-                        children: /* @__PURE__ */ t(Q, { title: typeof k == "string" ? k : void 0, children: k })
+                        children: /* @__PURE__ */ t(X, { title: typeof k == "string" ? k : void 0, children: k })
                       },
-                      i.key
+                      r.key
                     );
                   })
-                ] }, l);
+                ] }, s);
               }) })
             ] })
           }
@@ -188,5 +195,5 @@ function re({
   );
 }
 export {
-  re as default
+  ae as default
 };

package/dist/shared/ui/mciTable/MciTableClamp2.js

@@ -1,7 +1,8 @@
 import { jsx as e } from "react/jsx-runtime";
-function l({ children: t, title: a }) {
-  return /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e("div", { className: "clamp-2 break-words", title: a ?? (typeof t == "string" ? t : void 0), children: t }) });
+function o({ children: t, title: i }) {
+  const a = typeof t == "string" ? t : void 0;
+  return typeof t != "string" && typeof t != "number" ? /* @__PURE__ */ e("div", { className: "-m-1 inline-flex w-fit max-w-full items-start overflow-visible p-1 align-top", children: t }) : /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e("div", { className: "clamp-2 break-words", title: i ?? a, children: t }) });
 }
 export {
-  l as default
+  o as default
 };