@algorithm-shift/design-system 1.2.72 → 1.2.74

package/dist/index.d.mts

@@ -306,6 +306,11 @@ interface CustomPaginationProps {
 
 type PaginationMode = 'client' | 'server';
 
+interface CellClickProps {
+  id: string;
+  column: any;
+}
+
 interface ExtendedTableProps extends TableProps {
   paginationMode?: PaginationMode;
   page?: number;
@@ -314,6 +319,7 @@ interface ExtendedTableProps extends TableProps {
   onSortChange?: (props: SortChangeProps) => void;
   onFilterChange?: (props: FilterChangeProps) => void;
   onGlobalSearch?: (props: SearchChangeProps) => void;
+  onCellClick?: (props: CellClickProps) => void;
   sort_by?: string;
   sort_order?: string;
 }

package/dist/index.d.ts

@@ -306,6 +306,11 @@ interface CustomPaginationProps {
 
 type PaginationMode = 'client' | 'server';
 
+interface CellClickProps {
+  id: string;
+  column: any;
+}
+
 interface ExtendedTableProps extends TableProps {
   paginationMode?: PaginationMode;
   page?: number;
@@ -314,6 +319,7 @@ interface ExtendedTableProps extends TableProps {
   onSortChange?: (props: SortChangeProps) => void;
   onFilterChange?: (props: FilterChangeProps) => void;
   onGlobalSearch?: (props: SearchChangeProps) => void;
+  onCellClick?: (props: CellClickProps) => void;
   sort_by?: string;
   sort_order?: string;
 }

package/dist/index.js

@@ -28469,7 +28469,8 @@ function DataTable({
   onSortChange,
   onFilterChange,
   onGlobalSearch,
-  globalSearch
+  globalSearch,
+  onCellClick
 }) {
   const [columnFilters, setColumnFilters] = React7.useState([]);
   const [columnVisibility, setColumnVisibility] = React7.useState({});
@@ -28682,7 +28683,24 @@ function DataTable({
           ] })
         ] }) }, header.id);
       }) }, hg.id)) }),
-      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableBody, { children: loading ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "Loading..." }) }) : table.getRowModel().rows.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableRow, { children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableCell, { children: (0, import_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext()) }, cell.id)) }, row.id)) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) }) })
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableBody, { children: loading ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "Loading..." }) }) : table.getRowModel().rows.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableRow, { children: row.getVisibleCells().map((cell) => {
+        const meta = cell.column.columnDef.meta || {};
+        const isClickable = meta?.isClickable;
+        return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+          TableCell,
+          {
+            className: `${meta?.cellClass ?? ""} ${isClickable ? "cursor-pointer hover:bg-gray-100 underline" : ""}`,
+            style: meta?.cellStyle,
+            onClick: () => {
+              if (isClickable && onCellClick) {
+                onCellClick(cell.row.original, cell.column.id);
+              }
+            },
+            children: (0, import_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext())
+          },
+          cell.id
+        );
+      }) }, row.id)) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) }) })
     ] }),
     pagination && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex items-center justify-between py-3 px-2 text-sm w-full", children: [
       /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { children: [
@@ -28772,7 +28790,10 @@ var Table4 = ({
       onSortChange: (col, dir) => onSortChange?.({ sort_by: col, sort_order: dir }),
       onFilterChange: (filters) => onFilterChange?.({ columnKey: filters.columnKey, columnTerm: filters.columnTerm }),
       onGlobalSearch: (term) => onGlobalSearch?.({ searchTerm: term }),
-      globalSearch
+      globalSearch,
+      onCellClick: (cell) => {
+        props.onCellClick?.({ id: cell.id, column: cell });
+      }
     }
   ) });
 };