@bbki.ng/components 2.6.1 → 2.6.3

package/dist/index.js

@@ -1,21 +1,74 @@
 // lib/article/Article.tsx
+import classNames2 from "classnames";
+import React3 from "react";
+
+// lib/blink-dot/BlinkDot.tsx
 import classNames from "classnames";
 import React from "react";
+var BlinkDot = (props) => {
+  const { className } = props;
+  const status = props.status || "hidden";
+  const statusCls = classNames({
+    "animate-ping-fast": status === "blink",
+    hidden: status === "hidden"
+  });
+  return /* @__PURE__ */ React.createElement("span", {
+    className: classNames("inline-flex justify-center items-center relative")
+  }, /* @__PURE__ */ React.createElement("span", {
+    className: `absolute inline-flex h-full w-full rounded-full text-red-600  -top-[28px] -left-[3px] ${statusCls} ${className}`
+  }, "."));
+};
+
+// lib/blur-cover/BlurCover.tsx
+import React2 from "react";
+import cls from "classnames";
+var BlurCover = (props) => {
+  const { status } = props;
+  const coverCls = cls(
+    "absolute",
+    "block",
+    "text-blur",
+    "transition-all",
+    "top-0",
+    "left-0",
+    "h-full",
+    "w-full",
+    {
+      "z-[999]": status === "show",
+      "opacity-0": status === "silent",
+      "opacity-100": status === "show",
+      "pointer-events-none": status === "silent"
+    },
+    props.className
+  );
+  return /* @__PURE__ */ React2.createElement("div", {
+    className: coverCls
+  });
+};
+
+// lib/article/Article.tsx
 var Article = (props) => {
   const { title, content, children, className, description } = props;
-  return /* @__PURE__ */ React.createElement("div", {
-    className: classNames("article", className)
-  }, /* @__PURE__ */ React.createElement("div", {
-    className: "text-[2.25rem] mb-128 leading-none"
-  }, title), description && /* @__PURE__ */ React.createElement("div", {
+  return /* @__PURE__ */ React3.createElement("div", {
+    className: classNames2("article", className)
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "mb-128 leading-none"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-[2.25rem] p-16"
+  }, title), props.loading && /* @__PURE__ */ React3.createElement(BlinkDot, {
+    status: "blink",
+    className: "!-top-[42px] !-left-16"
+  })), description && /* @__PURE__ */ React3.createElement("div", {
     className: "mb-128"
-  }, description), /* @__PURE__ */ React.createElement("div", {
-    className: "text-black"
-  }, children || content));
+  }, description), /* @__PURE__ */ React3.createElement("div", {
+    className: "text-black relative p-16"
+  }, children || content, /* @__PURE__ */ React3.createElement(BlurCover, {
+    status: props.loading ? "show" : "silent"
+  })));
 };
 
 // lib/button/Button.tsx
