@ceed/ads 0.0.58 → 0.0.60

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

@@ -21,7 +21,13 @@ type DataTableProps<T extends Record<string, unknown>> = {
      * 체크박스가 있는 경우, 체크박스를 클릭했을 때 선택된 row의 index를 지정한다.
      */
     selectionModel?: string[];
-    onSelectionModelChange?: (newSelectionModel: string[]) => void;
+    onSelectionModelChange?: (newSelectionModel: string[], 
+    /**
+     * Total Select를 클릭한 경우에만 값이 true/false로 들어온다.
+     * MUI에는 없는 인터페이스지만 Total Select 기능이 추가되었기 때문에 추가해야했다.
+     */
+    isTotalSelected?: boolean) => void;
+    paginationMode?: "client" | "server";
     paginationModel?: {
         page: number;
         pageSize: number;
@@ -33,6 +39,7 @@ type DataTableProps<T extends Record<string, unknown>> = {
     /**
      * Rows의 총 갯수를 직접 지정 할 수 있다.
      * 기본적으로는 rows.length를 사용하지만, 이 값을 지정하면 rows.length를 사용하지 않는다.
+     * server mode를 사용할 때 유용하다.
      */
     rowCount?: number;
     slots?: {

package/dist/index.js

@@ -1231,11 +1231,11 @@ function useDataTableRenderer({
   rows,
   columns,
   rowCount: totalRowsProp,
+  paginationMode,
   paginationModel,
   onPaginationModelChange,
   selectionModel = [],
-  onSelectionModelChange,
-  stickyHeader
+  onSelectionModelChange
 }) {
   const [page, setPage] = useState3(paginationModel?.page || 1);
   const pageSize = paginationModel?.pageSize || 20;
@@ -1244,8 +1244,8 @@ function useDataTableRenderer({
     [selectionModel]
   );
   const dataInPage = useMemo3(
-    () => rows.slice((page - 1) * pageSize, (page - 1) * pageSize + pageSize),
-    [rows, page, pageSize]
+    () => paginationMode === "server" ? rows : rows.slice((page - 1) * pageSize, (page - 1) * pageSize + pageSize),
+    [rows, page, pageSize, paginationMode]
   );
   const isAllSelected = useMemo3(
     () => dataInPage.length > 0 && dataInPage.every(
@@ -1282,26 +1282,6 @@ function useDataTableRenderer({
     pageSize,
     onPaginationModelChange: handlePageChange,
     HeadCell,
-    // HeadCell: useCallback(
-    //   (column: Column<any>) => {
-    //     const ref = useRef<HTMLTableCellElement>(null);
-    //     const style = {
-    //       width: column.width,
-    //       minWidth: column.minWidth ?? "50px",
-    //       maxWidth: column.maxWidth,
-    //       textAlign: column.type === "number" ? "end" : "start",
-    //       position: stickyHeader ? undefined : "relative",
-    //     } as React.CSSProperties;
-    //     const resizer = column.resizable ?? true ? Resizer(ref) : null;
-    //     return (
-    //       <th ref={ref} key={column.field as string} style={style}>
-    //         {column.headerName ?? (column.field as string)}
-    //         {resizer}
-    //       </th>
-    //     );
-    //   },
-    //   [stickyHeader, columns]
-    // ),
     dataInPage,
     isAllSelected,
     // all rows are selected on this page
@@ -1338,7 +1318,8 @@ function useDataTableRenderer({
     ),
     onTotalSelect: useCallback3(() => {
       onSelectionModelChange?.(
-        isTotalSelected ? [] : rows.map((_, i) => `${i}`)
+        isTotalSelected ? [] : rows.map((_, i) => `${i}`),
+        isTotalSelected
       );
     }, [isTotalSelected, rows, onSelectionModelChange])
   };

package/framer/index.js

@@ -38104,11 +38104,11 @@ function useDataTableRenderer({
   rows,
   columns,
   rowCount: totalRowsProp,
+  paginationMode,
   paginationModel,
   onPaginationModelChange,
   selectionModel = [],
-  onSelectionModelChange,
-  stickyHeader
+  onSelectionModelChange
 }) {
   const [page, setPage] = useState24((paginationModel == null ? void 0 : paginationModel.page) || 1);
   const pageSize2 = (paginationModel == null ? void 0 : paginationModel.pageSize) || 20;
@@ -38117,8 +38117,8 @@ function useDataTableRenderer({
     [selectionModel]
   );
   const dataInPage = useMemo35(
-    () => rows.slice((page - 1) * pageSize2, (page - 1) * pageSize2 + pageSize2),
-    [rows, page, pageSize2]
+    () => paginationMode === "server" ? rows : rows.slice((page - 1) * pageSize2, (page - 1) * pageSize2 + pageSize2),
+    [rows, page, pageSize2, paginationMode]
   );
   const isAllSelected = useMemo35(
     () => dataInPage.length > 0 && dataInPage.every(
@@ -38155,26 +38155,6 @@ function useDataTableRenderer({
     pageSize: pageSize2,
     onPaginationModelChange: handlePageChange,
     HeadCell,
-    // HeadCell: useCallback(
-    //   (column: Column<any>) => {
-    //     const ref = useRef<HTMLTableCellElement>(null);
-    //     const style = {
-    //       width: column.width,
-    //       minWidth: column.minWidth ?? "50px",
-    //       maxWidth: column.maxWidth,
-    //       textAlign: column.type === "number" ? "end" : "start",
-    //       position: stickyHeader ? undefined : "relative",
-    //     } as React.CSSProperties;
-    //     const resizer = column.resizable ?? true ? Resizer(ref) : null;
-    //     return (
-    //       <th ref={ref} key={column.field as string} style={style}>
-    //         {column.headerName ?? (column.field as string)}
-    //         {resizer}
-    //       </th>
-    //     );
-    //   },
-    //   [stickyHeader, columns]
-    // ),
     dataInPage,
     isAllSelected,
     // all rows are selected on this page
@@ -38211,7 +38191,8 @@ function useDataTableRenderer({
     ),
     onTotalSelect: useCallback26(() => {
       onSelectionModelChange == null ? void 0 : onSelectionModelChange(
-        isTotalSelected ? [] : rows.map((_4, i) => `${i}`)
+        isTotalSelected ? [] : rows.map((_4, i) => `${i}`),
+        isTotalSelected
       );
     }, [isTotalSelected, rows, onSelectionModelChange])
   };
@@ -43054,8 +43035,32 @@ var badgePropertyControls = {
   }
 };
 
-// src/components/Button/Button.framer.ts
+// src/components/Breadcrumbs/Breadcrumbs.framer.ts
 import { ControlType as ControlType5 } from "framer";
+var breadcrumbsPropertyControls = {
+  items: {
+    title: "Items",
+    type: ControlType5.Array,
+    control: {
+      // NOTE: 일단 framer에서는 string만 받는다
+      type: ControlType5.String
+    },
+    defaultValue: []
+  },
+  separator: {
+    title: "Separator",
+    type: ControlType5.ComponentInstance
+  },
+  size: {
+    title: "Size",
+    type: ControlType5.Enum,
+    options: ["sm", "md", "lg"],
+    defaultValue: "md"
+  }
+};
+
+// src/components/Button/Button.framer.ts
+import { ControlType as ControlType6 } from "framer";
 var buttonPropertyControls = {
   // NOT working
   // children: {
@@ -43063,109 +43068,109 @@ var buttonPropertyControls = {
   // },
   text: {
     title: "Text",
-    type: ControlType5.String,
+    type: ControlType6.String,
     defaultValue: "Press me"
   },
   onTap: {
-    type: ControlType5.EventHandler
+    type: ControlType6.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType5.Boolean,
+    type: ControlType6.Boolean,
     defaultValue: false
   },
   color: {
     title: "Color",
-    type: ControlType5.Enum,
+    type: ControlType6.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
   },
   variant: {
     title: "Variant",
-    type: ControlType5.Enum,
+    type: ControlType6.Enum,
     options: ["solid", "outlined", "soft", "plain"]
   },
   loading: {
     title: "Loading",
-    type: ControlType5.Boolean,
+    type: ControlType6.Boolean,
     defaultValue: false
   },
   endDecorator: {
     title: "End Decorator",
-    type: ControlType5.ComponentInstance
+    type: ControlType6.ComponentInstance
   },
   startDecorator: {
     title: "Start Decorator",
-    type: ControlType5.ComponentInstance
+    type: ControlType6.ComponentInstance
   },
   size: {
     title: "Size",
-    type: ControlType5.Enum,
+    type: ControlType6.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   },
   // for withModal
   modalContents: {
     title: "Modal Contents",
-    type: ControlType5.Array,
+    type: ControlType6.Array,
     control: {
-      type: ControlType5.ComponentInstance
+      type: ControlType6.ComponentInstance
     }
   }
 };
 
 // src/components/Checkbox/Checkbox.framer.ts
-import { ControlType as ControlType6 } from "framer";
+import { ControlType as ControlType7 } from "framer";
 var checkboxPropertyControls = {
   onChange: {
     title: "onChange",
-    type: ControlType6.EventHandler
+    type: ControlType7.EventHandler
   },
   defaultChecked: {
     title: "Checked",
-    type: ControlType6.Boolean,
+    type: ControlType7.Boolean,
     defaultValue: false
   },
   disabled: {
     title: "Disabled",
-    type: ControlType6.Boolean,
+    type: ControlType7.Boolean,
     defaultValue: false
   },
   label: {
     title: "Label",
-    type: ControlType6.String,
+    type: ControlType7.String,
     defaultValue: "Label"
   },
   color: {
     title: "Color",
-    type: ControlType6.Enum,
+    type: ControlType7.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
   },
   size: {
     title: "Size",
-    type: ControlType6.Enum,
+    type: ControlType7.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   },
   variant: {
     title: "Variant",
-    type: ControlType6.Enum,
+    type: ControlType7.Enum,
     options: ["outlined", "plain", "solid", "soft"],
     defaultValue: void 0
   }
 };
 
 // src/components/Calendar/Calendar.framer.ts
-import { ControlType as ControlType7 } from "framer";
+import { ControlType as ControlType8 } from "framer";
 var calendarPropertyControls = {
   onChange: {
     title: "onChange",
-    type: ControlType7.EventHandler
+    type: ControlType8.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType7.Boolean,
+    type: ControlType8.Boolean,
     defaultValue: false
   }
   // color: {
@@ -43189,38 +43194,38 @@ var calendarPropertyControls = {
 };
 
 // src/components/Chip/Chip.framer.ts
-import { ControlType as ControlType8 } from "framer";
+import { ControlType as ControlType9 } from "framer";
 var chipPropertyControls = {
   text: {
     title: "Text",
-    type: ControlType8.String,
+    type: ControlType9.String,
     defaultValue: "Chip"
   },
   color: {
     title: "Color",
-    type: ControlType8.Enum,
+    type: ControlType9.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
   },
   variant: {
     title: "Variant",
-    type: ControlType8.Enum,
+    type: ControlType9.Enum,
     options: ["solid", "outlined", "soft", "plain"]
   },
   size: {
     title: "Size",
-    type: ControlType8.Enum,
+    type: ControlType9.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   }
 };
 
 // src/components/DataTable/DataTable.framer.ts
-import { ControlType as ControlType9 } from "framer";
+import { ControlType as ControlType10 } from "framer";
 var dataTablePropertyControls = {
   csvUrl: {
     title: "CSV Data",
-    type: ControlType9.File,
+    type: ControlType10.File,
     allowedFileTypes: ["csv"]
     // NOT WORKING
     // defaultValue:
@@ -43228,43 +43233,43 @@ var dataTablePropertyControls = {
   },
   checkboxSelection: {
     title: "Show Checkbox",
-    type: ControlType9.Boolean,
+    type: ControlType10.Boolean,
     defaultValue: true
   },
   noWrap: {
-    type: ControlType9.Boolean,
+    type: ControlType10.Boolean,
     defaultValue: false
   },
   hoverRow: {
-    type: ControlType9.Boolean,
+    type: ControlType10.Boolean,
     defaultValue: true
   },
   stripe: {
-    type: ControlType9.Enum,
+    type: ControlType10.Enum,
     options: [void 0, "odd", "even"],
     optionTitles: ["None", "Odd", "Even"],
     defaultValue: void 0
   },
   columns: {
-    type: ControlType9.Array,
+    type: ControlType10.Array,
     description: "Column\uC758 \uC0C1\uC138 \uC124\uC815\uC774 \uD544\uC694\uD55C \uACBD\uC6B0 \uC0AC\uC6A9",
     control: {
-      type: ControlType9.Object,
+      type: ControlType10.Object,
       controls: {
         field: {
-          type: ControlType9.String,
+          type: ControlType10.String,
           description: "Column Name. CSV\uC5D0 \uC788\uB294 \uAC12\uC744 \uADF8\uB300\uB85C \uB123\uC5B4\uC57C \uD55C\uB2E4."
         },
         width: {
-          type: ControlType9.String
+          type: ControlType10.String
         },
         type: {
-          type: ControlType9.Enum,
+          type: ControlType10.Enum,
           defaultValue: "string",
           options: ["string", "number"]
         },
         resizable: {
-          type: ControlType9.Boolean,
+          type: ControlType10.Boolean,
           defaultValue: true
         }
       }
@@ -43276,288 +43281,288 @@ var dataTablePropertyControls = {
   //   defaultValue: 20,
   // },
   stickyHeader: {
-    type: ControlType9.Boolean,
+    type: ControlType10.Boolean,
     defaultValue: false
   },
   stickyFooter: {
-    type: ControlType9.Boolean,
+    type: ControlType10.Boolean,
     defaultValue: false
   },
   onPaginationModelChange: {
-    type: ControlType9.EventHandler
+    type: ControlType10.EventHandler
   },
   onSelectionModelChange: {
-    type: ControlType9.EventHandler
+    type: ControlType10.EventHandler
   },
   toolbar: {
-    type: ControlType9.ComponentInstance
+    type: ControlType10.ComponentInstance
   }
 };
 
 // src/components/DatePicker/DatePicker.framer.ts
-import { ControlType as ControlType10 } from "framer";
+import { ControlType as ControlType11 } from "framer";
 var datePickerPropertyControls = {
   onChange: {
     title: "onChange",
-    type: ControlType10.EventHandler
+    type: ControlType11.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType10.Boolean,
+    type: ControlType11.Boolean,
     defaultValue: false
   },
   value: {
     title: "Value",
-    type: ControlType10.String,
+    type: ControlType11.String,
     defaultValue: "2024/04/03"
   },
   label: {
     title: "Label",
-    type: ControlType10.String,
+    type: ControlType11.String,
     defaultValue: ""
   },
   error: {
     title: "Error",
-    type: ControlType10.Boolean,
+    type: ControlType11.Boolean,
     defaultValue: false
   },
   helperText: {
     title: "Helper Text",
-    type: ControlType10.String,
+    type: ControlType11.String,
     defaultValue: ""
   },
   minDate: {
     title: "Minimum Date",
-    type: ControlType10.Date
+    type: ControlType11.Date
   },
   maxDate: {
     title: "Maximum Date",
-    type: ControlType10.Date
+    type: ControlType11.Date
   },
   disableFuture: {
     title: "Disable Future",
-    type: ControlType10.Boolean,
+    type: ControlType11.Boolean,
     defaultValue: false
   },
   disablePast: {
     title: "Disable Past",
-    type: ControlType10.Boolean,
+    type: ControlType11.Boolean,
     defaultValue: false
   }
 };
 
 // src/components/DateRangePicker/DateRangePicker.framer.ts
-import { ControlType as ControlType11 } from "framer";
+import { ControlType as ControlType12 } from "framer";
 var dateRangePickerPropertyControls = {
   onChange: {
     title: "onChange",
-    type: ControlType11.EventHandler
+    type: ControlType12.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType11.Boolean,
+    type: ControlType12.Boolean,
     defaultValue: false
   },
   value: {
     title: "Value",
-    type: ControlType11.String,
+    type: ControlType12.String,
     defaultValue: "2024/04/03 - 2024/04/20"
   },
   label: {
     title: "Label",
-    type: ControlType11.String,
+    type: ControlType12.String,
     defaultValue: ""
   },
   error: {
     title: "Error",
-    type: ControlType11.Boolean,
+    type: ControlType12.Boolean,
     defaultValue: false
   },
   helperText: {
     title: "Helper Text",
-    type: ControlType11.String,
+    type: ControlType12.String,
     defaultValue: ""
   },
   minDate: {
     title: "Minimum Date",
-    type: ControlType11.Date
+    type: ControlType12.Date
   },
   maxDate: {
     title: "Maximum Date",
-    type: ControlType11.Date
+    type: ControlType12.Date
   },
   disableFuture: {
     title: "Disable Future",
-    type: ControlType11.Boolean,
+    type: ControlType12.Boolean,
     defaultValue: false
   },
   disablePast: {
     title: "Disable Past",
-    type: ControlType11.Boolean,
+    type: ControlType12.Boolean,
     defaultValue: false
   }
 };
 
 // src/components/DialogFrame/DialogFrame.framer.ts
-import { ControlType as ControlType12 } from "framer";
+import { ControlType as ControlType13 } from "framer";
 var dialogFramePropertyControls = {
   title: {
-    type: ControlType12.String,
+    type: ControlType13.String,
     defaultValue: "Title"
   },
   content: {
     title: "Content",
-    type: ControlType12.ComponentInstance
+    type: ControlType13.ComponentInstance
   },
   actions: {
     title: "Actions",
-    type: ControlType12.ComponentInstance
+    type: ControlType13.ComponentInstance
   },
   size: {
     title: "Size",
-    type: ControlType12.Enum,
+    type: ControlType13.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   }
 };
 
 // src/components/Divider/Divider.framer.ts
-import { ControlType as ControlType13 } from "framer";
+import { ControlType as ControlType14 } from "framer";
 var dividerPropertyControls = {
   text: {
-    type: ControlType13.String,
+    type: ControlType14.String,
     defaultValue: void 0
   },
   orientation: {
     title: "Orientation",
-    type: ControlType13.Enum,
+    type: ControlType14.Enum,
     options: ["horizontal", "vertical"]
   }
 };
 
 // src/components/IconButton/IconButton.framer.ts
-import { ControlType as ControlType14 } from "framer";
+import { ControlType as ControlType15 } from "framer";
 var iconButtonPropertyControls = {
   icon: {
     title: "Icon",
-    type: ControlType14.ComponentInstance
+    type: ControlType15.ComponentInstance
   },
   onClick: {
     title: "onClick",
-    type: ControlType14.EventHandler
+    type: ControlType15.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType14.Boolean,
+    type: ControlType15.Boolean,
     defaultValue: false
   },
   color: {
     title: "Color",
-    type: ControlType14.Enum,
+    type: ControlType15.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
   },
   variant: {
     title: "Variant",
-    type: ControlType14.Enum,
+    type: ControlType15.Enum,
     options: ["solid", "outlined", "soft", "plain"]
   },
   size: {
     title: "Size",
-    type: ControlType14.Enum,
+    type: ControlType15.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   }
 };
 
 // src/components/Input/Input.framer.ts
-import { ControlType as ControlType15 } from "framer";
+import { ControlType as ControlType16 } from "framer";
 var inputPropertyControls = {
   label: {
     title: "Label",
-    type: ControlType15.String
+    type: ControlType16.String
   },
   helperText: {
     title: "Helper Text",
-    type: ControlType15.String
+    type: ControlType16.String
   },
   error: {
     title: "Error",
-    type: ControlType15.Boolean,
+    type: ControlType16.Boolean,
     defaultValue: false
   },
   onChange: {
-    type: ControlType15.EventHandler
+    type: ControlType16.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType15.Boolean,
+    type: ControlType16.Boolean,
     defaultValue: false
   },
   color: {
     title: "Color",
-    type: ControlType15.Enum,
+    type: ControlType16.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"],
     defaultValue: "neutral"
   },
   variant: {
     title: "Variant",
-    type: ControlType15.Enum,
+    type: ControlType16.Enum,
     options: ["solid", "outlined", "soft", "plain"],
     defaultValue: "outlined"
   },
   defaultValue: {
     title: "Value",
-    type: ControlType15.String,
+    type: ControlType16.String,
     defaultValue: ""
   },
   placeholder: {
     title: "Placeholder",
-    type: ControlType15.String,
+    type: ControlType16.String,
     defaultValue: "Type in here..."
   },
   endDecorator: {
     title: "End Decorator",
-    type: ControlType15.ComponentInstance
+    type: ControlType16.ComponentInstance
   },
   startDecorator: {
     title: "Start Decorator",
-    type: ControlType15.ComponentInstance
+    type: ControlType16.ComponentInstance
   },
   size: {
     title: "Size",
-    type: ControlType15.Enum,
+    type: ControlType16.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   }
 };
 
 // src/components/MenuButton/MenuButton.framer.ts
-import { ControlType as ControlType16 } from "framer";
+import { ControlType as ControlType17 } from "framer";
 var menuButtonPropertyControls = {
   buttonText: {
     title: "Button Text",
-    type: ControlType16.String,
+    type: ControlType17.String,
     defaultValue: "text"
   },
   showIcon: {
-    type: ControlType16.Boolean,
+    type: ControlType17.Boolean,
     defaultValue: false
   },
   size: {
-    type: ControlType16.Enum,
+    type: ControlType17.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "sm"
   },
   items: {
     title: "Items",
-    type: ControlType16.Array,
+    type: ControlType17.Array,
     control: {
-      type: ControlType16.Object,
+      type: ControlType17.Object,
       controls: {
         text: {
-          type: ControlType16.String
+          type: ControlType17.String
         }
       }
     },
@@ -43566,104 +43571,104 @@ var menuButtonPropertyControls = {
 };
 
 // src/components/Modal/Modal.framer.ts
-import { ControlType as ControlType17 } from "framer";
+import { ControlType as ControlType18 } from "framer";
 var modalFramePropertyControls = {
   title: {
-    type: ControlType17.String,
+    type: ControlType18.String,
     defaultValue: "Title"
   },
   content: {
     title: "Content",
-    type: ControlType17.ComponentInstance
+    type: ControlType18.ComponentInstance
   },
   size: {
     title: "Size",
-    type: ControlType17.Enum,
+    type: ControlType18.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   }
 };
 
 // src/components/MonthRangePicker/MonthRangePicker.framer.ts
-import { ControlType as ControlType18 } from "framer";
+import { ControlType as ControlType19 } from "framer";
 var monthRangePickerPropertyControls = {
   onChange: {
     title: "onChange",
-    type: ControlType18.EventHandler
+    type: ControlType19.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType18.Boolean,
+    type: ControlType19.Boolean,
     defaultValue: false
   },
   value: {
     title: "Value",
-    type: ControlType18.String,
+    type: ControlType19.String,
     defaultValue: "2024/04 - 2024/07"
   },
   label: {
     title: "Label",
-    type: ControlType18.String,
+    type: ControlType19.String,
     defaultValue: ""
   },
   error: {
     title: "Error",
-    type: ControlType18.Boolean,
+    type: ControlType19.Boolean,
     defaultValue: false
   },
   helperText: {
     title: "Helper Text",
-    type: ControlType18.String,
+    type: ControlType19.String,
     defaultValue: ""
   },
   minDate: {
     title: "Minimum Date",
-    type: ControlType18.Date
+    type: ControlType19.Date
   },
   maxDate: {
     title: "Maximum Date",
-    type: ControlType18.Date
+    type: ControlType19.Date
   },
   disableFuture: {
     title: "Disable Future",
-    type: ControlType18.Boolean,
+    type: ControlType19.Boolean,
     defaultValue: false
   },
   disablePast: {
     title: "Disable Past",
-    type: ControlType18.Boolean,
+    type: ControlType19.Boolean,
     defaultValue: false
   }
 };
 
 // src/components/RadioList/RadioList.framer.ts
-import { ControlType as ControlType19 } from "framer";
+import { ControlType as ControlType20 } from "framer";
 var radioListPropertyControls = {
   orientation: {
     title: "Orientation",
-    type: ControlType19.Enum,
+    type: ControlType20.Enum,
     options: ["vertical", "horizontal"],
     defaultValue: "vertical"
   },
   defaultValue: {
     title: "Checked Value",
-    type: ControlType19.String,
+    type: ControlType20.String,
     defaultValue: "value1"
   },
   items: {
     title: "Items",
-    type: ControlType19.Array,
+    type: ControlType20.Array,
     control: {
-      type: ControlType19.Object,
+      type: ControlType20.Object,
       controls: {
         displayName: {
           title: "Display Name",
-          type: ControlType19.String
+          type: ControlType20.String
         },
-        value: { title: "Value", type: ControlType19.String },
+        value: { title: "Value", type: ControlType20.String },
         color: {
           title: "Color",
-          type: ControlType19.Enum,
+          type: ControlType20.Enum,
           options: ["primary", "neutral", "danger", "success", "warning"],
           optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
         }
@@ -43681,73 +43686,73 @@ var radioListPropertyControls = {
 };
 
 // src/components/Select/Select.framer.ts
-import { ControlType as ControlType20 } from "framer";
+import { ControlType as ControlType21 } from "framer";
 var selectPropertyControls = {
   label: {
     title: "Label",
-    type: ControlType20.String
+    type: ControlType21.String
   },
   helperText: {
     title: "Helper Text",
-    type: ControlType20.String
+    type: ControlType21.String
   },
   error: {
     title: "Error",
-    type: ControlType20.Boolean,
+    type: ControlType21.Boolean,
     defaultValue: false
   },
   onChange: {
     title: "onChange",
-    type: ControlType20.EventHandler
+    type: ControlType21.EventHandler
   },
   defaultListboxOpen: {
     title: "Opened",
-    type: ControlType20.Boolean,
+    type: ControlType21.Boolean,
     defaultValue: false
   },
   defaultValue: {
     title: "Selected Option",
-    type: ControlType20.String
+    type: ControlType21.String
   },
   disabled: {
     title: "Disabled",
-    type: ControlType20.Boolean,
+    type: ControlType21.Boolean,
     defaultValue: false
   },
   placeholder: {
     title: "Placeholder",
-    type: ControlType20.String,
+    type: ControlType21.String,
     defaultValue: "Choose one..."
   },
   color: {
     title: "Color",
-    type: ControlType20.Enum,
+    type: ControlType21.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
   },
   size: {
     title: "Size",
-    type: ControlType20.Enum,
+    type: ControlType21.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   },
   variant: {
     title: "Variant",
-    type: ControlType20.Enum,
+    type: ControlType21.Enum,
     options: ["outlined", "plain", "solid", "soft"],
     defaultValue: void 0
   },
   options: {
     title: "Options",
-    type: ControlType20.Array,
+    type: ControlType21.Array,
     control: {
-      type: ControlType20.Object,
+      type: ControlType21.Object,
       controls: {
         text: {
           title: "Text",
-          type: ControlType20.String
+          type: ControlType21.String
         },
-        value: { title: "Value", type: ControlType20.String }
+        value: { title: "Value", type: ControlType21.String }
       }
     },
     defaultValue: [
@@ -43758,126 +43763,126 @@ var selectPropertyControls = {
 };
 
 // src/components/Sheet/Sheet.framer.ts
-import { ControlType as ControlType21 } from "framer";
+import { ControlType as ControlType22 } from "framer";
 var sheetPropertyControls = {
   color: {
     title: "Color",
-    type: ControlType21.Enum,
+    type: ControlType22.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
   },
   variant: {
     title: "Variant",
-    type: ControlType21.Enum,
+    type: ControlType22.Enum,
     options: ["solid", "outlined", "soft", "plain"],
     defaultValue: "outlined"
   }
 };
 
 // src/components/Skeleton/Skeleton.framer.ts
-import { ControlType as ControlType22 } from "framer";
+import { ControlType as ControlType23 } from "framer";
 var skeletonPropertyControls = {
   animation: {
     title: "Animation type",
-    type: ControlType22.Enum,
+    type: ControlType23.Enum,
     options: ["wave", "pulse"]
   },
   variant: {
     title: "Variant",
-    type: ControlType22.Enum,
+    type: ControlType23.Enum,
     options: ["circular", "rectangular"],
     defaultValue: "rectangular"
   },
   target: {
     title: "Target",
-    type: ControlType22.ComponentInstance
+    type: ControlType23.ComponentInstance
   },
   loading: {
     title: "Loading",
-    type: ControlType22.Boolean,
+    type: ControlType23.Boolean,
     defaultValue: false
   }
 };
 
 // src/components/Switch/Switch.framer.ts
-import { ControlType as ControlType23 } from "framer";
+import { ControlType as ControlType24 } from "framer";
 var switchPropertyControls = {
   onChange: {
     title: "onChange",
-    type: ControlType23.EventHandler
+    type: ControlType24.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType23.Boolean,
+    type: ControlType24.Boolean,
     defaultValue: false
   },
   color: {
     title: "Color",
-    type: ControlType23.Enum,
+    type: ControlType24.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
   },
   variant: {
     title: "Variant",
-    type: ControlType23.Enum,
+    type: ControlType24.Enum,
     options: ["solid", "outlined", "soft", "plain"],
     defaultValue: void 0
   },
   size: {
     title: "Size",
-    type: ControlType23.Enum,
+    type: ControlType24.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   }
 };
 
 // src/components/Tabs/Tabs.framer.ts
-import { ControlType as ControlType24 } from "framer";
+import { ControlType as ControlType25 } from "framer";
 var tabsPropertyControls = {
   color: {
     title: "Color",
-    type: ControlType24.Enum,
+    type: ControlType25.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"]
   },
   size: {
     title: "Size",
-    type: ControlType24.Enum,
+    type: ControlType25.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   },
   variant: {
     title: "Variant",
-    type: ControlType24.Enum,
+    type: ControlType25.Enum,
     options: ["outlined", "plain", "solid", "soft"],
     defaultValue: "plain"
   },
   orientation: {
-    type: ControlType24.Enum,
+    type: ControlType25.Enum,
     options: ["horizontal", "vertical"]
   },
   disableUnderline: {
-    type: ControlType24.Boolean,
+    type: ControlType25.Boolean,
     defaultValue: false
   },
   disableIndicator: {
-    type: ControlType24.Boolean,
+    type: ControlType25.Boolean,
     defaultValue: false
   },
   indicatorInset: {
-    type: ControlType24.Boolean,
+    type: ControlType25.Boolean,
     defaultValue: false
   },
   tabs: {
-    type: ControlType24.Array,
+    type: ControlType25.Array,
     control: {
-      type: ControlType24.Object,
+      type: ControlType25.Object,
       controls: {
         title: {
-          type: ControlType24.String
+          type: ControlType25.String
         },
         disabled: {
-          type: ControlType24.Boolean,
+          type: ControlType25.Boolean,
           defaultValue: false
         }
       }
@@ -43885,65 +43890,65 @@ var tabsPropertyControls = {
   },
   contents: {
     title: "Contents",
-    type: ControlType24.Array,
+    type: ControlType25.Array,
     control: {
-      type: ControlType24.ComponentInstance
+      type: ControlType25.ComponentInstance
     }
   }
 };
 
 // src/components/Textarea/Textarea.framer.ts
-import { ControlType as ControlType25 } from "framer";
+import { ControlType as ControlType26 } from "framer";
 var textareaPropertyControls = {
   onChange: {
-    type: ControlType25.EventHandler
+    type: ControlType26.EventHandler
   },
   disabled: {
     title: "Disabled",
-    type: ControlType25.Boolean,
+    type: ControlType26.Boolean,
     defaultValue: false
   },
   color: {
     title: "Color",
-    type: ControlType25.Enum,
+    type: ControlType26.Enum,
     options: ["primary", "neutral", "danger", "success", "warning"],
     optionTitles: ["Primary", "Neutral", "Danger", "Success", "Warning"],
     defaultValue: "neutral"
   },
   variant: {
     title: "Variant",
-    type: ControlType25.Enum,
+    type: ControlType26.Enum,
     options: ["solid", "outlined", "soft", "plain"],
     defaultValue: "outlined"
   },
   defaultValue: {
     title: "Value",
-    type: ControlType25.String,
+    type: ControlType26.String,
     defaultValue: ""
   },
   placeholder: {
     title: "Placeholder",
-    type: ControlType25.String,
+    type: ControlType26.String,
     defaultValue: "Type in here..."
   },
   endDecorator: {
     title: "End Decorator",
-    type: ControlType25.ComponentInstance
+    type: ControlType26.ComponentInstance
   },
   startDecorator: {
     title: "Start Decorator",
-    type: ControlType25.ComponentInstance
+    type: ControlType26.ComponentInstance
   },
   size: {
     title: "Size",
-    type: ControlType25.Enum,
+    type: ControlType26.Enum,
     options: ["sm", "md", "lg"],
     defaultValue: "md"
   }
 };
 
 // src/components/Typography/Typography.framer.ts
-import { ControlType as ControlType26 } from "framer";
+import { ControlType as ControlType27 } from "framer";
 var typographyPropertyControls = {
   // color: {
   //     title: "Color",
@@ -43953,7 +43958,7 @@ var typographyPropertyControls = {
   // },
   level: {
     title: "Level",
-    type: ControlType26.Enum,
+    type: ControlType27.Enum,
     options: [
       "h1",
       "h2",
@@ -43972,7 +43977,7 @@ var typographyPropertyControls = {
   },
   textColor: {
     title: "Text Color",
-    type: ControlType26.Enum,
+    type: ControlType27.Enum,
     options: [
       "text.primary",
       "text.secondary",
@@ -43986,17 +43991,17 @@ var typographyPropertyControls = {
   },
   text: {
     title: "Text",
-    type: ControlType26.String,
+    type: ControlType27.String,
     defaultValue: "Typography",
     displayTextArea: true
   },
   endDecorator: {
     title: "End Decorator",
-    type: ControlType26.ComponentInstance
+    type: ControlType27.ComponentInstance
   },
   startDecorator: {
     title: "Start Decorator",
-    type: ControlType26.ComponentInstance
+    type: ControlType27.ComponentInstance
   }
 };
 export {
@@ -44101,6 +44106,7 @@ export {
   badgePropertyControls,
   boxClasses_default as boxClasses,
   breadcrumbsClasses_default as breadcrumbsClasses,
+  breadcrumbsPropertyControls,
   buttonClasses_default as buttonClasses,
   buttonPropertyControls,
   calendarPropertyControls,

package/package.json

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