@deepnoid/ui 1.0.21 → 1.0.23

package/dist/{chunk-KAB3AB67.mjs → chunk-AZ5QZAO6.mjs}

@@ -1,19 +1,19 @@
 "use client";
 import {
   pagination_default
-} from "./chunk-WS4SOWDZ.mjs";
+} from "./chunk-AHKNFPHN.mjs";
 import {
   checkbox_default
-} from "./chunk-37BZALDV.mjs";
+} from "./chunk-RZD3NZIL.mjs";
 import {
   scrollArea_default
-} from "./chunk-XS32UZI3.mjs";
+} from "./chunk-YYWOSKGH.mjs";
 import {
   clsx
-} from "./chunk-27Y6K5NK.mjs";
+} from "./chunk-KJFYLLMP.mjs";
 import {
   mapPropsVariants
-} from "./chunk-E3G5QXSH.mjs";
+} from "./chunk-UWT2WB6H.mjs";
 
 // src/components/table/table-head.tsx
 import { useLayoutEffect as useLayoutEffect2, useRef as useRef3, useState as useState3 } from "react";
@@ -56,8 +56,8 @@ function TableCell({
   return /* @__PURE__ */ jsx(
     "td",
     {
-      ref: tdRef,
       className: clsx(slots.td(), classNames == null ? void 0 : classNames.td, column.className, isTextContent && "truncate"),
+      ref: tdRef,
       style: {
         ...getCellStyle(column),
         maxWidth: column.width || "150px",
@@ -81,7 +81,7 @@ function TableCell({
     `${row.id}-${column.field}-${colIdx}-${rowIndex}`
   );
 }
-var TableBody = ({
+function TableBody({
   slots,
   rows,
   columns,
@@ -95,37 +95,41 @@ var TableBody = ({
   emptyContent,
   classNames,
   className
-}) => {
+}) {
   const renderCheckboxCell = (rowId, rowIndex) => /* @__PURE__ */ jsx(
     "td",
     {
       className: clsx(slots.td({ class: classNames == null ? void 0 : classNames.td }), "text-center"),
       style: { width: "40px", minWidth: "40px", textAlign: "center" },
-      children: /* @__PURE__ */ jsx("div", { "data-checkbox": true, className: "flex h-full w-full items-center justify-center", children: /* @__PURE__ */ jsx(checkbox_default, { size, checked: checkedRows.has(rowId), onChange: (e) => onCheckRow(rowId, e.target.checked) }) })
+      children: /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center", "data-checkbox": true, children: /* @__PURE__ */ jsx(checkbox_default, { checked: checkedRows.has(rowId), onChange: (e) => {
+        onCheckRow(rowId, e.target.checked);
+      }, size }) })
     },
     `checkbox-${rowId}-${rowIndex}`
   );
-  const renderEmptyRow = () => /* @__PURE__ */ jsx("tr", { className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }), children: /* @__PURE__ */ jsx("td", { colSpan: columns.length + (rowCheckbox ? 1 : 0), className: slots.empty({ class: classNames == null ? void 0 : classNames.empty }), children: emptyContent }) });
+  const renderEmptyRow = () => /* @__PURE__ */ jsx("tr", { className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }), children: /* @__PURE__ */ jsx("td", { className: slots.empty({ class: classNames == null ? void 0 : classNames.empty }), colSpan: columns.length + (rowCheckbox ? 1 : 0), children: emptyContent }) });
   const renderDataRow = (row, rowIndex) => /* @__PURE__ */ jsxs(
     "tr",
     {
       className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }),
       "data-checked": checkedRows.has(row.id),
-      onClick: typeof onRowClick === "function" ? (event) => onRowClick(row, rowIndex, event) : void 0,
+      onClick: typeof onRowClick === "function" ? (event) => {
+        onRowClick(row, rowIndex, event);
+      } : void 0,
       children: [
         columns.map((column, colIdx) => /* @__PURE__ */ jsx(
           TableCell,
           {
-            row,
-            column,
+            classNames,
             colIdx,
+            column,
+            row,
             rowIndex,
-            slots,
-            classNames
+            slots
           },
           `${row.id}-${column.field}-${colIdx}`
         )),
-        rowCheckbox && renderCheckboxCell(row.id, rowIndex)
+        rowCheckbox ? renderCheckboxCell(row.id, rowIndex) : null
       ]
     },
     `${row.id}-${rowIndex}`
@@ -142,7 +146,7 @@ var TableBody = ({
       children: !rows.length && emptyContent ? renderEmptyRow() : rows.map((row, index) => renderDataRow(row, index))
     }
   );