-import React2 from "react";
+import React4 from "react";
 var ButtonType = /* @__PURE__ */ ((ButtonType2) => {
   ButtonType2["DANGER"] = "danger";
   ButtonType2["PRIMARY"] = "primary";
@@ -32,7 +85,7 @@ function Button(props) {
   };
   const { type = "normal" /* NORMAL */, className = "", onClick, btnType } = props;
   const shadowTransCls = type === "disabled" /* DISABLED */ ? "" : "transition-all duration-200 ease-in-out shadow-button hover:shadow-button-hover active:shadow-empty";
-  return /* @__PURE__ */ React2.createElement("button", {
+  return /* @__PURE__ */ React4.createElement("button", {
     className: `${typeClsMap[type]} ${className} ${shadowTransCls} py-8 px-16 transition-all duration-200 ease-in-out`,
     onClick,
     type: btnType
@@ -41,9 +94,9 @@ function Button(props) {
 Button.displayName = "Button";
 
 // lib/logo/Logo.tsx
-import * as React3 from "react";
-var Logo = React3.memo(
-  (props) => /* @__PURE__ */ React3.createElement("svg", {
+import * as React5 from "react";
+var Logo = React5.memo(
+  (props) => /* @__PURE__ */ React5.createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "48",
     height: "48",
@@ -51,25 +104,25 @@ var Logo = React3.memo(
     fill: "none",
     onClick: props.onClick,
     className: props.className
-  }, /* @__PURE__ */ React3.createElement("path", {
+  }, /* @__PURE__ */ React5.createElement("path", {
     d: "M29.1152 21.3106C32.0605 21.3106 34.4481 18.9101 34.4481 15.9489V24.6457C34.4481 25.7585 33.5508 26.6607 32.444 26.6607H15.1207C14.0138 26.6607 13.1166 25.7585 13.1166 24.6457V15.9489C13.1166 18.9101 15.5042 21.3106 18.4494 21.3106C21.3947 21.3106 23.7823 18.9101 23.7823 15.9489C23.7823 18.9101 26.17 21.3106 29.1152 21.3106Z",
     fill: "#9CA3AF"
-  }), /* @__PURE__ */ React3.createElement("path", {
+  }), /* @__PURE__ */ React5.createElement("path", {
     d: "M23.7823 15.9373L23.7823 15.9489C23.7823 15.9451 23.7823 15.9412 23.7823 15.9373Z",
     fill: "#9CA3AF"
-  }), /* @__PURE__ */ React3.createElement("path", {
+  }), /* @__PURE__ */ React5.createElement("path", {
     d: "M23.1143 28.004C23.1205 30.9598 25.5057 33.3541 28.4472 33.3541C31.3886 33.3541 33.7738 30.9598 33.7801 28.004H23.1143Z",
     fill: "#9CA3AF"
-  }), /* @__PURE__ */ React3.createElement("path", {
+  }), /* @__PURE__ */ React5.createElement("path", {
     d: "M13.7846 28.004C13.7846 28.0079 13.7846 28.0117 13.7846 28.0156C13.7908 30.9714 16.1761 33.3657 19.1175 33.3657C22.0589 33.3657 24.4442 30.9714 24.4504 28.0156H13.7846V28.004Z",
     fill: "#9CA3AF"
-  }), /* @__PURE__ */ React3.createElement("path", {
+  }), /* @__PURE__ */ React5.createElement("path", {
     d: "M14.4527 15.9373C14.4527 16.6792 13.8545 17.2806 13.1166 17.2806C12.3786 17.2806 11.7805 16.6792 11.7805 15.9373C11.7805 15.1954 12.3786 14.594 13.1166 14.594C13.8545 14.594 14.4527 15.1954 14.4527 15.9373Z",
     fill: "#9CA3AF"
-  }), /* @__PURE__ */ React3.createElement("path", {
+  }), /* @__PURE__ */ React5.createElement("path", {
     d: "M25.1184 15.2657C25.1184 16.0076 24.5202 16.609 23.7823 16.609C23.0444 16.609 22.4462 16.0076 22.4462 15.2657C22.4462 14.5238 23.0444 13.9224 23.7823 13.9224C24.5202 13.9224 25.1184 14.5238 25.1184 15.2657Z",
     fill: "#9CA3AF"
-  }), /* @__PURE__ */ React3.createElement("path", {
+  }), /* @__PURE__ */ React5.createElement("path", {
     d: "M35.7842 15.9373C35.7842 16.6792 35.186 17.2806 34.4481 17.2806C33.7102 17.2806 33.112 16.6792 33.112 15.9373C33.112 15.1954 33.7102 14.594 34.4481 14.594C35.186 14.594 35.7842 15.1954 35.7842 15.9373Z",
     fill: "#9CA3AF"
   })),
@@ -79,35 +132,16 @@ var Logo = React3.memo(
 );
 
 // lib/nav/Nav.tsx
-import React7 from "react";
+import React8 from "react";
 
 // lib/breadcrumb/Breadcrumb.tsx
-import React6 from "react";
+import React7 from "react";
 import classNames4 from "classnames";
 
 // lib/link/Link.tsx
 import classNames3 from "classnames";
 import { Link as BaseLink } from "react-router-dom";
-import React5 from "react";
-
-// lib/blink-dot/BlinkDot.tsx
-import classNames2 from "classnames";
-import React4 from "react";
-var BlinkDot = (props) => {
-  const { className } = props;
-  const status = props.status || "hidden";
-  const statusCls = classNames2({
-    "animate-ping-fast": status === "blink",
-    hidden: status === "hidden"
-  });
-  return /* @__PURE__ */ React4.createElement("span", {
-    className: classNames2("inline-flex justify-center items-center relative")
-  }, /* @__PURE__ */ React4.createElement("span", {
-    className: `absolute inline-flex h-full w-full rounded-full text-red-600  -top-[28px] -left-[3px] ${statusCls}`
-  }, "."));
-};
-
-// lib/link/Link.tsx
+import React6 from "react";
 var LinkColor = /* @__PURE__ */ ((LinkColor2) => {
   LinkColor2["BLUE"] = "blue";
   LinkColor2["RED"] = "red";
@@ -150,7 +184,7 @@ var Link = (props) => {
     FOCUS_BG_COLOR_MAPPING[color]
   );
   if (external) {
-    return /* @__PURE__ */ React5.createElement("a", {
+    return /* @__PURE__ */ React6.createElement("a", {
       href: props.to,
       className: linkCls,
       target: "_blank",
@@ -161,18 +195,18 @@ var Link = (props) => {
   if (readonly) {
     const isNonEnName = !/^[a-zA-Z~]+$/.test(children);
     const offsetCls = classNames3({ "relative top-[2px]": isNonEnName });
-    return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement("span", {
+    return /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement("span", {
       className: classNames3("text-gray-400", offsetCls),
       style: { padding: 4 }
-    }, children), /* @__PURE__ */ React5.createElement(BlinkDot, {
+    }, children), /* @__PURE__ */ React6.createElement(BlinkDot, {
       status
     }));
   }
-  return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(BaseLink, {
+  return /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(BaseLink, {
     ...rest,
     className: linkCls,
     style: { padding: 4 }
-  }, children), /* @__PURE__ */ React5.createElement(BlinkDot, {
+  }, children), /* @__PURE__ */ React6.createElement(BlinkDot, {
     className: "-top-3 left-1",
     status
   }));
@@ -182,23 +216,23 @@ var Link = (props) => {
 var Breadcrumb = (props) => {
   const { paths, loading } = props;
   const PathElements = paths.map(({ path, name }, index) => {
-    const slash = index === 0 ? null : /* @__PURE__ */ React6.createElement("span", {
+    const slash = index === 0 ? null : /* @__PURE__ */ React7.createElement("span", {
       className: "text-gray-400"
     }, "/");
     const isNonEnName = !/^[a-zA-Z~]+$/.test(name);
     const offsetCls = classNames4({ "relative top-[2px]": isNonEnName });
     const isLast = index === paths.length - 1;
     const status = loading && isLast ? "blink" : "hidden";
-    return /* @__PURE__ */ React6.createElement("span", {
+    return /* @__PURE__ */ React7.createElement("span", {
       key: path || name
-    }, slash, /* @__PURE__ */ React6.createElement(Link, {
+    }, slash, /* @__PURE__ */ React7.createElement(Link, {
       to: path ?? "",
       className: offsetCls,
       readonly: !path,
       status
     }, name));
   });
-  return /* @__PURE__ */ React6.createElement("div", {
+  return /* @__PURE__ */ React7.createElement("div", {
     className: "breadcrumb"
   }, PathElements);
 };
@@ -207,21 +241,21 @@ var Breadcrumb = (props) => {
 import { useNavigate } from "react-router-dom";
 var Nav = (props) => {
   if (props.mini) {
-    return /* @__PURE__ */ React7.createElement("div", {
+    return /* @__PURE__ */ React8.createElement("div", {
       className: `p-8 w-full flex items-center ${props.className}`
-    }, /* @__PURE__ */ React7.createElement(Breadcrumb, {
+    }, /* @__PURE__ */ React8.createElement(Breadcrumb, {
       paths: props.paths
     }));
   }
   const nav = useNavigate();
-  return /* @__PURE__ */ React7.createElement("div", {
+  return /* @__PURE__ */ React8.createElement("div", {
     className: `p-8 w-full flex items-center ${props.className}`
-  }, props.customLogo || /* @__PURE__ */ React7.createElement(Logo, {
+  }, props.customLogo || /* @__PURE__ */ React8.createElement(Logo, {
     className: "mr-8",
     onClick: () => {
       nav("/");
     }
-  }), /* @__PURE__ */ React7.createElement(Breadcrumb, {
+  }), /* @__PURE__ */ React8.createElement(Breadcrumb, {
     paths: props.paths,
     loading: props.loading
   }));
@@ -229,20 +263,20 @@ var Nav = (props) => {
 
 // lib/tag/Tag.tsx
 import classNames5 from "classnames";
-import React8 from "react";
+import React9 from "react";
 var Tag = (props) => {
-  return /* @__PURE__ */ React8.createElement(Link, {
+  return /* @__PURE__ */ React9.createElement(Link, {
     ...props,
     color: "gray" /* GRAY */
-  }, /* @__PURE__ */ React8.createElement("small", null, props.prefix || "#", props.children));
+  }, /* @__PURE__ */ React9.createElement("small", null, props.prefix || "#", props.children));
 };
 var Tags = (props) => {
   const { tags, className } = props;
-  return /* @__PURE__ */ React8.createElement("div", {
+  return /* @__PURE__ */ React9.createElement("div", {
     className: classNames5(className, "inline-block")
   }, tags.map((tag, index) => {
     const isLast = index === tags.length - 1;
-    return /* @__PURE__ */ React8.createElement(Tag, {
+    return /* @__PURE__ */ React9.createElement(Tag, {
       ...tag,
       key: tag.to,
       className: classNames5({ "mr-8": !isLast })
@@ -251,44 +285,44 @@ var Tags = (props) => {
 };
 
 // lib/panel/Panel.tsx
-import React9, { useEffect, useState } from "react";
+import React10, { useEffect, useState } from "react";
 var Panel = (props) => {
   const { className = "", children } = props;
   const [show, setShow] = useState(false);
   useEffect(() => {
     setShow(true);
   }, []);
-  return /* @__PURE__ */ React9.createElement("div", {
+  return /* @__PURE__ */ React10.createElement("div", {
     className: `transition-all ease-in-out duration-900 ${className} ${show ? "shadow-panel" : "shadow-empty"} p-32`
   }, children);
 };
 
 // lib/page/Page.tsx
-import React10 from "react";
+import React11 from "react";
 var Page = (props) => {
   const { nav, main } = props;
-  return /* @__PURE__ */ React10.createElement("main", {
+  return /* @__PURE__ */ React11.createElement("main", {
     className: "flex flex-col h-full"
-  }, /* @__PURE__ */ React10.createElement("div", {
+  }, /* @__PURE__ */ React11.createElement("div", {
     className: `flx-grow-0 w-full fixed top-0 z-50`
-  }, nav), /* @__PURE__ */ React10.createElement("section", {
+  }, nav), /* @__PURE__ */ React11.createElement("section", {
     className: "flex-grow flex-shrink-0 px-6"
   }, main));
 };
 var NotFound = (props) => {
-  return /* @__PURE__ */ React10.createElement(Error2, {
+  return /* @__PURE__ */ React11.createElement(Error2, {
     error: { name: "404", message: "Not Found" }
   });
 };
 var Error2 = (props) => {
   const { error } = props;
-  return /* @__PURE__ */ React10.createElement("div", {
+  return /* @__PURE__ */ React11.createElement("div", {
     className: "prose"
-  }, /* @__PURE__ */ React10.createElement("pre", null, /* @__PURE__ */ React10.createElement("code", {
+  }, /* @__PURE__ */ React11.createElement("pre", null, /* @__PURE__ */ React11.createElement("code", {
     className: "javascript language-javascript"
   }, error.name, ":", error.message)));
 };
-var ErrorBoundary = class extends React10.Component {
+var ErrorBoundary = class extends React11.Component {
   constructor(props) {
     super(props);
     this.state = { hasError: false };
@@ -298,11 +332,11 @@ var ErrorBoundary = class extends React10.Component {
   }
   render() {
     if (this.state.error && this.state.hasError) {
-      return /* @__PURE__ */ React10.createElement(Article, {
+      return /* @__PURE__ */ React11.createElement(Article, {
         title: "\u51FA\u9519"
-      }, /* @__PURE__ */ React10.createElement("div", {
+      }, /* @__PURE__ */ React11.createElement("div", {
         className: "relative h-256"
-      }, /* @__PURE__ */ React10.createElement(Error2, {
+      }, /* @__PURE__ */ React11.createElement(Error2, {
         error: this.state.error
       })));
     }
@@ -311,20 +345,20 @@ var ErrorBoundary = class extends React10.Component {
 };
 
 // lib/pop-confirm/PopConfirm.tsx
-import React11, { useState as useState2 } from "react";
+import React12, { useState as useState2 } from "react";
 var PopConfirm = (props) => {
   const [loading, setLoading] = useState2(false);
   const { onOk, onCancel, children, content, className } = props;
-  return /* @__PURE__ */ React11.createElement(Panel, {
+  return /* @__PURE__ */ React12.createElement(Panel, {
     className
-  }, /* @__PURE__ */ React11.createElement("div", {
+  }, /* @__PURE__ */ React12.createElement("div", {
     className: "mb-32"
-  }, children || content), /* @__PURE__ */ React11.createElement("div", {
+  }, children || content), /* @__PURE__ */ React12.createElement("div", {
     className: "flex justify-end"
-  }, onCancel && /* @__PURE__ */ React11.createElement(Button, {
+  }, onCancel && /* @__PURE__ */ React12.createElement(Button, {
     onClick: onCancel,
     type: "normal" /* NORMAL */
-  }, "Cancel"), onOk && /* @__PURE__ */ React11.createElement(Button, {
+  }, "Cancel"), onOk && /* @__PURE__ */ React12.createElement(Button, {
     onClick: async (e) => {
       setLoading(true);
       await onOk(e);
@@ -332,80 +366,80 @@ var PopConfirm = (props) => {
     },
     className: "ml-16 relative",
     type: loading ? "disabled" /* DISABLED */ : "primary" /* PRIMARY */
-  }, "OK", loading && /* @__PURE__ */ React11.createElement(BlinkDot, {
+  }, "OK", loading && /* @__PURE__ */ React12.createElement(BlinkDot, {
     className: "!absolute top-2 right-2"
   }))));
 };
 
 // lib/table/Table.tsx
-import React12 from "react";
+import React13 from "react";
 var Table = (props) => {
   const { rowCount, rowRenderer, headerRenderer, className } = props;
   const rows = [];
   for (let i = 0; i < rowCount; i++) {
-    rows.push(/* @__PURE__ */ React12.createElement("tr", {
+    rows.push(/* @__PURE__ */ React13.createElement("tr", {
       key: i
     }, rowRenderer(i)));
   }
-  return /* @__PURE__ */ React12.createElement("table", {
+  return /* @__PURE__ */ React13.createElement("table", {
     className
-  }, headerRenderer && /* @__PURE__ */ React12.createElement("thead", null, /* @__PURE__ */ React12.createElement("tr", null, headerRenderer())), /* @__PURE__ */ React12.createElement("tbody", null, rows));
+  }, headerRenderer && /* @__PURE__ */ React13.createElement("thead", null, /* @__PURE__ */ React13.createElement("tr", null, headerRenderer())), /* @__PURE__ */ React13.createElement("tbody", null, rows));
 };
-Table.HCell = (props) => /* @__PURE__ */ React12.createElement("th", {
+Table.HCell = (props) => /* @__PURE__ */ React13.createElement("th", {
   ...props
 }, props.children);
-Table.Cell = (props) => /* @__PURE__ */ React12.createElement("td", {
+Table.Cell = (props) => /* @__PURE__ */ React13.createElement("td", {
   ...props
 }, props.children);
 
 // lib/skeleton/Seleton.tsx
 import classNames6 from "classnames";
-import React14 from "react";
+import React15 from "react";
 
 // lib/list/list.tsx
-import cls from "classnames";
-import React13 from "react";
+import cls2 from "classnames";
+import React14 from "react";
 var List = (props) => {
   const { items, itemRenderer, className, horizontal, compact } = props;
   const spaceCls = compact ? "" : horizontal ? "mr-3" : "mb-16";
-  return /* @__PURE__ */ React13.createElement("ul", {
-    className: cls(className, "list-style-none", {
+  return /* @__PURE__ */ React14.createElement("ul", {
+    className: cls2(className, "list-style-none", {
       flex: horizontal,
       "items-center": horizontal
     })
   }, items.map((item, index) => {
-    return /* @__PURE__ */ React13.createElement("li", {
+    return /* @__PURE__ */ React14.createElement("li", {
       key: item.id || index,
-      className: cls(spaceCls, "flex-shrink-0", { "!my-0": horizontal })
+      className: cls2(spaceCls, "flex-shrink-0", { "!my-0": horizontal })
     }, itemRenderer(item, index));
   }));
 };
 var TitledList = (props) => {
   const { title, description, ...rest } = props;
   if (!title) {
-    return /* @__PURE__ */ React13.createElement(List, {
+    return /* @__PURE__ */ React14.createElement(List, {
       ...rest
     });
   }
-  return /* @__PURE__ */ React13.createElement(Article, {
+  return /* @__PURE__ */ React14.createElement(Article, {
     title,
     description,
     className: "w-fit"
-  }, /* @__PURE__ */ React13.createElement(List, {
+  }, /* @__PURE__ */ React14.createElement(List, {
     ...rest
   }));
 };
 var LinkList = (props) => {
   const { title, description, links, ...rest } = props;
   const renderLink = ({ name, to, external, ...rest2 }) => {
-    return /* @__PURE__ */ React13.createElement(Link, {
+    return /* @__PURE__ */ React14.createElement(Link, {
       to,
       key: name,
       external,
       ...rest2
     }, name);
   };
-  return /* @__PURE__ */ React13.createElement(TitledList, {
+  return /* @__PURE__ */ React14.createElement(TitledList, {
     title,
     description,
     items: links,
@@ -435,7 +469,7 @@ var Skeleton = (props) => {
     height = 24,
     className
   } = props;
-  return /* @__PURE__ */ React14.createElement("div", {
+  return /* @__PURE__ */ React15.createElement("div", {
     className: classNames6(
       COLOR_MAPPING2[bgColor],
       "animate-pulse",
@@ -447,13 +481,13 @@ var Skeleton = (props) => {
 };
 var ArticleSkeleton = (props) => {
   const { children, titleLength = 0, descriptionLength } = props;
-  return /* @__PURE__ */ React14.createElement(Article, {
-    title: /* @__PURE__ */ React14.createElement(Skeleton, {
+  return /* @__PURE__ */ React15.createElement(Article, {
+    title: /* @__PURE__ */ React15.createElement(Skeleton, {
       width: 36 * titleLength,
       height: 36,
       bgColor: "black" /* BLACK */
     }),
-    description: descriptionLength && /* @__PURE__ */ React14.createElement(Skeleton, {
+    description: descriptionLength && /* @__PURE__ */ React15.createElement(Skeleton, {
       width: 16 * descriptionLength
     })
   }, children);
@@ -461,29 +495,29 @@ var ArticleSkeleton = (props) => {
 var LinkListSkeleton = (props) => {
   const { linksLength, ...rest } = props;
   const renderSkeleton = (length) => {
-    return /* @__PURE__ */ React14.createElement(Skeleton, {
+    return /* @__PURE__ */ React15.createElement(Skeleton, {
       className: "inline-block align-middle",
       width: length * 16,
       bgColor: "blue" /* BLUE */
     });
   };
   if (!rest.titleLength) {
-    return /* @__PURE__ */ React14.createElement(List, {
+    return /* @__PURE__ */ React15.createElement(List, {
       items: linksLength,
       itemRenderer: renderSkeleton
     });
   }
-  return /* @__PURE__ */ React14.createElement(ArticleSkeleton, {
+  return /* @__PURE__ */ React15.createElement(ArticleSkeleton, {
     ...rest
-  }, /* @__PURE__ */ React14.createElement(List, {
+  }, /* @__PURE__ */ React15.createElement(List, {
     items: linksLength,
     itemRenderer: renderSkeleton
   }));
 };
 
 // lib/drop-image/DropImage.tsx
-import cls2 from "classnames";
-import React15, {
+import cls3 from "classnames";
+import React16, {
   useEffect as useEffect2,
   useCallback as useCallback2
 } from "react";
@@ -607,8 +641,8 @@ var ImagePreviewer = (props) => {
     imageSrc,
     className
   } = props;
-  return /* @__PURE__ */ React15.createElement("img", {
-    className: cls2(
+  return /* @__PURE__ */ React16.createElement("img", {
+    className: cls3(
       className,
       "max-w-[100%]",
       "h-[auto]",
@@ -672,13 +706,13 @@ var GhostDropImage = (props) => {
       document.removeEventListener("dragenter", handleDocDragEnter);
     };
   }, []);
-  const coverCls = cls2("fixed", "top-0", "left-0", "h-full", "w-full", {
+  const coverCls = cls3("fixed", "top-0", "left-0", "h-full", "w-full", {
     "lqip-blur": coverVisible,
     "z-[999]": coverVisible,
     block: coverVisible,
     hidden: !coverVisible
   });
-  return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", {
+  return /* @__PURE__ */ React16.createElement(React16.Fragment, null, /* @__PURE__ */ React16.createElement("div", {
     className: coverCls,
     onDragLeave: () => {
       handleDragLeave();
@@ -691,7 +725,7 @@ var GhostDropImage = (props) => {
     imageRef,
     imageSize,
     imageSrc
-  }) : /* @__PURE__ */ React15.createElement(ImagePreviewer, {
+  }) : /* @__PURE__ */ React16.createElement(ImagePreviewer, {
     className,
     visible: imageVisible,
     imageRef,
@@ -718,7 +752,7 @@ var DropImage = (props) => {
     }
   } = props;
   if (ghost) {
-    return /* @__PURE__ */ React15.createElement(GhostDropImage, {
+    return /* @__PURE__ */ React16.createElement(GhostDropImage, {
       ...props
     });
   }
@@ -751,8 +785,8 @@ var DropImage = (props) => {
       height: imageSize.height || dropAreaStyle.height
     });
   };
-  return /* @__PURE__ */ React15.createElement("div", {
-    className: cls2(
+  return /* @__PURE__ */ React16.createElement("div", {
+    className: cls3(
       className,
       "transition-all items-center justify-center flex duration-200 ease-in-out",
       {
@@ -769,7 +803,7 @@ var DropImage = (props) => {
     imageRef,
     imageSize,
     imageSrc
-  }) : /* @__PURE__ */ React15.createElement(ImagePreviewer, {
+  }) : /* @__PURE__ */ React16.createElement(ImagePreviewer, {
     visible: showImagePreviewer,
     imageRef,
     imageSrc,
@@ -778,27 +812,27 @@ var DropImage = (props) => {
 };
 
 // lib/layout/layout.tsx
-import cls3 from "classnames";
-import React16 from "react";
+import cls4 from "classnames";
+import React17 from "react";
 var ThreeColLayout = (props) => {
   const { leftRenderer, middleRenderer, rightRenderer } = props;
-  const colCls = cls3("max-h-full overflow-auto xl:!block py-128");
-  return /* @__PURE__ */ React16.createElement("div", {
+  const colCls = cls4("max-h-full overflow-auto xl:!block py-128");
+  return /* @__PURE__ */ React17.createElement("div", {
     className: "grid grid-cols-1 xl:grid-cols-3 gap-4 h-full w-full"
-  }, /* @__PURE__ */ React16.createElement("div", {
-    className: cls3("hidden", colCls)
-  }, leftRenderer && leftRenderer()), /* @__PURE__ */ React16.createElement("div", {
-    className: cls3(colCls, "sm:px-128 xl:px-0 no-scrollbar", "relative", {
+  }, /* @__PURE__ */ React17.createElement("div", {
+    className: cls4("hidden", colCls)
+  }, leftRenderer && leftRenderer()), /* @__PURE__ */ React17.createElement("div", {
+    className: cls4(colCls, "sm:px-128 xl:px-0 no-scrollbar", "relative", {
       hidden: !middleRenderer
     })
-  }, middleRenderer && middleRenderer()), /* @__PURE__ */ React16.createElement("div", {
-    className: cls3("hidden", colCls)
+  }, middleRenderer && middleRenderer()), /* @__PURE__ */ React17.createElement("div", {
+    className: cls4("hidden", colCls)
   }, rightRenderer && rightRenderer()));
 };
 
 // lib/img/Img.tsx
 import classnames from "classnames";
-import React17, { useState as useState5 } from "react";
+import React18, { useState as useState5 } from "react";
 
 // lib/img/types.ts
 var ossProcessType = /* @__PURE__ */ ((ossProcessType2) => {
@@ -877,7 +911,7 @@ var Img = (props) => {
     }
     img.onload = updateFunc;
   };
-  return /* @__PURE__ */ React17.createElement("span", {
+  return /* @__PURE__ */ React18.createElement("span", {
     className: classnames(
       className,
       "inline-block",
@@ -890,19 +924,19 @@ var Img = (props) => {
     ),
     draggable: false,
     style: Object.assign({}, baseWrapperStyle, dynamicWrapperStyle)
-  }, /* @__PURE__ */ React17.createElement("img", {
+  }, /* @__PURE__ */ React18.createElement("img", {
     ref: (input) => {
       if (!input) {
         return;
       }
       handleImgLoad(input);
     },
-    crossOrigin: "anonymous",
     width,
     height,
     src: addOssWebpProcessStyle(src, processType || "webp" /* WEBP */),
     decoding: "async",
     loading: "lazy",
+    crossOrigin: "anonymous",
     style: {
       contentVisibility: "auto"
     },
@@ -914,7 +948,7 @@ var Img = (props) => {
         "opacity-0": !decoded
       }
     )
-  }), /* @__PURE__ */ React17.createElement("img", {
+  }), /* @__PURE__ */ React18.createElement("img", {
     src: emptyDataURL,
     className: classnames(
       "lqip-blur",
@@ -935,11 +969,11 @@ var Img = (props) => {
 
 // lib/img/Gallery.tsx
 import classnames3 from "classnames";
-import React19 from "react";
+import React20 from "react";
 
 // lib/img/RandomRowsLayout.tsx
 import classnames2 from "classnames";
-import React18 from "react";
+import React19 from "react";
 var last = (arr) => {
   if (arr.length < 2) {
     return arr[0];
@@ -974,7 +1008,7 @@ var sumColNumByIdx = (colNums, idx) => {
   }
   return sum;
 };
-var RandomRowsLayout = React18.memo(
+var RandomRowsLayout = React19.memo(
   (props) => {
     const {
       cellsCount,
@@ -983,14 +1017,14 @@ var RandomRowsLayout = React18.memo(
       cellWrapperClsGenerator = defaultCellClsGenerator
     } = props;
     const colNums = generateRandomColNum(cellsCount);
-    return /* @__PURE__ */ React18.createElement("div", {
+    return /* @__PURE__ */ React19.createElement("div", {
       className: classNames8
     }, colNums.map((colNum, row) => {
       const randBool = generateRandomBoolean(
         colNum < 2 ? 0.6 : 0.5
       );
       const randBoolArr = [randBool, !randBool];
-      return /* @__PURE__ */ React18.createElement("div", {
+      return /* @__PURE__ */ React19.createElement("div", {
         className: "flex items-center flex-wrap",
         key: row
       }, new Array(colNum).fill(null).map((_, col) => {
@@ -1004,7 +1038,7 @@ var RandomRowsLayout = React18.memo(
           "basis-full",
           generatedCls
         );
-        return /* @__PURE__ */ React18.createElement("div", {
+        return /* @__PURE__ */ React19.createElement("div", {
           className: cls6,
           key: col
         }, cellRenderer(currentIdx, randBoolArr[col], col));
@@ -1018,7 +1052,7 @@ var RandomRowsLayout = React18.memo(
 
 // lib/img/Gallery.tsx
 var defaultImageRenderer = (img, index, col) => {
-  return /* @__PURE__ */ React19.createElement("div", {
+  return /* @__PURE__ */ React20.createElement("div", {
     className: classnames3("mb-128", {
       "md:mr-64": col === 0,
       "md:ml-64": col !== 0
@@ -1039,7 +1073,7 @@ var Gallery = (props) => {
       return null;
     }
     return imageRenderer(
-      /* @__PURE__ */ React19.createElement(Img, {
+      /* @__PURE__ */ React20.createElement(Img, {
         ...image,
         size: isLargeImage ? "large" : "normal"
       }),
@@ -1048,9 +1082,9 @@ var Gallery = (props) => {
       isLargeImage
     );
   };
-  return /* @__PURE__ */ React19.createElement("div", {
+  return /* @__PURE__ */ React20.createElement("div", {
     className: classnames3("w-full flex justify-center", className)
-  }, /* @__PURE__ */ React19.createElement(RandomRowsLayout, {
+  }, /* @__PURE__ */ React20.createElement(RandomRowsLayout, {
     classNames: "mx-32 mt-128 max-w-screen-xl",
     cellsCount: images.length,
     cellRenderer: renderImage,
@@ -1061,7 +1095,7 @@ var Gallery = (props) => {
 // lib/loading-spiral/LoadingSpiral.tsx
 import Phenomenon from "phenomenon";
 import classNames7 from "classnames";
-import React20, { useEffect as useEffect3, useRef as useRef2 } from "react";
+import React21, { useEffect as useEffect3, useRef as useRef2 } from "react";
 
 // lib/loading-spiral/createSettings.ts
 var createSettings = (settings) => {
@@ -1191,7 +1225,7 @@ var LoadingSpiral = (props) => {
       createOptions()
     );
   }, []);
-  return /* @__PURE__ */ React20.createElement("canvas", {
+  return /* @__PURE__ */ React21.createElement("canvas", {
     style: {
       maxWidth: 500,
       maxHeight: 500,
@@ -1206,8 +1240,8 @@ var LoadingSpiral = (props) => {
 };
 
 // lib/drop-zone/DropZone.tsx
-import React21, { useCallback as useCallback3, useEffect as useEffect4, useState as useState6 } from "react";
-import cls4 from "classnames";
+import React22, { useCallback as useCallback3, useEffect as useEffect4, useState as useState6 } from "react";
+import cls5 from "classnames";
 var DropZone = (props) => {
   const { onDrop, children, className, style } = props;
   const [coverVisible, setCoverVisible] = useState6(false);
@@ -1228,19 +1262,19 @@ var DropZone = (props) => {
     };
   }, []);
   if (props.disabled) {
-    return /* @__PURE__ */ React21.createElement(React21.Fragment, null, children);
+    return /* @__PURE__ */ React22.createElement(React22.Fragment, null, children);
   }
   const handleDragOver = (e) => {
     e.preventDefault();
     setCoverVisible(true);
   };
-  const coverCls = cls4("fixed", "top-0", "left-0", "h-full", "w-full", {
+  const coverCls = cls5("fixed", "top-0", "left-0", "h-full", "w-full", {
     "text-blur": coverVisible,
     "z-[999]": coverVisible,
     block: coverVisible,
     hidden: !coverVisible
   });
-  return /* @__PURE__ */ React21.createElement(React21.Fragment, null, /* @__PURE__ */ React21.createElement("div", {
+  return /* @__PURE__ */ React22.createElement(React22.Fragment, null, /* @__PURE__ */ React22.createElement("div", {
     className: coverCls,
     onDragLeave: () => {
       setCoverVisible(false);
@@ -1251,7 +1285,7 @@ var DropZone = (props) => {
 };
 
 // lib/context-menu/index.tsx
-import * as React22 from "react";
+import * as React23 from "react";
 import * as ContextMenuPrimitive from "@radix-ui/react-context-menu";
 import {
   CheckIcon,
@@ -1266,7 +1300,7 @@ var ContextMenuGroup = ContextMenuPrimitive.Group;
 var ContextMenuPortal = ContextMenuPrimitive.Portal;
 var ContextMenuSub = ContextMenuPrimitive.Sub;
 var ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
-var ContextMenuSubTrigger = React22.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.SubTrigger, {
+var ContextMenuSubTrigger = React23.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.SubTrigger, {
   ref,
   className: cn(
     "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
@@ -1274,11 +1308,11 @@ var ContextMenuSubTrigger = React22.forwardRef(({ className, inset, children, ..
     className
   ),
   ...props
-}, children, /* @__PURE__ */ React22.createElement(ChevronRightIcon, {
+}, children, /* @__PURE__ */ React23.createElement(ChevronRightIcon, {
   className: "ml-auto"
 })));
 ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
-var ContextMenuSubContent = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.SubContent, {
+var ContextMenuSubContent = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.SubContent, {
   ref,
   className: cn(
     "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
@@ -1287,7 +1321,7 @@ var ContextMenuSubContent = React22.forwardRef(({ className, ...props }, ref) =>
   ...props
 }));
 ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
-var ContextMenuContent = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.Portal, null, /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.Content, {
+var ContextMenuContent = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.Portal, null, /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.Content, {
   ref,
   className: cn(
     "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
@@ -1296,7 +1330,7 @@ var ContextMenuContent = React22.forwardRef(({ className, ...props }, ref) => /*
   ...props
 })));
 ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
-var ContextMenuItem = React22.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.Item, {
+var ContextMenuItem = React23.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.Item, {
   ref,
   className: cn(
     "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
@@ -1306,7 +1340,7 @@ var ContextMenuItem = React22.forwardRef(({ className, inset, ...props }, ref) =
   ...props
 }));
 ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
-var ContextMenuCheckboxItem = React22.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.CheckboxItem, {
+var ContextMenuCheckboxItem = React23.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.CheckboxItem, {
   ref,
   className: cn(
     "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-32 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
@@ -1314,26 +1348,26 @@ var ContextMenuCheckboxItem = React22.forwardRef(({ className, children, checked
   ),
   checked,
   ...props
-}, /* @__PURE__ */ React22.createElement("span", {
+}, /* @__PURE__ */ React23.createElement("span", {
   className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center"
-}, /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.ItemIndicator, null, /* @__PURE__ */ React22.createElement(CheckIcon, {
+}, /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.ItemIndicator, null, /* @__PURE__ */ React23.createElement(CheckIcon, {
   className: "h-4 w-4"
 }))), children));
 ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
-var ContextMenuRadioItem = React22.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.RadioItem, {
+var ContextMenuRadioItem = React23.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.RadioItem, {
   ref,
   className: cn(
     "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-32 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
     className
   ),
   ...props
-}, /* @__PURE__ */ React22.createElement("span", {
+}, /* @__PURE__ */ React23.createElement("span", {
   className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center"
-}, /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.ItemIndicator, null, /* @__PURE__ */ React22.createElement(DotFilledIcon, {
+}, /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.ItemIndicator, null, /* @__PURE__ */ React23.createElement(DotFilledIcon, {
   className: "h-4 w-4 fill-current"
 }))), children));
 ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
-var ContextMenuLabel = React22.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.Label, {
+var ContextMenuLabel = React23.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.Label, {
   ref,
   className: cn(
     "px-2 py-1.5 text-sm font-semibold text-foreground",
@@ -1343,7 +1377,7 @@ var ContextMenuLabel = React22.forwardRef(({ className, inset, ...props }, ref)
   ...props
 }));
 ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
-var ContextMenuSeparator = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React22.createElement(ContextMenuPrimitive.Separator, {
+var ContextMenuSeparator = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React23.createElement(ContextMenuPrimitive.Separator, {
   ref,
   className: cn("-mx-1 my-1 h-px bg-border", className),
   ...props
@@ -1353,7 +1387,7 @@ var ContextMenuShortcut = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ React22.createElement("span", {
+  return /* @__PURE__ */ React23.createElement("span", {
     className: cn(
       "ml-auto text-xs tracking-widest text-muted-foreground",
       className
@@ -1364,7 +1398,7 @@ var ContextMenuShortcut = ({
 ContextMenuShortcut.displayName = "ContextMenuShortcut";
 
 // lib/form/index.tsx
-import * as React24 from "react";
+import * as React25 from "react";
 import { z } from "zod";
 import { Slot } from "@radix-ui/react-slot";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -1377,7 +1411,7 @@ import {
 import cn3 from "classnames";
 
 // lib/label/index.tsx
-import * as React23 from "react";
+import * as React24 from "react";
 import * as LabelPrimitive from "@radix-ui/react-label";
 import { cva } from "class-variance-authority";
 import cn2 from "classnames";
@@ -1385,7 +1419,7 @@ import cn2 from "classnames";
 var labelVariants = cva(
   "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
 );
-var Label2 = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React23.createElement(LabelPrimitive.Root, {
+var Label2 = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React24.createElement(LabelPrimitive.Root, {
   ref,
   className: cn2(labelVariants(), className),
   ...props
@@ -1395,21 +1429,21 @@ Label2.displayName = LabelPrimitive.Root.displayName;
 // lib/form/index.tsx
 "use client";
 var Form = FormProvider;
-var FormFieldContext = React24.createContext(
+var FormFieldContext = React25.createContext(
   {}
 );
 var FormField = ({
   ...props
 }) => {
-  return /* @__PURE__ */ React24.createElement(FormFieldContext.Provider, {
+  return /* @__PURE__ */ React25.createElement(FormFieldContext.Provider, {
     value: { name: props.name }
-  }, /* @__PURE__ */ React24.createElement(Controller, {
+  }, /* @__PURE__ */ React25.createElement(Controller, {
     ...props
   }));
 };
 var useFormField = () => {
-  const fieldContext = React24.useContext(FormFieldContext);
-  const itemContext = React24.useContext(FormItemContext);
+  const fieldContext = React25.useContext(FormFieldContext);
+  const itemContext = React25.useContext(FormItemContext);
   const { getFieldState, formState } = useFormContext();
   const fieldState = getFieldState(fieldContext.name, formState);
   if (!fieldContext) {
@@ -1425,23 +1459,23 @@ var useFormField = () => {
     ...fieldState
   };
 };
-var FormItemContext = React24.createContext(
+var FormItemContext = React25.createContext(
   {}
 );
-var FormItem = React24.forwardRef(({ className, ...props }, ref) => {
-  const id = React24.useId();
-  return /* @__PURE__ */ React24.createElement(FormItemContext.Provider, {
+var FormItem = React25.forwardRef(({ className, ...props }, ref) => {
+  const id = React25.useId();
+  return /* @__PURE__ */ React25.createElement(FormItemContext.Provider, {
     value: { id }
-  }, /* @__PURE__ */ React24.createElement("div", {
+  }, /* @__PURE__ */ React25.createElement("div", {
     ref,
     className: cn3("space-y-2", className),
     ...props
   }));
 });
 FormItem.displayName = "FormItem";
-var FormLabel = React24.forwardRef(({ className, ...props }, ref) => {
+var FormLabel = React25.forwardRef(({ className, ...props }, ref) => {
   const { error, formItemId } = useFormField();
-  return /* @__PURE__ */ React24.createElement(Label2, {
+  return /* @__PURE__ */ React25.createElement(Label2, {
     ref,
     className: cn3(error && "text-destructive", className),
     htmlFor: formItemId,
@@ -1449,9 +1483,9 @@ var FormLabel = React24.forwardRef(({ className, ...props }, ref) => {
   });
 });
 FormLabel.displayName = "FormLabel";
-var FormControl = React24.forwardRef(({ ...props }, ref) => {
+var FormControl = React25.forwardRef(({ ...props }, ref) => {
   const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
-  return /* @__PURE__ */ React24.createElement(Slot, {
+  return /* @__PURE__ */ React25.createElement(Slot, {
     ref,
     id: formItemId,
     "aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`,
@@ -1460,9 +1494,9 @@ var FormControl = React24.forwardRef(({ ...props }, ref) => {
   });
 });
 FormControl.displayName = "FormControl";
-var FormDescription = React24.forwardRef(({ className, ...props }, ref) => {
+var FormDescription = React25.forwardRef(({ className, ...props }, ref) => {
   const { formDescriptionId } = useFormField();
-  return /* @__PURE__ */ React24.createElement("p", {
+  return /* @__PURE__ */ React25.createElement("p", {
     ref,
     id: formDescriptionId,
     className: cn3("text-sm text-muted-foreground", className),
@@ -1470,13 +1504,13 @@ var FormDescription = React24.forwardRef(({ className, ...props }, ref) => {
   });
 });
 FormDescription.displayName = "FormDescription";
-var FormMessage = React24.forwardRef(({ className, children, ...props }, ref) => {
+var FormMessage = React25.forwardRef(({ className, children, ...props }, ref) => {
   const { error, formMessageId } = useFormField();
   const body = error ? String(error == null ? void 0 : error.message) : children;
   if (!body) {
     return null;
   }
-  return /* @__PURE__ */ React24.createElement("p", {
+  return /* @__PURE__ */ React25.createElement("p", {
     ref,
     id: formMessageId,
     className: cn3("text-sm font-medium text-destructive", className),
@@ -1486,11 +1520,11 @@ var FormMessage = React24.forwardRef(({ className, children, ...props }, ref) =>
 FormMessage.displayName = "FormMessage";
 
 // lib/input/index.tsx
-import * as React25 from "react";
+import * as React26 from "react";
 import cn4 from "classnames";
-var Input = React25.forwardRef(
+var Input = React26.forwardRef(
   ({ className, type, ...props }, ref) => {
-    return /* @__PURE__ */ React25.createElement("input", {
+    return /* @__PURE__ */ React26.createElement("input", {
       type,
       className: cn4(
         "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
@@ -1503,33 +1537,6 @@ var Input = React25.forwardRef(
 );
 Input.displayName = "Input";
 
-// lib/blur-cover/BlurCover.tsx
-import React26 from "react";
-import cls5 from "classnames";
-var BlurCover = (props) => {
-  const { status } = props;
-  const coverCls = cls5(
-    "fixed",
-    "block",
-    "text-blur",
-    "transition-all",
-    "top-0",
-    "left-0",
-    "h-full",
-    "w-full",
-    {
-      "z-[999]": status === "show",
-      "opacity-0": status === "silent",
-      "opacity-100": status === "show",
-      "pointer-events-none": status === "silent"
-    },
-    props.className
-  );
-  return /* @__PURE__ */ React26.createElement("div", {
-    className: coverCls
-  });
-};
-
 // lib/canvas/Canvas.tsx
 import React27, { useEffect as useEffect6 } from "react";