@vkzstudio/muza-ui 1.0.38 → 1.0.40

package/dist/components/DataTable/DataTable.d.ts

@@ -57,8 +57,9 @@ export interface DataTableProps<T> extends Omit<React.HTMLAttributes<HTMLTableEl
     /** Prevents interaction and applies muted text colors. @default false */
     disabled?: boolean;
     /**
-     * Fires when a row is clicked. When provided and not `disabled`, rows become
-     * interactive: cursor-pointer, keyboard-activatable, and a hover/focus border.
+     * Fires when a row is clicked (pointer only — rows are not keyboard-activatable).
+     * When provided and not `disabled`, rows get a pointer cursor and a
+     * hover/focus-within border on cells.
      */
     onRowClick?: (rowData: T, rowIndex: number) => void;
 }

package/dist/components/DataTable/DataTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,qBAAqB;;;8EAmB1B,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,mEAAmE;IACnE,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,mCAAmC;IACnC,KAAK,EAAE,SAAS,CAAA;IAChB,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B;;;;;;;;OAQG;IACH,MAAM,CAAC,EAAE,CACP,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EACjB,OAAO,EAAE,CAAC,EACV,QAAQ,EAAE,MAAM,EAChB,QAAQ,CAAC,EAAE,OAAO,KACf,SAAS,CAAA;CACf;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc,CAAC,CAAC,CAC/B,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,EAC9D,IAAI,CAAC,YAAY,CAAC,OAAO,qBAAqB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;IAC1E,sDAAsD;IACtD,IAAI,EAAE,CAAC,EAAE,CAAA;IACT,qFAAqF;IACrF,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAA;IAC7B,iEAAiE;IACjE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kEAAkE;IAClE,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC7B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;CACpD;AAED,QAAA,MAAM,SAAS,GAAI,CAAC,EAAG,mFASpB,cAAc,CAAC,CAAC,CAAC,4CAwGnB,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAA"}
+{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,qBAAqB;;;8EAmB1B,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,mEAAmE;IACnE,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,mCAAmC;IACnC,KAAK,EAAE,SAAS,CAAA;IAChB,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B;;;;;;;;OAQG;IACH,MAAM,CAAC,EAAE,CACP,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EACjB,OAAO,EAAE,CAAC,EACV,QAAQ,EAAE,MAAM,EAChB,QAAQ,CAAC,EAAE,OAAO,KACf,SAAS,CAAA;CACf;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc,CAAC,CAAC,CAC/B,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,EAC9D,IAAI,CAAC,YAAY,CAAC,OAAO,qBAAqB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;IAC1E,sDAAsD;IACtD,IAAI,EAAE,CAAC,EAAE,CAAA;IACT,qFAAqF;IACrF,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAA;IAC7B,iEAAiE;IACjE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kEAAkE;IAClE,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC7B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;OAIG;IACH,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;CACpD;AAED,QAAA,MAAM,SAAS,GAAI,CAAC,EAAG,mFASpB,cAAc,CAAC,CAAC,CAAC,4CAwGnB,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAA"}

package/dist/components/ExpandableTable/ExpandableTable.d.ts

@@ -1,4 +1,9 @@
 import { ReactNode } from 'react';
+/**
+ * Named breakpoint at and above which a column becomes visible.
+ * Mirrors the breakpoints exported from `@/hooks/use-is-breakpoint`.
+ */
+export type ResponsiveBreakpoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
 /**
  * Column definition for the ExpandableTable.
  * @typeParam T - The type of data objects in each row
@@ -19,11 +24,20 @@ export interface IColumn<T> {
      */
     render?: (value: T[keyof T], rowData: T) => ReactNode;
     /**
-     * Minimum breakpoint at which this column is visible.
-     * Columns hidden below their breakpoint automatically appear in the expanded row view.
+     * Controls when the column is visible.
+     * - Named breakpoint (`'xs'..'3xl'`): visible at and above that breakpoint, rendered with static Tailwind classes.
+     * - Boolean: caller supplies the visibility directly (e.g. from `useMediaQuery('(min-width: 52rem)')`).
+     *   `true` shows the column, `false` hides it. Use this for arbitrary thresholds.
      * @default 'xs'
      */
-    responsive?: 'xs' | 'sm' | 'md' | 'lg';
+    responsive?: ResponsiveBreakpoint | boolean;
+    /**
+     * When `responsive` hides this column, also render it in the automatic expandable area
+     * below the row. Set to `false` to just hide the column — useful when the expandable
+     * area already contains a richer version of the same data.
+     * @default true
+     */
+    moveToExpandable?: boolean;
 }
 /**
  * Cell definition within an expandable row section.

package/dist/components/ExpandableTable/ExpandableTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableTable.d.ts","sourceRoot":"","sources":["../../../src/components/ExpandableTable/ExpandableTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,SAAS,EAMf,MAAM,OAAO,CAAA;AAgBd;;;GAGG;AACH,MAAM,WAAW,OAAO,CAAC,CAAC;IACxB,wDAAwD;IACxD,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,iDAAiD;IACjD,KAAK,EAAE,SAAS,CAAA;IAChB,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,KAAK,SAAS,CAAA;IACrD;;;;OAIG;IACH,UAAU,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CACvC;AAED;;;GAGG;AACH,MAAM,WAAW,uBAAuB,CAAC,CAAC;IACxC,sDAAsD;IACtD,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6CAA6C;IAC7C,KAAK,EAAE,SAAS,CAAA;IAChB,kGAAkG;IAClG,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,KAAK,SAAS,CAAA;CACtD;AAED;;;;GAIG;AACH,MAAM,WAAW,0BAA0B,CAAC,CAAC;IAC3C,yDAAyD;IACzD,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,4FAA4F;IAC5F,KAAK,EAAE,uBAAuB,CAAC,CAAC,CAAC,EAAE,CAAA;CACpC;AAED;;;GAGG;AACH,MAAM,WAAW,oBAAoB,CAAC,CAAC;IACrC,sEAAsE;IACtE,IAAI,EAAE,CAAC,EAAE,CAAA;IACT,sFAAsF;IACtF,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAA;IACrB;;;;;;;;;;;;;OAaG;IACH,qBAAqB,CAAC,EAClB,0BAA0B,CAAC,CAAC,CAAC,EAAE,GAC/B,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,0BAA0B,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA;IACjD;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;QACnB,0GAA0G;QAC1G,mBAAmB,EAAE,MAAM,CAAA;QAC3B,yFAAyF;QACzF,YAAY,EAAE,MAAM,CAAA;QACpB,0GAA0G;QAC1G,SAAS,EAAE,MAAM,CAAA;KAClB,CAAC,CAAA;CACH;AAgCD,eAAO,MAAM,eAAe,GAAI,CAAC,EAAG,uDAKjC,oBAAoB,CAAC,CAAC,CAAC,4CAwXzB,CAAA"}
+{"version":3,"file":"ExpandableTable.d.ts","sourceRoot":"","sources":["../../../src/components/ExpandableTable/ExpandableTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,SAAS,EAMf,MAAM,OAAO,CAAA;AAuBd;;;GAGG;AACH,MAAM,MAAM,oBAAoB,GAC5B,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,KAAK,GACL,KAAK,CAAA;AAET;;;GAGG;AACH,MAAM,WAAW,OAAO,CAAC,CAAC;IACxB,wDAAwD;IACxD,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,iDAAiD;IACjD,KAAK,EAAE,SAAS,CAAA;IAChB,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,KAAK,SAAS,CAAA;IACrD;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,oBAAoB,GAAG,OAAO,CAAA;IAC3C;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B;AAED;;;GAGG;AACH,MAAM,WAAW,uBAAuB,CAAC,CAAC;IACxC,sDAAsD;IACtD,OAAO,EAAE,MAAM,CAAC,CAAA;IAChB,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6CAA6C;IAC7C,KAAK,EAAE,SAAS,CAAA;IAChB,kGAAkG;IAClG,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,KAAK,SAAS,CAAA;CACtD;AAED;;;;GAIG;AACH,MAAM,WAAW,0BAA0B,CAAC,CAAC;IAC3C,yDAAyD;IACzD,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,4FAA4F;IAC5F,KAAK,EAAE,uBAAuB,CAAC,CAAC,CAAC,EAAE,CAAA;CACpC;AAED;;;GAGG;AACH,MAAM,WAAW,oBAAoB,CAAC,CAAC;IACrC,sEAAsE;IACtE,IAAI,EAAE,CAAC,EAAE,CAAA;IACT,sFAAsF;IACtF,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAA;IACrB;;;;;;;;;;;;;OAaG;IACH,qBAAqB,CAAC,EAClB,0BAA0B,CAAC,CAAC,CAAC,EAAE,GAC/B,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,0BAA0B,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA;IACjD;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;QACnB,0GAA0G;QAC1G,mBAAmB,EAAE,MAAM,CAAA;QAC3B,yFAAyF;QACzF,YAAY,EAAE,MAAM,CAAA;QACpB,0GAA0G;QAC1G,SAAS,EAAE,MAAM,CAAA;KAClB,CAAC,CAAA;CACH;AA4CD,eAAO,MAAM,eAAe,GAAI,CAAC,EAAG,uDAKjC,oBAAoB,CAAC,CAAC,CAAC,4CAiZzB,CAAA"}

package/dist/components/ExpandableTable/ExpandableTable.js

@@ -1,153 +1,180 @@
-import { jsxs as m, jsx as s, Fragment as _ } from "react/jsx-runtime";
-import { useState as L, useRef as O, useEffect as W, useCallback as q, useMemo as M, Fragment as J } from "react";
-import { cva as Q } from "class-variance-authority";
-import { useIsMinSm as U, useIsMinMd as X, useIsMinLg as Y } from "../../hooks/use-is-breakpoint.js";
-import { Table as Z, TableHeader as D, TableRow as $, TableHead as S, TableRowGroup as R, TableCell as j } from "./Table.js";
+import { jsxs as m, jsx as s, Fragment as J } from "react/jsx-runtime";
+import { useState as B, useRef as Q, useEffect as U, useCallback as Y, useMemo as E, Fragment as Z } from "react";
+import { cva as D } from "class-variance-authority";
+import { useIsMinSm as S, useIsMinMd as R, useIsMinLg as I, useIsMinXl as w, useIsMin2xl as ee, useIsMin3xl as re } from "../../hooks/use-is-breakpoint.js";
+import { Table as se, TableHeader as te, TableRow as H, TableHead as ie, TableRowGroup as ne, TableCell as P } from "./Table.js";
 import { cn as o } from "../../utils/cn.js";
 import { Typography as g } from "../Typography/Typography.js";
-import { AltArrowDownOutline as w } from "@solar-icons/react-perf";
-import { Flex as z } from "../Flex/Flex.js";
-const F = Q("", {
+import { AltArrowDownOutline as de } from "@solar-icons/react-perf";
+import { Flex as A } from "../Flex/Flex.js";
+const G = D("", {
   variants: {
     responsive: {
       xs: "",
       sm: "hidden sm:table-cell",
       md: "hidden md:table-cell",
-      lg: "hidden lg:table-cell"
+      lg: "hidden lg:table-cell",
+      xl: "hidden xl:table-cell",
+      "2xl": "hidden 2xl:table-cell",
+      "3xl": "hidden 3xl:table-cell"
     },
     reverse: {
       xs: "hidden",
       sm: "sm:hidden",
       md: "md:hidden",
-      lg: "lg:hidden"
+      lg: "lg:hidden",
+      xl: "xl:hidden",
+      "2xl": "2xl:hidden",
+      "3xl": "3xl:hidden"
     }
   }
-}), I = (h, a, t, d) => !h || h === "xs" ? !0 : h === "sm" ? a : h === "md" ? t : h === "lg" ? d : !0, oe = ({
-  data: h,
+}), X = (n) => typeof n == "string" && (n === "xs" || n === "sm" || n === "md" || n === "lg" || n === "xl" || n === "2xl" || n === "3xl"), C = (n, a) => n === void 0 || n === "xs" ? !0 : typeof n == "boolean" ? n : a[n], ge = ({
+  data: n,
   columns: a,
   expandableRowSections: t,
-  classNames: d
+  classNames: p
 }) => {
-  const [b, A] = L(/* @__PURE__ */ new Set()), [B, N] = L(/* @__PURE__ */ new Set()), u = O(
+  const [v, _] = B(/* @__PURE__ */ new Set()), [O, y] = B(/* @__PURE__ */ new Set()), f = Q(
     /* @__PURE__ */ new Map()
   );
-  W(() => {
-    const e = u.current;
+  U(() => {
+    const e = f.current;
     return () => {
       e.forEach((i) => clearTimeout(i)), e.clear();
     };
   }, []);
-  const K = q((e) => {
-    A((i) => {
+  const M = Y((e) => {
+    _((i) => {
       const l = new Set(i);
       if (l.has(e)) {
-        l.delete(e), N((c) => {
+        l.delete(e), y((c) => {
           const r = new Set(c);
           return r.add(e), r;
         });
-        const n = u.current.get(e);
-        n && clearTimeout(n), u.current.set(
+        const d = f.current.get(e);
+        d && clearTimeout(d), f.current.set(
           e,
           setTimeout(() => {
-            N((c) => {
+            y((c) => {
               const r = new Set(c);
               return r.delete(e), r;
-            }), u.current.delete(e);
+            }), f.current.delete(e);
           }, 150)
         );
       } else {
         l.add(e);
-        const n = u.current.get(e);
-        n && (clearTimeout(n), u.current.delete(e), N((c) => {
+        const d = f.current.get(e);
+        d && (clearTimeout(d), f.current.delete(e), y((c) => {
           const r = new Set(c);
           return r.delete(e), r;
         }));
       }
       return l;
     });
-  }, []), f = M(() => {
-    const e = a.filter((i) => i.responsive).map((i) => i.responsive);
-    return e.includes("lg") ? "lg" : e.includes("md") ? "md" : e.includes("sm") ? "sm" : e.includes("xs") ? "xs" : null;
-  }, [a]), y = U(), k = X(), T = Y(), V = M(() => f ? f === "lg" ? T : f === "md" ? k : f === "sm" ? y : !1 : !1, [f, y, k, T]), { firstVisibleIndex: H, lastVisibleIndex: P } = M(() => {
+  }, []), N = S(), V = R(), F = I(), K = w(), L = ee(), $ = re(), u = E(
+    () => ({
+      xs: !0,
+      sm: N,
+      md: V,
+      lg: F,
+      xl: K,
+      "2xl": L,
+      "3xl": $
+    }),
+    [N, V, F, K, L, $]
+  ), j = E(
+    () => a.some(
+      (e) => e.responsive !== void 0 && e.responsive !== "xs" && e.moveToExpandable !== !1 && !C(e.responsive, u)
+    ),
+    [a, u]
+  ), { firstVisibleIndex: W, lastVisibleIndex: q } = E(() => {
     let e = -1, i = -1;
-    return a.forEach((l, n) => {
-      I(l.responsive, y, k, T) && (e === -1 && (e = n), i = n);
+    return a.forEach((l, d) => {
+      C(l.responsive, u) && (e === -1 && (e = d), i = d);
     }), { firstVisibleIndex: e, lastVisibleIndex: i };
-  }, [a, y, k, T]), C = !t && !!f && !V, x = !!t || C;
-  return /* @__PURE__ */ m(Z, { children: [
-    /* @__PURE__ */ s(D, { children: /* @__PURE__ */ s($, { className: "[&>th]:border-0 [&>th]:bg-transparent", children: a.map((e, i) => /* @__PURE__ */ s(
-      S,
-      {
-        className: o(
-          e.className,
-          F({ responsive: e.responsive })
-        ),
-        children: e.title
-      },
-      i
-    )) }) }),
-    h.map((e, i) => {
+  }, [a, u]), x = !t && j, z = !!t || x;
+  return /* @__PURE__ */ m(se, { children: [
+    /* @__PURE__ */ s(te, { children: /* @__PURE__ */ s(H, { className: "[&>th]:border-0 [&>th]:bg-transparent", children: a.map((e, i) => {
+      const l = X(e.responsive) ? e.responsive : void 0, d = e.responsive === !1;
+      return /* @__PURE__ */ s(
+        ie,
+        {
+          className: o(
+            e.className,
+            G({ responsive: l }),
+            d && "hidden"
+          ),
+          children: e.title
+        },
+        i
+      );
+    }) }) }),
+    n.map((e, i) => {
       var c;
-      const l = b.has(i) || C, n = B.has(i);
+      const l = v.has(i) || x, d = O.has(i);
       return /* @__PURE__ */ m(
-        R,
+        ne,
         {
           className: o({
             "group hover:[&_td]:border-stroke-brand-hover": t
           }),
           children: [
             /* @__PURE__ */ m(
-              $,
+              H,
               {
-                expandablePosition: t && (b.has(i) || n) || C ? "top" : "none",
+                expandablePosition: t && (v.has(i) || d) || x ? "top" : "none",
                 className: o("focus-visible-default", {
                   "cursor-pointer": t
                 }),
-                onClick: t ? () => K(i) : void 0,
+                onClick: t ? () => M(i) : void 0,
                 onKeyDown: t ? (r) => {
-                  (r.key === "Enter" || r.key === " ") && (r.preventDefault(), K(i));
+                  (r.key === "Enter" || r.key === " ") && (r.preventDefault(), M(i));
                 } : void 0,
                 tabIndex: t ? 0 : void 0,
                 role: t ? "button" : void 0,
-                "aria-expanded": t ? b.has(i) : void 0,
+                "aria-expanded": t ? v.has(i) : void 0,
                 children: [
-                  a.map((r, p) => /* @__PURE__ */ s(
-                    j,
-                    {
-                      isFirst: p === H,
-                      isLast: p === P && !t,
-                      expandablePosition: (l || n) && x ? "top" : "none",
-                      className: o(
-                        r.className,
-                        F({ responsive: r.responsive })
-                      ),
-                      children: r.render ? r.render(e[r.dataKey], e) : /* @__PURE__ */ s(
-                        g,
-                        {
-                          variant: "body",
-                          size: "base",
-                          weight: "medium",
-                          component: "span",
-                          children: e[r.dataKey]
-                        }
-                      )
-                    },
-                    p
-                  )),
+                  a.map((r, h) => {
+                    const T = X(r.responsive) ? r.responsive : void 0, b = r.responsive === !1;
+                    return /* @__PURE__ */ s(
+                      P,
+                      {
+                        isFirst: h === W,
+                        isLast: h === q && !t,
+                        expandablePosition: (l || d) && z ? "top" : "none",
+                        className: o(
+                          r.className,
+                          G({ responsive: T }),
+                          b && "hidden"
+                        ),
+                        children: r.render ? r.render(e[r.dataKey], e) : /* @__PURE__ */ s(
+                          g,
+                          {
+                            variant: "body",
+                            size: "base",
+                            weight: "medium",
+                            component: "span",
+                            children: e[r.dataKey]
+                          }
+                        )
+                      },
+                      h
+                    );
+                  }),
                   t && /* @__PURE__ */ s(
-                    j,
+                    P,
                     {
                       className: "w-[68px]",
                       isFirst: !1,
                       isLast: !0,
-                      expandablePosition: b.has(i) || n ? "top" : "none",
+                      expandablePosition: v.has(i) || d ? "top" : "none",
                       children: /* @__PURE__ */ s(
-                        w,
+                        de,
                         {
                           className: o(
                             "text-text-brand-def transition-transform duration-300",
                             {
-                              "rotate-180": b.has(i)
+                              "rotate-180": v.has(i)
                             }
                           )
                         }
@@ -157,7 +184,7 @@ const F = Q("", {
                 ]
               }
             ),
-            x && /* @__PURE__ */ s("tr", { "aria-hidden": !l, children: /* @__PURE__ */ s(
+            z && /* @__PURE__ */ s("tr", { "aria-hidden": !l, children: /* @__PURE__ */ s(
               "td",
               {
                 colSpan: a.length + (t ? 1 : 0),
@@ -182,27 +209,33 @@ const F = Q("", {
                             {
                               className: o(
                                 "grid grid-cols-1 gap-2xl px-comp-table-p py-2xl md:grid-cols-[auto_1fr]",
-                                d == null ? void 0 : d.expandedContentGrid
+                                p == null ? void 0 : p.expandedContentGrid
                               ),
                               children: [
-                                !V && /* @__PURE__ */ m(_, { children: [
+                                j && /* @__PURE__ */ m(J, { children: [
                                   /* @__PURE__ */ s(
-                                    z,
+                                    A,
                                     {
                                       gap: "md",
                                       direction: "column",
                                       className: "col-span-full",
-                                      children: a.map((r, p) => /* @__PURE__ */ m(
-                                        z,
+                                      children: a.filter(
+                                        (r) => r.moveToExpandable !== !1 && r.responsive !== void 0 && r.responsive !== "xs" && !C(r.responsive, u)
+                                      ).map((r, h) => /* @__PURE__ */ m(
+                                        A,
                                         {
                                           align: "center",
                                           justify: "between",
                                           direction: "row",
-                                          className: F({
-                                            reverse: r.responsive
-                                          }),
                                           children: [
-                                            /* @__PURE__ */ s(g, { variant: "body", component: "span", children: r.title }),
+                                            /* @__PURE__ */ s(
+                                              g,
+                                              {
+                                                variant: "body",
+                                                component: "span",
+                                                children: r.title
+                                              }
+                                            ),
                                             r.render ? r.render(
                                               e[r.dataKey],
                                               e
@@ -218,22 +251,22 @@ const F = Q("", {
                                             )
                                           ]
                                         },
-                                        p
+                                        h
                                       ))
                                     }
                                   ),
                                   t && /* @__PURE__ */ s("hr", { className: "col-span-full text-stroke-base-secondary md:col-span-2" })
                                 ] }),
-                                (c = typeof t == "function" ? t(e) : t) == null ? void 0 : c.map((r, p) => {
+                                (c = typeof t == "function" ? t(e) : t) == null ? void 0 : c.map((r, h) => {
                                   if (!t) return null;
-                                  const G = typeof t == "function" ? t(e).length : t.length;
-                                  return /* @__PURE__ */ m(J, { children: [
+                                  const T = typeof t == "function" ? t(e).length : t.length;
+                                  return /* @__PURE__ */ m(Z, { children: [
                                     /* @__PURE__ */ m(
                                       "div",
                                       {
                                         className: o(
                                           "col-span-full grid grid-cols-1 gap-y-xl md:col-span-2 md:grid-cols-subgrid",
-                                          d == null ? void 0 : d.sectionTitle
+                                          p == null ? void 0 : p.sectionTitle
                                         ),
                                         children: [
                                           r.title && /* @__PURE__ */ s(
@@ -253,30 +286,30 @@ const F = Q("", {
                                             {
                                               className: o(
                                                 "col-span-full grid grid-cols-1 gap-x-3xl md:col-span-2 md:grid-cols-subgrid md:gap-y-md",
-                                                d == null ? void 0 : d.cellsWrap
+                                                p == null ? void 0 : p.cellsWrap
                                               ),
                                               children: r.cells.flatMap(
-                                                (v, E) => [
+                                                (b, k) => [
                                                   /* @__PURE__ */ s(
                                                     g,
                                                     {
                                                       component: "span",
                                                       variant: "body",
                                                       className: "mb-xs text-text-dark-primary-def md:mb-0",
-                                                      children: v.title
+                                                      children: b.title
                                                     },
-                                                    `${E}-label`
+                                                    `${k}-label`
                                                   ),
-                                                  v.render ? /* @__PURE__ */ s(
+                                                  b.render ? /* @__PURE__ */ s(
                                                     "div",
                                                     {
                                                       className: "mb-md block last-of-type:mb-0 md:mb-0",
-                                                      children: v.render(
-                                                        e[v.dataKey],
+                                                      children: b.render(
+                                                        e[b.dataKey],
                                                         e
                                                       )
                                                     },
-                                                    `${E}-value`
+                                                    `${k}-value`
                                                   ) : /* @__PURE__ */ s(
                                                     g,
                                                     {
@@ -284,9 +317,9 @@ const F = Q("", {
                                                       weight: "medium",
                                                       component: "span",
                                                       className: "mb-md block last-of-type:mb-0 md:mb-0",
-                                                      children: e[v.dataKey]
+                                                      children: e[b.dataKey]
                                                     },
-                                                    `${E}-value`
+                                                    `${k}-value`
                                                   )
                                                 ]
                                               )
@@ -295,8 +328,8 @@ const F = Q("", {
                                         ]
                                       }
                                     ),
-                                    p < G - 1 && /* @__PURE__ */ s("hr", { className: "col-span-full text-stroke-base-secondary md:col-span-2" })
-                                  ] }, p);
+                                    h < T - 1 && /* @__PURE__ */ s("hr", { className: "col-span-full text-stroke-base-secondary md:col-span-2" })
+                                  ] }, h);
                                 })
                               ]
                             }
@@ -316,5 +349,5 @@ const F = Q("", {
   ] });
 };
 export {
-  oe as ExpandableTable
+  ge as ExpandableTable
 };

package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts

@@ -36,4 +36,6 @@ export declare const SingleRow: Story;
 export declare const DynamicExpandableRowSections: Story;
 export declare const IndependentColumns: Story;
 export declare const LongLabels: Story;
+export declare const NoResponsiveColumns: Story;
+export declare const HideWithoutMoving: Story;
 //# sourceMappingURL=ExpandableTable.stories.d.ts.map

package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableTable.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ExpandableTable/ExpandableTable.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAM3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+B8B,CAAA;AAExC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AA+MlC,eAAO,MAAM,MAAM,EAAE,KAsBpB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAkB/B,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAwJjC,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAuBvB,CAAA;AAED,eAAO,MAAM,4BAA4B,EAAE,KAyH1C,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KA0DhC,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAoExB,CAAA"}
+{"version":3,"file":"ExpandableTable.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ExpandableTable/ExpandableTable.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAO3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+B8B,CAAA;AAExC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AA+MlC,eAAO,MAAM,MAAM,EAAE,KAsBpB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAkB/B,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAwJjC,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAuBvB,CAAA;AAED,eAAO,MAAM,4BAA4B,EAAE,KAyH1C,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KA0DhC,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAoExB,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KA6EjC,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KA2E/B,CAAA"}

package/dist/components/FileUpload/FileItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileItem.d.ts","sourceRoot":"","sources":["../../../src/components/FileUpload/FileItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AA8C9B,UAAU,iBAAiB;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,sEAAsE;IACtE,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC/B,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAA;CAC/C;AAED,UAAU,iBAAkB,SAAQ,iBAAiB;IACnD,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,IAAI,CAAA;CACX;AAED,UAAU,gBAAiB,SAAQ,iBAAiB;IAClD,MAAM,EAAE,KAAK,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,KAAK,aAAa,GAAG,iBAAiB,GAAG,gBAAgB,CAAA;AAsEzD,eAAO,MAAM,QAAQ,GAAI,OAAO,aAAa,4CAoO5C,CAAA"}
+{"version":3,"file":"FileItem.d.ts","sourceRoot":"","sources":["../../../src/components/FileUpload/FileItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AA8C9B,UAAU,iBAAiB;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,sEAAsE;IACtE,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC/B,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAA;CAC/C;AAED,UAAU,iBAAkB,SAAQ,iBAAiB;IACnD,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,IAAI,CAAA;CACX;AAED,UAAU,gBAAiB,SAAQ,iBAAiB;IAClD,MAAM,EAAE,KAAK,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,KAAK,aAAa,GAAG,iBAAiB,GAAG,gBAAgB,CAAA;AAsEzD,eAAO,MAAM,QAAQ,GAAI,OAAO,aAAa,4CAuO5C,CAAA"}

package/dist/components/FileUpload/FileItem.js

@@ -85,8 +85,8 @@ const D = (e, l, i) => {
     readOnly: r = !1,
     note: c,
     error: s,
-    secondaryText: g,
-    onDelete: y,
+    secondaryText: y,
+    onDelete: g,
     onError: L
   } = e, m = _(), [v, w] = p.useState(!1), N = e.source === "file" ? e.file.name : e.name, b = e.source === "url" ? (e.type ?? "").startsWith("image/") || A.test(e.name) : e.file.type.startsWith("image/"), T = e.source === "url" ? E.includes(e.type ?? "") || z.test(e.name) : E.includes(e.file.type) || z.test(e.file.name), d = e.source === "file" ? e.file : e.url, C = p.useMemo(() => o ? "disabled" : s ? "error" : typeof i == "number" && i > 0 && i < 100 ? "loading" : "default", [o, s, i]), x = p.useMemo(() => {
     if (b)
@@ -151,7 +151,7 @@ const D = (e, l, i) => {
                 children: N
               }
             ),
-            g && /* @__PURE__ */ t(
+            y && /* @__PURE__ */ t(
               u,
               {
                 className: "w-full truncate text-comp-file-upload-text-dark-secondary",
@@ -159,15 +159,16 @@ const D = (e, l, i) => {
                 variant: "body",
                 size: "caption",
                 weight: "regular",
-                children: g
+                children: y
               }
             )
           ] }),
           !l && /* @__PURE__ */ t(
             "button",
             {
+              type: "button",
               disabled: o,
-              onClick: y,
+              onClick: g,
               "aria-label": m.fileUpload.deleteButtonAriaLabel,
               className: a(
                 h,
@@ -183,6 +184,7 @@ const D = (e, l, i) => {
             /* @__PURE__ */ t(
               "button",
               {
+                type: "button",
                 disabled: o,
                 onClick: () => e.source === "url" ? (() => {
                   try {
@@ -216,8 +218,9 @@ const D = (e, l, i) => {
             !r && /* @__PURE__ */ t(
               "button",
               {
+                type: "button",
                 disabled: o,
-                onClick: y,
+                onClick: g,
                 "aria-label": m.fileUpload.deleteButtonAriaLabel,
                 className: a(
                   h,

package/dist/components/Input/Input.d.ts

@@ -66,11 +66,14 @@ export interface InputProps extends Omit<ComponentProps<'input'>, 'size' | 'pref
      */
     mask?: string;
     /**
-     * Stops click events on the wrapper from propagating to ancestors. Use this
+     * Stops `click` events on the wrapper from propagating to ancestors. Use this
      * when the Input is placed inside a clickable container (e.g. a DataTable or
      * ReorderableTable row that wires `onRowClick`) so that clicking the input's
      * padding / prefix / suffix area does not trigger the parent's click handler.
-     * Focus behavior on the input is preserved.
+     *
+     * Scope: only `click` events are stopped. `focus`, `pointerdown`/`mousedown`,
+     * and `keydown` events still bubble normally. Focus behavior on the input
+     * itself is preserved.
      * @default false
      */
     stopClickPropagation?: boolean;

package/dist/components/Input/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAMjE,QAAA,MAAM,oBAAoB;;;8EA0BzB,CAAA;AAgBD;;;;;GAKG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC,EAC1E,YAAY,CAAC,OAAO,oBAAoB,CAAC;IAC3C,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAA;IACxD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAClC;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,uEAAuE;IACvE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,wEAAwE;IACxE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;;;;;OAOG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B;AAED,eAAO,MAAM,KAAK,sHAiJjB,CAAA"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAMjE,QAAA,MAAM,oBAAoB;;;8EA0BzB,CAAA;AAgBD;;;;;GAKG;AACH,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC,EAC1E,YAAY,CAAC,OAAO,oBAAoB,CAAC;IAC3C,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAA;IACxD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAClC;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,uEAAuE;IACvE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,wEAAwE;IACxE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;;;;;;;;OAUG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B;AAED,eAAO,MAAM,KAAK,sHAiJjB,CAAA"}

package/dist/hooks/use-is-breakpoint.js

@@ -1,5 +1,5 @@
 import { useMediaQuery as t } from "./use-media-query.js";
-const s = 40, n = 48, e = 64, r = 80, m = 96, i = 118, o = () => t(`(min-width: ${s}rem)`), c = () => t(`(max-width: ${s}rem)`), I = () => t(`(min-width: ${n}rem)`), x = () => t(`(max-width: ${n}rem)`), M = () => t(`(min-width: ${e}rem)`), d = () => t(`(max-width: ${e}rem)`), a = () => t(`(min-width: ${r}rem)`), h = () => t(`(max-width: ${r}rem)`), w = () => t(`(min-width: ${m}rem)`), $ = () => t(`(max-width: ${m}rem)`), X = () => t(`(min-width: ${i}rem)`), l = () => t(`(max-width: ${i}rem)`);
+const s = 40, n = 48, e = 64, r = 80, m = 100, i = 120, o = () => t(`(min-width: ${s}rem)`), c = () => t(`(max-width: ${s}rem)`), I = () => t(`(min-width: ${n}rem)`), x = () => t(`(max-width: ${n}rem)`), M = () => t(`(min-width: ${e}rem)`), d = () => t(`(max-width: ${e}rem)`), a = () => t(`(min-width: ${r}rem)`), h = () => t(`(max-width: ${r}rem)`), w = () => t(`(min-width: ${m}rem)`), $ = () => t(`(max-width: ${m}rem)`), X = () => t(`(min-width: ${i}rem)`), l = () => t(`(max-width: ${i}rem)`);
 export {
   $ as useIsMax2xl,
   l as useIsMax3xl,