@ceed/ads 0.0.68 → 0.0.70

package/dist/components/DataTable/DataTable.d.ts

@@ -1,6 +1,6 @@
 import React, { ComponentProps, ReactNode } from "react";
 import { Table } from "../Table";
-type Column<T extends Record<string, V>, V = unknown> = {
+export type ColumnDef<T extends Record<string, V>, V = unknown> = {
     type?: "number" | "string";
     field: keyof T;
     headerName?: string;
@@ -14,10 +14,10 @@ type Column<T extends Record<string, V>, V = unknown> = {
         id: string;
     }) => ReactNode;
 };
-type DataTableProps<T extends Record<string, unknown>> = {
+export type DataTableProps<T extends Record<string, unknown>> = {
     rows: T[];
     checkboxSelection?: boolean;
-    columns: Column<T>[];
+    columns: ColumnDef<T>[];
     /**
      * 체크박스가 있는 경우, 체크박스를 클릭했을 때 선택된 row의 index를 지정한다.
      */
@@ -45,6 +45,11 @@ type DataTableProps<T extends Record<string, unknown>> = {
     rowCount?: number;
     loading?: boolean;
     getId?: (row: T) => string;
+    /**
+     * 기본적으로 Uncontrolled로 작동하지만, Controlled로 작동하게 하고 싶을 때 사용한다.
+     * 이 값이 true이면, 현재 페이지 이외에도 존재하는 모든 데이터가 선택된것으로 간주하고 동작한다.
+     */
+    isTotalSelected?: boolean;
     slots?: {
         checkbox?: React.ElementType;
         toolbar?: React.ElementType;

package/dist/index.js

@@ -1044,6 +1044,8 @@ import React12, {
 } from "react";
 import { styled as styled3 } from "@mui/joy/styles";
 import LinearProgress from "@mui/joy/LinearProgress";
+import PreviousIcon from "@mui/icons-material/esm/ChevronLeft.js";
+import NextIcon from "@mui/icons-material/esm/ChevronRight.js";
 
 // src/components/Sheet/Sheet.tsx
 import { Sheet as JoySheet } from "@mui/joy";
@@ -1184,7 +1186,7 @@ function TablePagination(props) {
       alignItems: "center"
     },
     /* @__PURE__ */ React12.createElement(Stack_default, { direction: "row", spacing: 0.5, alignItems: "center" }, /* @__PURE__ */ React12.createElement(
-      Button_default,
+      IconButton_default,
       {
         size: "sm",
         variant: "plain",
@@ -1193,7 +1195,7 @@ function TablePagination(props) {
         disabled: page === firstPage,
         "aria-label": "Previous page"
       },
-      "<"
+      /* @__PURE__ */ React12.createElement(PreviousIcon, null)
     ), page !== firstPage && /* @__PURE__ */ React12.createElement(
       Button_default,
       {
@@ -1251,7 +1253,7 @@ function TablePagination(props) {
       },
       lastPage
     ), /* @__PURE__ */ React12.createElement(
-      Button_default,
+      IconButton_default,
       {
         size: "sm",
         variant: "plain",
@@ -1260,7 +1262,7 @@ function TablePagination(props) {
         disabled: page === lastPage,
         "aria-label": "Next page"
       },
-      ">"
+      /* @__PURE__ */ React12.createElement(NextIcon, null)
     ))
   );
 }
@@ -1313,7 +1315,8 @@ function useDataTableRenderer({
   onPaginationModelChange,
   selectionModel = [],
   onSelectionModelChange,
-  getId: _getId
+  getId: _getId,
+  isTotalSelected: _isTotalSelected
 }) {
   const [page, setPage] = useState4(paginationModel?.page || 1);
   const pageSize = paginationModel?.pageSize || 20;
@@ -1335,8 +1338,8 @@ function useDataTableRenderer({
   );
   const rowCount = totalRowsProp || rows.length;
   const isTotalSelected = useMemo3(
-    () => rowCount > 0 && selectionModel.length === rowCount,
-    [selectionModel, rowCount]
+    () => _isTotalSelected ?? (rowCount > 0 && selectionModel.length === rowCount),
+    [_isTotalSelected, selectionModel, rowCount]
   );
   const handlePageChange = useCallback3(
     (newPage) => {
@@ -1398,7 +1401,7 @@ function useDataTableRenderer({
     onTotalSelect: useCallback3(() => {
       onSelectionModelChange?.(
         isTotalSelected ? [] : rows.map(getId),
-        isTotalSelected
+        !isTotalSelected
       );
     }, [isTotalSelected, rows, onSelectionModelChange])
   };

package/framer/index.js

@@ -38043,7 +38043,7 @@ function TablePagination(props) {
       alignItems: "center",
       children: /* @__PURE__ */ jsxs2(Stack_default2, { direction: "row", spacing: 0.5, alignItems: "center", children: [
         /* @__PURE__ */ jsx2(
-          Button_default2,
+          IconButton_default2,
           {
             size: "sm",
             variant: "plain",
@@ -38051,7 +38051,7 @@ function TablePagination(props) {
             onClick: () => onPageChange(page - 1),
             disabled: page === firstPage,
             "aria-label": "Previous page",
-            children: "<"
+            children: /* @__PURE__ */ jsx2(ChevronLeft_default, {})
           }
         ),
         page !== firstPage && /* @__PURE__ */ jsx2(
@@ -38118,7 +38118,7 @@ function TablePagination(props) {
           }
         ),
         /* @__PURE__ */ jsx2(
-          Button_default2,
+          IconButton_default2,
           {
             size: "sm",
             variant: "plain",
@@ -38126,7 +38126,7 @@ function TablePagination(props) {
             onClick: () => onPageChange(page + 1),
             disabled: page === lastPage,
             "aria-label": "Next page",
-            children: ">"
+            children: /* @__PURE__ */ jsx2(ChevronRight_default, {})
           }
         )
       ] })
@@ -38187,7 +38187,8 @@ function useDataTableRenderer({
   onPaginationModelChange,
   selectionModel = [],
   onSelectionModelChange,
-  getId: _getId
+  getId: _getId,
+  isTotalSelected: _isTotalSelected
 }) {
   const [page, setPage] = useState25((paginationModel == null ? void 0 : paginationModel.page) || 1);
   const pageSize2 = (paginationModel == null ? void 0 : paginationModel.pageSize) || 20;
@@ -38212,8 +38213,8 @@ function useDataTableRenderer({
   );
   const rowCount = totalRowsProp || rows.length;
   const isTotalSelected = useMemo35(
-    () => rowCount > 0 && selectionModel.length === rowCount,
-    [selectionModel, rowCount]
+    () => _isTotalSelected != null ? _isTotalSelected : rowCount > 0 && selectionModel.length === rowCount,
+    [_isTotalSelected, selectionModel, rowCount]
   );
   const handlePageChange = useCallback26(
     (newPage) => {
@@ -38275,7 +38276,7 @@ function useDataTableRenderer({
     onTotalSelect: useCallback26(() => {
       onSelectionModelChange == null ? void 0 : onSelectionModelChange(
         isTotalSelected ? [] : rows.map(getId),
-        isTotalSelected
+        !isTotalSelected
       );
     }, [isTotalSelected, rows, onSelectionModelChange])
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ceed/ads",
-  "version": "0.0.68",
+  "version": "0.0.70",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "type": "module",