@fabio.caffarello/react-design-system 3.7.0 → 3.9.0

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

@@ -0,0 +1,244 @@
+"use client";
+var Zt = Object.defineProperty, $t = Object.defineProperties;
+var bt = Object.getOwnPropertyDescriptors;
+var pt = Object.getOwnPropertySymbols;
+var yt = Object.prototype.hasOwnProperty, Kt = Object.prototype.propertyIsEnumerable;
+var at = (i, r, e) => r in i ? Zt(i, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[r] = e, Dt = (i, r) => {
+  for (var e in r || (r = {}))
+    yt.call(r, e) && at(i, e, r[e]);
+  if (pt)
+    for (var e of pt(r))
+      Kt.call(r, e) && at(i, e, r[e]);
+  return i;
+}, Vt = (i, r) => $t(i, bt(r));
+import { jsx as gt } from "react/jsx-runtime";
+import { useMemo as f, useState as a, useCallback as o } from "react";
+import { TableContextProvider as xt } from "./TableContext.js";
+function Ct({
+  columns: i,
+  data: r,
+  loading: e = !1,
+  paginationMode: Q,
+  page: y,
+  pageSize: U,
+  total: D,
+  onPageChange: l,
+  onPageSizeChange: S,
+  defaultPageSize: mt = 10,
+  pageSizeOptions: Rt,
+  sortColumn: K,
+  sortDirection: It,
+  onSort: d,
+  defaultSortColumn: Wt,
+  defaultSortDirection: kt = "asc",
+  filters: V,
+  filterValues: g,
+  onFilter: m,
+  initialFilterValues: Lt = {},
+  selectable: I = !1,
+  selectedRows: x,
+  onSelectionChange: W,
+  rowId: _,
+  actions: R,
+  emptyMessage: F = "No data available",
+  emptyStateTitle: T,
+  emptyStateMessage: h,
+  emptyStateIllustration: w,
+  emptyStateAction: C,
+  onRowClick: P,
+  resizable: z = !1,
+  columnWidths: tt,
+  onColumnResize: k,
+  virtualScrolling: st,
+  virtualScrollingOptions: rt,
+  children: jt
+}) {
+  const L = f(() => Q || (D !== void 0 && l ? "server" : "client"), [Q, D, l]), X = y !== void 0, [At, Nt] = a(1), [Ot, St] = a(mt), q = X ? y : At, v = U != null ? U : Ot, B = f(() => L === "server" ? D != null ? D : 0 : r.length, [L, D, r.length]), nt = f(() => Math.ceil(B / v), [B, v]), j = K !== void 0, [_t, qt] = a(
+    Wt || ""
+  ), [Bt, Et] = a(kt), A = j ? K : _t, E = j ? It || "asc" : Bt, Y = g !== void 0, [Gt, Ht] = a(Lt), G = Y ? g : Gt, Z = x !== void 0, [Jt, Mt] = a(
+    []
+  ), c = Z ? x : Jt, H = f(() => !V || V.length === 0 ? r : r.filter((t) => V.every((s) => {
+    const n = G[s.key];
+    if (!n || n === "") return !0;
+    const M = t[s.key];
+    return s.type === "text" ? String(M || "").toLowerCase().includes(String(n).toLowerCase()) : String(M) === String(n);
+  })), [r, V, G]), $ = f(() => {
+    if (j && d || !A) return H;
+    const t = [...H];
+    return t.sort((s, n) => {
+      const M = s[A], Yt = n[A], vt = String(M || "").localeCompare(
+        String(Yt || "")
+      );
+      return E === "asc" ? vt : -vt;
+    }), t;
+  }, [H, A, E, d, j]), u = f(() => {
+    if (L === "server")
+      return $;
+    const t = (q - 1) * v, s = t + v;
+    return $.slice(t, s);
+  }, [$, L, q, v]), N = o(
+    (t, s) => {
+      var n;
+      return _ ? _(t) : ((n = t == null ? void 0 : t.id) == null ? void 0 : n.toString()) || s.toString();
+    },
+    [_]
+  ), J = f(() => !I || u.length === 0 ? !1 : u.every((t, s) => {
+    const n = N(t, s);
+    return c.includes(n);
+  }), [I, u, c, N]), et = f(() => {
+    if (!I) return !1;
+    const t = c.length;
+    return t > 0 && t < u.length;
+  }, [I, c.length, u.length]), O = o(
+    (t) => {
+      X ? l == null || l(t) : Nt(t);
+    },
+    [X, l]
+  ), it = o(
+    (t) => {
+      S ? S(t) : St(t), O(1);
+    },
+    [S, O]
+  ), ct = o(
+    (t, s) => {
+      j ? d == null || d(t, s) : (qt(t), Et(s));
+    },
+    [j, d]
+  ), ut = o(
+    (t) => {
+      Y ? m == null || m(t) : Ht(t), O(1);
+    },
+    [Y, m, O]
+  ), p = o(
+    (t) => {
+      Z ? W == null || W(t) : Mt(t);
+    },
+    [Z, W]
+  ), ft = o(
+    (t) => {
+      const s = c.includes(t) ? c.filter((n) => n !== t) : [...c, t];
+      p(s);
+    },
+    [c, p]
+  ), ot = o(() => {
+    if (J)
+      p([]);
+    else {
+      const t = u.map((s, n) => N(s, n));
+      p(t);
+    }
+  }, [J, u, N, p]), [Qt, Ut] = a({}), b = tt !== void 0, lt = b ? tt : Qt, dt = o(
+    (t, s) => {
+      b ? k == null || k(t, s) : Ut((n) => Vt(Dt({}, n), {
+        [t]: s
+      }));
+    },
+    [b, k]
+  ), Xt = f(
+    () => ({
+      columns: i,
+      data: r,
+      paginatedData: u,
+      loading: e,
+      paginationState: {
+        page: q,
+        pageSize: v,
+        total: B,
+        totalPages: nt
+      },
+      sortState: {
+        column: A,
+        direction: E
+      },
+      filterState: {
+        values: G,
+        config: V || []
+      },
+      selectionState: {
+        selectedRows: c,
+        isAllSelected: J,
+        isIndeterminate: et
+      },
+      paginationMode: L,
+      selectable: I,
+      rowId: _,
+      actions: R,
+      resizable: z,
+      columnWidths: lt,
+      virtualScrolling: st,
+      virtualScrollingOptions: rt,
+      emptyMessage: F,
+      emptyStateTitle: T,
+      emptyStateMessage: h,
+      emptyStateIllustration: w,
+      emptyStateAction: C,
+      setPage: O,
+      setPageSize: it,
+      setSorting: ct,
+      setFilters: ut,
+      setSelection: p,
+      toggleRowSelection: ft,
+      toggleSelectAll: ot,
+      getRowId: N,
+      setColumnWidth: dt,
+      onPageChange: l,
+      onPageSizeChange: S,
+      onSort: d,
+      onFilter: m,
+      onSelectionChange: W,
+      onRowClick: P,
+      onColumnResize: k
+    }),
+    [
+      i,
+      r,
+      u,
+      e,
+      q,
+      v,
+      B,
+      nt,
+      A,
+      E,
+      G,
+      V,
+      c,
+      J,
+      et,
+      L,
+      I,
+      _,
+      R,
+      F,
+      T,
+      h,
+      w,
+      C,
+      O,
+      it,
+      ct,
+      ut,
+      p,
+      ft,
+      ot,
+      N,
+      dt,
+      l,
+      S,
+      d,
+      m,
+      W,
+      P,
+      k,
+      z,
+      lt,
+      st,
+      rt
+    ]
+  );
+  return /* @__PURE__ */ gt(xt, { value: Xt, children: jt });
+}
+export {
+  Ct as TableProvider
+};
+//# sourceMappingURL=TableProvider.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TableProvider.js","sources":["../../../../../src/ui/components/Table/TableProvider.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useMemo, useCallback } from \"react\";\nimport type { ReactNode } from \"react\";\nimport {\n  TableContextProvider,\n  type TableContextValue,\n  type PaginationMode,\n} from \"./TableContext\";\nimport type { TableColumn } from \"./TableTypes\";\nimport type { FilterConfig, FilterValue } from \"./TableFilters/TableFilters\";\nimport type { TableAction } from \"./TableActions/TableActions\";\n\nexport interface TableProviderProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> {\n  columns: TableColumn<T>[];\n  data: T[];\n  loading?: boolean;\n\n  // Pagination\n  paginationMode?: PaginationMode;\n  page?: number; // controlled\n  pageSize?: number; // controlled\n  total?: number; // required for server mode\n  onPageChange?: (page: number) => void; // required for server mode\n  onPageSizeChange?: (size: number) => void;\n  defaultPageSize?: number;\n  pageSizeOptions?: number[];\n\n  // Sorting\n  sortColumn?: string; // controlled\n  sortDirection?: \"asc\" | \"desc\"; // controlled\n  onSort?: (column: string, direction: \"asc\" | \"desc\") => void;\n  defaultSortColumn?: string;\n  defaultSortDirection?: \"asc\" | \"desc\";\n\n  // Filters\n  filters?: FilterConfig[];\n  filterValues?: Record<string, FilterValue>; // controlled\n  onFilter?: (filters: Record<string, FilterValue>) => void;\n  initialFilterValues?: Record<string, FilterValue>;\n\n  // Selection\n  selectable?: boolean;\n  selectedRows?: string[]; // controlled\n  onSelectionChange?: (selected: string[]) => void;\n  rowId?: (row: T) => string;\n\n  // Actions\n  actions?: (row: T) => TableAction<T>[];\n\n  // Empty state\n  emptyMessage?: string;\n  emptyStateTitle?: string;\n  emptyStateMessage?: string;\n  emptyStateIllustration?: ReactNode;\n  emptyStateAction?: ReactNode;\n\n  // Callbacks\n  onRowClick?: (row: T) => void;\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  children: ReactNode;\n}\n\n/**\n * TableProvider Component\n *\n * Manages table state (pagination, sorting, filters, selection) and provides it via Context.\n * Supports both client-side and server-side pagination with auto-detection.\n */\nexport function TableProvider<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>({\n  columns,\n  data,\n  loading = false,\n  paginationMode: explicitMode,\n  page: controlledPage,\n  pageSize: controlledPageSize,\n  total: externalTotal,\n  onPageChange,\n  onPageSizeChange,\n  defaultPageSize = 10,\n  pageSizeOptions: _pageSizeOptions,\n  sortColumn: controlledSortColumn,\n  sortDirection: controlledSortDirection,\n  onSort,\n  defaultSortColumn,\n  defaultSortDirection = \"asc\",\n  filters,\n  filterValues: controlledFilterValues,\n  onFilter,\n  initialFilterValues = {},\n  selectable = false,\n  selectedRows: controlledSelectedRows,\n  onSelectionChange,\n  rowId,\n  actions,\n  emptyMessage = \"No data available\",\n  emptyStateTitle,\n  emptyStateMessage,\n  emptyStateIllustration,\n  emptyStateAction,\n  onRowClick,\n  resizable = false,\n  columnWidths,\n  onColumnResize,\n  virtualScrolling,\n  virtualScrollingOptions,\n  children,\n}: TableProviderProps<T>) {\n  // Detect pagination mode\n  const paginationMode: PaginationMode = useMemo(() => {\n    if (explicitMode) return explicitMode;\n\n    // Auto-detect: if total and onPageChange are provided, it's server-side\n    if (externalTotal !== undefined && onPageChange) {\n      return \"server\";\n    }\n\n    return \"client\";\n  }, [explicitMode, externalTotal, onPageChange]);\n\n  // Pagination state\n  const isPaginationControlled = controlledPage !== undefined;\n  const [internalPage, setInternalPage] = useState(1);\n  const [internalPageSize, setInternalPageSize] = useState(defaultPageSize);\n\n  const page = isPaginationControlled ? controlledPage! : internalPage;\n  const pageSize = controlledPageSize ?? internalPageSize;\n\n  const total = useMemo(() => {\n    if (paginationMode === \"server\") {\n      return externalTotal ?? 0;\n    }\n    return data.length;\n  }, [paginationMode, externalTotal, data.length]);\n\n  const totalPages = useMemo(() => {\n    return Math.ceil(total / pageSize);\n  }, [total, pageSize]);\n\n  // Sorting state\n  const isSortingControlled = controlledSortColumn !== undefined;\n  const [internalSortColumn, setInternalSortColumn] = useState(\n    defaultSortColumn || \"\",\n  );\n  const [internalSortDirection, setInternalSortDirection] = useState<\n    \"asc\" | \"desc\"\n  >(defaultSortDirection);\n\n  const sortColumn = isSortingControlled\n    ? controlledSortColumn!\n    : internalSortColumn;\n  const sortDirection = isSortingControlled\n    ? controlledSortDirection || \"asc\"\n    : internalSortDirection;\n\n  // Filter state\n  const isFilterControlled = controlledFilterValues !== undefined;\n  const [internalFilterValues, setInternalFilterValues] =\n    useState<Record<string, FilterValue>>(initialFilterValues);\n\n  const filterValues = isFilterControlled\n    ? controlledFilterValues!\n    : internalFilterValues;\n\n  // Selection state\n  const isSelectionControlled = controlledSelectedRows !== undefined;\n  const [internalSelectedRows, setInternalSelectedRows] = useState<string[]>(\n    [],\n  );\n\n  const selectedRows = isSelectionControlled\n    ? controlledSelectedRows!\n    : internalSelectedRows;\n\n  // Apply client-side filtering\n  const filteredData = useMemo(() => {\n    if (!filters || filters.length === 0) return data;\n\n    return data.filter((row) => {\n      return filters.every((filter) => {\n        const value = filterValues[filter.key];\n        if (!value || value === \"\") return true;\n\n        const rowValue = (row as Record<string, unknown>)[filter.key];\n        if (filter.type === \"text\") {\n          return String(rowValue || \"\")\n            .toLowerCase()\n            .includes(String(value).toLowerCase());\n        }\n        return String(rowValue) === String(value);\n      });\n    });\n  }, [data, filters, filterValues]);\n\n  // Apply client-side sorting (only if not controlled externally)\n  const sortedData = useMemo(() => {\n    // If sorting is controlled externally (onSort provided), don't sort here\n    // The parent component should handle sorting on the server or before passing data\n    // However, we still apply sorting if sortColumn is set and no onSort callback\n    if (isSortingControlled && onSort) {\n      // When controlled, assume data is already sorted by parent\n      return filteredData;\n    }\n\n    // Only apply internal sorting if sortColumn is set\n    if (!sortColumn) return filteredData;\n\n    // Apply internal sorting\n    const sorted = [...filteredData];\n    sorted.sort((a, b) => {\n      const aValue = (a as Record<string, unknown>)[sortColumn];\n      const bValue = (b as Record<string, unknown>)[sortColumn];\n      const comparison = String(aValue || \"\").localeCompare(\n        String(bValue || \"\"),\n      );\n      return sortDirection === \"asc\" ? comparison : -comparison;\n    });\n\n    return sorted;\n  }, [filteredData, sortColumn, sortDirection, onSort, isSortingControlled]);\n\n  // Apply client-side pagination\n  const paginatedData = useMemo(() => {\n    if (paginationMode === \"server\") {\n      return sortedData; // Server already paginated\n    }\n\n    const startIndex = (page - 1) * pageSize;\n    const endIndex = startIndex + pageSize;\n    return sortedData.slice(startIndex, endIndex);\n  }, [sortedData, paginationMode, page, pageSize]);\n\n  // Selection helpers\n  const getRowId = useCallback(\n    (row: T, index: number): string => {\n      if (rowId) {\n        return rowId(row);\n      }\n      return (\n        (row as { id?: { toString(): string } } | null)?.id?.toString() ||\n        index.toString()\n      );\n    },\n    [rowId],\n  );\n\n  const isAllSelected = useMemo(() => {\n    if (!selectable || paginatedData.length === 0) return false;\n    return paginatedData.every((row, index) => {\n      const id = getRowId(row, index);\n      return selectedRows.includes(id);\n    });\n  }, [selectable, paginatedData, selectedRows, getRowId]);\n\n  const isIndeterminate = useMemo(() => {\n    if (!selectable) return false;\n    const selectedCount = selectedRows.length;\n    return selectedCount > 0 && selectedCount < paginatedData.length;\n  }, [selectable, selectedRows.length, paginatedData.length]);\n\n  // Methods\n  const setPage = useCallback(\n    (newPage: number) => {\n      if (isPaginationControlled) {\n        onPageChange?.(newPage);\n      } else {\n        setInternalPage(newPage);\n      }\n    },\n    [isPaginationControlled, onPageChange],\n  );\n\n  const setPageSize = useCallback(\n    (newSize: number) => {\n      if (onPageSizeChange) {\n        onPageSizeChange(newSize);\n      } else {\n        setInternalPageSize(newSize);\n      }\n      setPage(1); // Reset to first page\n    },\n    [onPageSizeChange, setPage],\n  );\n\n  const setSorting = useCallback(\n    (column: string, direction: \"asc\" | \"desc\") => {\n      if (isSortingControlled) {\n        onSort?.(column, direction);\n      } else {\n        setInternalSortColumn(column);\n        setInternalSortDirection(direction);\n      }\n    },\n    [isSortingControlled, onSort],\n  );\n\n  const setFilters = useCallback(\n    (newFilters: Record<string, FilterValue>) => {\n      if (isFilterControlled) {\n        onFilter?.(newFilters);\n      } else {\n        setInternalFilterValues(newFilters);\n      }\n      // Reset to first page when filters change\n      setPage(1);\n    },\n    [isFilterControlled, onFilter, setPage],\n  );\n\n  const setSelection = useCallback(\n    (selected: string[]) => {\n      if (isSelectionControlled) {\n        onSelectionChange?.(selected);\n      } else {\n        setInternalSelectedRows(selected);\n      }\n    },\n    [isSelectionControlled, onSelectionChange],\n  );\n\n  const toggleRowSelection = useCallback(\n    (rowId: string) => {\n      const newSelected = selectedRows.includes(rowId)\n        ? selectedRows.filter((id) => id !== rowId)\n        : [...selectedRows, rowId];\n      setSelection(newSelected);\n    },\n    [selectedRows, setSelection],\n  );\n\n  const toggleSelectAll = useCallback(() => {\n    if (isAllSelected) {\n      setSelection([]);\n    } else {\n      const allIds = paginatedData.map((row, index) => getRowId(row, index));\n      setSelection(allIds);\n    }\n  }, [isAllSelected, paginatedData, getRowId, setSelection]);\n\n  // Column resizing state\n  const [internalColumnWidths, setInternalColumnWidths] = useState<\n    Record<string, number>\n  >({});\n  const isColumnWidthsControlled = columnWidths !== undefined;\n  const finalColumnWidths = isColumnWidthsControlled\n    ? columnWidths!\n    : internalColumnWidths;\n\n  const setColumnWidth = useCallback(\n    (columnKey: string, width: number) => {\n      if (isColumnWidthsControlled) {\n        onColumnResize?.(columnKey, width);\n      } else {\n        setInternalColumnWidths((prev) => ({\n          ...prev,\n          [columnKey]: width,\n        }));\n      }\n    },\n    [isColumnWidthsControlled, onColumnResize],\n  );\n\n  const contextValue: TableContextValue<T> = useMemo(\n    () => ({\n      columns,\n      data,\n      paginatedData,\n      loading,\n      paginationState: {\n        page,\n        pageSize,\n        total,\n        totalPages,\n      },\n      sortState: {\n        column: sortColumn,\n        direction: sortDirection,\n      },\n      filterState: {\n        values: filterValues,\n        config: filters || [],\n      },\n      selectionState: {\n        selectedRows,\n        isAllSelected,\n        isIndeterminate,\n      },\n      paginationMode,\n      selectable,\n      rowId,\n      actions,\n      resizable,\n      columnWidths: finalColumnWidths,\n      virtualScrolling,\n      virtualScrollingOptions,\n      emptyMessage,\n      emptyStateTitle,\n      emptyStateMessage,\n      emptyStateIllustration,\n      emptyStateAction,\n      setPage,\n      setPageSize,\n      setSorting,\n      setFilters,\n      setSelection,\n      toggleRowSelection,\n      toggleSelectAll,\n      getRowId,\n      setColumnWidth,\n      onPageChange,\n      onPageSizeChange,\n      onSort,\n      onFilter,\n      onSelectionChange,\n      onRowClick,\n      onColumnResize,\n    }),\n    [\n      columns,\n      data,\n      paginatedData,\n      loading,\n      page,\n      pageSize,\n      total,\n      totalPages,\n      sortColumn,\n      sortDirection,\n      filterValues,\n      filters,\n      selectedRows,\n      isAllSelected,\n      isIndeterminate,\n      paginationMode,\n      selectable,\n      rowId,\n      actions,\n      emptyMessage,\n      emptyStateTitle,\n      emptyStateMessage,\n      emptyStateIllustration,\n      emptyStateAction,\n      setPage,\n      setPageSize,\n      setSorting,\n      setFilters,\n      setSelection,\n      toggleRowSelection,\n      toggleSelectAll,\n      getRowId,\n      setColumnWidth,\n      onPageChange,\n      onPageSizeChange,\n      onSort,\n      onFilter,\n      onSelectionChange,\n      onRowClick,\n      onColumnResize,\n      resizable,\n      finalColumnWidths,\n      virtualScrolling,\n      virtualScrollingOptions,\n    ],\n  );\n\n  return (\n    <TableContextProvider value={contextValue}>{children}</TableContextProvider>\n  );\n}\n"],"names":["TableProvider","columns","data","loading","explicitMode","controlledPage","controlledPageSize","externalTotal","onPageChange","onPageSizeChange","defaultPageSize","_pageSizeOptions","controlledSortColumn","controlledSortDirection","onSort","defaultSortColumn","defaultSortDirection","filters","controlledFilterValues","onFilter","initialFilterValues","selectable","controlledSelectedRows","onSelectionChange","rowId","actions","emptyMessage","emptyStateTitle","emptyStateMessage","emptyStateIllustration","emptyStateAction","onRowClick","resizable","columnWidths","onColumnResize","virtualScrolling","virtualScrollingOptions","children","paginationMode","useMemo","isPaginationControlled","internalPage","setInternalPage","useState","internalPageSize","setInternalPageSize","page","pageSize","total","totalPages","isSortingControlled","internalSortColumn","setInternalSortColumn","internalSortDirection","setInternalSortDirection","sortColumn","sortDirection","isFilterControlled","internalFilterValues","setInternalFilterValues","filterValues","isSelectionControlled","internalSelectedRows","setInternalSelectedRows","selectedRows","filteredData","row","filter","value","rowValue","sortedData","sorted","a","b","aValue","bValue","comparison","paginatedData","startIndex","endIndex","getRowId","useCallback","index","_a","isAllSelected","id","isIndeterminate","selectedCount","setPage","newPage","setPageSize","newSize","setSorting","column","direction","setFilters","newFilters","setSelection","selected","toggleRowSelection","newSelected","toggleSelectAll","allIds","internalColumnWidths","setInternalColumnWidths","isColumnWidthsControlled","finalColumnWidths","setColumnWidth","columnKey","width","prev","__spreadProps","__spreadValues","contextValue","jsx","TableContextProvider"],"mappings":"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"}

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

@@ -0,0 +1,95 @@
+"use client";
+var T = Object.defineProperty, v = Object.defineProperties;
+var j = Object.getOwnPropertyDescriptors;
+var i = Object.getOwnPropertySymbols;
+var g = Object.prototype.hasOwnProperty, b = Object.prototype.propertyIsEnumerable;
+var f = (e, t, o) => t in e ? T(e, t, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[t] = o, h = (e, t) => {
+  for (var o in t || (t = {}))
+    g.call(t, o) && f(e, o, t[o]);
+  if (i)
+    for (var o of i(t))
+      b.call(t, o) && f(e, o, t[o]);
+  return e;
+}, u = (e, t) => v(e, j(t));
+var x = (e, t) => {
+  var o = {};
+  for (var l in e)
+    g.call(e, l) && t.indexOf(l) < 0 && (o[l] = e[l]);
+  if (e != null && i)
+    for (var l of i(e))
+      t.indexOf(l) < 0 && b.call(e, l) && (o[l] = e[l]);
+  return o;
+};
+import { jsxs as A, jsx as s } from "react/jsx-runtime";
+import { useTableContext as q } from "./TableContext.js";
+import { getSpacingClass as a } from "../../tokens/spacing.js";
+import z from "./TableCell.js";
+import B from "./TableActions.js";
+import D from "../../primitives/Checkbox/Checkbox.js";
+function M(E) {
+  var m = E, {
+    row: e,
+    rowIndex: t,
+    className: o = "",
+    onClick: l,
+    style: C
+  } = m, $ = x(m, [
+    "row",
+    "rowIndex",
+    "className",
+    "onClick",
+    "style"
+  ]);
+  const {
+    columns: S,
+    selectable: d,
+    selectionState: k,
+    toggleRowSelection: R,
+    getRowId: w,
+    actions: y,
+    onRowClick: p
+  } = q(), r = w(e, t), n = k.selectedRows.includes(r), N = (c) => {
+    l && l(c), p && p(e);
+  };
+  return /* @__PURE__ */ A(
+    "tr",
+    u(h({
+      role: "row",
+      "aria-selected": d ? n : void 0,
+      "aria-rowindex": t + 1,
+      className: `hover:bg-surface-hover ${n ? "bg-surface-selected" : ""} ${o}`,
+      onClick: N,
+      style: C
+    }, $), {
+      children: [
+        d && /* @__PURE__ */ s(
+          "td",
+          {
+            className: `${a("lg", "px")} ${a("base", "py")}`,
+            children: /* @__PURE__ */ s(
+              D,
+              {
+                checked: n,
+                onChange: () => R(r),
+                "aria-label": `Select row ${r}`,
+                className: a("none", "my")
+              }
+            )
+          }
+        ),
+        S.map((c) => /* @__PURE__ */ s(z, { column: c, row: e }, String(c.key))),
+        y && /* @__PURE__ */ s(
+          "td",
+          {
+            className: `${a("lg", "px")} ${a("base", "py")} text-right`,
+            children: /* @__PURE__ */ s(B, { row: e })
+          }
+        )
+      ]
+    })
+  );
+}
+export {
+  M as default
+};
+//# sourceMappingURL=TableRow.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TableRow.js","sources":["../../../../../src/ui/components/Table/TableRow.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\nimport { useTableContext } from \"./TableContext\";\nimport { Checkbox } from \"../../primitives\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport TableCell from \"./TableCell\";\nimport TableActions from \"./TableActions\";\n\nexport interface TableRowProps<\n  T extends Record<string, unknown> = Record<string, unknown>,\n> extends Omit<HTMLAttributes<HTMLTableRowElement>, \"style\"> {\n  row: T;\n  rowIndex: number;\n  style?: React.CSSProperties;\n  className?: string;\n}\n\n/**\n * TableRow Component\n *\n * Renders a table row (tr) with cells.\n * Supports selection and row click.\n * Must be used within a Table component.\n */\nexport default function TableRow<\n  T extends Record<string, unknown> = Record<string, unknown>,\n>({\n  row,\n  rowIndex,\n  className = \"\",\n  onClick,\n  style,\n  ...props\n}: TableRowProps<T>) {\n  const {\n    columns,\n    selectable,\n    selectionState,\n    toggleRowSelection,\n    getRowId,\n    actions,\n    onRowClick,\n  } = useTableContext<T>();\n\n  const id = getRowId(row, rowIndex);\n  const isSelected = selectionState.selectedRows.includes(id);\n\n  const handleClick = (e: React.MouseEvent<HTMLTableRowElement>) => {\n    if (onClick) {\n      onClick(e);\n    }\n    if (onRowClick) {\n      onRowClick(row);\n    }\n  };\n\n  return (\n    <tr\n      role=\"row\"\n      aria-selected={selectable ? isSelected : undefined}\n      aria-rowindex={rowIndex + 1}\n      className={`hover:bg-surface-hover ${isSelected ? \"bg-surface-selected\" : \"\"} ${className}`}\n      onClick={handleClick}\n      style={style}\n      {...props}\n    >\n      {selectable && (\n        <td\n          className={`${getSpacingClass(\"lg\", \"px\")} ${getSpacingClass(\"base\", \"py\")}`}\n        >\n          <Checkbox\n            checked={isSelected}\n            onChange={() => toggleRowSelection(id)}\n            aria-label={`Select row ${id}`}\n            className={getSpacingClass(\"none\", \"my\")}\n          />\n        </td>\n      )}\n\n      {columns.map((column) => (\n        <TableCell key={String(column.key)} column={column} row={row} />\n      ))}\n\n      {actions && (\n        <td\n          className={`${getSpacingClass(\"lg\", \"px\")} ${getSpacingClass(\"base\", \"py\")} text-right`}\n        >\n          <TableActions row={row} />\n        </td>\n      )}\n    </tr>\n  );\n}\n"],"names":["TableRow","_a","_b","row","rowIndex","className","onClick","style","props","__objRest","columns","selectable","selectionState","toggleRowSelection","getRowId","actions","onRowClick","useTableContext","id","isSelected","handleClick","e","jsxs","__spreadProps","__spreadValues","jsx","getSpacingClass","Checkbox","column","TableCell","TableActions"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,SAAwBA,EAEtBC,GAOmB;AAPnB,MAAAC,IAAAD,GACA;AAAA,SAAAE;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,SAAAC;AAAA,IACA,OAAAC;AAAA,MALAL,GAMGM,IAAAC,EANHP,GAMG;AAAA,IALH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM;AAAA,IACJ,SAAAQ;AAAA,IACA,YAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,IACA,YAAAC;AAAA,EAAA,IACEC,EAAA,GAEEC,IAAKJ,EAASX,GAAKC,CAAQ,GAC3Be,IAAaP,EAAe,aAAa,SAASM,CAAE,GAEpDE,IAAc,CAACC,MAA6C;AAChE,IAAIf,KACFA,EAAQe,CAAC,GAEPL,KACFA,EAAWb,CAAG;AAAA,EAElB;AAEA,SACE,gBAAAmB;AAAA,IAAC;AAAA,IAAAC,EAAAC,EAAA;AAAA,MACC,MAAK;AAAA,MACL,iBAAeb,IAAaQ,IAAa;AAAA,MACzC,iBAAef,IAAW;AAAA,MAC1B,WAAW,0BAA0Be,IAAa,wBAAwB,EAAE,IAAId,CAAS;AAAA,MACzF,SAASe;AAAA,MACT,OAAAb;AAAA,OACIC,IAPL;AAAA,MASE,UAAA;AAAA,QAAAG,KACC,gBAAAc;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,GAAGC,EAAgB,MAAM,IAAI,CAAC,IAAIA,EAAgB,QAAQ,IAAI,CAAC;AAAA,YAE1E,UAAA,gBAAAD;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,SAASR;AAAA,gBACT,UAAU,MAAMN,EAAmBK,CAAE;AAAA,gBACrC,cAAY,cAAcA,CAAE;AAAA,gBAC5B,WAAWQ,EAAgB,QAAQ,IAAI;AAAA,cAAA;AAAA,YAAA;AAAA,UACzC;AAAA,QAAA;AAAA,QAIHhB,EAAQ,IAAI,CAACkB,MACZ,gBAAAH,EAACI,GAAA,EAAmC,QAAAD,GAAgB,KAAAzB,EAAA,GAApC,OAAOyB,EAAO,GAAG,CAA6B,CAC/D;AAAA,QAEAb,KACC,gBAAAU;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,GAAGC,EAAgB,MAAM,IAAI,CAAC,IAAIA,EAAgB,QAAQ,IAAI,CAAC;AAAA,YAE1E,UAAA,gBAAAD,EAACK,KAAa,KAAA3B,EAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MAC1B;AAAA,IAAA;AAAA,EAAA;AAIR;"}

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

@@ -0,0 +1,71 @@
+"use client";
+var k = Object.defineProperty, y = Object.defineProperties;
+var I = Object.getOwnPropertyDescriptors;
+var M = Object.getOwnPropertySymbols;
+var U = Object.prototype.hasOwnProperty, j = Object.prototype.propertyIsEnumerable;
+var E = (n, e, t) => e in n ? k(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, L = (n, e) => {
+  for (var t in e || (e = {}))
+    U.call(e, t) && E(n, t, e[t]);
+  if (M)
+    for (var t of M(e))
+      j.call(e, t) && E(n, t, e[t]);
+  return n;
+}, x = (n, e) => y(n, I(e));
+import { useState as h, useRef as v, useCallback as c } from "react";
+function B(n = {}) {
+  const {
+    defaultWidths: e = {},
+    minWidth: t = 50,
+    maxWidth: a,
+    resizable: R = !0
+  } = n, [X, z] = h(e), [r, W] = h(!1), [d, p] = h(null), i = v(
+    null
+  ), f = c(
+    (s, u) => {
+      const o = Math.max(
+        t,
+        a ? Math.min(u, a) : u
+      );
+      z((S) => x(L({}, S), {
+        [s]: o
+      }));
+    },
+    [t, a]
+  ), b = c(() => {
+    z(e);
+  }, [e]), w = c(
+    (s, u, o) => {
+      R && (W(!0), p(s), i.current = { startX: u, startWidth: o });
+    },
+    [R]
+  ), C = c(
+    (s) => {
+      if (!r || !d || !i.current) return;
+      const u = s - i.current.startX, o = i.current.startWidth + u;
+      f(d, o);
+    },
+    [r, d, f]
+  ), g = c(() => {
+    W(!1), p(null), i.current = null;
+  }, []), l = v(
+    void 0
+  ), m = v(void 0);
+  return typeof window != "undefined" && (l.current = (s) => {
+    r && C(s.clientX);
+  }, m.current = () => {
+    r && g();
+  }, r ? (document.addEventListener("mousemove", l.current), document.addEventListener("mouseup", m.current)) : (l.current && document.removeEventListener("mousemove", l.current), m.current && document.removeEventListener("mouseup", m.current))), {
+    columnWidths: X,
+    setColumnWidth: f,
+    resetColumnWidths: b,
+    isResizing: r,
+    resizingColumn: d,
+    startResize: w,
+    handleResize: C,
+    endResize: g
+  };
+}
+export {
+  B as useColumnResizing
+};
+//# sourceMappingURL=useColumnResizing.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useColumnResizing.js","sources":["../../../../../src/ui/components/Table/useColumnResizing.ts"],"sourcesContent":["\"use client\";\n\nimport { useState, useCallback, useRef } from \"react\";\n\nexport interface ColumnWidth {\n  [key: string]: number;\n}\n\nexport interface UseColumnResizingOptions {\n  defaultWidths?: ColumnWidth;\n  minWidth?: number;\n  maxWidth?: number;\n  resizable?: boolean;\n}\n\nexport interface UseColumnResizingResult {\n  columnWidths: ColumnWidth;\n  setColumnWidth: (columnKey: string, width: number) => void;\n  resetColumnWidths: () => void;\n  isResizing: boolean;\n  resizingColumn: string | null;\n  startResize: (columnKey: string, startX: number, startWidth: number) => void;\n  handleResize: (currentX: number) => void;\n  endResize: () => void;\n}\n\n/**\n * useColumnResizing Hook\n *\n * Hook for managing column resizing in tables.\n *\n * @example\n * ```tsx\n * const {\n *   columnWidths,\n *   setColumnWidth,\n *   startResize,\n *   handleResize,\n *   endResize,\n * } = useColumnResizing({\n *   defaultWidths: { name: 200, email: 250 },\n *   minWidth: 100,\n * });\n * ```\n */\nexport function useColumnResizing(\n  options: UseColumnResizingOptions = {},\n): UseColumnResizingResult {\n  const {\n    defaultWidths = {},\n    minWidth = 50,\n    maxWidth,\n    resizable = true,\n  } = options;\n\n  const [columnWidths, setColumnWidths] = useState<ColumnWidth>(defaultWidths);\n  const [isResizing, setIsResizing] = useState(false);\n  const [resizingColumn, setResizingColumn] = useState<string | null>(null);\n  const resizeStateRef = useRef<{ startX: number; startWidth: number } | null>(\n    null,\n  );\n\n  const setColumnWidth = useCallback(\n    (columnKey: string, width: number) => {\n      const clampedWidth = Math.max(\n        minWidth,\n        maxWidth ? Math.min(width, maxWidth) : width,\n      );\n      setColumnWidths((prev) => ({\n        ...prev,\n        [columnKey]: clampedWidth,\n      }));\n    },\n    [minWidth, maxWidth],\n  );\n\n  const resetColumnWidths = useCallback(() => {\n    setColumnWidths(defaultWidths);\n  }, [defaultWidths]);\n\n  const startResize = useCallback(\n    (columnKey: string, startX: number, startWidth: number) => {\n      if (!resizable) return;\n      setIsResizing(true);\n      setResizingColumn(columnKey);\n      resizeStateRef.current = { startX, startWidth };\n    },\n    [resizable],\n  );\n\n  const handleResize = useCallback(\n    (currentX: number) => {\n      if (!isResizing || !resizingColumn || !resizeStateRef.current) return;\n\n      const deltaX = currentX - resizeStateRef.current.startX;\n      const newWidth = resizeStateRef.current.startWidth + deltaX;\n      setColumnWidth(resizingColumn, newWidth);\n    },\n    [isResizing, resizingColumn, setColumnWidth],\n  );\n\n  const endResize = useCallback(() => {\n    setIsResizing(false);\n    setResizingColumn(null);\n    resizeStateRef.current = null;\n  }, []);\n\n  // Handle mouse move and mouse up globally during resize\n  const handleMouseMoveRef = useRef<((e: MouseEvent) => void) | undefined>(\n    undefined,\n  );\n  const handleMouseUpRef = useRef<(() => void) | undefined>(undefined);\n\n  if (typeof window !== \"undefined\") {\n    handleMouseMoveRef.current = (e: MouseEvent) => {\n      if (isResizing) {\n        handleResize(e.clientX);\n      }\n    };\n\n    handleMouseUpRef.current = () => {\n      if (isResizing) {\n        endResize();\n      }\n    };\n\n    if (isResizing) {\n      document.addEventListener(\"mousemove\", handleMouseMoveRef.current);\n      document.addEventListener(\"mouseup\", handleMouseUpRef.current);\n    } else {\n      if (handleMouseMoveRef.current) {\n        document.removeEventListener(\"mousemove\", handleMouseMoveRef.current);\n      }\n      if (handleMouseUpRef.current) {\n        document.removeEventListener(\"mouseup\", handleMouseUpRef.current);\n      }\n    }\n  }\n\n  return {\n    columnWidths,\n    setColumnWidth,\n    resetColumnWidths,\n    isResizing,\n    resizingColumn,\n    startResize,\n    handleResize,\n    endResize,\n  };\n}\n"],"names":["useColumnResizing","options","defaultWidths","minWidth","maxWidth","resizable","columnWidths","setColumnWidths","useState","isResizing","setIsResizing","resizingColumn","setResizingColumn","resizeStateRef","useRef","setColumnWidth","useCallback","columnKey","width","clampedWidth","prev","__spreadProps","__spreadValues","resetColumnWidths","startResize","startX","startWidth","handleResize","currentX","deltaX","newWidth","endResize","handleMouseMoveRef","handleMouseUpRef","e"],"mappings":";;;;;;;;;;;;;;AA6CO,SAASA,EACdC,IAAoC,IACX;AACzB,QAAM;AAAA,IACJ,eAAAC,IAAgB,CAAA;AAAA,IAChB,UAAAC,IAAW;AAAA,IACX,UAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,EAAA,IACVJ,GAEE,CAACK,GAAcC,CAAe,IAAIC,EAAsBN,CAAa,GACrE,CAACO,GAAYC,CAAa,IAAIF,EAAS,EAAK,GAC5C,CAACG,GAAgBC,CAAiB,IAAIJ,EAAwB,IAAI,GAClEK,IAAiBC;AAAA,IACrB;AAAA,EAAA,GAGIC,IAAiBC;AAAA,IACrB,CAACC,GAAmBC,MAAkB;AACpC,YAAMC,IAAe,KAAK;AAAA,QACxBhB;AAAA,QACAC,IAAW,KAAK,IAAIc,GAAOd,CAAQ,IAAIc;AAAA,MAAA;AAEzC,MAAAX,EAAgB,CAACa,MAAUC,EAAAC,EAAA,IACtBF,IADsB;AAAA,QAEzB,CAACH,CAAS,GAAGE;AAAA,MAAA,EACb;AAAA,IACJ;AAAA,IACA,CAAChB,GAAUC,CAAQ;AAAA,EAAA,GAGfmB,IAAoBP,EAAY,MAAM;AAC1C,IAAAT,EAAgBL,CAAa;AAAA,EAC/B,GAAG,CAACA,CAAa,CAAC,GAEZsB,IAAcR;AAAA,IAClB,CAACC,GAAmBQ,GAAgBC,MAAuB;AACzD,MAAKrB,MACLK,EAAc,EAAI,GAClBE,EAAkBK,CAAS,GAC3BJ,EAAe,UAAU,EAAE,QAAAY,GAAQ,YAAAC,EAAA;AAAA,IACrC;AAAA,IACA,CAACrB,CAAS;AAAA,EAAA,GAGNsB,IAAeX;AAAA,IACnB,CAACY,MAAqB;AACpB,UAAI,CAACnB,KAAc,CAACE,KAAkB,CAACE,EAAe,QAAS;AAE/D,YAAMgB,IAASD,IAAWf,EAAe,QAAQ,QAC3CiB,IAAWjB,EAAe,QAAQ,aAAagB;AACrD,MAAAd,EAAeJ,GAAgBmB,CAAQ;AAAA,IACzC;AAAA,IACA,CAACrB,GAAYE,GAAgBI,CAAc;AAAA,EAAA,GAGvCgB,IAAYf,EAAY,MAAM;AAClC,IAAAN,EAAc,EAAK,GACnBE,EAAkB,IAAI,GACtBC,EAAe,UAAU;AAAA,EAC3B,GAAG,CAAA,CAAE,GAGCmB,IAAqBlB;AAAA,IACzB;AAAA,EAAA,GAEImB,IAAmBnB,EAAiC,MAAS;AAEnE,SAAI,OAAO,UAAW,gBACpBkB,EAAmB,UAAU,CAACE,MAAkB;AAC9C,IAAIzB,KACFkB,EAAaO,EAAE,OAAO;AAAA,EAE1B,GAEAD,EAAiB,UAAU,MAAM;AAC/B,IAAIxB,KACFsB,EAAA;AAAA,EAEJ,GAEItB,KACF,SAAS,iBAAiB,aAAauB,EAAmB,OAAO,GACjE,SAAS,iBAAiB,WAAWC,EAAiB,OAAO,MAEzDD,EAAmB,WACrB,SAAS,oBAAoB,aAAaA,EAAmB,OAAO,GAElEC,EAAiB,WACnB,SAAS,oBAAoB,WAAWA,EAAiB,OAAO,KAK/D;AAAA,IACL,cAAA3B;AAAA,IACA,gBAAAS;AAAA,IACA,mBAAAQ;AAAA,IACA,YAAAd;AAAA,IACA,gBAAAE;AAAA,IACA,aAAAa;AAAA,IACA,cAAAG;AAAA,IACA,WAAAI;AAAA,EAAA;AAEJ;"}

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

@@ -0,0 +1,50 @@
+"use client";
+import { useState as p, useRef as M, useMemo as S, useEffect as m } from "react";
+function b(n, d) {
+  const { itemHeight: t, containerHeight: u, overscan: i = 5, enabled: s = !0 } = d, [c, a] = p(0), l = M(null), g = S(() => {
+    if (!s || n.length === 0)
+      return n.map((o, f) => ({
+        index: f,
+        start: f * t,
+        end: (f + 1) * t,
+        size: t
+      }));
+    const e = Math.max(
+      0,
+      Math.floor(c / t) - i
+    ), r = u ? Math.min(
+      n.length,
+      Math.ceil((c + u) / t) + i
+    ) : n.length, h = [];
+    for (let o = e; o < r; o++)
+      h.push({
+        index: o,
+        start: o * t,
+        end: (o + 1) * t,
+        size: t
+      });
+    return h;
+  }, [n, t, c, u, i, s]), v = n.length * t;
+  return m(() => {
+    if (!s || !l.current) return;
+    const e = l.current, r = () => {
+      a(e.scrollTop);
+    };
+    return e.addEventListener("scroll", r, { passive: !0 }), () => e.removeEventListener("scroll", r);
+  }, [s]), {
+    virtualItems: g,
+    totalHeight: v,
+    scrollOffset: c,
+    setScrollOffset: a,
+    scrollToIndex: (e) => {
+      if (!l.current) return;
+      const r = e * t;
+      l.current.scrollTop = r, a(r);
+    },
+    containerRef: l
+  };
+}
+export {
+  b as useVirtualScrolling
+};
+//# sourceMappingURL=useVirtualScrolling.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useVirtualScrolling.js","sources":["../../../../../src/ui/components/Table/useVirtualScrolling.ts"],"sourcesContent":["\"use client\";\n\nimport { useState, useEffect, useRef, useMemo } from \"react\";\n\nexport interface UseVirtualScrollingOptions {\n  itemHeight: number; // Height of each row in pixels\n  containerHeight?: number; // Height of visible container\n  overscan?: number; // Number of items to render outside visible area\n  enabled?: boolean; // Whether virtual scrolling is enabled\n}\n\nexport interface VirtualScrollingResult {\n  virtualItems: Array<{\n    index: number;\n    start: number;\n    end: number;\n    size: number;\n  }>;\n  totalHeight: number;\n  scrollOffset: number;\n  setScrollOffset: (offset: number) => void;\n  scrollToIndex: (index: number) => void;\n  containerRef: React.RefObject<HTMLDivElement | null>;\n}\n\n/**\n * useVirtualScrolling Hook\n *\n * Hook for virtual scrolling to improve performance with large datasets.\n * Only renders visible items plus overscan buffer.\n *\n * @example\n * ```tsx\n * const { virtualItems, totalHeight, containerRef } = useVirtualScrolling({\n *   itemHeight: 50,\n *   containerHeight: 400,\n *   overscan: 5,\n * });\n * ```\n */\nexport function useVirtualScrolling<T>(\n  items: T[],\n  options: UseVirtualScrollingOptions,\n): VirtualScrollingResult {\n  const { itemHeight, containerHeight, overscan = 5, enabled = true } = options;\n\n  const [scrollOffset, setScrollOffset] = useState(0);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  // Calculate visible range\n  const virtualItems = useMemo(() => {\n    if (!enabled || items.length === 0) {\n      return items.map((_, index) => ({\n        index,\n        start: index * itemHeight,\n        end: (index + 1) * itemHeight,\n        size: itemHeight,\n      }));\n    }\n\n    const visibleStart = Math.max(\n      0,\n      Math.floor(scrollOffset / itemHeight) - overscan,\n    );\n    const visibleEnd = containerHeight\n      ? Math.min(\n          items.length,\n          Math.ceil((scrollOffset + containerHeight) / itemHeight) + overscan,\n        )\n      : items.length;\n\n    const result: Array<{\n      index: number;\n      start: number;\n      end: number;\n      size: number;\n    }> = [];\n    for (let i = visibleStart; i < visibleEnd; i++) {\n      result.push({\n        index: i,\n        start: i * itemHeight,\n        end: (i + 1) * itemHeight,\n        size: itemHeight,\n      });\n    }\n    return result;\n  }, [items, itemHeight, scrollOffset, containerHeight, overscan, enabled]);\n\n  const totalHeight = items.length * itemHeight;\n\n  // Handle scroll events\n  useEffect(() => {\n    if (!enabled || !containerRef.current) return;\n\n    const container = containerRef.current;\n    const handleScroll = () => {\n      setScrollOffset(container.scrollTop);\n    };\n\n    container.addEventListener(\"scroll\", handleScroll, { passive: true });\n    return () => container.removeEventListener(\"scroll\", handleScroll);\n  }, [enabled]);\n\n  const scrollToIndex = (index: number) => {\n    if (!containerRef.current) return;\n    const offset = index * itemHeight;\n    containerRef.current.scrollTop = offset;\n    setScrollOffset(offset);\n  };\n\n  return {\n    virtualItems,\n    totalHeight,\n    scrollOffset,\n    setScrollOffset,\n    scrollToIndex,\n    containerRef,\n  };\n}\n"],"names":["useVirtualScrolling","items","options","itemHeight","containerHeight","overscan","enabled","scrollOffset","setScrollOffset","useState","containerRef","useRef","virtualItems","useMemo","_","index","visibleStart","visibleEnd","result","i","totalHeight","useEffect","container","handleScroll","offset"],"mappings":";;AAwCO,SAASA,EACdC,GACAC,GACwB;AACxB,QAAM,EAAE,YAAAC,GAAY,iBAAAC,GAAiB,UAAAC,IAAW,GAAG,SAAAC,IAAU,OAASJ,GAEhE,CAACK,GAAcC,CAAe,IAAIC,EAAS,CAAC,GAC5CC,IAAeC,EAAuB,IAAI,GAG1CC,IAAeC,EAAQ,MAAM;AACjC,QAAI,CAACP,KAAWL,EAAM,WAAW;AAC/B,aAAOA,EAAM,IAAI,CAACa,GAAGC,OAAW;AAAA,QAC9B,OAAAA;AAAA,QACA,OAAOA,IAAQZ;AAAA,QACf,MAAMY,IAAQ,KAAKZ;AAAA,QACnB,MAAMA;AAAA,MAAA,EACN;AAGJ,UAAMa,IAAe,KAAK;AAAA,MACxB;AAAA,MACA,KAAK,MAAMT,IAAeJ,CAAU,IAAIE;AAAA,IAAA,GAEpCY,IAAab,IACf,KAAK;AAAA,MACHH,EAAM;AAAA,MACN,KAAK,MAAMM,IAAeH,KAAmBD,CAAU,IAAIE;AAAA,IAAA,IAE7DJ,EAAM,QAEJiB,IAKD,CAAA;AACL,aAASC,IAAIH,GAAcG,IAAIF,GAAYE;AACzC,MAAAD,EAAO,KAAK;AAAA,QACV,OAAOC;AAAA,QACP,OAAOA,IAAIhB;AAAA,QACX,MAAMgB,IAAI,KAAKhB;AAAA,QACf,MAAMA;AAAA,MAAA,CACP;AAEH,WAAOe;AAAA,EACT,GAAG,CAACjB,GAAOE,GAAYI,GAAcH,GAAiBC,GAAUC,CAAO,CAAC,GAElEc,IAAcnB,EAAM,SAASE;AAGnC,SAAAkB,EAAU,MAAM;AACd,QAAI,CAACf,KAAW,CAACI,EAAa,QAAS;AAEvC,UAAMY,IAAYZ,EAAa,SACzBa,IAAe,MAAM;AACzB,MAAAf,EAAgBc,EAAU,SAAS;AAAA,IACrC;AAEA,WAAAA,EAAU,iBAAiB,UAAUC,GAAc,EAAE,SAAS,IAAM,GAC7D,MAAMD,EAAU,oBAAoB,UAAUC,CAAY;AAAA,EACnE,GAAG,CAACjB,CAAO,CAAC,GASL;AAAA,IACL,cAAAM;AAAA,IACA,aAAAQ;AAAA,IACA,cAAAb;AAAA,IACA,iBAAAC;AAAA,IACA,eAZoB,CAACO,MAAkB;AACvC,UAAI,CAACL,EAAa,QAAS;AAC3B,YAAMc,IAAST,IAAQZ;AACvB,MAAAO,EAAa,QAAQ,YAAYc,GACjChB,EAAgBgB,CAAM;AAAA,IACxB;AAAA,IAQE,cAAAd;AAAA,EAAA;AAEJ;"}

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

@@ -0,0 +1,39 @@
+"use client";
+var b = Object.defineProperty, g = Object.defineProperties;
+var u = Object.getOwnPropertyDescriptors;
+var s = Object.getOwnPropertySymbols;
+var n = Object.prototype.hasOwnProperty, a = Object.prototype.propertyIsEnumerable;
+var m = (r, o, t) => o in r ? b(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t, T = (r, o) => {
+  for (var t in o || (o = {}))
+    n.call(o, t) && m(r, t, o[t]);
+  if (s)
+    for (var t of s(o))
+      a.call(o, t) && m(r, t, o[t]);
+  return r;
+}, f = (r, o) => g(r, u(o));
+var p = (r, o) => {
+  var t = {};
+  for (var i in r)
+    n.call(r, i) && o.indexOf(i) < 0 && (t[i] = r[i]);
+  if (r != null && s)
+    for (var i of s(r))
+      o.indexOf(i) < 0 && a.call(r, i) && (t[i] = r[i]);
+  return t;
+};
+import { jsx as c } from "react/jsx-runtime";
+import { TabsProvider as C } from "./TabsProvider.js";
+import { TabsList as d } from "./TabsList.js";
+import { TabsTrigger as l } from "./TabsTrigger.js";
+import { TabsContent as x } from "./TabsContent.js";
+function e(t) {
+  var i = t, { children: r } = i, o = p(i, ["children"]);
+  return /* @__PURE__ */ c(C, f(T({}, o), { children: r }));
+}
+e.List = d;
+e.Trigger = l;
+e.Content = x;
+const q = e;
+export {
+  q as default
+};
+//# sourceMappingURL=Tabs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sources":["../../../../../src/ui/components/Tabs/Tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport React, { type ReactNode } from \"react\";\nimport { TabsProvider, type TabsProviderProps } from \"./TabsProvider\";\nimport { TabsList } from \"./TabsList\";\nimport { TabsTrigger } from \"./TabsTrigger\";\nimport { TabsContent } from \"./TabsContent\";\n\nexport interface TabsProps extends Omit<TabsProviderProps, \"children\"> {\n  children: ReactNode;\n}\n\n/**\n * Tabs Component\n *\n * A flexible tabs component with compound components pattern.\n * Supports horizontal and vertical orientations, automatic and manual activation modes.\n * Fully accessible with ARIA attributes and keyboard navigation.\n *\n * @example\n * ```tsx\n * <Tabs defaultValue=\"tab1\">\n *   <Tabs.List>\n *     <Tabs.Trigger value=\"tab1\">Tab 1</Tabs.Trigger>\n *     <Tabs.Trigger value=\"tab2\">Tab 2</Tabs.Trigger>\n *   </Tabs.List>\n *   <Tabs.Content value=\"tab1\">Content 1</Tabs.Content>\n *   <Tabs.Content value=\"tab2\">Content 2</Tabs.Content>\n * </Tabs>\n * ```\n */\nfunction TabsComponent({ children, ...providerProps }: TabsProps) {\n  return <TabsProvider {...providerProps}>{children}</TabsProvider>;\n}\n\n// Compound components\nTabsComponent.List = TabsList;\nTabsComponent.Trigger = TabsTrigger;\nTabsComponent.Content = TabsContent;\n\n// Type declaration for compound components\nexport interface TabsComponentType extends React.FC<TabsProps> {\n  List: typeof TabsList;\n  Trigger: typeof TabsTrigger;\n  Content: typeof TabsContent;\n}\n\n// Cast to include compound components\nconst Tabs: TabsComponentType = TabsComponent as TabsComponentType;\n\nexport default Tabs;\n"],"names":["TabsComponent","_a","_b","children","providerProps","__objRest","jsx","TabsProvider","__spreadProps","__spreadValues","TabsList","TabsTrigger","TabsContent","Tabs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA,SAASA,EAAcC,GAA2C;AAA3C,MAAAC,IAAAD,GAAE,YAAAE,MAAFD,GAAeE,IAAAC,EAAfH,GAAe,CAAb;AACvB,SAAO,gBAAAI,EAACC,GAAAC,EAAAC,EAAA,IAAiBL,IAAjB,EAAiC,UAAAD,EAAA,EAAS;AACpD;AAGAH,EAAc,OAAOU;AACrBV,EAAc,UAAUW;AACxBX,EAAc,UAAUY;AAUxB,MAAMC,IAA0Bb;"}

package/dist/granular/ui/components/Tabs/TabsContent.js

@@ -0,0 +1,59 @@
+"use client";
+var d = Object.defineProperty, $ = Object.defineProperties;
+var x = Object.getOwnPropertyDescriptors;
+var o = Object.getOwnPropertySymbols;
+var r = Object.prototype.hasOwnProperty, c = Object.prototype.propertyIsEnumerable;
+var l = (t, e, n) => e in t ? d(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, m = (t, e) => {
+  for (var n in e || (e = {}))
+    r.call(e, n) && l(t, n, e[n]);
+  if (o)
+    for (var n of o(e))
+      c.call(e, n) && l(t, n, e[n]);
+  return t;
+}, u = (t, e) => $(t, x(e));
+var b = (t, e) => {
+  var n = {};
+  for (var a in t)
+    r.call(t, a) && e.indexOf(a) < 0 && (n[a] = t[a]);
+  if (t != null && o)
+    for (var a of o(t))
+      e.indexOf(a) < 0 && c.call(t, a) && (n[a] = t[a]);
+  return n;
+};
+import { jsx as C } from "react/jsx-runtime";
+import { useTabsContext as g } from "./TabsContext.js";
+import { getSpacingClass as v } from "../../tokens/spacing.js";
+function N(T) {
+  var i = T, {
+    value: t,
+    children: e,
+    forceMount: n = !1,
+    className: a = ""
+  } = i, f = b(i, [
+    "value",
+    "children",
+    "forceMount",
+    "className"
+  ]);
+  const { value: p } = g(), s = p === t;
+  return !s && !n ? null : /* @__PURE__ */ C(
+    "div",
+    u(m({
+      role: "tabpanel",
+      id: `tabpanel-${t}`,
+      "aria-labelledby": `tab-${t}`,
+      hidden: !s,
+      className: `
+        ${v("sm", "mt")}
+        focus:outline-none
+        ${a}
+      `
+    }, f), {
+      children: e
+    })
+  );
+}
+export {
+  N as TabsContent
+};
+//# sourceMappingURL=TabsContent.js.map

package/dist/granular/ui/components/Tabs/TabsContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsContent.js","sources":["../../../../../src/ui/components/Tabs/TabsContent.tsx"],"sourcesContent":["\"use client\";\n\nimport { useTabsContext } from \"./TabsContext\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\n\nexport interface TabsContentProps extends HTMLAttributes<HTMLDivElement> {\n  value: string;\n  children: ReactNode;\n  forceMount?: boolean;\n}\n\n/**\n * TabsContent Component\n *\n * Content panel for a tab.\n * Only renders when the tab is active (unless forceMount is true).\n * Must be used within a Tabs component.\n */\nexport function TabsContent({\n  value,\n  children,\n  forceMount = false,\n  className = \"\",\n  ...props\n}: TabsContentProps) {\n  const { value: activeValue } = useTabsContext();\n\n  const isActive = activeValue === value;\n\n  if (!isActive && !forceMount) {\n    return null;\n  }\n\n  return (\n    <div\n      role=\"tabpanel\"\n      id={`tabpanel-${value}`}\n      aria-labelledby={`tab-${value}`}\n      hidden={!isActive}\n      className={`\n        ${getSpacingClass(\"sm\", \"mt\")}\n        focus:outline-none\n        ${className}\n      `}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["TabsContent","_a","_b","value","children","forceMount","className","props","__objRest","activeValue","useTabsContext","isActive","jsx","__spreadProps","__spreadValues","getSpacingClass"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,SAASA,EAAYC,GAMP;AANO,MAAAC,IAAAD,GAC1B;AAAA,WAAAE;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,WAAAC,IAAY;AAAA,MAJcJ,GAKvBK,IAAAC,EALuBN,GAKvB;AAAA,IAJH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,EAAE,OAAOO,EAAA,IAAgBC,EAAA,GAEzBC,IAAWF,MAAgBN;AAEjC,SAAI,CAACQ,KAAY,CAACN,IACT,OAIP,gBAAAO;AAAA,IAAC;AAAA,IAAAC,EAAAC,EAAA;AAAA,MACC,MAAK;AAAA,MACL,IAAI,YAAYX,CAAK;AAAA,MACrB,mBAAiB,OAAOA,CAAK;AAAA,MAC7B,QAAQ,CAACQ;AAAA,MACT,WAAW;AAAA,UACPI,EAAgB,MAAM,IAAI,CAAC;AAAA;AAAA,UAE3BT,CAAS;AAAA;AAAA,OAETC,IAVL;AAAA,MAYE,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP;"}