-};
+}
 var table_body_default = TableBody;
 
 // src/components/table/table.tsx
@@ -233,13 +237,13 @@ var Table = forwardRef((originalProps, ref) => {
     () => tableStyle({ ...variantProps, rowClickable: typeof onRowClick === "function" }),
     [variantProps, onRowClick]
   );
-  return /* @__PURE__ */ jsxs2("div", { "data-table": "base", className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: [
+  return /* @__PURE__ */ jsxs2("div", { className: slots.base({ class: classNames == null ? void 0 : classNames.base }), "data-table": "base", children: [
     /* @__PURE__ */ jsxs2(
       scrollArea_default,
       {
+        className: slots.scroll({ class: classNames == null ? void 0 : classNames.scroll }),
         direction: "both",
         size: size === "xl" ? "lg" : size,
-        className: slots.scroll({ class: classNames == null ? void 0 : classNames.scroll }),
         children: [
           /* @__PURE__ */ jsxs2(
             "table",
@@ -254,55 +258,55 @@ var Table = forwardRef((originalProps, ref) => {
                 /* @__PURE__ */ jsx2(
                   table_head_default,
                   {
-                    columns,
-                    size,
+                    classNames,
                     color,
-                    rowCheckbox,
+                    columns,
                     hasCheckedRows: rows.length > 0 && rows.every((row) => checkedRowIds.has(row.id)),
                     onCheckAll: handleAllRowCheck,
-                    classNames,
+                    rowCheckbox,
+                    size,
                     slots
                   }
                 ),
                 /* @__PURE__ */ jsx2(
                   table_body_default,
                   {
-                    slots,
-                    rows,
-                    columns,
-                    size,
-                    color,
-                    rowCheckbox,
                     checkedRows: checkedRowIds,
+                    classNames,
+                    color,
+                    columns,
+                    emptyContent,
+                    isLoading,
                     onCheckRow: handleRowCheck,
                     onRowClick: handleRowClick,
-                    isLoading,
-                    emptyContent,
-                    classNames
+                    rowCheckbox,
+                    rows,
+                    size,
+                    slots
                   }
                 )
               ]
             }
           ),
-          isLoading && /* @__PURE__ */ jsx2("div", { className: slots.overlay({ class: classNames == null ? void 0 : classNames.overlay }) })
+          isLoading ? /* @__PURE__ */ jsx2("div", { className: slots.overlay({ class: classNames == null ? void 0 : classNames.overlay }) }) : null
         ]
       }
     ),
-    showPagination && /* @__PURE__ */ jsx2("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx2(
+    showPagination ? /* @__PURE__ */ jsx2("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx2(
       pagination_default,
       {
-        variant: variant === "outline" ? "solid" : variant,
         color,
-        size: "sm",
         currentPage: page,
-        totalPage: Math.ceil(totalData / (perPage || 1)),
         groupSize: paginationGroupSize,
+        handleChangePage: (newPage) => onPageChange == null ? void 0 : onPageChange({ page: newPage, perPage }),
         showFirstLastButtons,
         showPageLabel,
         showPageNumber,
-        handleChangePage: (newPage) => onPageChange == null ? void 0 : onPageChange({ page: newPage, perPage })
+        size: "sm",
+        totalPage: Math.ceil(totalData / (perPage || 1)),
+        variant: variant === "outline" ? "solid" : variant
       }
-    ) })
+    ) }) : null
   ] });
 });
 Table.displayName = "Table";
