@deepnoid/ui 0.1.26 → 0.1.27

package/dist/{chunk-MSAULFDB.mjs → chunk-E4UUZOR4.mjs}

@@ -22,8 +22,8 @@ var Select = forwardRef((originalProps, ref) => {
   const {
     label,
     options,
-    helperText,
-    errorText,
+    helperMessage,
+    errorMessage,
     classNames,
     defaultSelectedOptions = [],
     onChange,
@@ -151,8 +151,8 @@ var Select = forwardRef((originalProps, ref) => {
                 ]
               }
             ),
-            helperText && !errorText && /* @__PURE__ */ jsx("p", { className: slots.helperText({ class: classNames == null ? void 0 : classNames.helperText }), children: helperText }),
-            errorText && /* @__PURE__ */ jsx("p", { className: clsx("error", slots.errorText({ class: classNames == null ? void 0 : classNames.errorText })), children: errorText })
+            helperMessage && !errorMessage && /* @__PURE__ */ jsx("p", { className: slots.helperMessage({ class: classNames == null ? void 0 : classNames.helperMessage }), children: helperMessage }),
+            errorMessage && /* @__PURE__ */ jsx("p", { className: clsx("error", slots.errorMessage({ class: classNames == null ? void 0 : classNames.errorMessage })), children: errorMessage })
           ] })
         ]
       }
