@mondrianai/runyourai-design-system 0.0.20 → 0.0.21

package/dist/index.mjs

@@ -4064,7 +4064,7 @@ function Modal({
   variant = "confirm",
   title,
   description,
-  showCloseButton = false,
+  showCloseButton = true,
   children,
   cancelLabel = "\uCDE8\uC18C",
   confirmLabel = "\uD655\uC778",
@@ -6018,6 +6018,9 @@ function SortIcon({ direction }) {
     }
   );
 }
+function isEmptyConfig(value) {
+  return typeof value === "object" && value !== null && !React27.isValidElement(value) && "description" in value;
+}
 function Table({
   columns,
   data,
@@ -6025,11 +6028,13 @@ function Table({
   pagination,
   defaultSorting,
   loading = false,
+  empty,
   enableRowSelection,
   rowSelection: rowSelectionProp,
   onRowSelectionChange,
   rowActions,
   onRowClick,
+  isRowDisabled,
   onSortingChange,
   className,
   maxHeight
@@ -6096,6 +6101,7 @@ function Table({
         Checkbox,
         {
           checked: row.getIsSelected(),
+          disabled: !row.getCanSelect(),
           onCheckedChange: (checked) => row.toggleSelected(!!checked),
           "aria-label": "\uD589 \uC120\uD0DD",
           onClick: (e) => e.stopPropagation()
@@ -6141,7 +6147,7 @@ function Table({
     getRowId: (row) => getRowKey(row),
     onSortingChange: handleSortingChange
   }, hasPagination && { onPaginationChange: handlePaginationChange }), isSelectionActive && {
-    enableRowSelection: true,
+    enableRowSelection: isRowDisabled ? (row) => !isRowDisabled(row.original) : true,
     onRowSelectionChange: handleRowSelectionChange
   }), {
     getCoreRowModel: getCoreRowModel(),
@@ -6250,81 +6256,87 @@ function Table({
               name: "loader-2",
               className: "mx-auto size-6 animate-spin text-muted-foreground"
             }
-          ) }) }) : table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx52(
-            "tr",
-            {
-              onClick: !isSelectionActive && onRowClick ? () => onRowClick(row.original) : void 0,
-              className: cn(
-                "group border-b border-border transition-colors hover:bg-accent/50 last:border-b-0",
-                !isSelectionActive && onRowClick && "cursor-pointer",
-                isSelectionActive && row.getIsSelected() && "bg-accent/30"
-              ),
-              children: row.getVisibleCells().map((cell) => {
-                var _a2;
-                if (cell.column.id === "__select__") {
-                  return /* @__PURE__ */ jsx52("td", { className: "w-10 p-0 relative", children: isSelectionActive && /* @__PURE__ */ jsx52("div", { className: "absolute inset-0 flex items-center justify-center", children: flexRender(
+          ) }) }) : table.getRowModel().rows.length === 0 ? /* @__PURE__ */ jsx52("tr", { children: /* @__PURE__ */ jsx52("td", { colSpan: colCount, children: empty === void 0 ? /* @__PURE__ */ jsx52(Empty, { description: "No Data" }) : isEmptyConfig(empty) ? /* @__PURE__ */ jsx52(Empty, { description: empty.description }) : empty }) }) : table.getRowModel().rows.map((row) => {
+            var _a2;
+            const rowDisabled = (_a2 = isRowDisabled == null ? void 0 : isRowDisabled(row.original)) != null ? _a2 : false;
+            return /* @__PURE__ */ jsx52(
+              "tr",
+              {
+                "aria-disabled": rowDisabled || void 0,
+                onClick: !isSelectionActive && onRowClick && !rowDisabled ? () => onRowClick(row.original) : void 0,
+                className: cn(
+                  "group border-b border-border transition-colors hover:bg-accent/50 last:border-b-0",
+                  !isSelectionActive && onRowClick && !rowDisabled && "cursor-pointer",
+                  isSelectionActive && row.getIsSelected() && "bg-accent/30",
+                  rowDisabled && "cursor-not-allowed [&_td]:text-muted-foreground"
+                ),
+                children: row.getVisibleCells().map((cell) => {
+                  var _a3;
+                  if (cell.column.id === "__select__") {
+                    return /* @__PURE__ */ jsx52("td", { className: "w-10 p-0 relative", children: isSelectionActive && /* @__PURE__ */ jsx52("div", { className: "absolute inset-0 flex items-center justify-center", children: flexRender(
+                      cell.column.columnDef.cell,
+                      cell.getContext()
+                    ) }) }, cell.id);
+                  }
+                  if (cell.column.id === "__row_actions__") {
+                    return /* @__PURE__ */ jsx52(
+                      "td",
+                      {
+                        className: "w-12 px-2 py-4 align-middle text-right",
+                        children: flexRender(
+                          cell.column.columnDef.cell,
+                          cell.getContext()
+                        )
+                      },
+                      cell.id
+                    );
+                  }
+                  const {
+                    align,
+                    cellCls,
+                    ellipsis,
+                    ellipsisTooltip,
+                    cellFn
+                  } = (_a3 = colMap[cell.column.id]) != null ? _a3 : {
+                    align: "left",
+                    cellCls: "",
+                    ellipsis: false,
+                    ellipsisTooltip: void 0,
+                    cellFn: () => null
+                  };
+                  const rendered = flexRender(
                     cell.column.columnDef.cell,
                     cell.getContext()
-                  ) }) }, cell.id);
-                }
-                if (cell.column.id === "__row_actions__") {
+                  );
+                  const rawContent = ellipsis ? cellFn(row.original) : null;
+                  const cellContent = ellipsis ? /* @__PURE__ */ jsx52(
+                    EllipsisCell,
+                    {
+                      rendered: rawContent,
+                      tooltip: ellipsisTooltip ? ellipsisTooltip(row.original) : rawContent
+                    }
+                  ) : rendered;
                   return /* @__PURE__ */ jsx52(
                     "td",
                     {
-                      className: "w-12 px-2 py-4 align-middle text-right",
-                      children: flexRender(
-                        cell.column.columnDef.cell,
-                        cell.getContext()
-                      )
+                      className: cn(
+                        "px-2 py-4 text-sm leading-none text-foreground align-middle",
+                        align === "center" && "text-center",
+                        align === "right" && "text-right",
+                        // ellipsis 컬럼은 max-w-0으로 table 레이아웃상 너비를 고정하고
+                        // overflow-hidden으로 td 밖으로 나가는 콘텐츠를 클리핑
+                        ellipsis && "max-w-0 overflow-hidden",
+                        cellCls
+                      ),
+                      children: cellContent
                     },
                     cell.id
                   );
-                }
-                const {
-                  align,
-                  cellCls,
-                  ellipsis,
-                  ellipsisTooltip,
-                  cellFn
-                } = (_a2 = colMap[cell.column.id]) != null ? _a2 : {
-                  align: "left",
-                  cellCls: "",
-                  ellipsis: false,
-                  ellipsisTooltip: void 0,
-                  cellFn: () => null
-                };
-                const rendered = flexRender(
-                  cell.column.columnDef.cell,
-                  cell.getContext()
-                );
-                const rawContent = ellipsis ? cellFn(row.original) : null;
-                const cellContent = ellipsis ? /* @__PURE__ */ jsx52(
-                  EllipsisCell,
-                  {
-                    rendered: rawContent,
-                    tooltip: ellipsisTooltip ? ellipsisTooltip(row.original) : rawContent
-                  }
-                ) : rendered;
-                return /* @__PURE__ */ jsx52(
-                  "td",
-                  {
-                    className: cn(
-                      "px-2 py-4 text-sm leading-none text-foreground align-middle",
-                      align === "center" && "text-center",
-                      align === "right" && "text-right",
-                      // ellipsis 컬럼은 max-w-0으로 table 레이아웃상 너비를 고정하고
-                      // overflow-hidden으로 td 밖으로 나가는 콘텐츠를 클리핑
-                      ellipsis && "max-w-0 overflow-hidden",
-                      cellCls
-                    ),
-                    children: cellContent
-                  },
-                  cell.id
-                );
-              })
-            },
-            getRowKey(row.original)
-          )) })
+                })
+              },
+              getRowKey(row.original)
+            );
+          }) })
         ] })
       }
     ),