@caspeco/casper-ui-library 9.13.0 → 10.0.0

package/dist/components/table/table-filter.js

@@ -19,72 +19,71 @@ const G = ({
   onFilterVisibleChange: b,
   onFilterChange: m
 }) => {
-  const x = z(), { registerTableFilter: g } = x, S = x.localeString, h = L[S], [l, a] = R(v), k = I(
-    (e, s) => {
-      a((o) => {
-        const r = o.map((i) => i.filterId === e ? {
-          ...i,
-          selectedItems: s
-        } : i), c = r.filter(
-          (i) => i.isVisible && i.filterId !== e && i.selectedItems && i.selectedItems.length > 0
-        );
-        if (s.length > 0) {
-          const i = r.find((t) => t.filterId === e);
-          i && m?.([
-            ...c.map((t) => ({ filterId: t.filterId, selectedItems: t.selectedItems })),
-            { filterId: e, selectedItems: i.selectedItems }
-          ]);
-        } else
-          m?.([
-            ...c.map((i) => ({ filterId: i.filterId, selectedItems: i.selectedItems }))
-          ]);
-        return r;
-      });
-    },
-    [m, a]
-  ), w = I((e, s) => {
+  const x = z(), {
+    registerTableFilter: g
+  } = x, S = x.localeString, h = L[S], [l, a] = R(v), k = I((e, s) => {
+    a((o) => {
+      const r = o.map((i) => i.filterId === e ? {
+        ...i,
+        selectedItems: s
+      } : i), c = r.filter((i) => i.isVisible && i.filterId !== e && i.selectedItems && i.selectedItems.length > 0);
+      if (s.length > 0) {
+        const i = r.find((t) => t.filterId === e);
+        i && m?.([...c.map((t) => ({
+          filterId: t.filterId,
+          selectedItems: t.selectedItems
+        })), {
+          filterId: e,
+          selectedItems: i.selectedItems
+        }]);
+      } else
+        m?.([...c.map((i) => ({
+          filterId: i.filterId,
+          selectedItems: i.selectedItems
+        }))]);
+      return r;
+    });
+  }, [m, a]), w = I((e, s) => {
     a((o) => o.map((r) => r.filterId === e ? {
       ...r,
       items: s
     } : r));
-  }, []), p = I(
-    (e, s) => {
-      a((r) => {
-        const c = r.map((t) => t.filterId === e ? {
-          ...t,
-          isVisible: s
-        } : t), i = c.find((t) => t.filterId === e);
-        if (s) {
-          if (i?.selectedItems && i.selectedItems.length > 0) {
-            const t = c.filter(
-              (d) => d.isVisible && d.filterId !== e && d.selectedItems && d.selectedItems.length > 0
-            );
-            m?.([
-              ...t.map((d) => ({ filterId: d.filterId, selectedItems: d.selectedItems })),
-              { filterId: e, selectedItems: i.selectedItems }
-            ]);
-          }
-        } else
-          m?.(
-            c.filter(
-              (t) => t.isVisible && t.filterId !== e && t.selectedItems && t.selectedItems.length > 0
-            ).map((t) => ({ filterId: t.filterId, selectedItems: t.selectedItems }))
-          );
-        return c;
-      });
-      const o = l.find((r) => r.filterId === e);
-      o && b?.({ filterId: e, isVisible: s, items: o.items }, (r) => {
-        w(e, r);
-      });
-    },
-    [l, m, b, w]
-  ), V = I(
-    (e) => {
-      const s = l.find((o) => (o.columnId ?? o.filterId) === e);
-      s && p(s.filterId, !s.isVisible);
-    },
-    [l, p]
-  );
+  }, []), p = I((e, s) => {
+    a((r) => {
+      const c = r.map((t) => t.filterId === e ? {
+        ...t,
+        isVisible: s
+      } : t), i = c.find((t) => t.filterId === e);
+      if (s) {
+        if (i?.selectedItems && i.selectedItems.length > 0) {
+          const t = c.filter((d) => d.isVisible && d.filterId !== e && d.selectedItems && d.selectedItems.length > 0);
+          m?.([...t.map((d) => ({
+            filterId: d.filterId,
+            selectedItems: d.selectedItems
+          })), {
+            filterId: e,
+            selectedItems: i.selectedItems
+          }]);
+        }
+      } else
+        m?.(c.filter((t) => t.isVisible && t.filterId !== e && t.selectedItems && t.selectedItems.length > 0).map((t) => ({
+          filterId: t.filterId,
+          selectedItems: t.selectedItems
+        })));
+      return c;
+    });
+    const o = l.find((r) => r.filterId === e);
+    o && b?.({
+      filterId: e,
+      isVisible: s,
+      items: o.items
+    }, (r) => {
+      w(e, r);
+    });
+  }, [l, m, b, w]), V = I((e) => {
+    const s = l.find((o) => (o.columnId ?? o.filterId) === e);
+    s && p(s.filterId, !s.isVisible);
+  }, [l, p]);
   W(() => g({
     onToggleFilterVisibility: V,
     canFilterOnColumn: (s) => l.some((o) => (o.columnId ?? o.filterId) === s)
@@ -95,46 +94,19 @@ const G = ({
       isVisible: !1,
       selectedItems: []
     }))), m?.([]);
-  }, [m, a]), M = j(
-    () => l.some((e) => e.isVisible),
-    [l]
-  ), F = I(
-    (e) => ({ checked: s }) => {
-      p(e, !!s);
-    },
-    [p]
-  );
+  }, [m, a]), M = j(() => l.some((e) => e.isVisible), [l]), F = I((e) => ({
+    checked: s
+  }) => {
+    p(e, !!s);
+  }, [p]);
   return /* @__PURE__ */ u(f, { width: "100%", overflow: "hidden", children: [
     /* @__PURE__ */ u(f, { shrink: 1, grow: 0, minWidth: 0, gap: T.Medium, children: [
-      /* @__PURE__ */ n(f, { maxWidth: "100%", overflowX: "auto", whiteSpace: "nowrap", gap: T.Medium, children: l.filter((e) => e.isVisible).map((e) => /* @__PURE__ */ n(
-        O,
-        {
-          collapsed: !0,
-          placeholder: "",
-          id: `${e.filterId}-filter`,
-          maxVisibleItems: 30,
-          label: e.label,
-          locale: S,
-          width: "285px",
-          minWidth: "285px",
-          items: e.items,
-          selectedItems: e.selectedItems,
-          onChange: (s) => k(e.filterId, s),
-          footerContent: /* @__PURE__ */ n(C, { variant: "link", size: "xs", onClick: () => k(e.filterId, []), children: /* @__PURE__ */ n(A, { children: h.filterBoxReset }) })
-        },
-        e.filterId
-      )) }),
+      /* @__PURE__ */ n(f, { maxWidth: "100%", overflowX: "auto", whiteSpace: "nowrap", gap: T.Medium, children: l.filter((e) => e.isVisible).map((e) => /* @__PURE__ */ n(O, { collapsed: !0, placeholder: "", id: `${e.filterId}-filter`, maxVisibleItems: 30, label: e.label, locale: S, width: "285px", minWidth: "285px", items: e.items, selectedItems: e.selectedItems, onChange: (s) => k(e.filterId, s), footerContent: /* @__PURE__ */ n(C, { variant: "link", size: "xs", onClick: () => k(e.filterId, []), children: /* @__PURE__ */ n(A, { children: h.filterBoxReset }) }) }, e.filterId)) }),
       /* @__PURE__ */ n(f, { shrink: 0, children: /* @__PURE__ */ u(D, { closeOnSelect: !1, offset: [0, 4], children: [
         /* @__PURE__ */ n(E, { flexShrink: 0, leftIcon: H, variant: "ghost", children: h.filterText }),
         /* @__PURE__ */ n(X, { zIndex: 10, maxHeight: "320px", overflowY: "auto", children: l.map((e) => /* @__PURE__ */ u(Y, { value: e.filterId, itemType: "checkbox", children: [
           e.label,
-          /* @__PURE__ */ n(
-            $,
-            {
-              isChecked: e.isVisible,
-              onCheckedChange: F(e.filterId)
-            }
-          )
+          /* @__PURE__ */ n($, { isChecked: e.isVisible, onCheckedChange: F(e.filterId) })
         ] }, e.filterId)) })
       ] }) })
     ] }),

package/dist/components/table/table-header-dropdown.d.ts

@@ -16,7 +16,7 @@ type TableHeaderDropdownProps<TData extends TableData> = {
 };
 declare const TableHeaderDropdownComponent: <TData extends TableData>({ header, breakingContentState, onBreakingContentChange, setBreakingContentState, headerGroup, sorting, setSorting, localeString, portalContainerRef, dragRef, }: TableHeaderDropdownProps<TData> & {
     portalContainerRef?: React.RefObject<HTMLElement | null>;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export declare const TableHeaderDropdown: typeof TableHeaderDropdownComponent;
 export {};
 //# sourceMappingURL=table-header-dropdown.d.ts.map

package/dist/components/table/table-header-dropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-header-dropdown.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-header-dropdown.tsx"],"names":[],"mappings":"AAWA,OAAO,EAGN,KAAK,MAAM,EACX,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAQ,KAAK,GAAG,EAAwB,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,KAAK,OAAO,EAAgB,MAAM,gBAAgB,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnD,KAAK,wBAAwB,CAAC,KAAK,SAAS,SAAS,IAAI;IACxD,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;IACzC,oBAAoB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,uBAAuB,CAAC,EAAE,CAAC,oBAAoB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IAClF,uBAAuB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,KAAK,IAAI,CAAC;IACxF,WAAW,EAAE,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC;IAC5C,OAAO,EAAE,YAAY,CAAC;IACtB,UAAU,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,gBAAgB,EAAE,eAAe,CAAC;IAClC,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CACjC,CAAC;AAEF,QAAA,MAAM,4BAA4B,GAAI,KAAK,SAAS,SAAS,EAAE,kKAW5D,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAAE,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;CAAE,4CAqJhG,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAyC,OAAO,4BAA4B,CAAC"}
+{"version":3,"file":"table-header-dropdown.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-header-dropdown.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAGN,KAAK,MAAM,EACX,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAQ,KAAK,GAAG,EAAwB,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,KAAK,OAAO,EAAgB,MAAM,gBAAgB,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnD,KAAK,wBAAwB,CAAC,KAAK,SAAS,SAAS,IAAI;IACxD,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;IACzC,oBAAoB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,uBAAuB,CAAC,EAAE,CAAC,oBAAoB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IAClF,uBAAuB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,KAAK,IAAI,CAAC;IACxF,WAAW,EAAE,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC;IAC5C,OAAO,EAAE,YAAY,CAAC;IACtB,UAAU,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,gBAAgB,EAAE,eAAe,CAAC;IAClC,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CACjC,CAAC;AAEF,QAAA,MAAM,4BAA4B,GAAI,KAAK,SAAS,SAAS,EAAE,kKAW5D,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAAE,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;CAAE,gCAsJhG,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAyC,OAAO,4BAA4B,CAAC"}

package/dist/components/table/table-header-dropdown.js

@@ -1,137 +1,89 @@
-import { jsxs as r, Fragment as u, jsx as o } from "react/jsx-runtime";
-import { Portal as j } from "@chakra-ui/react";
-import { flexRender as A } from "../../node_modules/@tanstack/react-table/build/lib/index.js";
+import { jsxs as r, Fragment as d, jsx as n } from "react/jsx-runtime";
+import { Portal as A } from "@chakra-ui/react";
+import { flexRender as k } from "../../node_modules/@tanstack/react-table/build/lib/index.js";
 import { memo as L, useCallback as M, useMemo as p } from "react";
 import { useTableContext as U } from "./table-context.js";
-import { translations as X } from "./translations.js";
-import { SortDescIcon as k } from "../icon/icons/sort-desc-icon.js";
-import { SortAscIcon as S } from "../icon/icons/sort-asc-icon.js";
+import { translations as W } from "./translations.js";
+import { SortDescIcon as S } from "../icon/icons/sort-desc-icon.js";
+import { SortAscIcon as w } from "../icon/icons/sort-asc-icon.js";
+import { Box as X } from "../box/box.js";
 import { MenuItem as l } from "../menu/menu-item.js";
 import { Text as c } from "../text/text.js";
 import { FilterIcon as R } from "../icon/icons/filter-icon.js";
-import { MenuDivider as w } from "../menu/menu-divider.js";
-import { HideIcon as W } from "../icon/icons/hide-icon.js";
+import { MenuDivider as v } from "../menu/menu-divider.js";
+import { HideIcon as _ } from "../icon/icons/hide-icon.js";
 import { ThumbtackIcon as $ } from "../icon/icons/thumbtack-icon.js";
 import { Switch as q } from "../switch/switch.js";
 import { Menu as J } from "../menu/menu.js";
 import { MenuBoxButton as K } from "../menu/menu-box-button.js";
 import { MenuList as N } from "../menu/menu-list.js";
-import { ThemeIconSizeVariable as D, ThemeColorVariable as v, ThemeSpaceVariable as Q, ThemeFontSizeVariable as F } from "../../theme/theme-types.js";
+import { ThemeIconSizeVariable as D, ThemeColorVariable as F, ThemeSpaceVariable as Q, ThemeFontSizeVariable as z } from "../../theme/theme-types.js";
 const Y = ({
-  header: n,
+  header: o,
   breakingContentState: m,
   onBreakingContentChange: h,
   setBreakingContentState: g,
   headerGroup: C,
-  sorting: d,
+  sorting: u,
   setSorting: f,
-  localeString: y,
-  portalContainerRef: z,
-  dragRef: V
+  localeString: V,
+  portalContainerRef: y,
+  dragRef: H
 }) => {
-  const i = X[y], H = U(), { getTableFilterMethods: s } = H, b = M(
-    ({ checked: e }) => {
-      const t = {
-        ...m,
-        [n.column.id]: e
-      };
-      g(t), h?.(t);
-    },
-    [m, n.column.id, h, g]
-  ), x = M(
-    (e) => {
-      const t = e.getIndex();
-      C.forEach((E) => {
-        E.headers.forEach((O, T) => {
-          const { column: I } = O;
-          e.getIsPinned() ? T >= t && I.pin(!1) : T <= t && I.pin("left");
-        });
+  const e = W[V], B = U(), {
+    getTableFilterMethods: s
+  } = B, x = M(({
+    checked: i
+  }) => {
+    const t = {
+      ...m,
+      [o.column.id]: i
+    };
+    g(t), h?.(t);
+  }, [m, o.column.id, h, g]), b = M((i) => {
+    const t = i.getIndex();
+    C.forEach((O) => {
+      O.headers.forEach((j, T) => {
+        const {
+          column: I
+        } = j;
+        i.getIsPinned() ? T >= t && I.pin(!1) : T <= t && I.pin("left");
       });
-    },
-    [C]
-  ), P = p(() => /* @__PURE__ */ r(u, { children: [
-    d.find((e) => e.id === n.column.id) && (d.find((e) => e.desc) ? /* @__PURE__ */ o(k, { size: D.XSmall }) : /* @__PURE__ */ o(S, { size: D.XSmall })),
-    n.column.columnDef.header
-  ] }), [n.column.columnDef.header, n.column.id, d]), a = p(() => s()?.canFilterOnColumn(n.column.id) ?? !1, [n.column.id, s]), B = p(() => /* @__PURE__ */ r(u, { children: [
-    n.column.getCanSort() && /* @__PURE__ */ r(u, { children: [
-      /* @__PURE__ */ o(
-        l,
-        {
-          onClick: () => f([{ desc: !1, id: n.column.id }]),
-          leftIcon: S,
-          value: "sort-asc",
-          children: /* @__PURE__ */ o(c, { children: i.sortUp })
-        }
-      ),
-      /* @__PURE__ */ o(
-        l,
-        {
-          onClick: () => f([{ desc: !0, id: n.column.id }]),
-          leftIcon: k,
-          value: "sort-desc",
-          children: /* @__PURE__ */ o(c, { children: i.sortDown })
-        }
-      )
+    });
+  }, [C]), P = p(() => /* @__PURE__ */ r(d, { children: [
+    u.find((i) => i.id === o.column.id) && (u.find((i) => i.desc) ? /* @__PURE__ */ n(S, { size: D.XSmall }) : /* @__PURE__ */ n(w, { size: D.XSmall })),
+    /* @__PURE__ */ n(X, { minW: 0, overflowWrap: "break-word", children: k(o.column.columnDef.header, o.getContext()) })
+  ] }), [o, u]), a = p(() => s()?.canFilterOnColumn(o.column.id) ?? !1, [o.column.id, s]), E = p(() => /* @__PURE__ */ r(d, { children: [
+    o.column.getCanSort() && /* @__PURE__ */ r(d, { children: [
+      /* @__PURE__ */ n(l, { onClick: () => f([{
+        desc: !1,
+        id: o.column.id
+      }]), leftIcon: w, value: "sort-asc", children: /* @__PURE__ */ n(c, { children: e.sortUp }) }),
+      /* @__PURE__ */ n(l, { onClick: () => f([{
+        desc: !0,
+        id: o.column.id
+      }]), leftIcon: S, value: "sort-desc", children: /* @__PURE__ */ n(c, { children: e.sortDown }) })
     ] }),
-    a && /* @__PURE__ */ o(
-      l,
-      {
-        onClick: () => {
-          const e = s();
-          e?.onToggleFilterVisibility && e.onToggleFilterVisibility(n.column.id);
-        },
-        leftIcon: R,
-        value: "filter",
-        children: /* @__PURE__ */ o(c, { children: i.filter })
-      }
-    ),
-    (n.column.getCanSort() || a) && /* @__PURE__ */ o(w, {}),
-    n.column.getCanHide() && /* @__PURE__ */ o(l, { onClick: n.column.getToggleVisibilityHandler(), leftIcon: W, value: "hide", children: /* @__PURE__ */ o(c, { children: i.hideColumn }) }),
-    /* @__PURE__ */ o(l, { onClick: () => x(n.column), leftIcon: $, value: "pin", children: /* @__PURE__ */ o(c, { children: n.column.getIsPinned() ? i.stopPinningColumn : i.pinUpToColumn }) }),
-    /* @__PURE__ */ o(w, {}),
+    a && /* @__PURE__ */ n(l, { onClick: () => {
+      const i = s();
+      i?.onToggleFilterVisibility && i.onToggleFilterVisibility(o.column.id);
+    }, leftIcon: R, value: "filter", children: /* @__PURE__ */ n(c, { children: e.filter }) }),
+    (o.column.getCanSort() || a) && /* @__PURE__ */ n(v, {}),
+    o.column.getCanHide() && /* @__PURE__ */ n(l, { onClick: o.column.getToggleVisibilityHandler(), leftIcon: _, value: "hide", children: /* @__PURE__ */ n(c, { children: e.hideColumn }) }),
+    /* @__PURE__ */ n(l, { onClick: () => b(o.column), leftIcon: $, value: "pin", children: /* @__PURE__ */ n(c, { children: o.column.getIsPinned() ? e.stopPinningColumn : e.pinUpToColumn }) }),
+    /* @__PURE__ */ n(v, {}),
     /* @__PURE__ */ r(l, { itemType: "switch", value: "breaking-content", children: [
-      i.breakingContent,
-      /* @__PURE__ */ o(
-        q,
-        {
-          onCheckedChange: b,
-          isChecked: m[n.column.id]
-        }
-      )
+      e.breakingContent,
+      /* @__PURE__ */ n(q, { onCheckedChange: x, isChecked: m[o.column.id] })
     ] })
-  ] }), [
-    m,
-    a,
-    s,
-    x,
-    n.column,
-    b,
-    f,
-    i
-  ]);
-  return /* @__PURE__ */ o(J, { isLazy: !0, children: ({ isOpen: e }) => /* @__PURE__ */ r(u, { children: [
-    /* @__PURE__ */ o(
-      K,
-      {
-        ref: V,
-        color: v.OnBackgroundSubdued,
-        textTransform: "none",
-        fontSize: F.Small,
-        h: "40px",
-        display: "flex",
-        textAlign: "inherit",
-        alignItems: "center",
-        lineHeight: "1.2",
-        padding: `0px 0px 0px ${Q.Small}`,
-        backgroundColor: e ? v.BackgroundDisabled : "unset",
-        w: "100%",
-        overflowWrap: "anywhere",
-        children: A(P, n.getContext())
-      }
-    ),
-    /* @__PURE__ */ o(j, { container: z, children: /* @__PURE__ */ o(N, { fontSize: F.Medium, children: B }) })
+  ] }), [m, a, s, b, o.column, x, f, e]);
+  return /* @__PURE__ */ n(J, { isLazy: !0, children: ({
+    isOpen: i
+  }) => /* @__PURE__ */ r(d, { children: [
+    /* @__PURE__ */ n(K, { ref: H, color: F.OnBackgroundSubdued, textTransform: "none", fontSize: z.Small, h: "40px", display: "flex", textAlign: "inherit", alignItems: "center", lineHeight: "1.2", padding: `0px 0px 0px ${Q.Small}`, backgroundColor: i ? F.BackgroundDisabled : "unset", w: "100%", children: k(P, o.getContext()) }),
+    /* @__PURE__ */ n(A, { container: y, children: /* @__PURE__ */ n(N, { fontSize: z.Medium, children: E }) })
   ] }) });
-}, bn = L(Y);
+}, To = L(Y);
 export {
-  bn as TableHeaderDropdown
+  To as TableHeaderDropdown
 };

package/dist/components/table/table-header-row.d.ts

@@ -6,7 +6,7 @@ type TableHeaderRowProps<TData extends TableData> = {
 };
 declare const TableHeaderRowComponent: <TData extends TableData>({ headerGroup, hideTableHeaderDropdown, portalContainerRef, }: TableHeaderRowProps<TData> & {
     portalContainerRef?: React.RefObject<HTMLElement | null>;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export declare const TableHeaderRow: typeof TableHeaderRowComponent;
 export {};
 //# sourceMappingURL=table-header-row.d.ts.map

package/dist/components/table/table-header-row.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-header-row.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-header-row.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAwC,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAK/F,OAAO,KAAK,EAAmB,SAAS,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEpE,KAAK,mBAAmB,CAAC,KAAK,SAAS,SAAS,IAAI;IACnD,WAAW,EAAE,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;IAC1C,uBAAuB,EAAE,OAAO,GAAG,SAAS,CAAC;CAC7C,CAAC;AAEF,QAAA,MAAM,uBAAuB,GAAI,KAAK,SAAS,SAAS,EAAE,+DAIvD,mBAAmB,CAAC,KAAK,CAAC,GAAG;IAAE,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;CAAE,4CAiD3F,CAAC;AAsPF,eAAO,MAAM,cAAc,EAAoC,OAAO,uBAAuB,CAAC"}
+{"version":3,"file":"table-header-row.d.ts","sourceRoot":"","sources":["../../../lib/components/table/table-header-row.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAwC,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAK/F,OAAO,KAAK,EAAmB,SAAS,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEpE,KAAK,mBAAmB,CAAC,KAAK,SAAS,SAAS,IAAI;IACnD,WAAW,EAAE,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;IAC1C,uBAAuB,EAAE,OAAO,GAAG,SAAS,CAAC;CAC7C,CAAC;AAEF,QAAA,MAAM,uBAAuB,GAAI,KAAK,SAAS,SAAS,EAAE,+DAIvD,mBAAmB,CAAC,KAAK,CAAC,GAAG;IAAE,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;CAAE,gCAiD3F,CAAC;AAsPF,eAAO,MAAM,cAAc,EAAoC,OAAO,uBAAuB,CAAC"}

package/dist/components/table/table-header-row.js

@@ -26,37 +26,16 @@ const Y = ({
   portalContainerRef: s
 }) => {
   const a = p(), l = !!a.getRowActions, i = (a.selectedRowIds?.length ?? 0) > 0 && (a.selectionActions?.length ?? 0) > 0;
-  return /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(I.Row, { children: i ? /* @__PURE__ */ e(
-    I.ColumnHeader,
-    {
-      colSpan: t.headers.length,
-      cursor: "default",
-      css: {
-        "& div:not(label *):hover": {
-          backgroundColor: "transparent !important"
-        },
-        "& div span": {
-          color: g.OnBackground
-        },
-        borderBottom: `1px solid ${g.OnBackgroundBorder}`,
-        paddingLeft: l ? "24px" : void 0
-      },
-      scope: "col",
-      zIndex: 1,
-      children: /* @__PURE__ */ e(M, { showSelectAll: !0, children: /* @__PURE__ */ e(ee, {}) })
-    }
-  ) : /* @__PURE__ */ e(S, { children: t.headers.map((o, r) => /* @__PURE__ */ e(
-    Z,
-    {
-      header: o,
-      hideTableHeaderDropdown: n,
-      applyActionMenuPadding: l,
-      portalContainerRef: s,
-      isFirstColumn: !o.isPlaceholder && r === 0,
-      enableColumnReorder: a.enableColumnReorder
+  return /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(I.Row, { children: i ? /* @__PURE__ */ e(I.ColumnHeader, { colSpan: t.headers.length, cursor: "default", css: {
+    "& div:not(label *):hover": {
+      backgroundColor: "transparent !important"
     },
-    o.id
-  )) }) }, t.id) });
+    "& div span": {
+      color: g.OnBackground
+    },
+    borderBottom: `1px solid ${g.OnBackgroundBorder}`,
+    paddingLeft: l ? "24px" : void 0
+  }, scope: "col", zIndex: 1, children: /* @__PURE__ */ e(M, { showSelectAll: !0, children: /* @__PURE__ */ e(ee, {}) }) }) : /* @__PURE__ */ e(S, { children: t.headers.map((o, r) => /* @__PURE__ */ e(Z, { header: o, hideTableHeaderDropdown: n, applyActionMenuPadding: l, portalContainerRef: s, isFirstColumn: !o.isPlaceholder && r === 0, enableColumnReorder: a.enableColumnReorder }, o.id)) }) }, t.id) });
 }, Z = ({
   header: t,
   hideTableHeaderDropdown: n,
@@ -65,7 +44,9 @@ const Y = ({
   isFirstColumn: l = !1,
   enableColumnReorder: i = !1
 }) => {
-  const o = p(), { column: r } = t, c = i && !r.columnDef.meta?.disableColumnReorder, {
+  const o = p(), {
+    column: r
+  } = t, c = i && !r.columnDef.meta?.disableColumnReorder, {
     ref: d,
     isDragging: m,
     isDropTarget: T
@@ -86,67 +67,45 @@ const Y = ({
       maxWidth: x
     };
   }, []);
-  return /* @__PURE__ */ e(
-    I.ColumnHeader,
-    {
-      className: "tableHeaderCell",
-      textAlign: r.columnDef.meta?.isNumeric ? "end" : "start",
-      zIndex: r.getIsPinned() ? 2 : 1,
-      cursor: i ? m ? "grabbing" : "pointer" : void 0,
-      opacity: m ? 0.5 : 1,
-      backgroundColor: T || m ? g.Background : void 0,
-      scope: "col",
-      style: {
-        ...y(r),
-        borderBottom: `1px solid ${g.OnBackgroundBorder}`,
-        paddingLeft: l && s ? "24px" : void 0,
-        ...c ? { userSelect: "none", WebkitUserSelect: "none" } : {}
-      },
-      children: /* @__PURE__ */ e(M, { showSelectAll: o.canSelectRows && l, children: /* @__PURE__ */ e(S, { children: n ? /* @__PURE__ */ e(u, { paddingLeft: f.Small, children: V(t.column.columnDef.header, t.getContext()) }) : /* @__PURE__ */ e(
-        O,
-        {
-          header: t,
-          breakingContentState: o.breakingContentState,
-          columnVisibility: o.columnVisibility,
-          headerGroup: o.table.getHeaderGroups(),
-          localeString: o.localeString,
-          setBreakingContentState: o.setBreakingContentState,
-          setSorting: o.setSorting,
-          sorting: o.sorting,
-          onBreakingContentChange: o.onBreakingContentChange,
-          portalContainerRef: a,
-          dragRef: c ? d : void 0
-        }
-      ) }) })
-    }
-  );
-}, M = ({ showSelectAll: t, children: n }) => t ? /* @__PURE__ */ w(k, { w: "100%", align: "center", children: [
+  return /* @__PURE__ */ e(I.ColumnHeader, { className: "tableHeaderCell", textAlign: r.columnDef.meta?.isNumeric ? "end" : "start", zIndex: r.getIsPinned() ? 2 : 1, cursor: i ? m ? "grabbing" : "pointer" : void 0, opacity: m ? 0.5 : 1, backgroundColor: T || m ? g.Background : void 0, scope: "col", style: {
+    ...y(r),
+    borderBottom: `1px solid ${g.OnBackgroundBorder}`,
+    paddingLeft: l && s ? "24px" : void 0,
+    ...c ? {
+      userSelect: "none",
+      WebkitUserSelect: "none"
+    } : {}
+  }, children: /* @__PURE__ */ e(M, { showSelectAll: o.canSelectRows && l, children: /* @__PURE__ */ e(S, { children: n ? /* @__PURE__ */ e(u, { paddingLeft: f.Small, children: V(t.column.columnDef.header, t.getContext()) }) : /* @__PURE__ */ e(O, { header: t, breakingContentState: o.breakingContentState, columnVisibility: o.columnVisibility, headerGroup: o.table.getHeaderGroups(), localeString: o.localeString, setBreakingContentState: o.setBreakingContentState, setSorting: o.setSorting, sorting: o.sorting, onBreakingContentChange: o.onBreakingContentChange, portalContainerRef: a, dragRef: c ? d : void 0 }) }) }) });
+}, M = ({
+  showSelectAll: t,
+  children: n
+}) => t ? /* @__PURE__ */ w(k, { w: "100%", align: "center", children: [
   /* @__PURE__ */ e(u, { justifyContent: "center", alignItems: "center", children: /* @__PURE__ */ e(_, {}) }),
   n
 ] }) : /* @__PURE__ */ e(S, { children: n }), _ = () => {
-  const t = p(), n = R(
-    ({ checked: l }) => {
-      const i = typeof l == "boolean" ? l : !1, o = t.getSelectableRowIds();
-      i ? t.setSelectedRowIds((r) => [.../* @__PURE__ */ new Set([...r, ...o])]) : t.setSelectedRowIds((r) => r.filter((c) => !o.includes(c)));
-    },
-    [t]
-  ), { allIsSelected: s, shouldShowIndeterminateState: a } = L(() => {
+  const t = p(), n = R(({
+    checked: l
+  }) => {
+    const i = typeof l == "boolean" ? l : !1, o = t.getSelectableRowIds();
+    i ? t.setSelectedRowIds((r) => [.../* @__PURE__ */ new Set([...r, ...o])]) : t.setSelectedRowIds((r) => r.filter((c) => !o.includes(c)));
+  }, [t]), {
+    allIsSelected: s,
+    shouldShowIndeterminateState: a
+  } = L(() => {
     const i = t.table.getRowModel().flatRows, o = new Set(t.selectedRowIds), r = t.getSelectableRowIds(), c = r.length > 0 && r.every((m) => o.has(m)), d = i.some((m) => o.has(m.id));
     return {
       allIsSelected: c,
       shouldShowIndeterminateState: d && !c
     };
   }, [t]);
-  return /* @__PURE__ */ e(
-    E,
-    {
-      isChecked: s,
-      isIndeterminate: a,
-      onCheckedChange: n
-    }
-  );
+  return /* @__PURE__ */ e(E, { isChecked: s, isIndeterminate: a, onCheckedChange: n });
 }, ee = () => {
-  const { localeString: t, selectedRowIds: n = [], selectionActions: s = [], totalDataCount: a } = p(), l = v[t], [i] = A(["(min-width: 48em)"]), o = s.length > 3 || !i, r = n.length, c = a ? C(l.selectedWithTotal, {
+  const {
+    localeString: t,
+    selectedRowIds: n = [],
+    selectionActions: s = [],
+    totalDataCount: a
+  } = p(), l = v[t], [i] = A(["(min-width: 48em)"]), o = s.length > 3 || !i, r = n.length, c = a ? C(l.selectedWithTotal, {
     count: r,
     total: a
   }) : n.length === 1 ? C(l.selectedSingular, {
@@ -155,38 +114,26 @@ const Y = ({
     count: r
   });
   return /* @__PURE__ */ w(k, { gap: f.Medium, align: "center", alignContent: "center", children: [
-    /* @__PURE__ */ e(
-      u,
-      {
-        pl: f.Small,
-        color: g.OnBackground,
-        fontFamily: J.Body,
-        fontSize: G.Medium,
-        whiteSpace: "nowrap",
-        css: { fontVariantNumeric: "normal" },
-        children: c
-      }
-    ),
+    /* @__PURE__ */ e(u, { pl: f.Small, color: g.OnBackground, fontFamily: J.Body, fontSize: G.Medium, whiteSpace: "nowrap", css: {
+      fontVariantNumeric: "normal"
+    }, children: c }),
     /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(W, { orientation: "vertical", height: "20px" }) }),
     /* @__PURE__ */ e(k, { gap: f.Small, align: "center", children: o ? /* @__PURE__ */ w(j, { children: [
       /* @__PURE__ */ e(N, { variant: "ghost", rightIcon: X, size: "sm", children: l.action }),
       /* @__PURE__ */ e(D, { children: /* @__PURE__ */ e($, { children: s.map((d) => /* @__PURE__ */ e(B, { isMenuItem: !0, action: d }, d.name)) }) })
     ] }) : s.map((d) => /* @__PURE__ */ e(B, { isMenuItem: !1, action: d }, d.name)) })
   ] });
-}, B = ({ isMenuItem: t, action: n }) => {
-  const { selectedRowIds: s, localeString: a } = p(), l = v[a], i = R(() => {
+}, B = ({
+  isMenuItem: t,
+  action: n
+}) => {
+  const {
+    selectedRowIds: s,
+    localeString: a
+  } = p(), l = v[a], i = R(() => {
     n.onClick(s || []);
   }, [n, s]);
-  return t ? /* @__PURE__ */ e(K, { onClick: i, value: n.name, children: n.variant === "delete" ? /* @__PURE__ */ e(u, { as: "span", color: g.Error, children: n.name }) : n.name }) : n.variant === "delete" ? /* @__PURE__ */ e(
-    Q,
-    {
-      onClick: i,
-      icon: U,
-      "aria-label": l.deleteSelectedRows,
-      size: "sm",
-      variant: "ghost"
-    }
-  ) : /* @__PURE__ */ e(q, { onClick: i, size: "sm", variant: "ghost", children: n.name });
+  return t ? /* @__PURE__ */ e(K, { onClick: i, value: n.name, children: n.variant === "delete" ? /* @__PURE__ */ e(u, { as: "span", color: g.Error, children: n.name }) : n.name }) : n.variant === "delete" ? /* @__PURE__ */ e(Q, { onClick: i, icon: U, "aria-label": l.deleteSelectedRows, size: "sm", variant: "ghost" }) : /* @__PURE__ */ e(q, { onClick: i, size: "sm", variant: "ghost", children: n.name });
 }, Re = F(Y);
 export {
   Re as TableHeaderRow