@underverse-ui/underverse 1.0.199 → 1.0.200

package/api-reference.json

@@ -1,6 +1,6 @@
 {
   "package": "@underverse-ui/underverse",
-  "version": "1.0.199",
+  "version": "1.0.200",
   "sourceEntry": "src/index.ts",
   "totalExports": 252,
   "exports": [

package/dist/index.cjs

@@ -210,6 +210,39 @@ module.exports = __toCommonJS(index_exports);
 // src/components/Button.tsx
 var import_react = require("react");
 
+// src/constants/form-control-size.ts
+var formControlSizeStyles = {
+  sm: {
+    control: "h-8 px-3 text-sm leading-none md:h-7 md:text-xs",
+    compactControl: "h-8 px-2.5 text-sm leading-none md:h-7 md:text-xs",
+    input: "h-8 px-3 text-sm leading-none md:h-7 md:text-xs",
+    label: "text-xs",
+    icon: "h-4 w-4 md:h-3.5 md:w-3.5",
+    iconButton: "h-7 w-7 md:h-6 md:w-6",
+    tag: "h-5 max-w-24 px-2 text-[10px] leading-none"
+  },
+  md: {
+    control: "h-10 px-3 text-sm leading-none",
+    compactControl: "h-10 px-3 text-sm leading-none",
+    input: "h-10 px-4 text-sm leading-none",
+    label: "text-sm",
+    icon: "h-4 w-4",
+    iconButton: "h-8 w-8",
+    tag: "h-6 max-w-28 px-2 text-xs leading-none"
+  },
+  lg: {
+    control: "h-12 px-4 text-base leading-none",
+    compactControl: "h-12 px-4 text-base leading-none",
+    input: "h-12 px-5 text-base leading-none",
+    label: "text-base",
+    icon: "h-5 w-5",
+    iconButton: "h-10 w-10",
+    tag: "h-7 max-w-32 px-2.5 text-sm leading-none"
+  }
+};
+var formControlFixedClass = "min-h-0 overflow-hidden";
+var formControlValueClass = "max-h-full min-w-0 flex-1 truncate whitespace-nowrap";
+
 // src/constants/button.ts
 var VARIANT_STYLES_BTN = {
   // Mặc định: tối giản, rõ ràng, dùng tokens hệ màu
@@ -233,10 +266,10 @@ var VARIANT_STYLES_BTN = {
   gradient: "bg-linear-to-r from-primary via-primary/80 to-secondary text-primary-foreground hover:opacity-90 shadow-md border-0"
 };
 var SIZE_STYLES_BTN = {
-  sm: "px-3 py-1.5 text-sm h-8 min-w-8 md:px-2.5 md:py-1 md:h-7 md:text-xs",
-  md: "px-4 py-2 text-sm h-10 min-w-10 md:px-3 md:py-1.5 md:h-9",
-  lg: "px-6 py-3 text-base h-12 min-w-12 md:px-4 md:py-2 md:h-10 md:text-sm",
-  smx: "px-3.5 py-1.5 text-[13px] h-9 min-w-9 md:px-3 md:py-1 md:h-8 md:text-xs",
+  sm: `${formControlSizeStyles.sm.control} min-w-8`,
+  md: `${formControlSizeStyles.md.input} min-w-10`,
+  lg: `${formControlSizeStyles.lg.input} min-w-12`,
+  smx: "h-9 min-w-9 px-3.5 text-[13px] leading-none md:h-8 md:text-xs",
   icon: "w-11 h-11 p-0 rounded-full flex items-center justify-center md:w-10 md:h-10"
 };
 
@@ -321,6 +354,7 @@ var Button = (0, import_react.forwardRef)(
     const finalVariant = gradient ? "gradient" : variant;
     const variantStyle = VARIANT_STYLES_BTN[finalVariant] || VARIANT_STYLES_BTN.default;
     const sizeStyle = SIZE_STYLES_BTN[size] || SIZE_STYLES_BTN.md;
+    const iconSizeStyle = size === "sm" ? formControlSizeStyles.sm.icon : size === "lg" || size === "icon" ? formControlSizeStyles.lg.icon : formControlSizeStyles.md.icon;
     const globalConfig = useUnderverseUIConfig();
     const resolvedBorderMode = borderMode ?? globalConfig.button?.borderMode ?? "full";
     const SpinnerIcon = Spinner ?? import_lucide_react.Activity;
@@ -385,13 +419,13 @@ var Button = (0, import_react.forwardRef)(
         children: [
           !noHoverOverlay ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "absolute inset-0 bg-linear-to-r from-primary-foreground/20 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-200 dark:hidden" }) : null,
           loading2 ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SpinnerIcon, { className: "w-4 h-4 animate-spin", "aria-hidden": "true" }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SpinnerIcon, { className: cn(iconSizeStyle, "shrink-0 animate-spin"), "aria-hidden": "true" }),
             loadingText ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "ml-2", "aria-live": "polite", children: loadingText }) : null,
             preserveChildrenOnLoading && !loadingText ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "ml-2 opacity-70", "aria-hidden": true, children }) : null
           ] }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-            Icon ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { className: cn("transition-transform duration-200", iConClassName ? iConClassName : "w-5 h-5") }) : null,
