@deepnoid/ui 0.0.80 → 0.0.84

package/dist/{chunk-KWOLWE6I.mjs → chunk-463XE4SI.mjs}

@@ -1,13 +1,13 @@
 "use client";
-import {
-  option_default
-} from "./chunk-FLJ4ZZXV.mjs";
 import {
   useSelect
 } from "./chunk-S3QS5B7F.mjs";
+import {
+  option_default
+} from "./chunk-SQLRQTFC.mjs";
 import {
   Icon_default
-} from "./chunk-GJKNTX2T.mjs";
+} from "./chunk-AHORH5PH.mjs";
 import {
   mapPropsVariants
 } from "./chunk-E3G5QXSH.mjs";

package/dist/chunk-5T5F5WVS.mjs

@@ -0,0 +1,32 @@
+"use client";
+import {
+  getToastPosition
+} from "./chunk-SDNTEP5C.mjs";
+
+// src/components/toast/useToast.ts
+import { useState, useEffect, useRef } from "react";
+var useToast = ({ placement, offset, targetRect }) => {
+  const [toastPosition, setToastPosition] = useState({ x: 0, y: 0 });
+  const toastRef = useRef(null);
+  useEffect(() => {
+    if (targetRect && toastRef.current) {
+      const { width, height } = toastRef.current.getBoundingClientRect();
+      const scrollX = window.scrollX;
+      const scrollY = window.scrollY;
+      const adjustedTargetRect = {
+        ...targetRect,
+        left: targetRect.left + scrollX,
+        top: targetRect.top + scrollY,
+        right: targetRect.right + scrollX,
+        bottom: targetRect.bottom + scrollY
+      };
+      const { toastX, toastY } = getToastPosition(placement, adjustedTargetRect, width, height, offset);
+      setToastPosition({ x: toastX, y: toastY });
+    }
+  }, [placement, offset, targetRect]);
+  return { toastPosition, toastRef };
+};
+
+export {
+  useToast
+};

package/dist/{chunk-S4DTK5GI.mjs → chunk-ADDUBJ4I.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   getConfig
-} from "./chunk-FNPWLOGV.mjs";
+} from "./chunk-NTTHTGDK.mjs";
 import {
   __export
 } from "./chunk-IZ6II3QA.mjs";

package/dist/{chunk-GJKNTX2T.mjs → chunk-AHORH5PH.mjs}

@@ -1,10 +1,11 @@
 "use client";
 import {
   template
-} from "./chunk-TLYAFXE2.mjs";
+} from "./chunk-QURXBWKK.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 }) => {
   const SVGIcon = template[name];
   const getInputIconSize = (size2) => {
@@ -12,12 +13,12 @@ var Icon = ({ name, size = "md", fill = false, className, onClick, ...props }) =
       case "sm":
         return "size-[15px]";
       case "md":
-        return "size-[17px]";
+        return "size-[17px] stroke-[1.25px]";
       case "lg":
-        return "size-[20px]";
+        return "size-[20px] stroke-[1.5px]";
     }
   };