@@ -224,8 +224,8 @@ var select = tv({
     ],
     optionsWrapper: ["border", "rounded", "bg-white", "shadow", "overflow-auto"],
     option: ["flex", "justify-between", "items-center", "cursor-pointer"],
-    helperText: ["text-neutral-main"],
-    errorText: ["text-danger-main"],
+    helperMessage: ["text-neutral-main"],
+    errorMessage: ["text-danger-main"],
     readonly: ["pointer-events-none", "!bg-trans-soft"]
   },
   variants: {
@@ -248,8 +248,8 @@ var select = tv({
         selectWrapper: ["w-[240px]", "h-[24px]", "rounded-sm", "px-[4px]"],
         select: ["text-sm"],
         option: ["px-[4px]", "py-[3px]", "text-sm"],
-        helperText: ["text-sm"],
-        errorText: ["text-sm"]
+        helperMessage: ["text-sm"],
+        errorMessage: ["text-sm"]
       },
       md: {
         base: ["text-md", "gap-[6px]", "rounded-md"],
@@ -258,8 +258,8 @@ var select = tv({
         selectWrapper: ["w-[240px]", "h-[32px]", "rounded-md", "px-[6px]"],
         select: ["text-md"],
         option: ["px-[6px]", "py-[5.5px]", "text-md"],
-        helperText: ["text-sm"],
-        errorText: ["text-sm"]
+        helperMessage: ["text-sm"],
+        errorMessage: ["text-sm"]
       },
       lg: {
         base: ["text-lg", "gap-[8px]"],
@@ -268,8 +268,8 @@ var select = tv({
         selectWrapper: ["w-[240px]", "h-[40px]", "rounded-lg", "px-[8px]"],
         select: ["text-lg"],
         option: ["px-[8px]", "py-[8px]", "text-lg"],
-        helperText: ["text-md"],
-        errorText: ["text-md"]
+        helperMessage: ["text-md"],
+        errorMessage: ["text-md"]
       },
       xl: {
         base: ["text-xl", "gap-[10px]"],
@@ -278,8 +278,8 @@ var select = tv({
         selectWrapper: ["w-[240px]", "h-[50px]", "rounded-lg", "px-[10px]"],
         select: ["text-xl"],
         option: ["px-[10px]", "py-[11.5px]"],
-        helperText: ["text-md"],
-        errorText: ["text-md"]
+        helperMessage: ["text-md"],
+        errorMessage: ["text-md"]
       }
     },
     direction: {
@@ -309,8 +309,8 @@ var select = tv({
           "group-has-[p.error]/select:text-danger-light",
           "group-has-[p.error]/select:placeholder:text-danger-light"
         ],
-        helperText: ["!text-neutral-light"],
-        errorText: ["!text-danger-light"]
+        helperMessage: ["!text-neutral-light"],
+        errorMessage: ["!text-danger-light"]
       }
     },
     isSelected: {

package/dist/{chunk-P5PJTJLY.mjs → chunk-GRA2LU42.mjs}

@@ -17,7 +17,7 @@ import React, { forwardRef, useRef, useCallback, useMemo } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var Input = forwardRef((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, inputStyle.variantKeys);
-  const { classNames, label, helperText, errorText, startContent, endContent, ...inputProps } = props;
+  const { classNames, label, helperMessage, errorMessage, startContent, endContent, ...inputProps } = props;
   const inputRef = useRef(null);
   const slots = useMemo(() => inputStyle({ ...variantProps }), [variantProps]);
   const getContentProps = useCallback(
@@ -60,7 +60,7 @@ var Input = forwardRef((originalProps, ref) => {
         className: `${getContentProps().className || ""} ${existingProps.className || ""}`.trim()
       };
       return React.cloneElement(endContent, mergedProps);
-    } else if (errorText) {
+    } else if (errorMessage) {
       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 {
@@ -114,8 +114,8 @@ var Input = forwardRef((originalProps, ref) => {
               ]
             }
           ),
-          helperText && !errorText && /* @__PURE__ */ jsx("p", { className: slots.helperText({ class: classNames == null ? void 0 : classNames.helperText }), children: helperText }),
-          errorText && /* @__PURE__ */ jsx("p", { className: clsx("error", slots.errorText({ class: classNames == null ? void 0 : classNames.errorText })), children: errorText })
+          helperMessage && !errorMessage && /* @__PURE__ */ jsx("p", { className: slots.helperMessage({ class: classNames == null ? void 0 : classNames.helperMessage }), children: helperMessage }),
+          errorMessage && /* @__PURE__ */ jsx("p", { className: clsx("error", slots.errorMessage({ class: classNames == null ? void 0 : classNames.errorMessage })), children: errorMessage })
         ] })
       ]
     }
@@ -155,8 +155,8 @@ var inputStyle = tv(
         "group-has-[:hover]/input:text-neutral-dark",
         "group-has-[p.error]/input:text-danger-main"
       ],
-      helperText: ["text-neutral-main", "group-has-[:hover]/input:text-neutral-dark"],
-      errorText: ["text-danger-main"],
+      helperMessage: ["text-neutral-main", "group-has-[:hover]/input:text-neutral-dark"],
+      errorMessage: ["text-danger-main"],
       readonly: ["pointer-events-none", "!text-body-foreground"]
     },
     variants: {
@@ -191,7 +191,7 @@ var inputStyle = tv(
             "group-has-[:focus]/input:text-primary-main",
             "!group-has-[p.error]:not(input:focus):hover/input:text-primary-main"
           ],
-          helperText: [
+          helperMessage: [
             "group-has-[:focus]/input:text-primary-main",
             "group-has-[:focus:hover]/input:text-primary-main",
             "group-has-[:focus]/input:hover:text-primary-main"
@@ -202,7 +202,7 @@ var inputStyle = tv(
             "group-has-[:focus]/input:text-secondary-main",
             "!group-has-[p.error]:not(input:focus):hover/input:text-secondary-main"
           ],
-          helperText: [
+          helperMessage: [
             "group-has-[:focus]/input:text-secondary-main",
             "group-has-[:focus:hover]/input:text-secondary-main",
             "group-has-[:focus]/input:hover:text-secondary-main"
@@ -215,32 +215,32 @@ var inputStyle = tv(
           label: ["text-sm"],
           innerWrapper: ["gap-[4px]"],
           inputWrapper: ["w-[240px]", "h-[24px]", "rounded-sm", "px-[4px]", "gap-[4px]"],
-          helperText: ["text-sm"],
-          errorText: ["text-sm"]
+          helperMessage: ["text-sm"],
+          errorMessage: ["text-sm"]
         },
         md: {
           base: ["text-md", "gap-[6px]"],
           label: ["text-md"],
           innerWrapper: ["gap-[6px]"],
           inputWrapper: ["w-[240px]", "h-[32px]", "rounded-md", "px-[6px]", "gap-[6px]"],
-          helperText: ["text-sm"],
-          errorText: ["text-sm"]
+          helperMessage: ["text-sm"],
+          errorMessage: ["text-sm"]
         },
         lg: {
           base: ["text-lg", "gap-[8px]"],
           label: ["text-lg"],
           innerWrapper: ["gap-[8px]"],
           inputWrapper: ["w-[240px]", "h-[40px]", "rounded-lg", "px-[8px]", "gap-[8px]"],
-          helperText: ["text-md"],
-          errorText: ["text-md"]
+          helperMessage: ["text-md"],
+          errorMessage: ["text-md"]
         },
         xl: {
           base: ["text-xl", "gap-[10px]"],
           label: ["text-xl"],
           innerWrapper: ["gap-[10px]"],
           inputWrapper: ["w-[240px]", "h-[50px]", "rounded-lg", "px-[10px]", "gap-[10px]"],
-          helperText: ["text-md"],
-          errorText: ["text-md"]
+          helperMessage: ["text-md"],
+          errorMessage: ["text-md"]
         }
       },
       direction: {
@@ -264,8 +264,8 @@ var inputStyle = tv(
             "group-has-[p.error]/input:placeholder:text-danger-light"
           ],
           content: ["text-neutral-light", "group-has-[p.error]/input:text-danger-light"],
-          helperText: ["!text-neutral-light"],
-          errorText: ["!text-danger-light"]
+          helperMessage: ["!text-neutral-light"],
+          errorMessage: ["!text-danger-light"]
         }
       }
     },

package/dist/chunk-PX4PFLJ3.mjs

@@ -0,0 +1,178 @@
+"use client";
+import {
+  Icon_default
+} from "./chunk-HWL7TPUN.mjs";
+import {
+  tv
+} from "./chunk-4ZJFD3L3.mjs";
+import {
+  clsx
+} from "./chunk-27Y6K5NK.mjs";
+
+// src/components/tree/tree.tsx
+import { forwardRef, useMemo, useState, useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var TreeNodeItem = forwardRef(
+  ({ node, depth, fileIcon, isLoading, classNames, onExpand }, ref) => {
+    const [isOpen, setIsOpen] = useState(false);
+    const [children, setChildren] = useState(node.children);
+    const [isLoadingChildren, setIsLoadingChildren] = useState(false);
+    const slots = useMemo(() => treeStyle(), []);
+    const hasMore = useMemo(() => {
+      if (node.isLeaf) return false;
+      if (Array.isArray(children)) return children.length > 0;
+      return typeof onExpand === "function";
+    }, [node.isLeaf, children, onExpand]);
+    const toggleOpen = useCallback(async () => {
+      if (!isOpen && !children && onExpand && !node.isLeaf) {
+        setIsLoadingChildren(true);
+        try {
+          const result = await onExpand(node);
+          setChildren(result);
+        } catch (e) {
+          console.error("Failed to load child nodes ", e);
+        } finally {
+          setIsLoadingChildren(false);
+        }
+      }
+      setIsOpen((prev) => !prev);
+    }, [isOpen, children, onExpand, node]);
+    const handleClick = () => {
+      var _a;
+      toggleOpen();
+      (_a = node.onClick) == null ? void 0 : _a.call(node);
+    };
+    const handleRightClick = (e) => {
+      var _a;
+      e.preventDefault();
+      (_a = node.onRightClick) == null ? void 0 : _a.call(node, e);
+    };
+    const marginClass = depth > 1 ? hasMore ? "ml-[30px]" : "ml-[55px]" : hasMore ? "" : "ml-[25px]";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: clsx(
+          marginClass,
+          "transition-all duration-150 ease-out",
+          isLoading ? "-translate-y-2 opacity-0" : "translate-y-0 opacity-100"
+        ),
+        children: [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: slots.group({ class: classNames == null ? void 0 : classNames.group }),
+              onClick: handleClick,
+              onContextMenu: handleRightClick,
+              children: [
+                hasMore && /* @__PURE__ */ jsx(
+                  Icon_default,
+                  {
+                    name: "right-chevron",
+                    className: clsx(
+                      "text-neutral-main cursor-pointer transition-transform duration-150",
+                      isOpen ? "rotate-90" : "rotate-0"
+                    )
+                  }
+                ),
+                fileIcon,
+                node.label
+              ]
+            }
+          ),
+          isOpen && /* @__PURE__ */ jsxs("div", { children: [
+            isLoadingChildren && /* @__PURE__ */ jsx("div", { className: "text-neutral py-1 text-sm", children: "loading..." }),
+            children == null ? void 0 : children.map((child) => /* @__PURE__ */ jsx(
+              TreeNodeItem,
+              {
+                node: child,
+                depth: depth + 1,
+                classNames,
+                fileIcon,
+                onExpand
+              },
+              child.id
+            ))
+          ] })
+        ]
+      }
+    );
+  }
+);
+TreeNodeItem.displayName = "TreeNodeItem";
+var Tree = ({
+  headerContent,
+  group,
+  groupIcon,
+  fileIcon,
+  isLoading = false,
+  classNames,
+  onExpand
+}) => {
+  const slots = useMemo(() => treeStyle(), []);
+  const [isOpen, setIsOpen] = useState(true);
+  const handleToggle = () => {
+    var _a;
+    setIsOpen((prev) => !prev);
+    (_a = group.onClick) == null ? void 0 : _a.call(group);
+  };
+  const handleRightClick = (e) => {
+    var _a;
+    e.preventDefault();
+    (_a = group.onRightClick) == null ? void 0 : _a.call(group, e);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: [
+    headerContent && /* @__PURE__ */ jsx("div", { children: headerContent }),
+    /* @__PURE__ */ jsxs("div", { className: slots.wrapper({ class: classNames == null ? void 0 : classNames.wrapper }), children: [
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: slots.group({ class: classNames == null ? void 0 : classNames.group }),
+          onClick: handleToggle,
+          onContextMenu: handleRightClick,
+          children: [
+            groupIcon,
+            group.label
+          ]
+        }
+      ),
+      isOpen && /* @__PURE__ */ jsx("div", { children: group.data.map((node) => /* @__PURE__ */ jsx(
+        TreeNodeItem,
+        {
+          node,
+          depth: 1,
+          classNames,
+          fileIcon,
+          isLoading,
+          onExpand
+        },
+        node.id
+      )) })
+    ] })
+  ] });
+};
+Tree.displayName = "Tree";
+var tree_default = Tree;
+var treeStyle = tv({
+  slots: {
+    base: ["border", "border-neutral-light", "rounded-xl", "p-[20px]", "flex", "flex-col", "gap-[20px]", "select-none"],
+    wrapper: ["flex", "flex-col", "gap-[5px]"],
+    group: [
+      "flex",
+      "items-center",
+      "gap-[5px]",
+      "text-md",
+      "font-bold",
+      "text-body-foreground",
+      "hover:bg-neutral-soft",
+      "p-[5px]",
+      "rounded-[5px]",
+      "cursor-pointer"
+    ]
+  }
+});
+
+export {
+  Tree,
+  tree_default
+};

package/dist/{chunk-EAK5DVWA.mjs → chunk-UNH3BCGN.mjs}

@@ -27,7 +27,14 @@ var TableHead = ({ columns, slots, size, rowCheckbox, isCheckedAll, classNames,
     },
     `${column.field}${index}thead`
   ));
