@fabio.caffarello/react-design-system 3.8.0 → 3.10.0

package/dist/granular/ui/components/Table/Table.js

@@ -0,0 +1,162 @@
+"use client";
+var q = Object.defineProperty, G = Object.defineProperties;
+var J = Object.getOwnPropertyDescriptors;
+var u = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, S = Object.prototype.propertyIsEnumerable;
+var g = (e, a, o) => a in e ? q(e, a, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[a] = o, f = (e, a) => {
+  for (var o in a || (a = {}))
+    p.call(a, o) && g(e, o, a[o]);
+  if (u)
+    for (var o of u(a))
+      S.call(a, o) && g(e, o, a[o]);
+  return e;
+}, h = (e, a) => G(e, J(a));
+var v = (e, a) => {
+  var o = {};
+  for (var t in e)
+    p.call(e, t) && a.indexOf(t) < 0 && (o[t] = e[t]);
+  if (e != null && u)
+    for (var t of u(e))
+      a.indexOf(t) < 0 && S.call(e, t) && (o[t] = e[t]);
+  return o;
+};
+import { jsx as s, jsxs as C, Fragment as K } from "react/jsx-runtime";
+import { TableProvider as w } from "./TableProvider.js";
+import y from "./TableHeader.js";
+import Q from "./TableHeaderRow.js";
+import U from "./TableHeaderCell.js";
+import P from "./TableBody.js";
+import X from "./TableRow.js";
+import Y from "./TableCell.js";
+import z from "./TableFilters.js";
+import R from "./TablePagination.js";
+import Z from "./TableEmptyState.js";
+import _ from "./TableActions.js";
+import { getRadiusClass as T } from "../../tokens/radius.js";
+function n(e) {
+  const c = e, {
+    className: a = "",
+    "aria-label": o,
+    "aria-labelledby": t
+  } = c, d = v(c, [
+    "className",
+    "aria-label",
+    "aria-labelledby"
+  ]), m = "children" in e && e.children !== void 0, i = m ? d : ee(
+    d
+  );
+  return m ? /* @__PURE__ */ s(
+    "div",
+    {
+      className: `bg-surface-base shadow ${T("lg")} overflow-hidden ${a}`,
+      children: /* @__PURE__ */ s(w, h(f({}, i), { children: e.children }))
+    }
+  ) : /* @__PURE__ */ s(
+    "div",
+    {
+      className: `bg-surface-base shadow ${T("lg")} overflow-hidden ${a}`,
+      children: /* @__PURE__ */ C(w, h(f({}, i), { children: [
+        i.filters && i.filters.length > 0 && /* @__PURE__ */ s(z, {}),
+        /* @__PURE__ */ s("div", { className: "overflow-x-auto", children: /* @__PURE__ */ C(
+          "table",
+          {
+            className: "min-w-full divide-y divide-line-default",
+            role: "table",
+            "aria-label": o,
+            "aria-labelledby": t,
+            "aria-rowcount": i.total || i.data.length,
+            "aria-colcount": i.columns.length + (i.selectable ? 1 : 0) + (i.actions ? 1 : 0),
+            children: [
+              /* @__PURE__ */ s(y, {}),
+              /* @__PURE__ */ s(P, {})
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ s(R, {})
+      ] }))
+    }
+  );
+}
+function ee(e) {
+  const {
+    columns: a,
+    data: o,
+    loading: t,
+    onSort: d,
+    sortColumn: m,
+    sortDirection: i,
+    emptyMessage: c,
+    emptyStateTitle: F,
+    emptyStateMessage: H,
+    emptyStateIllustration: N,
+    emptyStateAction: x,
+    pagination: l,
+    filters: r,
+    selectable: M,
+    selectedRows: V,
+    onSelectionChange: $,
+    rowId: A,
+    actions: B,
+    onRowClick: O,
+    paginationMode: j,
+    defaultPageSize: E,
+    resizable: I,
+    columnWidths: L,
+    onColumnResize: k,
+    virtualScrolling: D,
+    virtualScrollingOptions: W
+  } = e;
+  let b = j || "auto";
+  return b === "auto" && (b = l && l.total !== void 0 ? "server" : "client"), {
+    columns: a,
+    data: o,
+    loading: t,
+    paginationMode: b,
+    page: l == null ? void 0 : l.page,
+    pageSize: l == null ? void 0 : l.pageSize,
+    total: l == null ? void 0 : l.total,
+    onPageChange: l == null ? void 0 : l.onPageChange,
+    onPageSizeChange: l == null ? void 0 : l.onPageSizeChange,
+    defaultPageSize: E || (l == null ? void 0 : l.pageSize) || 10,
+    pageSizeOptions: l == null ? void 0 : l.pageSizeOptions,
+    sortColumn: m,
+    sortDirection: i,
+    onSort: d,
+    filters: r == null ? void 0 : r.config,
+    filterValues: r == null ? void 0 : r.initialValues,
+    onFilter: r == null ? void 0 : r.onFilter,
+    initialFilterValues: r == null ? void 0 : r.initialValues,
+    selectable: M,
+    selectedRows: V,
+    onSelectionChange: $,
+    rowId: A,
+    actions: B,
+    onRowClick: O,
+    emptyMessage: c,
+    emptyStateTitle: F,
+    emptyStateMessage: H,
+    emptyStateIllustration: N,
+    emptyStateAction: x,
+    resizable: I,
+    columnWidths: L,
+    onColumnResize: k,
+    virtualScrolling: D,
+    virtualScrollingOptions: W,
+    children: /* @__PURE__ */ s(K, {})
+    // Placeholder, will be overridden by default structure
+  };
+}
+n.Header = y;
+n.HeaderRow = Q;
+n.HeaderCell = U;
+n.Body = P;
+n.Row = X;
+n.Cell = Y;
+n.Filters = z;
+n.Pagination = R;
+n.EmptyState = Z;
+n.Actions = _;
+export {
+  n as default
+};
+//# sourceMappingURL=Table.js.map

package/dist/granular/ui/components/Table/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sources":["../../../../../src/ui/components/Table/Table.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { TableProvider, type TableProviderProps } from \"./TableProvider\";\nimport type { FilterConfig, FilterValue } from \"./TableFilters/TableFilters\";\nimport type { TableAction } from \"./TableActions/TableActions\";\nimport type { TableColumn } from \"./TableTypes\";\nimport TableHeader from \"./TableHeader\";\nimport TableHeaderRow from \"./TableHeaderRow\";\nimport TableHeaderCell from \"./TableHeaderCell\";\nimport TableBody from \"./TableBody\";\nimport TableRow from \"./TableRow\";\nimport TableCell from \"./TableCell\";\nimport TableFilters from \"./TableFilters\";\nimport TablePagination from \"./TablePagination\";\nimport TableEmptyState from \"./TableEmptyState\";\nimport TableActions from \"./TableActions\";\nimport { getRadiusClass } from \"../../tokens/radius\";\n\nexport type { TableColumn } from \"./TableTypes\";\n\n// API Simplificada Props (backward compatible)\ninterface SimplifiedTableProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends Omit<HTMLAttributes<HTMLDivElement>, \"onSort\" | \"children\"> {\n  columns: TableColumn<T>[];\n  data: T[];\n  loading?: boolean;\n  onSort?: (columnKey: string, direction: \"asc\" | \"desc\") => void;\n  sortColumn?: string;\n  sortDirection?: \"asc\" | \"desc\";\n  emptyMessage?: string;\n  emptyStateTitle?: string;\n  emptyStateMessage?: string;\n  emptyStateIllustration?: ReactNode;\n  emptyStateAction?: ReactNode;\n\n  // Pagination\n  pagination?: {\n    page: number;\n    pageSize: number;\n    total: number;\n    onPageChange: (page: number) => void;\n    onPageSizeChange: (size: number) => void;\n    pageSizeOptions?: number[];\n  };\n\n  // Filters\n  filters?: {\n    config: FilterConfig[];\n    onFilter: (filters: Record<string, FilterValue>) => void;\n    initialValues?: Record<string, FilterValue>;\n  };\n\n  // Selection\n  selectable?: boolean;\n  selectedRows?: string[];\n  onSelectionChange?: (selected: string[]) => void;\n  rowId?: (row: T) => string;\n\n  // Actions\n  actions?: (row: T) => TableAction<T>[];\n\n  // Row click callback\n  onRowClick?: (row: T) => void;\n\n  // Pagination mode\n  paginationMode?: \"client\" | \"server\" | \"auto\";\n  defaultPageSize?: number;\n\n  // Column resizing\n  resizable?: boolean;\n  columnWidths?: Record<string, number>;\n  onColumnResize?: (columnKey: string, width: number) => void;\n\n  // Virtual scrolling\n  virtualScrolling?: boolean;\n  virtualScrollingOptions?: {\n    itemHeight?: number;\n    containerHeight?: number;\n    overscan?: number;\n  };\n\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n\n  children?: never; // Simplified API doesn't accept children\n}\n\n// API Declarativa Props (compound components)\ninterface DeclarativeTableProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends Omit<TableProviderProps<T>, \"children\"> {\n  children: ReactNode; // Declarative API requires children\n}\n\ntype TableProps<T extends Record<string, unknown> = Record<string, unknown>> =\n  | SimplifiedTableProps<T>\n  | DeclarativeTableProps<T>;\n\n/**\n * Table Component\n *\n * A comprehensive table component with sorting, pagination, filters, selection, and actions.\n * Supports both simplified API (props-based) and declarative API (compound components).\n *\n * @example\n * ```tsx\n * // Simplified API\n * <Table\n *   columns={columns}\n *   data={data}\n *   pagination={{ page, pageSize, total, onPageChange }}\n * />\n *\n * // Declarative API\n * <Table columns={columns} data={data}>\n *   <Table.Filters />\n *   <Table.Header />\n *   <Table.Body />\n *   <Table.Pagination />\n * </Table>\n * ```\n */\nfunction TableComponent<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>(props: TableProps<T>) {\n  const {\n    className = \"\",\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    ...restProps\n  } = props as SimplifiedTableProps<T> & DeclarativeTableProps<T>;\n  const hasChildren = \"children\" in props && props.children !== undefined;\n\n  // Convert simplified API props to provider props.\n  // The two double-casts below are safe: `restProps` originates from the\n  // same TableProps<T> union and convertSimplifiedToProviderProps' return\n  // mirrors TableProviderProps's shape — but TS cannot prove either via\n  // structural narrowing, so we assert the contract explicitly.\n  const providerProps: TableProviderProps<T> = hasChildren\n    ? (restProps as unknown as TableProviderProps<T>)\n    : (convertSimplifiedToProviderProps(\n        restProps as SimplifiedTableProps<T>,\n      ) as unknown as TableProviderProps<T>);\n\n  // If children are provided, use declarative API\n  if (hasChildren) {\n    return (\n      <div\n        className={`bg-surface-base shadow ${getRadiusClass(\"lg\")} overflow-hidden ${className}`}\n      >\n        <TableProvider {...providerProps}>{props.children}</TableProvider>\n      </div>\n    );\n  }\n\n  // Otherwise, use simplified API with default structure\n  return (\n    <div\n      className={`bg-surface-base shadow ${getRadiusClass(\"lg\")} overflow-hidden ${className}`}\n    >\n      <TableProvider {...providerProps}>\n        {providerProps.filters && providerProps.filters.length > 0 && (\n          <TableFilters />\n        )}\n        <div className=\"overflow-x-auto\">\n          <table\n            className=\"min-w-full divide-y divide-line-default\"\n            role=\"table\"\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            aria-rowcount={providerProps.total || providerProps.data.length}\n            aria-colcount={\n              providerProps.columns.length +\n              (providerProps.selectable ? 1 : 0) +\n              (providerProps.actions ? 1 : 0)\n            }\n          >\n            <TableHeader />\n            <TableBody />\n          </table>\n        </div>\n        {/* Show pagination - TablePagination component will decide if it should render based on totalPages */}\n        <TablePagination />\n      </TableProvider>\n    </div>\n  );\n}\n\n// Helper to convert simplified API props to provider props\nfunction convertSimplifiedToProviderProps<T extends Record<string, unknown>>(\n  props: SimplifiedTableProps<T>,\n): TableProviderProps<T> {\n  const {\n    columns,\n    data,\n    loading,\n    onSort,\n    sortColumn,\n    sortDirection,\n    emptyMessage,\n    emptyStateTitle,\n    emptyStateMessage,\n    emptyStateIllustration,\n    emptyStateAction,\n    pagination,\n    filters,\n    selectable,\n    selectedRows,\n    onSelectionChange,\n    rowId,\n    actions,\n    onRowClick,\n    paginationMode,\n    defaultPageSize,\n    resizable,\n    columnWidths,\n    onColumnResize,\n    virtualScrolling,\n    virtualScrollingOptions,\n  } = props;\n\n  // Determine pagination mode\n  let mode: \"client\" | \"server\" | \"auto\" = paginationMode || \"auto\";\n  if (mode === \"auto\") {\n    // pagination.onPageChange is required by the type, so its presence\n    // is implied by `pagination` itself.\n    mode = pagination && pagination.total !== undefined ? \"server\" : \"client\";\n  }\n\n  return {\n    columns,\n    data,\n    loading,\n    paginationMode: mode,\n    page: pagination?.page,\n    pageSize: pagination?.pageSize,\n    total: pagination?.total,\n    onPageChange: pagination?.onPageChange,\n    onPageSizeChange: pagination?.onPageSizeChange,\n    defaultPageSize: defaultPageSize || pagination?.pageSize || 10,\n    pageSizeOptions: pagination?.pageSizeOptions,\n    sortColumn,\n    sortDirection,\n    onSort,\n    filters: filters?.config,\n    filterValues: filters?.initialValues,\n    onFilter: filters?.onFilter,\n    initialFilterValues: filters?.initialValues,\n    selectable,\n    selectedRows,\n    onSelectionChange,\n    rowId,\n    actions,\n    onRowClick,\n    emptyMessage,\n    emptyStateTitle,\n    emptyStateMessage,\n    emptyStateIllustration,\n    emptyStateAction,\n    resizable,\n    columnWidths,\n    onColumnResize,\n    virtualScrolling,\n    virtualScrollingOptions,\n    children: <></>, // Placeholder, will be overridden by default structure\n  };\n}\n\n// Compound Components\nTableComponent.Header = TableHeader;\nTableComponent.HeaderRow = TableHeaderRow;\nTableComponent.HeaderCell = TableHeaderCell;\nTableComponent.Body = TableBody;\nTableComponent.Row = TableRow;\nTableComponent.Cell = TableCell;\nTableComponent.Filters = TableFilters;\nTableComponent.Pagination = TablePagination;\nTableComponent.EmptyState = TableEmptyState;\nTableComponent.Actions = TableActions;\n\nexport default TableComponent;\n"],"names":["TableComponent","props","_a","className","ariaLabel","ariaLabelledBy","restProps","__objRest","hasChildren","providerProps","convertSimplifiedToProviderProps","jsx","getRadiusClass","TableProvider","__spreadProps","__spreadValues","jsxs","TableFilters","TableHeader","TableBody","TablePagination","columns","data","loading","onSort","sortColumn","sortDirection","emptyMessage","emptyStateTitle","emptyStateMessage","emptyStateIllustration","emptyStateAction","pagination","filters","selectable","selectedRows","onSelectionChange","rowId","actions","onRowClick","paginationMode","defaultPageSize","resizable","columnWidths","onColumnResize","virtualScrolling","virtualScrollingOptions","mode","Fragment","TableHeaderRow","TableHeaderCell","TableRow","TableCell","TableEmptyState","TableActions"],"mappings":"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"}

package/dist/granular/ui/components/Table/TableActions/TableActions.js

@@ -0,0 +1,67 @@
+"use client";
+var h = Object.defineProperty, u = Object.defineProperties;
+var w = Object.getOwnPropertyDescriptors;
+var l = Object.getOwnPropertySymbols;
+var m = Object.prototype.hasOwnProperty, c = Object.prototype.propertyIsEnumerable;
+var n = (e, r, i) => r in e ? h(e, r, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[r] = i, d = (e, r) => {
+  for (var i in r || (r = {}))
+    m.call(r, i) && n(e, i, r[i]);
+  if (l)
+    for (var i of l(r))
+      c.call(r, i) && n(e, i, r[i]);
+  return e;
+}, p = (e, r) => u(e, w(r));
+var f = (e, r) => {
+  var i = {};
+  for (var a in e)
+    m.call(e, a) && r.indexOf(a) < 0 && (i[a] = e[a]);
+  if (e != null && l)
+    for (var a of l(e))
+      r.indexOf(a) < 0 && c.call(e, a) && (i[a] = e[a]);
+  return i;
+};
+import { jsx as t } from "react/jsx-runtime";
+import v from "../../Dropdown/Dropdown.js";
+import { MoreVertical as x } from "lucide-react";
+import { getSpacingClass as C } from "../../../tokens/spacing.js";
+import { Button as N } from "../../../primitives/Button/Button.js";
+function I(k) {
+  var s = k, {
+    actions: e,
+    row: r,
+    align: i = "right",
+    className: a = ""
+  } = s, b = f(s, [
+    "actions",
+    "row",
+    "align",
+    "className"
+  ]);
+  const g = e.map((o) => ({
+    label: o.label,
+    onClick: () => o.onClick(r),
+    variant: o.variant,
+    disabled: o.disabled
+  }));
+  return /* @__PURE__ */ t("div", p(d({ className: `inline-flex ${a}` }, b), { children: /* @__PURE__ */ t(
+    v,
+    {
+      trigger: /* @__PURE__ */ t(
+        N,
+        {
+          variant: "ghost",
+          size: "sm",
+          "aria-label": "Row actions",
+          className: `h-8 w-8 ${C("none", "p")}`,
+          children: /* @__PURE__ */ t(x, { className: "h-4 w-4" })
+        }
+      ),
+      items: g,
+      align: i
+    }
+  ) }));
+}
+export {
+  I as default
+};
+//# sourceMappingURL=TableActions.js.map

package/dist/granular/ui/components/Table/TableActions/TableActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableActions.js","sources":["../../../../../../src/ui/components/Table/TableActions/TableActions.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport Dropdown from \"../../../components/Dropdown/Dropdown\";\nimport { Button } from \"../../../primitives\";\nimport { MoreVertical } from \"lucide-react\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface TableAction<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> {\n  label: string;\n  onClick: (row: T) => void;\n  variant?: \"default\" | \"danger\";\n  disabled?: boolean;\n  icon?: React.ReactNode;\n}\n\nexport interface TableActionsProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends HTMLAttributes<HTMLDivElement> {\n  actions: TableAction<T>[];\n  row: T;\n  align?: \"left\" | \"right\";\n}\n\n/**\n * TableActions Component\n *\n * Dropdown menu for row actions in tables.\n * Follows Atomic Design principles as a Molecule component.\n *\n * @example\n * ```tsx\n * <TableActions\n *   row={rowData}\n *   actions={[\n *     { label: 'Edit', onClick: (row) => handleEdit(row) },\n *     { label: 'Delete', onClick: (row) => handleDelete(row), variant: 'danger' },\n *   ]}\n * />\n * ```\n */\nexport default function TableActions<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>({\n  actions,\n  row,\n  align = \"right\",\n  className = \"\",\n  ...props\n}: TableActionsProps<T>) {\n  const dropdownItems = actions.map((action) => ({\n    label: action.label,\n    onClick: () => action.onClick(row),\n    variant: action.variant,\n    disabled: action.disabled,\n  }));\n\n  return (\n    <div className={`inline-flex ${className}`} {...props}>\n      <Dropdown\n        trigger={\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            aria-label=\"Row actions\"\n            className={`h-8 w-8 ${getSpacingClass(\"none\", \"p\")}`}\n          >\n            <MoreVertical className=\"h-4 w-4\" />\n          </Button>\n        }\n        items={dropdownItems}\n        align={align}\n      />\n    </div>\n  );\n}\n"],"names":["TableActions","_a","_b","actions","row","align","className","props","__objRest","dropdownItems","action","__spreadProps","__spreadValues","jsx","Dropdown","Button","getSpacingClass","MoreVertical"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,SAAwBA,EAEtBC,GAMuB;AANvB,MAAAC,IAAAD,GACA;AAAA,aAAAE;AAAA,IACA,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,WAAAC,IAAY;AAAA,MAJZJ,GAKGK,IAAAC,EALHN,GAKG;AAAA,IAJH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAMO,IAAgBN,EAAQ,IAAI,CAACO,OAAY;AAAA,IAC7C,OAAOA,EAAO;AAAA,IACd,SAAS,MAAMA,EAAO,QAAQN,CAAG;AAAA,IACjC,SAASM,EAAO;AAAA,IAChB,UAAUA,EAAO;AAAA,EAAA,EACjB;AAEF,2BACG,OAAAC,EAAAC,EAAA,EAAI,WAAW,eAAeN,CAAS,MAAQC,IAA/C,EACC,UAAA,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SACE,gBAAAD;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,cAAW;AAAA,UACX,WAAW,WAAWC,EAAgB,QAAQ,GAAG,CAAC;AAAA,UAElD,UAAA,gBAAAH,EAACI,GAAA,EAAa,WAAU,UAAA,CAAU;AAAA,QAAA;AAAA,MAAA;AAAA,MAGtC,OAAOR;AAAA,MACP,OAAAJ;AAAA,IAAA;AAAA,EAAA,IAEJ;AAEJ;"}

package/dist/granular/ui/components/Table/TableActions.js

@@ -0,0 +1,44 @@
+"use client";
+var p = Object.defineProperty;
+var e = Object.getOwnPropertySymbols;
+var u = Object.prototype.hasOwnProperty, a = Object.prototype.propertyIsEnumerable;
+var c = (t, o, n) => o in t ? p(t, o, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[o] = n, f = (t, o) => {
+  for (var n in o || (o = {}))
+    u.call(o, n) && c(t, n, o[n]);
+  if (e)
+    for (var n of e(o))
+      a.call(o, n) && c(t, n, o[n]);
+  return t;
+};
+var m = (t, o) => {
+  var n = {};
+  for (var r in t)
+    u.call(t, r) && o.indexOf(r) < 0 && (n[r] = t[r]);
+  if (t != null && e)
+    for (var r of e(t))
+      o.indexOf(r) < 0 && a.call(t, r) && (n[r] = t[r]);
+  return n;
+};
+import { jsx as b } from "react/jsx-runtime";
+import { useTableContext as x } from "./TableContext.js";
+import A from "./TableActions/TableActions.js";
+function C(T) {
+  var i = T, { row: t, align: o = "right", className: n = "" } = i, r = m(i, ["row", "align", "className"]);
+  const { actions: s } = x();
+  if (!s)
+    return null;
+  const l = s(t);
+  return l.length === 0 ? null : /* @__PURE__ */ b(
+    A,
+    f({
+      row: t,
+      actions: l,
+      align: o,
+      className: n
+    }, r)
+  );
+}
+export {
+  C as default
+};
+//# sourceMappingURL=TableActions.js.map

package/dist/granular/ui/components/Table/TableActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableActions.js","sources":["../../../../../src/ui/components/Table/TableActions.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport { useTableContext } from \"./TableContext\";\nimport TableActionsComponent from \"./TableActions/TableActions\";\n\nexport interface TableActionsProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends HTMLAttributes<HTMLDivElement> {\n  row: T;\n  align?: \"left\" | \"right\";\n}\n\n/**\n * TableActions Component\n *\n * Renders action dropdown menu for a table row.\n * Uses actions configuration from Table context.\n * Must be used within a Table component.\n */\nexport default function TableActions<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>({ row, align = \"right\", className = \"\", ...props }: TableActionsProps<T>) {\n  const { actions } = useTableContext<T>();\n\n  if (!actions) {\n    return null;\n  }\n\n  const rowActions = actions(row);\n\n  if (rowActions.length === 0) {\n    return null;\n  }\n\n  return (\n    <TableActionsComponent\n      row={row}\n      actions={rowActions}\n      align={align}\n      className={className}\n      {...props}\n    />\n  );\n}\n"],"names":["TableActions","_a","_b","row","align","className","props","__objRest","actions","useTableContext","rowActions","jsx","TableActionsComponent","__spreadValues"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAoBA,SAAwBA,EAEtBC,GAA0E;AAA1E,MAAAC,IAAAD,GAAE,OAAAE,GAAK,OAAAC,IAAQ,SAAS,WAAAC,IAAY,OAApCH,GAA2CI,IAAAC,EAA3CL,GAA2C,CAAzC,OAAK,SAAiB;AACxB,QAAM,EAAE,SAAAM,EAAA,IAAYC,EAAA;AAEpB,MAAI,CAACD;AACH,WAAO;AAGT,QAAME,IAAaF,EAAQL,CAAG;AAE9B,SAAIO,EAAW,WAAW,IACjB,OAIP,gBAAAC;AAAA,IAACC;AAAAA,IAAAC,EAAA;AAAA,MACC,KAAAV;AAAA,MACA,SAASO;AAAA,MACT,OAAAN;AAAA,MACA,WAAAC;AAAA,OACIC;AAAA,EAAA;AAGV;"}

package/dist/granular/ui/components/Table/TableBody.js

@@ -0,0 +1,134 @@
+"use client";
+var j = Object.defineProperty, A = Object.defineProperties;
+var M = Object.getOwnPropertyDescriptors;
+var f = Object.getOwnPropertySymbols;
+var I = Object.prototype.hasOwnProperty, w = Object.prototype.propertyIsEnumerable;
+var x = (e, t, r) => t in e ? j(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, s = (e, t) => {
+  for (var r in t || (t = {}))
+    I.call(t, r) && x(e, r, t[r]);
+  if (f)
+    for (var r of f(t))
+      w.call(t, r) && x(e, r, t[r]);
+  return e;
+}, u = (e, t) => A(e, M(t));
+var $ = (e, t) => {
+  var r = {};
+  for (var n in e)
+    I.call(e, n) && t.indexOf(n) < 0 && (r[n] = e[n]);
+  if (e != null && f)
+    for (var n of f(e))
+      t.indexOf(n) < 0 && w.call(e, n) && (r[n] = e[n]);
+  return r;
+};
+import { jsx as a, jsxs as _, Fragment as k } from "react/jsx-runtime";
+import { useMemo as B } from "react";
+import { useTableContext as D } from "./TableContext.js";
+import { getSpacingClass as g } from "../../tokens/spacing.js";
+import H from "./TableRow.js";
+import E from "./TableEmptyState.js";
+import { useVirtualScrolling as F } from "./useVirtualScrolling.js";
+import V from "../../primitives/Skeleton/Skeleton.js";
+function X(n) {
+  var p = n, {
+    children: e,
+    className: t = ""
+  } = p, r = $(p, [
+    "children",
+    "className"
+  ]);
+  var v, y;
+  const {
+    paginatedData: m,
+    loading: T,
+    columns: N,
+    selectable: S,
+    actions: C,
+    virtualScrolling: c,
+    virtualScrollingOptions: o
+  } = D(), h = N.length + (S ? 1 : 0) + (C ? 1 : 0), d = F(m, {
+    itemHeight: (o == null ? void 0 : o.itemHeight) || 50,
+    containerHeight: o == null ? void 0 : o.containerHeight,
+    overscan: (o == null ? void 0 : o.overscan) || 5,
+    enabled: c || !1
+  }), b = B(() => c && d.virtualItems.length > 0 ? d.virtualItems.map((i) => ({
+    row: m[i.index],
+    index: i.index
+  })).filter((i) => i.row !== void 0) : m.map((i, l) => ({ row: i, index: l })), [c, d.virtualItems, m]);
+  return T ? /* @__PURE__ */ a(
+    "tbody",
+    u(s({
+      className: `bg-surface-base divide-y divide-line-default ${t}`
+    }, r), {
+      children: Array.from({ length: 5 }).map((i, l) => /* @__PURE__ */ a("tr", { children: Array.from({ length: h }).map((q, R) => /* @__PURE__ */ a(
+        "td",
+        {
+          className: `${g("lg", "px")} ${g("base", "py")}`,
+          children: /* @__PURE__ */ a(V, { className: "h-4 w-full" })
+        },
+        R
+      )) }, l))
+    })
+  ) : m.length === 0 ? /* @__PURE__ */ a(
+    "tbody",
+    u(s({
+      className: `bg-surface-base divide-y divide-line-default ${t}`
+    }, r), {
+      children: /* @__PURE__ */ a("tr", { children: /* @__PURE__ */ a(
+        "td",
+        {
+          colSpan: h,
+          className: `${g("lg", "px")} ${g("3xl", "py")}`,
+          children: /* @__PURE__ */ a(E, {})
+        }
+      ) })
+    })
+  ) : typeof e == "function" ? /* @__PURE__ */ a(
+    "tbody",
+    u(s({
+      className: `bg-surface-base divide-y divide-line-default ${t}`
+    }, r), {
+      children: m.map((i, l) => e(i, l))
+    })
+  ) : /* @__PURE__ */ a(
+    "tbody",
+    u(s({
+      className: `bg-surface-base divide-y divide-line-default ${t}`,
+      role: "rowgroup"
+    }, r), {
+      children: c && d.virtualItems.length > 0 && b.length > 0 ? (
+        // Virtual scrolling: render with spacer rows
+        /* @__PURE__ */ _(k, { children: [
+          ((v = d.virtualItems[0]) == null ? void 0 : v.start) > 0 && /* @__PURE__ */ a(
+            "tr",
+            {
+              style: { height: d.virtualItems[0].start },
+              "aria-hidden": "true",
+              children: /* @__PURE__ */ a("td", { colSpan: h })
+            }
+          ),
+          b.map(({ row: i, index: l }) => /* @__PURE__ */ a(H, { row: i, rowIndex: l }, l)),
+          d.virtualItems.length > 0 && /* @__PURE__ */ a(
+            "tr",
+            {
+              style: {
+                height: Math.max(
+                  0,
+                  d.totalHeight - (((y = d.virtualItems[d.virtualItems.length - 1]) == null ? void 0 : y.end) || 0)
+                )
+              },
+              "aria-hidden": "true",
+              children: /* @__PURE__ */ a("td", { colSpan: h })
+            }
+          )
+        ] })
+      ) : (
+        // Normal rendering
+        b.map(({ row: i, index: l }) => /* @__PURE__ */ a(H, { row: i, rowIndex: l }, l))
+      )
+    })
+  );
+}
+export {
+  X as default
+};
+//# sourceMappingURL=TableBody.js.map

package/dist/granular/ui/components/Table/TableBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableBody.js","sources":["../../../../../src/ui/components/Table/TableBody.tsx"],"sourcesContent":["\"use client\";\n\nimport { useMemo, type HTMLAttributes, type ReactNode } from \"react\";\nimport { useTableContext } from \"./TableContext\";\nimport { Skeleton } from \"../../primitives\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport TableRow from \"./TableRow\";\nimport TableEmptyState from \"./TableEmptyState\";\nimport { useVirtualScrolling } from \"./useVirtualScrolling\";\n\nexport interface TableBodyProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends Omit<HTMLAttributes<HTMLTableSectionElement>, \"children\"> {\n  children?: (row: T, index: number) => ReactNode;\n  className?: string;\n}\n\n/**\n * TableBody Component\n *\n * Renders the table body (tbody) with rows.\n * Can render loading skeleton, empty state, or data rows.\n * Must be used within a Table component.\n */\nexport default function TableBody({\n  children,\n  className = \"\",\n  ...props\n}: TableBodyProps) {\n  const {\n    paginatedData,\n    loading,\n    columns,\n    selectable,\n    actions,\n    virtualScrolling,\n    virtualScrollingOptions,\n  } = useTableContext();\n\n  // Calculate total columns for colspan\n  const totalColumns =\n    columns.length + (selectable ? 1 : 0) + (actions ? 1 : 0);\n\n  // Virtual scrolling\n  const virtualScrollingResult = useVirtualScrolling(paginatedData, {\n    itemHeight: virtualScrollingOptions?.itemHeight || 50,\n    containerHeight: virtualScrollingOptions?.containerHeight,\n    overscan: virtualScrollingOptions?.overscan || 5,\n    enabled: virtualScrolling || false,\n  });\n\n  const rowsToRender = useMemo(() => {\n    if (virtualScrolling && virtualScrollingResult.virtualItems.length > 0) {\n      return virtualScrollingResult.virtualItems\n        .map((item) => ({\n          row: paginatedData[item.index],\n          index: item.index,\n        }))\n        .filter((item) => item.row !== undefined);\n    }\n    return paginatedData.map((row, index) => ({ row, index }));\n  }, [virtualScrolling, virtualScrollingResult.virtualItems, paginatedData]);\n\n  if (loading) {\n    return (\n      <tbody\n        className={`bg-surface-base divide-y divide-line-default ${className}`}\n        {...props}\n      >\n        {Array.from({ length: 5 }).map((_, index) => (\n          <tr key={index}>\n            {Array.from({ length: totalColumns }).map((_, colIndex) => (\n              <td\n                key={colIndex}\n                className={`${getSpacingClass(\"lg\", \"px\")} ${getSpacingClass(\"base\", \"py\")}`}\n              >\n                <Skeleton className=\"h-4 w-full\" />\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    );\n  }\n\n  if (paginatedData.length === 0) {\n    return (\n      <tbody\n        className={`bg-surface-base divide-y divide-line-default ${className}`}\n        {...props}\n      >\n        <tr>\n          <td\n            colSpan={totalColumns}\n            className={`${getSpacingClass(\"lg\", \"px\")} ${getSpacingClass(\"3xl\", \"py\")}`}\n          >\n            <TableEmptyState />\n          </td>\n        </tr>\n      </tbody>\n    );\n  }\n\n  // If children is a render function, use it\n  if (typeof children === \"function\") {\n    return (\n      <tbody\n        className={`bg-surface-base divide-y divide-line-default ${className}`}\n        {...props}\n      >\n        {paginatedData.map((row, index) => children(row, index))}\n      </tbody>\n    );\n  }\n\n  // Default: render TableRow for each data item\n  return (\n    <tbody\n      className={`bg-surface-base divide-y divide-line-default ${className}`}\n      role=\"rowgroup\"\n      {...props}\n    >\n      {virtualScrolling &&\n      virtualScrollingResult.virtualItems.length > 0 &&\n      rowsToRender.length > 0 ? (\n        // Virtual scrolling: render with spacer rows\n        <>\n          {virtualScrollingResult.virtualItems[0]?.start > 0 && (\n            <tr\n              style={{ height: virtualScrollingResult.virtualItems[0].start }}\n              aria-hidden=\"true\"\n            >\n              <td colSpan={totalColumns} />\n            </tr>\n          )}\n          {rowsToRender.map(({ row, index }) => (\n            <TableRow key={index} row={row} rowIndex={index} />\n          ))}\n          {virtualScrollingResult.virtualItems.length > 0 && (\n            <tr\n              style={{\n                height: Math.max(\n                  0,\n                  virtualScrollingResult.totalHeight -\n                    (virtualScrollingResult.virtualItems[\n                      virtualScrollingResult.virtualItems.length - 1\n                    ]?.end || 0),\n                ),\n              }}\n              aria-hidden=\"true\"\n            >\n              <td colSpan={totalColumns} />\n            </tr>\n          )}\n        </>\n      ) : (\n        // Normal rendering\n        rowsToRender.map(({ row, index }) => (\n          <TableRow key={index} row={row} rowIndex={index} />\n        ))\n      )}\n    </tbody>\n  );\n}\n"],"names":["TableBody","_a","_b","children","className","props","__objRest","paginatedData","loading","columns","selectable","actions","virtualScrolling","virtualScrollingOptions","useTableContext","totalColumns","virtualScrollingResult","useVirtualScrolling","rowsToRender","useMemo","item","row","index","jsx","__spreadProps","__spreadValues","_","colIndex","getSpacingClass","Skeleton","TableEmptyState","jsxs","Fragment","TableRow"],"mappings":"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"}

package/dist/granular/ui/components/Table/TableCell.js

@@ -0,0 +1,40 @@
+"use client";
+var c = Object.defineProperty, h = Object.defineProperties;
+var m = Object.getOwnPropertyDescriptors;
+var d = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, l = Object.prototype.propertyIsEnumerable;
+var s = (e, t, i) => t in e ? c(e, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[t] = i, f = (e, t) => {
+  for (var i in t || (t = {}))
+    p.call(t, i) && s(e, i, t[i]);
+  if (d)
+    for (var i of d(t))
+      l.call(t, i) && s(e, i, t[i]);
+  return e;
+}, g = (e, t) => h(e, m(t));
+var x = (e, t) => {
+  var i = {};
+  for (var r in e)
+    p.call(e, r) && t.indexOf(r) < 0 && (i[r] = e[r]);
+  if (e != null && d)
+    for (var r of d(e))
+      t.indexOf(r) < 0 && l.call(e, r) && (i[r] = e[r]);
+  return i;
+};
+import { jsx as o } from "react/jsx-runtime";
+import { getSpacingClass as b } from "../../tokens/spacing.js";
+function S(y) {
+  var n = y, { column: e, row: t, className: i = "" } = n, r = x(n, ["column", "row", "className"]);
+  const a = e.key in t ? t[e.key] : void 0;
+  return /* @__PURE__ */ o(
+    "td",
+    g(f({
+      className: `${b("lg", "px")} ${b("base", "py")} whitespace-nowrap text-sm text-fg-primary ${e.hiddenOnMobile ? "hidden md:table-cell" : ""} ${i}`
+    }, r), {
+      children: e.render ? e.render(a, t) : String(a != null ? a : "")
+    })
+  );
+}
+export {
+  S as default
+};
+//# sourceMappingURL=TableCell.js.map

package/dist/granular/ui/components/Table/TableCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCell.js","sources":["../../../../../src/ui/components/Table/TableCell.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport type { TableColumn } from \"./TableTypes\";\n\nexport interface TableCellProps<\n  T = unknown,\n> extends HTMLAttributes<HTMLTableCellElement> {\n  column: TableColumn<T>;\n  row: T;\n}\n\n/**\n * TableCell Component\n *\n * Renders a table cell (td) for a column.\n * Uses column.render if available, otherwise renders the raw value.\n * Must be used within a Table component.\n */\nexport default function TableCell<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>({ column, row, className = \"\", ...props }: TableCellProps<T>) {\n  const value = column.key in row ? row[column.key as keyof T] : undefined;\n\n  return (\n    <td\n      className={`${getSpacingClass(\"lg\", \"px\")} ${getSpacingClass(\"base\", \"py\")} whitespace-nowrap text-sm text-fg-primary ${\n        column.hiddenOnMobile ? \"hidden md:table-cell\" : \"\"\n      } ${className}`}\n      {...props}\n    >\n      {column.render ? column.render(value, row) : String(value ?? \"\")}\n    </td>\n  );\n}\n"],"names":["TableCell","_a","_b","column","row","className","props","__objRest","value","jsx","__spreadProps","__spreadValues","getSpacingClass"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAoBA,SAAwBA,EAEtBC,GAA8D;AAA9D,MAAAC,IAAAD,GAAE,UAAAE,GAAQ,KAAAC,GAAK,WAAAC,IAAY,OAA3BH,GAAkCI,IAAAC,EAAlCL,GAAkC,CAAhC,UAAQ,OAAK;AACf,QAAMM,IAAQL,EAAO,OAAOC,IAAMA,EAAID,EAAO,GAAc,IAAI;AAE/D,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAAC,EAAAC,EAAA;AAAA,MACC,WAAW,GAAGC,EAAgB,MAAM,IAAI,CAAC,IAAIA,EAAgB,QAAQ,IAAI,CAAC,8CACxET,EAAO,iBAAiB,yBAAyB,EACnD,IAAIE,CAAS;AAAA,OACTC,IAJL;AAAA,MAME,UAAAH,EAAO,SAASA,EAAO,OAAOK,GAAOJ,CAAG,IAAI,OAAOI,KAAA,OAAAA,IAAS,EAAE;AAAA,IAAA;AAAA,EAAA;AAGrE;"}

package/dist/granular/ui/components/Table/TableContext.js

@@ -0,0 +1,19 @@
+"use client";
+import { createGenericContext as t } from "../../hooks/createGenericContext.js";
+const e = t({
+  displayName: "TableContext",
+  errorMessage: "useTableContext must be used within a Table component"
+}), o = e.Context, r = e.Provider;
+function a() {
+  return e.useContextRequired();
+}
+function s() {
+  return e.useContextOptional();
+}
+export {
+  o as TableContext,
+  r as TableContextProvider,
+  a as useTableContext,
+  s as useTableContextOptional
+};
+//# sourceMappingURL=TableContext.js.map

package/dist/granular/ui/components/Table/TableContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableContext.js","sources":["../../../../../src/ui/components/Table/TableContext.tsx"],"sourcesContent":["\"use client\";\n\n/* eslint-disable react-refresh/only-export-components */\nimport type { ReactNode } from \"react\";\nimport { createGenericContext } from \"../../hooks/createGenericContext\";\nimport type { TableColumn } from \"./TableTypes\";\nimport type { FilterConfig } from \"./TableFilters/TableFilters\";\nimport type { TableAction } from \"./TableActions/TableActions\";\n\nexport type PaginationMode = \"client\" | \"server\" | \"auto\";\n\nexport interface PaginationState {\n  page: number;\n  pageSize: number;\n  total: number;\n  totalPages: number;\n}\n\nexport interface SortState {\n  column: string;\n  direction: \"asc\" | \"desc\";\n}\n\nimport type { FilterValue } from \"./TableFilters/TableFilters\";\n\nexport interface FilterState {\n  values: Record<string, FilterValue>;\n  config: FilterConfig[];\n}\n\nexport interface SelectionState {\n  selectedRows: string[];\n  isAllSelected: boolean;\n  isIndeterminate: boolean;\n}\n\nexport interface TableContextValue<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> {\n  // Data\n  columns: TableColumn<T>[];\n  data: T[];\n  paginatedData: T[];\n  loading: boolean;\n\n  // State\n  paginationState: PaginationState;\n  sortState: SortState;\n  filterState: FilterState;\n  selectionState: SelectionState;\n\n  // Configuration\n  paginationMode: PaginationMode;\n  selectable: boolean;\n  rowId?: (row: T) => string;\n  actions?: (row: T) => TableAction<T>[];\n  resizable?: boolean;\n  columnWidths?: Record<string, number>;\n  virtualScrolling?: boolean;\n  virtualScrollingOptions?: {\n    itemHeight?: number;\n    containerHeight?: number;\n    overscan?: number;\n  };\n\n  // Empty state\n  emptyMessage?: string;\n  emptyStateTitle?: string;\n  emptyStateMessage?: string;\n  emptyStateIllustration?: ReactNode;\n  emptyStateAction?: ReactNode;\n\n  // Methods\n  setPage: (page: number) => void;\n  setPageSize: (size: number) => void;\n  setSorting: (column: string, direction: \"asc\" | \"desc\") => void;\n  setFilters: (filters: Record<string, FilterValue>) => void;\n  setSelection: (selected: string[]) => void;\n  toggleRowSelection: (rowId: string) => void;\n  toggleSelectAll: () => void;\n  getRowId: (row: T, index: number) => string;\n  setColumnWidth?: (columnKey: string, width: number) => void;\n\n  // Callbacks (for controlled components)\n  onPageChange?: (page: number) => void;\n  onPageSizeChange?: (size: number) => void;\n  onSort?: (column: string, direction: \"asc\" | \"desc\") => void;\n  onFilter?: (filters: Record<string, FilterValue>) => void;\n  onSelectionChange?: (selected: string[]) => void;\n  onRowClick?: (row: T) => void;\n  onColumnResize?: (columnKey: string, width: number) => void;\n}\n\nconst tableContext = createGenericContext<TableContextValue>({\n  displayName: \"TableContext\",\n  errorMessage: \"useTableContext must be used within a Table component\",\n});\n\n/**\n * Raw React Context object. Exposed so `useContextSelector(TableContext, …)`\n * keeps working (see hooks/useContextSelector.ts, which cites Table as\n * its canonical selector consumer). Prefer the typed hooks below for\n * direct reads.\n */\nexport const TableContext = tableContext.Context;\n\n/**\n * Internal Provider — consumed by `TableProvider.tsx` only. Not\n * re-exported from `Table/index.ts`; keeps the public surface unchanged.\n */\nexport const TableContextProvider = tableContext.Provider;\n\n/**\n * Hook to access Table context\n *\n * @throws Error if used outside of Table component\n */\nexport function useTableContext<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>(): TableContextValue<T> {\n  return tableContext.useContextRequired<TableContextValue<T>>();\n}\n\n/**\n * Hook to access Table context (optional, returns undefined if not in Table)\n */\nexport function useTableContextOptional<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>(): TableContextValue<T> | undefined {\n  return tableContext.useContextOptional<TableContextValue<T>>();\n}\n"],"names":["tableContext","createGenericContext","TableContext","TableContextProvider","useTableContext","useTableContextOptional"],"mappings":";;AA6FA,MAAMA,IAAeC,EAAwC;AAAA,EAC3D,aAAa;AAAA,EACb,cAAc;AAChB,CAAC,GAQYC,IAAeF,EAAa,SAM5BG,IAAuBH,EAAa;AAO1C,SAASI,IAEU;AACxB,SAAOJ,EAAa,mBAAA;AACtB;AAKO,SAASK,IAEsB;AACpC,SAAOL,EAAa,mBAAA;AACtB;"}

package/dist/granular/ui/components/Table/TableEmptyState.js

@@ -0,0 +1,62 @@
+"use client";
+var x = Object.defineProperty, S = Object.defineProperties;
+var b = Object.getOwnPropertyDescriptors;
+var l = Object.getOwnPropertySymbols;
+var u = Object.prototype.hasOwnProperty, y = Object.prototype.propertyIsEnumerable;
+var p = (t, e, a) => e in t ? x(t, e, { enumerable: !0, configurable: !0, writable: !0, value: a }) : t[e] = a, s = (t, e) => {
+  for (var a in e || (e = {}))
+    u.call(e, a) && p(t, a, e[a]);
+  if (l)
+    for (var a of l(e))
+      y.call(e, a) && p(t, a, e[a]);
+  return t;
+}, n = (t, e) => S(t, b(e));
+var v = (t, e) => {
+  var a = {};
+  for (var i in t)
+    u.call(t, i) && e.indexOf(i) < 0 && (a[i] = t[i]);
+  if (t != null && l)
+    for (var i of l(t))
+      e.indexOf(i) < 0 && y.call(t, i) && (a[i] = t[i]);
+  return a;
+};
+import { jsxs as g, jsx as o } from "react/jsx-runtime";
+import { useTableContext as h } from "./TableContext.js";
+import { getSpacingClass as N } from "../../tokens/spacing.js";
+import j from "../EmptyState/EmptyState.js";
+function $(a) {
+  var i = a, {
+    className: t = ""
+  } = i, e = v(i, [
+    "className"
+  ]);
+  const {
+    emptyMessage: m,
+    emptyStateTitle: c,
+    emptyStateMessage: d,
+    emptyStateIllustration: r,
+    emptyStateAction: f
+  } = h();
+  return c || d || r ? /* @__PURE__ */ g("div", n(s({ className: t }, e), { children: [
+    /* @__PURE__ */ o(
+      j,
+      {
+        title: c || "No data available",
+        message: d || m || "No data available",
+        variant: r ? "withIllustration" : "default",
+        illustration: r
+      }
+    ),
+    f && /* @__PURE__ */ o(
+      "div",
+      {
+        className: `${N("base", "mt")} flex justify-center`,
+        children: f
+      }
+    )
+  ] })) : /* @__PURE__ */ o("div", n(s({ className: `text-center text-fg-secondary ${t}` }, e), { children: m || "No data available" }));
+}
+export {
+  $ as default
+};
+//# sourceMappingURL=TableEmptyState.js.map

package/dist/granular/ui/components/Table/TableEmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableEmptyState.js","sources":["../../../../../src/ui/components/Table/TableEmptyState.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport { useTableContext } from \"./TableContext\";\nimport { EmptyState } from \"../../components\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\n\nexport type TableEmptyStateProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * TableEmptyState Component\n *\n * Renders empty state when table has no data.\n * Uses empty state configuration from Table context.\n * Must be used within a Table component.\n */\nexport default function TableEmptyState({\n  className = \"\",\n  ...props\n}: TableEmptyStateProps) {\n  const {\n    emptyMessage,\n    emptyStateTitle,\n    emptyStateMessage,\n    emptyStateIllustration,\n    emptyStateAction,\n  } = useTableContext();\n\n  if (emptyStateTitle || emptyStateMessage || emptyStateIllustration) {\n    return (\n      <div className={className} {...props}>\n        <EmptyState\n          title={emptyStateTitle || \"No data available\"}\n          message={emptyStateMessage || emptyMessage || \"No data available\"}\n          variant={emptyStateIllustration ? \"withIllustration\" : \"default\"}\n          illustration={emptyStateIllustration}\n        />\n        {emptyStateAction && (\n          <div\n            className={`${getSpacingClass(\"base\", \"mt\")} flex justify-center`}\n          >\n            {emptyStateAction}\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div className={`text-center text-fg-secondary ${className}`} {...props}>\n      {emptyMessage || \"No data available\"}\n    </div>\n  );\n}\n"],"names":["TableEmptyState","_a","_b","className","props","__objRest","emptyMessage","emptyStateTitle","emptyStateMessage","emptyStateIllustration","emptyStateAction","useTableContext","jsxs","__spreadProps","__spreadValues","jsx","EmptyState","getSpacingClass"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA,SAAwBA,EAAgBC,GAGf;AAHe,MAAAC,IAAAD,GACtC;AAAA,eAAAE,IAAY;AAAA,MAD0BD,GAEnCE,IAAAC,EAFmCH,GAEnC;AAAA,IADH;AAAA;AAGA,QAAM;AAAA,IACJ,cAAAI;AAAA,IACA,iBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,kBAAAC;AAAA,EAAA,IACEC,EAAA;AAEJ,SAAIJ,KAAmBC,KAAqBC,IAExC,gBAAAG,EAAC,OAAAC,EAAAC,EAAA,EAAI,WAAAX,KAA0BC,IAA9B,EACC,UAAA;AAAA,IAAA,gBAAAW;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAOT,KAAmB;AAAA,QAC1B,SAASC,KAAqBF,KAAgB;AAAA,QAC9C,SAASG,IAAyB,qBAAqB;AAAA,QACvD,cAAcA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEfC,KACC,gBAAAK;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAGE,EAAgB,QAAQ,IAAI,CAAC;AAAA,QAE1C,UAAAP;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,IAEJ,IAKF,gBAAAK,EAAC,aAAI,WAAW,iCAAiCZ,CAAS,MAAQC,MAC/D,UAAAE,KAAgB,oBAAA,EACnB;AAEJ;"}