@@ -568,12 +572,12 @@ function TableHeaderCell({
   return /* @__PURE__ */ jsx3(
     "th",
     {
-      ref: thRef,
       className: clsx(
         slots.th({ class: classNames == null ? void 0 : classNames.th }),
         column == null ? void 0 : column.className,
         !isCheckbox && isTextContent && "truncate"
       ),
+      ref: thRef,
       style: isCheckbox ? {
         width: "40px",
         minWidth: "40px",
@@ -598,7 +602,7 @@ function TableHeaderCell({
     }
   );
 }
-var TableHead = ({
+function TableHead({
   slots,
   columns,
   size,
@@ -606,37 +610,39 @@ var TableHead = ({
   hasCheckedRows,
   classNames,
   onCheckAll
-}) => {
+}) {
   return /* @__PURE__ */ jsx3("thead", { className: slots.thead({ class: classNames == null ? void 0 : classNames.thead }), children: /* @__PURE__ */ jsxs3("tr", { className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }), children: [
     columns.map((column, idx) => /* @__PURE__ */ jsx3(
       TableHeaderCell,
       {
-        content: column.headerName,
+        classNames,
         column,
-        slots,
-        classNames
+        content: column.headerName,
+        slots
       },
       `${column.field}-${idx}`
     )),
-    rowCheckbox && /* @__PURE__ */ jsx3(
+    rowCheckbox ? /* @__PURE__ */ jsx3(
       TableHeaderCell,
       {
-        content: /* @__PURE__ */ jsx3("div", { "data-checkbox": true, className: "flex h-full w-full items-center justify-center", children: /* @__PURE__ */ jsx3(
+        classNames,
+        content: /* @__PURE__ */ jsx3("div", { className: "flex h-full w-full items-center justify-center", "data-checkbox": true, children: /* @__PURE__ */ jsx3(
           checkbox_default,
           {
-            size,
             checked: hasCheckedRows,
-            onChange: (e) => onCheckAll(e.target.checked)
+            onChange: (e) => {
+              onCheckAll(e.target.checked);
+            },
+            size
           }
         ) }),
         isCheckbox: true,
-        slots,
-        classNames
+        slots
       },
       "checkbox"
-    )
+    ) : null
   ] }) });
-};
+}
 var table_head_default = TableHead;
 
 export {

package/dist/{chunk-D7DDV4UN.mjs → chunk-B2LJEDXL.mjs}

@@ -1,10 +1,10 @@
 "use client";
 import {
   Icon_default
-} from "./chunk-A6UUVHC6.mjs";
+} from "./chunk-C7OETP3D.mjs";
 import {
   mapPropsVariants
-} from "./chunk-E3G5QXSH.mjs";
+} from "./chunk-UWT2WB6H.mjs";
 import {
   tv
 } from "./chunk-UP6RPQDX.mjs";
@@ -66,22 +66,30 @@ var StarRating = forwardRef((originalProps, ref) => {
           "div",
           {
             className: slots.star({ class: classNames == null ? void 0 : classNames.star }),
-            onClick: () => handleStarClick(starIndex),
-            onMouseEnter: () => handleStarHover(starIndex)
+            onClick: () => {
+              handleStarClick(starIndex);
+            },
+            onMouseEnter: () => {
+              handleStarHover(starIndex);
+            }
           }
         ),
-        allowHalf && /* @__PURE__ */ jsx(
+        allowHalf ? /* @__PURE__ */ jsx(
           "div",
           {
             className: slots.starHalf({ class: classNames == null ? void 0 : classNames.starHalf }),
-            onClick: () => handleStarClick(starIndex, true),
-            onMouseEnter: () => handleStarHover(starIndex, true)
+            onClick: () => {
+              handleStarClick(starIndex, true);
+            },
+            onMouseEnter: () => {
+              handleStarHover(starIndex, true);
+            }
           }
-        )
+        ) : null
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-        (isFull || isPartial) && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Icon_default, { name: "star", fill: true, className: emptyColor, size }),
+        isFull || isPartial ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Icon_default, { className: emptyColor, fill: true, name: "star", size }),
           /* @__PURE__ */ jsx(
             "div",
             {
@@ -89,15 +97,15 @@ var StarRating = forwardRef((originalProps, ref) => {
               style: {
                 clipPath: isFull ? "none" : `inset(0 ${100 - fillPercentage}% 0 0)`
               },
-              children: /* @__PURE__ */ jsx(Icon_default, { name: "star", fill: true, className: filledColor, size })
+              children: /* @__PURE__ */ jsx(Icon_default, { className: filledColor, fill: true, name: "star", size })
             }
           )
-        ] }),
-        isEmpty && /* @__PURE__ */ jsx(Icon_default, { name: "star", fill: true, className: emptyColor, size })
+        ] }) : null,
+        isEmpty ? /* @__PURE__ */ jsx(Icon_default, { className: emptyColor, fill: true, name: "star", size }) : null
       ] })
     ] }, starIndex);
   };
-  return /* @__PURE__ */ jsx("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), onMouseLeave: handleMouseLeave, children: createRange(stars).map(renderStar) });
+  return /* @__PURE__ */ jsx("div", { className: slots.base({ class: classNames == null ? void 0 : classNames.base }), onMouseLeave: handleMouseLeave, ref, children: createRange(stars).map(renderStar) });
 });
 StarRating.displayName = "StarRating";
 var starRating_default = StarRating;

package/dist/{chunk-6PN3DGOE.mjs → chunk-BEFT2F7D.mjs}

@@ -1,12 +1,12 @@
 "use client";
 import {
   clsx
-} from "./chunk-27Y6K5NK.mjs";
+} from "./chunk-KJFYLLMP.mjs";
 
 // src/components/skeleton/skeleton.tsx
 import { tv } from "tailwind-variants";
 import { jsx } from "react/jsx-runtime";