-  const renderSelectAllCheckbox = () => rowCheckbox && /* @__PURE__ */ jsx("th", { className: slots.th({ class: classNames == null ? void 0 : classNames.th }), onClick: handleClickCheckAll, children: /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx(checkbox_default, { size, checked: isCheckedAll }) }) });
+  const renderSelectAllCheckbox = () => rowCheckbox && /* @__PURE__ */ jsx("th", { className: slots.th({ class: classNames == null ? void 0 : classNames.th }), onClick: handleClickCheckAll, children: /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx(
+    checkbox_default,
+    {
+      size,
+      checked: isCheckedAll,
+      onChange: (e) => onCheckAll(e.target.checked)
+    }
+  ) }) });
   return /* @__PURE__ */ jsx("thead", { className: slots.thead({ class: classNames == null ? void 0 : classNames.thead }), children: /* @__PURE__ */ jsxs("tr", { className: slots.tr({ class: classNames == null ? void 0 : classNames.tr }), children: [
     renderColumnHeaders(),
     renderSelectAllCheckbox()

package/dist/{chunk-6OMHIMIA.mjs → chunk-XA6PVFTW.mjs}

@@ -4,13 +4,13 @@ import {
 } from "./chunk-XRC5OUYQ.mjs";
 import {
   table_head_default
-} from "./chunk-EAK5DVWA.mjs";
+} from "./chunk-UNH3BCGN.mjs";
 import {
   scrollArea_default
 } from "./chunk-M37VBNB3.mjs";
 import {
   pagination_default
-} from "./chunk-IVK24VIL.mjs";
+} from "./chunk-C7OF5HJF.mjs";
 import {
   clsx
 } from "./chunk-27Y6K5NK.mjs";

package/dist/components/input/index.js

@@ -4360,7 +4360,7 @@ function toVal(mix) {
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var Input = (0, import_react.forwardRef)((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, inputStyle.variantKeys);
-  const { classNames, label, helperText, errorText, startContent, endContent, ...inputProps } = props;
+  const { classNames, label, helperMessage, errorMessage, startContent, endContent, ...inputProps } = props;
   const inputRef = (0, import_react.useRef)(null);
   const slots = (0, import_react.useMemo)(() => inputStyle({ ...variantProps }), [variantProps]);
   const getContentProps = (0, import_react.useCallback)(
@@ -4403,7 +4403,7 @@ var Input = (0, import_react.forwardRef)((originalProps, ref) => {
         className: `${getContentProps().className || ""} ${existingProps.className || ""}`.trim()
       };
       return import_react.default.cloneElement(endContent, mergedProps);
-    } else if (errorText) {
+    } else if (errorMessage) {
       const iconProps = { ...getContentProps(), className: getContentProps().className };
       return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { ...iconProps, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon_default, { name: "exclamation-circle", fill: true, size: originalProps.size }) });
     } else {
@@ -4457,8 +4457,8 @@ var Input = (0, import_react.forwardRef)((originalProps, ref) => {
               ]
             }
           ),
-          helperText && !errorText && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: slots.helperText({ class: classNames == null ? void 0 : classNames.helperText }), children: helperText }),
-          errorText && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: clsx("error", slots.errorText({ class: classNames == null ? void 0 : classNames.errorText })), children: errorText })
+          helperMessage && !errorMessage && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: slots.helperMessage({ class: classNames == null ? void 0 : classNames.helperMessage }), children: helperMessage }),
+          errorMessage && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { className: clsx("error", slots.errorMessage({ class: classNames == null ? void 0 : classNames.errorMessage })), children: errorMessage })
         ] })
       ]
     }