-  return /* @__PURE__ */ jsx("div", { onClick, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx("div", { className: "w-fit h-fit", onClick, children: /* @__PURE__ */ jsx(
     SVGIcon,
     {
       fill,
@@ -29,5 +30,6 @@ var Icon = ({ name, size = "md", fill = false, className, onClick, ...props }) =
 var Icon_default = Icon;
 
 export {
+  iconTemplate,
   Icon_default
 };

package/dist/{chunk-7LYJAJIS.mjs → chunk-EWKYBS7I.mjs}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-66WCZEEU.mjs";
 import {
   Icon_default
-} from "./chunk-GJKNTX2T.mjs";
+} from "./chunk-AHORH5PH.mjs";
 import {
   mapPropsVariants
 } from "./chunk-E3G5QXSH.mjs";
@@ -150,15 +150,22 @@ var modal_default = Modal;
 var modal = tv({
   slots: {
     backdrop: ["relative w-screen h-screen fixed inset-0 bg-black/60", "z-[9999]"],
-    modalWrapper: ["group", "absolute", "top-1/2", "-translate-y-1/2", "left-1/2", "-translate-x-1/2"],
-    icon: ["absolute", "top-[20px]", "left-1/2", "-translate-x-1/2", "z-10"],
+    modalWrapper: ["group/modal", "absolute", "top-1/2", "-translate-y-1/2", "left-1/2", "-translate-x-1/2"],
+    icon: [
+      "absolute",
+      "top-[20px]",
+      "left-1/2",
+      "-translate-x-1/2",
+      "z-10",
+      "group-data-[modal-icon-visibility=true]/modal:top-[80px]"
+    ],
     closeIcon: [
       "absolute",
       "top-[20px]",
       "right-[20px]",
       "cursor-pointer",
       "z-10",
-      "group-data-[icon-visibility=true]:top-[80px]"
+      "group-data-[modal-icon-visibility=true]/modal:top-[80px]"
     ],
     titleWrapper: ["relative", "flex", "flex-col", "gap-[10px]"],
     title: "text-h5 text-center text-foreground",
@@ -170,8 +177,8 @@ var modal = tv({
       "bg-background",
       "shadow-drop shadow-foreground/20 rounded-xxlg",
       "overflow-hidden",
-      "group-data-[icon-visibility=true]:mt-[60px]",
-      "group-data-[icon-visibility=true]:pt-[60px]"
+      "group-data-[modal-icon-visibility=true]/modal:mt-[60px]",
+      "group-data-[modal-icon-visibility=true]/modal:pt-[60px]"
     ],
     body: ["flex", "flex-col", "gap-[20px]"],
     content: ["text-md text-center", "break-words", "bg-neutral-soft", "rounded-[5px]", "p-[10px]"],

package/dist/{chunk-H7BLXC5M.mjs → chunk-ILMIS63S.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   require_lib
-} from "./chunk-FNPWLOGV.mjs";
+} from "./chunk-NTTHTGDK.mjs";
 import {
   __commonJS,
   __require,
@@ -1044,9 +1044,9 @@ var require_color_convert = __commonJS({
   }
 });
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/ansi-styles/index.js
+// ../../node_modules/ansi-styles/index.js
 var require_ansi_styles = __commonJS({
-  "../../node_modules/@testing-library/jest-dom/node_modules/ansi-styles/index.js"(exports, module) {
+  "../../node_modules/ansi-styles/index.js"(exports, module) {
     "use strict";
     var wrapAnsi16 = (fn, offset) => (...args) => {
       const code = fn(...args);
@@ -1186,9 +1186,9 @@ var require_ansi_styles = __commonJS({
   }
 });
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/has-flag/index.js
+// ../../node_modules/has-flag/index.js
 var require_has_flag = __commonJS({
-  "../../node_modules/@testing-library/jest-dom/node_modules/has-flag/index.js"(exports, module) {
+  "../../node_modules/has-flag/index.js"(exports, module) {
     "use strict";
     module.exports = (flag, argv = process.argv) => {
       const prefix = flag.startsWith("-") ? "" : flag.length === 1 ? "-" : "--";
@@ -1199,9 +1199,9 @@ var require_has_flag = __commonJS({
   }
 });
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/supports-color/index.js
+// ../../node_modules/supports-color/index.js
 var require_supports_color = __commonJS({
-  "../../node_modules/@testing-library/jest-dom/node_modules/supports-color/index.js"(exports, module) {
+  "../../node_modules/supports-color/index.js"(exports, module) {
     "use strict";
     var os = __require("os");
     var tty = __require("tty");
@@ -3761,7 +3761,7 @@ function $d708735ed1303b43$var$addParent(obj, parent) {
 var $d708735ed1303b43$export$2e2bcd8739ae039 = $d708735ed1303b43$export$98e6a39c04603d36;
 var $149c1bd638913645$export$98e6a39c04603d36 = (0, $d708735ed1303b43$export$2e2bcd8739ae039);
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api/dist/polyfills/array.from.mjs
+// ../../node_modules/dom-accessibility-api/dist/polyfills/array.from.mjs
 var toStr = Object.prototype.toString;
 function isCallable(fn) {
   return typeof fn === "function" || toStr.call(fn) === "[object Function]";
@@ -3809,7 +3809,7 @@ function arrayFrom(arrayLike, mapFn) {
   return A;
 }
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api/dist/polyfills/SetLike.mjs
+// ../../node_modules/dom-accessibility-api/dist/polyfills/SetLike.mjs
 function _typeof(o) {
   "@babel/helpers - typeof";
   return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) {
@@ -3913,7 +3913,7 @@ var SetLike = /* @__PURE__ */ function() {
 }();
 var SetLike_default = typeof Set === "undefined" ? Set : SetLike;
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api/dist/getRole.mjs
+// ../../node_modules/dom-accessibility-api/dist/getRole.mjs
 function getLocalName(element) {
   var _element$localName;
   return (
@@ -4098,7 +4098,7 @@ function getExplicitRole(element) {
   return null;
 }
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api/dist/util.mjs
+// ../../node_modules/dom-accessibility-api/dist/util.mjs
 var presentationRoles = ["presentation", "none"];
 function isElement(node) {
   return node !== null && node.nodeType === node.ELEMENT_NODE;
@@ -4168,7 +4168,7 @@ function hasAnyConcreteRoles(node, roles2) {
   return false;
 }
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api/dist/accessible-name-and-description.mjs
+// ../../node_modules/dom-accessibility-api/dist/accessible-name-and-description.mjs
 function asFlatString(s) {
   return s.trim().replace(/\s\s+/g, " ");
 }
@@ -4537,7 +4537,7 @@ function computeTextAlternative(root) {
   }));
 }
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api/dist/accessible-description.mjs
+// ../../node_modules/dom-accessibility-api/dist/accessible-description.mjs
 function _typeof2(o) {
   "@babel/helpers - typeof";
   return _typeof2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) {
@@ -4608,7 +4608,7 @@ function computeAccessibleDescription(root) {
   return description;
 }
 
-// ../../node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api/dist/accessible-name.mjs
+// ../../node_modules/dom-accessibility-api/dist/accessible-name.mjs
 function prohibitsNaming(node) {
   return hasAnyConcreteRoles(node, ["caption", "code", "deletion", "emphasis", "generic", "insertion", "none", "paragraph", "presentation", "strong", "subscript", "superscript"]);
 }

package/dist/{chunk-H737LHAY.mjs → chunk-KA4L5SCT.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   Icon_default
-} from "./chunk-GJKNTX2T.mjs";
+} from "./chunk-AHORH5PH.mjs";
 import {
   mapPropsVariants
 } from "./chunk-E3G5QXSH.mjs";
@@ -131,18 +131,18 @@ Input.displayName = "Input";
 var input_default = Input;
 var inputStyle = tv({
   slots: {
-    base: ["group", "flex", "flex-col"],
+    base: ["group/input", "flex", "flex-col"],
     label: ["flex", "items-center"],
     innerWrapper: ["flex", "flex-col"],
     inputWrapper: [
       "flex",
       "items-center",
-      "group-has-[p]:border-danger-main",
-      "group-has-[p]:bg-danger-soft",
+      "group-has-[p]/input:border-danger-main",
+      "group-has-[p]/input:bg-danger-soft",
       "transition duration-200"
     ],
     input: ["w-full", "h-full", "bg-transparent", "placeholder:text-neutral-main", "focus-visible:outline-none"],
-    content: ["flex", "items-center", "group-has-[p]:text-danger-main", "select-none"],
+    content: ["flex", "items-center", "group-has-[p]/input:text-danger-main", "select-none"],
     errorMessage: ["text-danger-main"]
   },
   variants: {
@@ -183,19 +183,19 @@ var inputStyle = tv({
     size: {
       sm: {
         base: ["text-sm", "gap-[6px]"],
-        innerWrapper: ["group-has-[p]:gap-[6px]"],
+        innerWrapper: ["group-has-[p]/input:gap-[6px]"],
         inputWrapper: ["w-[240px]", "h-[24px]", "rounded-sm", "px-[6px]", "py-[4.5px]", "gap-[6px]"],
         errorMessage: ["text-sm"]
       },
       md: {
         base: ["text-md", "gap-[8px]"],
-        innerWrapper: ["group-has-[p]:gap-[8px]"],
+        innerWrapper: ["group-has-[p]/input:gap-[8px]"],
         inputWrapper: ["w-[240px]", "h-[30px]", "rounded-md", "px-[8px]", "py-[6.5px]", "gap-[8px]"],
         errorMessage: ["text-md"]
       },
       lg: {
         base: ["text-lg", "gap-[10px]"],
-        innerWrapper: ["group-has-[p]:gap-[10px]"],
+        innerWrapper: ["group-has-[p]/input:gap-[10px]"],
         inputWrapper: ["w-[240px]", "h-[36px]", "rounded-lg", "px-[10px]", "py-[8px]", "gap-[10px]"],
         errorMessage: ["text-lg"]
       }

package/dist/{chunk-DLVQWKQG.mjs → chunk-LGELMZCN.mjs}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-27Y6K5NK.mjs";
 import {
   Icon_default
-} from "./chunk-GJKNTX2T.mjs";
+} from "./chunk-AHORH5PH.mjs";
 
 // src/components/table/table-body.tsx
 import React, { useState, useCallback, useEffect } from "react";
@@ -20,12 +20,15 @@ var TableBody = ({
   slots,
   rows,
   columns,
-  isSelected,
   isExpanded,
+  isSelected,
+  isSelectedRow,
+  selectedRows,
   emptyContent,
+  onSelectRow,
   onRowAction
 }) => {
-  const colSpanCount = columns.length + (isExpanded ? 1 : 0) + (isSelected ? 1 : 0);
+  const COL_SPAN_COUNT = columns.length + (isExpanded ? 1 : 0) + (isSelected ? 1 : 0);
   const [expandedRows, setExpandedRows] = useState(/* @__PURE__ */ new Set());
   useEffect(() => {
     setExpandedRows(/* @__PURE__ */ new Set());
@@ -77,20 +80,22 @@ var TableBody = ({
     },
     [classNames == null ? void 0 : classNames.td, columns, slots]
   );
+  const onChangeExpandedRow = (index) => {
+    setExpandedRows((prevIndices) => {
+      const newIndices = new Set(prevIndices);
+      if (newIndices.has(index)) {
+        newIndices.delete(index);
+      } else {
+        newIndices.add(index);
+      }
+      return newIndices;
+    });
+  };
   const handleRowClick = (index) => (e) => {
-    if (isSelected) {
-    }
-    if (isExpanded) {
-      setExpandedRows((prevIndices) => {
-        const newIndices = new Set(prevIndices);
-        if (newIndices.has(index)) {
-          newIndices.delete(index);
-        } else {
-          newIndices.add(index);
-        }
-        return newIndices;
-      });
-    }
+    e.stopPropagation();
+    e.preventDefault();
+    if (isExpanded) onChangeExpandedRow(index);
+    if (isSelected && isSelectedRow) onSelectRow(index);
     const row = rows[index];
     if (row !== void 0) {
       onRowAction == null ? void 0 : onRowAction(e, row);
@@ -100,7 +105,7 @@ var TableBody = ({
     const keys = Object.keys(row);
     return /* @__PURE__ */ jsxs(React.Fragment, { children: [
       /* @__PURE__ */ jsxs("tr", { ...getTrProps(rowIndex), onClick: handleRowClick(rowIndex), children: [
-        isSelected && /* @__PURE__ */ jsx("td", { ...getTdProps({ field: "checkbox" }, row, keys), children: /* @__PURE__ */ jsx(checkbox_default, { color, size }) }),
+        isSelected && /* @__PURE__ */ jsx("td", { ...getTdProps({ field: "checkbox" }, row, keys), onClick: () => onSelectRow(rowIndex), children: /* @__PURE__ */ jsx(checkbox_default, { color, size, checked: selectedRows.has(rowIndex) }) }),
         isExpanded && /* @__PURE__ */ jsx("td", { ...getTdProps({ field: "expandIcon" }, row, keys), children: /* @__PURE__ */ jsx(
           Icon_default,
           {
@@ -111,9 +116,9 @@ var TableBody = ({
         ) }),
         columns.map((column, colIndex) => /* @__PURE__ */ createElement("td", { ...getTdProps(column, row, keys), key: colIndex }))
       ] }),
-      isExpanded && expandedRows.has(rowIndex) && /* @__PURE__ */ jsx("tr", { ...getExpandedContentProps(), children: /* @__PURE__ */ jsx("td", { colSpan: colSpanCount, ...getTdProps({ field: "expandedRow" }, row, keys), children: row.renderExpandedRow && row.renderExpandedRow() }) })
+      isExpanded && expandedRows.has(rowIndex) && /* @__PURE__ */ jsx("tr", { ...getExpandedContentProps(), children: /* @__PURE__ */ jsx("td", { colSpan: COL_SPAN_COUNT, ...getTdProps({ field: "expandedRow" }, row, keys), children: row.renderExpandedRow && row.renderExpandedRow() }) })
     ] }, rowIndex);
-  }) : /* @__PURE__ */ jsx("tr", { ...getTrProps(-1), children: /* @__PURE__ */ jsx("td", { colSpan: columns.length, children: emptyContent }) }) });
+  }) : /* @__PURE__ */ jsx("tr", { ...getTrProps(-1), children: /* @__PURE__ */ jsx("td", { colSpan: COL_SPAN_COUNT, children: emptyContent }) }) });
 };
 var table_body_default = TableBody;
 

package/dist/chunk-LXPWTJ3F.mjs

@@ -0,0 +1,58 @@
+"use client";
+import {
+  mapPropsVariants
+} from "./chunk-E3G5QXSH.mjs";
+import {
+  tv
+} from "./chunk-J725QONZ.mjs";
+
+// src/components/dropdown/dropdown.tsx
+import React, { forwardRef, useCallback, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+var Dropdown = forwardRef((originalProps, ref) => {
+  const [props, variantProps] = mapPropsVariants(originalProps, dropdown.variantKeys);
+  const { children, classNames } = props;
+  const slots = useMemo(() => dropdown({ ...variantProps }), [...Object.values(variantProps)]);
+  const getBaseProps = useCallback(() => {
+    return {
+      className: slots.base({ class: classNames == null ? void 0 : classNames.base })
+    };
+  }, [slots, classNames == null ? void 0 : classNames.base]);
+  return /* @__PURE__ */ jsx("div", { ref, ...getBaseProps(), children: React.Children.map(children, (child, index) => {
+    return React.cloneElement(child, {
+      ...variantProps,
+      ...child.props
+    });
+  }) });
+});
+Dropdown.displayName = "Dropdown";
+var dropdown_default = Dropdown;
+var dropdown = tv({
+  slots: {
+    base: ["flex", "flex-col"]
+  },
+  variants: {
+    variant: {
+      solid: {},
+      line: {}
+    },
+    size: {
+      sm: {},
+      md: {},
+      lg: {}
+    },
+    color: {
+      primary: {},
+      secondary: {}
+    }
+  },
+  defaultVariants: {
+    variant: "solid",
+    color: "primary",
+    size: "md"
+  }
+});
+
+export {
+  dropdown_default
+};