-var Skeleton = ({ color = "primary", className, speed = "normal", rounded = "md" }) => {
+function Skeleton({ color = "primary", className, speed = "normal", rounded = "md" }) {
   const speedMap = {
     fast: "0.7s",
     normal: "1.2s",
@@ -31,7 +31,7 @@ var Skeleton = ({ color = "primary", className, speed = "normal", rounded = "md"
         ` })
     }
   );
-};
+}
 Skeleton.displayName = "Skeleton";
 var skeleton_default = Skeleton;
 var skeletonStyle = tv({

package/dist/{chunk-BJWYF2WY.mjs → chunk-C6S73EGR.mjs}

@@ -1,13 +1,13 @@
 "use client";
 import {
   Icon_default
-} from "./chunk-A6UUVHC6.mjs";
+} from "./chunk-C7OETP3D.mjs";
 import {
   clsx
-} from "./chunk-27Y6K5NK.mjs";
+} from "./chunk-KJFYLLMP.mjs";
 import {
   mapPropsVariants
-} from "./chunk-E3G5QXSH.mjs";
+} from "./chunk-UWT2WB6H.mjs";
 import {
   tv
 } from "./chunk-UP6RPQDX.mjs";
@@ -45,10 +45,9 @@ var Input = forwardRef((originalProps, ref) => {
         className: `${getContentProps().className || ""} ${existingProps.className || ""}`.trim()
       };
       return cloneElement(startContent, mergedProps);
-    } else {
-      const contentProps = getContentProps();
-      return /* @__PURE__ */ jsx("div", { ...contentProps, children: startContent });
     }
+    const contentProps = getContentProps();
+    return /* @__PURE__ */ jsx("div", { ...contentProps, children: startContent });
   };
   const renderDateTimePickerIcon = () => /* @__PURE__ */ jsx(
     "div",
@@ -59,7 +58,7 @@ var Input = forwardRef((originalProps, ref) => {
         target == null ? void 0 : target.focus();
         target == null ? void 0 : target.showPicker();
       },
-      children: /* @__PURE__ */ jsx(Icon_default, { name: props.type === "time" ? "clock" : "calendar", size: originalProps.size, className: "cursor-pointer" })
+      children: /* @__PURE__ */ jsx(Icon_default, { className: "cursor-pointer", name: props.type === "time" ? "clock" : "calendar", size: originalProps.size })
     }
   );
   const renderContentWithIcon = () => {
@@ -72,10 +71,9 @@ var Input = forwardRef((originalProps, ref) => {
       return cloneElement(endContent, mergedProps);
     } else if (errorMessage && errorMessage.length > 0) {
       const iconProps = { ...getContentProps(), className: getContentProps().className };
-      return /* @__PURE__ */ jsx("div", { ...iconProps, children: /* @__PURE__ */ jsx(Icon_default, { name: "exclamation-circle", fill: true, size: originalProps.size }) });
-    } else {
-      return /* @__PURE__ */ jsx(Fragment, {});
+      return /* @__PURE__ */ jsx("div", { ...iconProps, children: /* @__PURE__ */ jsx(Icon_default, { fill: true, name: "exclamation-circle", size: originalProps.size }) });
     }
+    return /* @__PURE__ */ jsx(Fragment, {});
   };
   const renderEndContent = () => {
     switch (props.type) {
@@ -97,7 +95,7 @@ var Input = forwardRef((originalProps, ref) => {
         variantProps.direction === "horizon" ? slots.horizon({ class: classNames == null ? void 0 : classNames.horizon }) : slots.vertical({ class: classNames == null ? void 0 : classNames.vertical })
       ),
       children: [
-        label && /* @__PURE__ */ jsx("label", { className: slots.label({ class: classNames == null ? void 0 : classNames.label }), children: label }),
+        label ? /* @__PURE__ */ jsx("label", { className: slots.label({ class: classNames == null ? void 0 : classNames.label }), children: label }) : null,
         /* @__PURE__ */ jsxs("div", { className: slots.innerWrapper({ class: classNames == null ? void 0 : classNames.innerWrapper }), children: [
           /* @__PURE__ */ jsxs(
             "div",
@@ -107,14 +105,14 @@ var Input = forwardRef((originalProps, ref) => {
                 inputProps.readOnly ? slots.readonlyWrapper({ class: classNames == null ? void 0 : classNames.readonlyWrapper }) : ""
               ),
               children: [
-                startContent && renderStartContent(),
+                startContent ? renderStartContent() : null,
                 /* @__PURE__ */ jsx(
                   "input",
                   {
                     ref: ref || inputRef,
                     ...inputProps,
-                    readOnly: props.readOnly,
                     className: clsx(slots.input({ class: classNames == null ? void 0 : classNames.input })),
+                    readOnly: props.readOnly,
                     size: 0
                   }
                 ),
@@ -122,7 +120,7 @@ var Input = forwardRef((originalProps, ref) => {
               ]
             }
           ),
-          helperMessage && !(errorMessage !== void 0) && /* @__PURE__ */ jsx(
+          helperMessage && !(errorMessage !== void 0) ? /* @__PURE__ */ jsx(
             "p",
             {
               className: clsx(
@@ -131,9 +129,9 @@ var Input = forwardRef((originalProps, ref) => {
               ),
               children: helperMessage
             }
-          ),
-          errorMessage && errorMessage.length > 0 && /* @__PURE__ */ jsx("p", { className: clsx("error", slots.errorMessage({ class: classNames == null ? void 0 : classNames.errorMessage })), children: errorMessage }),
-          errorMessage === "" && /* @__PURE__ */ jsx("p", { className: clsx("error", "sr-only"), "aria-hidden": "true" })
+          ) : null,
+          errorMessage && errorMessage.length > 0 ? /* @__PURE__ */ jsx("p", { className: clsx("error", slots.errorMessage({ class: classNames == null ? void 0 : classNames.errorMessage })), children: errorMessage }) : null,
+          errorMessage === "" && /* @__PURE__ */ jsx("p", { "aria-hidden": "true", className: clsx("error", "sr-only") })
         ] })
       ]
     }

package/dist/{chunk-A6UUVHC6.mjs → chunk-C7OETP3D.mjs}

@@ -1,12 +1,12 @@
 "use client";
 import {
   template
-} from "./chunk-AOU4QX7H.mjs";
+} from "./chunk-QOOYAQJ5.mjs";
 
 // src/components/icon/Icon.tsx
 import { jsx } from "react/jsx-runtime";
 var iconTemplate = template;
-var Icon = ({ name, size = "md", fill = false, className, onClick, ...props }) => {
+function Icon({ name, size = "md", fill = false, className, onClick, ...props }) {
   const SVGIcon = template[name];
   const getInputIconSize = (size2) => {
     switch (String(size2)) {
@@ -28,8 +28,8 @@ var Icon = ({ name, size = "md", fill = false, className, onClick, ...props }) =
         return "w-[21px] h-[21px] stroke-[1.25px]";
     }
   };
-  return /* @__PURE__ */ jsx("div", { className: `m-0 flex items-center justify-center p-0 ${className}`, onClick, children: /* @__PURE__ */ jsx(SVGIcon, { fill, className: getInputIconSize(size), ...props }) });
-};
+  return /* @__PURE__ */ jsx("div", { className: `m-0 flex items-center justify-center p-0 ${className}`, onClick, children: /* @__PURE__ */ jsx(SVGIcon, { className: getInputIconSize(size), fill, ...props }) });
+}
 var Icon_default = Icon;
 
 export {

package/dist/{chunk-5RJYESLP.mjs → chunk-EVXLGMV6.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   clsx
-} from "./chunk-27Y6K5NK.mjs";
+} from "./chunk-KJFYLLMP.mjs";
 import {
   tv
 } from "./chunk-UP6RPQDX.mjs";
@@ -9,7 +9,7 @@ import {
 // src/components/backdrop/backdrop.tsx
 import { useEffect, useState } from "react";
 import { jsx } from "react/jsx-runtime";
-var Backdrop = ({ open, onClick, className }) => {
+function Backdrop({ open, onClick, className }) {
   const [isVisible, setIsVisible] = useState(open);
   useEffect(() => {
     setIsVisible(open);
@@ -17,7 +17,7 @@ var Backdrop = ({ open, onClick, className }) => {
   if (!isVisible) return null;
   const slots = backdropStyle();
   return /* @__PURE__ */ jsx("div", { className: clsx(slots.base(), className), onClick });
-};
+}
 Backdrop.displayName = "Backdrop";
 var backdrop_default = Backdrop;
 var backdropStyle = tv({

package/dist/{chunk-3IBJXQTJ.mjs → chunk-GWOMD7ZU.mjs}

@@ -13,7 +13,7 @@ var formatStringToDate = (date) => {
 };
 var convert24To12 = (time24) => {
   const [HH, MM] = time24.split(":");
-  let h = Number(HH);
+  const h = Number(HH);
   const minute = MM || "";
   const meridiem = h >= 12 ? "PM" : "AM";
   let hour12 = h % 12;