+            Icon ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { className: cn("shrink-0 transition-transform duration-200", iConClassName ? iConClassName : iconSizeStyle) }) : null,
             children,
-            IconRight ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(IconRight, { className: "w-4 h-4 transition-transform duration-200" }) : null
+            IconRight ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(IconRight, { className: cn(iconSizeStyle, "shrink-0 transition-transform duration-200") }) : null
           ] })
         ]
       }
@@ -3112,39 +3146,6 @@ function useOverlayScrollbarTarget(targetRef, options = {}) {
 }
 var OverlayScrollbarProvider_default = OverlayScrollbarProvider;
 
-// src/components/form-control-size.ts
-var formControlSizeStyles = {
-  sm: {
-    control: "h-8 px-3 text-sm leading-none md:h-7 md:text-xs",
-    compactControl: "h-8 px-2.5 text-sm leading-none md:h-7 md:text-xs",
-    input: "h-8 px-3 text-sm leading-none md:h-7 md:text-xs",
-    label: "text-xs",
-    icon: "h-4 w-4 md:h-3.5 md:w-3.5",
-    iconButton: "h-7 w-7 md:h-6 md:w-6",
-    tag: "h-5 max-w-24 px-2 text-[10px] leading-none"
-  },
-  md: {
-    control: "h-10 px-3 text-sm leading-none",
-    compactControl: "h-10 px-3 text-sm leading-none",
-    input: "h-10 px-4 text-sm leading-none",
-    label: "text-sm",
-    icon: "h-4 w-4",
-    iconButton: "h-8 w-8",
-    tag: "h-6 max-w-28 px-2 text-xs leading-none"
-  },
-  lg: {
-    control: "h-12 px-4 text-base leading-none",
-    compactControl: "h-12 px-4 text-base leading-none",
-    input: "h-12 px-5 text-base leading-none",
-    label: "text-base",
-    icon: "h-5 w-5",
-    iconButton: "h-10 w-10",
-    tag: "h-7 max-w-32 px-2.5 text-sm leading-none"
-  }
-};
-var formControlFixedClass = "min-h-0 overflow-hidden";
-var formControlValueClass = "max-h-full min-w-0 flex-1 truncate whitespace-nowrap";
-
 // src/components/Input.tsx
 var import_jsx_runtime11 = require("react/jsx-runtime");
 var Input = (0, import_react4.forwardRef)(
@@ -33959,7 +33960,7 @@ var EditorToolbar = ({
     "div",
     {
       role: "toolbar",
-      className: "flex min-h-[60px] flex-nowrap items-center gap-1 overflow-x-auto border-b border-[rgba(196,197,213,0.6)] bg-[#F4F4F4] px-3 py-3 dark:bg-muted/60",
+      className: "flex min-h-15 flex-nowrap items-center gap-1 overflow-x-auto border-b border-[rgba(196,197,213,0.6)] bg-[#F4F4F4] px-3 py-3 dark:bg-muted/60",
       children: [
         isFull && /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
           DropdownMenu,
@@ -33970,7 +33971,7 @@ var EditorToolbar = ({
                 onClick: () => {
                 },
                 title: t("toolbar.fontFamily"),
-                className: "h-9 w-[200px] max-w-[200px] justify-between gap-3 rounded-lg border border-[rgba(196,197,213,0.6)] bg-white px-3 text-[#404040] shadow-[0_1px_2px_rgba(0,0,0,0.07)] hover:bg-white hover:text-[#404040] dark:bg-background dark:text-foreground",
+                className: "h-9 w-50 max-w-50 justify-between gap-3 rounded-lg border border-[rgba(196,197,213,0.6)] bg-white px-3 text-[#404040] shadow-[0_1px_2px_rgba(0,0,0,0.07)] hover:bg-white hover:text-[#404040] dark:bg-background dark:text-foreground",
                 children: [
                   /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("span", { className: "min-w-0 flex-1 truncate text-left text-sm font-normal", style: { fontFamily: displayedFontFamilyValue || void 0 }, children: displayedFontFamilyLabel }),
                   /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(FigmaChevronDownIcon, { className: "h-3 w-3 shrink-0 text-[#7B8184]" })