@@ -4498,8 +4498,8 @@ var inputStyle = tv(
         "group-has-[:hover]/input:text-neutral-dark",
         "group-has-[p.error]/input:text-danger-main"
       ],
-      helperText: ["text-neutral-main", "group-has-[:hover]/input:text-neutral-dark"],
-      errorText: ["text-danger-main"],
+      helperMessage: ["text-neutral-main", "group-has-[:hover]/input:text-neutral-dark"],
+      errorMessage: ["text-danger-main"],
       readonly: ["pointer-events-none", "!text-body-foreground"]
     },
     variants: {
@@ -4534,7 +4534,7 @@ var inputStyle = tv(
             "group-has-[:focus]/input:text-primary-main",
             "!group-has-[p.error]:not(input:focus):hover/input:text-primary-main"
           ],
-          helperText: [
+          helperMessage: [
             "group-has-[:focus]/input:text-primary-main",
             "group-has-[:focus:hover]/input:text-primary-main",
             "group-has-[:focus]/input:hover:text-primary-main"
@@ -4545,7 +4545,7 @@ var inputStyle = tv(
             "group-has-[:focus]/input:text-secondary-main",
             "!group-has-[p.error]:not(input:focus):hover/input:text-secondary-main"
           ],
-          helperText: [
+          helperMessage: [
             "group-has-[:focus]/input:text-secondary-main",
             "group-has-[:focus:hover]/input:text-secondary-main",
             "group-has-[:focus]/input:hover:text-secondary-main"
@@ -4558,32 +4558,32 @@ var inputStyle = tv(
           label: ["text-sm"],
           innerWrapper: ["gap-[4px]"],
           inputWrapper: ["w-[240px]", "h-[24px]", "rounded-sm", "px-[4px]", "gap-[4px]"],
-          helperText: ["text-sm"],
-          errorText: ["text-sm"]
+          helperMessage: ["text-sm"],
+          errorMessage: ["text-sm"]
         },
         md: {
           base: ["text-md", "gap-[6px]"],
           label: ["text-md"],
           innerWrapper: ["gap-[6px]"],
           inputWrapper: ["w-[240px]", "h-[32px]", "rounded-md", "px-[6px]", "gap-[6px]"],
-          helperText: ["text-sm"],
-          errorText: ["text-sm"]
+          helperMessage: ["text-sm"],
+          errorMessage: ["text-sm"]
         },
         lg: {
           base: ["text-lg", "gap-[8px]"],
           label: ["text-lg"],
           innerWrapper: ["gap-[8px]"],
           inputWrapper: ["w-[240px]", "h-[40px]", "rounded-lg", "px-[8px]", "gap-[8px]"],
-          helperText: ["text-md"],
-          errorText: ["text-md"]
+          helperMessage: ["text-md"],
+          errorMessage: ["text-md"]
         },
         xl: {
           base: ["text-xl", "gap-[10px]"],
           label: ["text-xl"],
           innerWrapper: ["gap-[10px]"],
           inputWrapper: ["w-[240px]", "h-[50px]", "rounded-lg", "px-[10px]", "gap-[10px]"],
-          helperText: ["text-md"],
-          errorText: ["text-md"]
+          helperMessage: ["text-md"],
+          errorMessage: ["text-md"]
         }
       },
       direction: {
@@ -4607,8 +4607,8 @@ var inputStyle = tv(
             "group-has-[p.error]/input:placeholder:text-danger-light"
           ],
           content: ["text-neutral-light", "group-has-[p.error]/input:text-danger-light"],
-          helperText: ["!text-neutral-light"],
-          errorText: ["!text-danger-light"]
+          helperMessage: ["!text-neutral-light"],
+          errorMessage: ["!text-danger-light"]
         }
       }
     },

package/dist/components/input/index.mjs

@@ -2,7 +2,7 @@
 import "../../chunk-2GCSFWHD.mjs";
 import {
   input_default
-} from "../../chunk-P5PJTJLY.mjs";
+} from "../../chunk-GRA2LU42.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-HWL7TPUN.mjs";
 import "../../chunk-3IU2RPSM.mjs";