@hanzo/ui 5.3.34 → 5.3.35

package/dist/dock/index.js

@@ -276,15 +276,15 @@ var DockItem2 = React__namespace.forwardRef(
 );
 DockItem2.displayName = "DockItem";
 var buttonVariants = classVarianceAuthority.cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*="size-"])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
-        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
-        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
-        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline",
         // Keep the additional Hanzo variants for backward compatibility
         primary: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
@@ -292,10 +292,12 @@ var buttonVariants = classVarianceAuthority.cva(
         linkMuted: "text-muted-foreground underline-offset-4 hover:underline hover:text-foreground"
       },
       size: {
-        default: "h-9 px-4 py-2",
-        sm: "h-8 rounded-md px-3 text-xs",
-        lg: "h-10 rounded-md px-8",
-        icon: "h-9 w-9"
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
       }
     },
     defaultVariants: {
@@ -305,11 +307,14 @@ var buttonVariants = classVarianceAuthority.cva(
   }
 );
 var Button = React__namespace.forwardRef(
-  ({ className, variant, size, asChild = false, isLoading = false, children, ...props }, ref) => {
+  ({ className, variant = "default", size = "default", asChild = false, isLoading = false, children, ...props }, ref) => {
     const Comp = asChild ? reactSlot.Slot : "button";
     return /* @__PURE__ */ jsxRuntime.jsxs(
       Comp,
       {
+        "data-slot": "button",
+        "data-variant": variant,
+        "data-size": size,
         className: cn(buttonVariants({ variant, size, className })),
         ref,
         ...props,
@@ -317,10 +322,10 @@ var Button = React__namespace.forwardRef(
           isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
             lucideReact.Loader2,
             {
-              className: cn("h-4 w-4 animate-spin", size !== "icon" && "mr-2")
+              className: cn("h-4 w-4 animate-spin", size !== "icon" && size !== "icon-sm" && size !== "icon-lg" && "mr-2")
             }
           ) : null,
-          isLoading && size === "icon" ? null : children
+          isLoading && (size === "icon" || size === "icon-sm" || size === "icon-lg") ? null : children
         ]
       }
     );
@@ -328,16 +333,19 @@ var Button = React__namespace.forwardRef(
 );
 Button.displayName = "Button";
 var badgeVariants = classVarianceAuthority.cva(
-  "focus:ring-ring border-divider inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:ring-2 focus:ring-offset-2 focus:outline-hidden",
+  "inline-flex items-center justify-center w-fit whitespace-nowrap shrink-0 rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:outline-none aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive [&>svg]:pointer-events-none overflow-hidden",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/80 border-transparent shadow",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90 border-transparent shadow-sm",
         secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 border-transparent",
-        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/80 border-transparent shadow",
-        outline: "hover:bg-bg-secondary text-text-secondary hover:text-text-default border border-gray-500 bg-transparent shadow-xs",
-        inputAdornment: "bg-gray-600 px-2 font-medium text-white",
-        tags: "text-text-secondary border-divider bg-bg-quaternary rounded-lg px-2 py-1 font-normal capitalize"
+        destructive: "bg-destructive text-white hover:bg-destructive/90 border-transparent shadow-sm focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground border-transparent",
+        link: "text-primary underline-offset-4 hover:underline border-transparent",
+        // Hanzo-specific variants for backward compatibility
+        inputAdornment: "bg-gray-600 px-2 font-medium text-white border-transparent",
+        tags: "text-muted-foreground border-border bg-muted rounded-lg px-2 py-1 font-normal capitalize"
       }
     },
     defaultVariants: {
@@ -345,12 +353,24 @@ var badgeVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Badge = React__namespace.forwardRef(
-  ({ className, variant, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(badgeVariants({ variant }), className), ...props });
-  }
-);
-Badge.displayName = "Badge";
+function Badge({
+  className,
+  variant = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? reactSlot.Slot : "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      "data-variant": variant,
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+__name(Badge, "Badge");
 var Input = /* @__PURE__ */ __name(({
   className,
   type,

package/dist/dock/index.mjs

@@ -255,15 +255,15 @@ var DockItem2 = React.forwardRef(
 );
 DockItem2.displayName = "DockItem";
 var buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*="size-"])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
-        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
-        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
-        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline",
         // Keep the additional Hanzo variants for backward compatibility
         primary: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
@@ -271,10 +271,12 @@ var buttonVariants = cva(
         linkMuted: "text-muted-foreground underline-offset-4 hover:underline hover:text-foreground"
       },
       size: {
-        default: "h-9 px-4 py-2",
-        sm: "h-8 rounded-md px-3 text-xs",
-        lg: "h-10 rounded-md px-8",
-        icon: "h-9 w-9"
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
       }
     },
     defaultVariants: {
@@ -284,11 +286,14 @@ var buttonVariants = cva(
   }
 );
 var Button = React.forwardRef(
-  ({ className, variant, size, asChild = false, isLoading = false, children, ...props }, ref) => {
+  ({ className, variant = "default", size = "default", asChild = false, isLoading = false, children, ...props }, ref) => {
     const Comp = asChild ? Slot : "button";
     return /* @__PURE__ */ jsxs(
       Comp,
       {
+        "data-slot": "button",
+        "data-variant": variant,
+        "data-size": size,
         className: cn(buttonVariants({ variant, size, className })),
         ref,
         ...props,
@@ -296,10 +301,10 @@ var Button = React.forwardRef(
           isLoading ? /* @__PURE__ */ jsx(
             Loader2,
             {
-              className: cn("h-4 w-4 animate-spin", size !== "icon" && "mr-2")
+              className: cn("h-4 w-4 animate-spin", size !== "icon" && size !== "icon-sm" && size !== "icon-lg" && "mr-2")
             }
           ) : null,
-          isLoading && size === "icon" ? null : children
+          isLoading && (size === "icon" || size === "icon-sm" || size === "icon-lg") ? null : children
         ]
       }
     );
@@ -307,16 +312,19 @@ var Button = React.forwardRef(
 );
 Button.displayName = "Button";
 var badgeVariants = cva(
-  "focus:ring-ring border-divider inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:ring-2 focus:ring-offset-2 focus:outline-hidden",
+  "inline-flex items-center justify-center w-fit whitespace-nowrap shrink-0 rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:outline-none aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive [&>svg]:pointer-events-none overflow-hidden",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/80 border-transparent shadow",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90 border-transparent shadow-sm",
         secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 border-transparent",
-        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/80 border-transparent shadow",
-        outline: "hover:bg-bg-secondary text-text-secondary hover:text-text-default border border-gray-500 bg-transparent shadow-xs",
-        inputAdornment: "bg-gray-600 px-2 font-medium text-white",
-        tags: "text-text-secondary border-divider bg-bg-quaternary rounded-lg px-2 py-1 font-normal capitalize"
+        destructive: "bg-destructive text-white hover:bg-destructive/90 border-transparent shadow-sm focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground border-transparent",
+        link: "text-primary underline-offset-4 hover:underline border-transparent",
+        // Hanzo-specific variants for backward compatibility
+        inputAdornment: "bg-gray-600 px-2 font-medium text-white border-transparent",
+        tags: "text-muted-foreground border-border bg-muted rounded-lg px-2 py-1 font-normal capitalize"
       }
     },
     defaultVariants: {
@@ -324,12 +332,24 @@ var badgeVariants = cva(
     }
   }
 );
-var Badge = React.forwardRef(
-  ({ className, variant, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("div", { ref, className: cn(badgeVariants({ variant }), className), ...props });
-  }
-);
-Badge.displayName = "Badge";
+function Badge({
+  className,
+  variant = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "span";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      "data-variant": variant,
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+__name(Badge, "Badge");
 var Input = /* @__PURE__ */ __name(({
   className,
   type,

package/dist/dock/limelight-nav.js

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var React4 = require('react');
+var React3 = require('react');
 var lucideReact = require('lucide-react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
@@ -27,7 +27,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React4__namespace = /*#__PURE__*/_interopNamespace(React4);
+var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
 
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
@@ -36,15 +36,15 @@ function cn(...inputs) {
 }
 __name(cn, "cn");
 var buttonVariants = classVarianceAuthority.cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*="size-"])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
-        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
-        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
-        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline",
         // Keep the additional Hanzo variants for backward compatibility
         primary: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
@@ -52,10 +52,12 @@ var buttonVariants = classVarianceAuthority.cva(
         linkMuted: "text-muted-foreground underline-offset-4 hover:underline hover:text-foreground"
       },
       size: {
-        default: "h-9 px-4 py-2",
-        sm: "h-8 rounded-md px-3 text-xs",
-        lg: "h-10 rounded-md px-8",
-        icon: "h-9 w-9"
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
       }
     },
     defaultVariants: {
@@ -64,12 +66,15 @@ var buttonVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Button = React4__namespace.forwardRef(
-  ({ className, variant, size, asChild = false, isLoading = false, children, ...props }, ref) => {
+var Button = React3__namespace.forwardRef(
+  ({ className, variant = "default", size = "default", asChild = false, isLoading = false, children, ...props }, ref) => {
     const Comp = asChild ? reactSlot.Slot : "button";
     return /* @__PURE__ */ jsxRuntime.jsxs(
       Comp,
       {
+        "data-slot": "button",
+        "data-variant": variant,
+        "data-size": size,
         className: cn(buttonVariants({ variant, size, className })),
         ref,
         ...props,
@@ -77,10 +82,10 @@ var Button = React4__namespace.forwardRef(
           isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
             lucideReact.Loader2,
             {
-              className: cn("h-4 w-4 animate-spin", size !== "icon" && "mr-2")
+              className: cn("h-4 w-4 animate-spin", size !== "icon" && size !== "icon-sm" && size !== "icon-lg" && "mr-2")
             }
           ) : null,
-          isLoading && size === "icon" ? null : children
+          isLoading && (size === "icon" || size === "icon-sm" || size === "icon-lg") ? null : children
         ]
       }
     );
@@ -88,16 +93,19 @@ var Button = React4__namespace.forwardRef(
 );
 Button.displayName = "Button";
 var badgeVariants = classVarianceAuthority.cva(
-  "focus:ring-ring border-divider inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:ring-2 focus:ring-offset-2 focus:outline-hidden",
+  "inline-flex items-center justify-center w-fit whitespace-nowrap shrink-0 rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:outline-none aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive [&>svg]:pointer-events-none overflow-hidden",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/80 border-transparent shadow",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90 border-transparent shadow-sm",
         secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 border-transparent",
-        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/80 border-transparent shadow",
-        outline: "hover:bg-bg-secondary text-text-secondary hover:text-text-default border border-gray-500 bg-transparent shadow-xs",
-        inputAdornment: "bg-gray-600 px-2 font-medium text-white",
-        tags: "text-text-secondary border-divider bg-bg-quaternary rounded-lg px-2 py-1 font-normal capitalize"
+        destructive: "bg-destructive text-white hover:bg-destructive/90 border-transparent shadow-sm focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground border-transparent",
+        link: "text-primary underline-offset-4 hover:underline border-transparent",
+        // Hanzo-specific variants for backward compatibility
+        inputAdornment: "bg-gray-600 px-2 font-medium text-white border-transparent",
+        tags: "text-muted-foreground border-border bg-muted rounded-lg px-2 py-1 font-normal capitalize"
       }
     },
     defaultVariants: {
@@ -105,12 +113,24 @@ var badgeVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Badge = React4__namespace.forwardRef(
-  ({ className, variant, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(badgeVariants({ variant }), className), ...props });
-  }
-);
-Badge.displayName = "Badge";
+function Badge({
+  className,
+  variant = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? reactSlot.Slot : "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      "data-variant": variant,
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+__name(Badge, "Badge");
 var Input = /* @__PURE__ */ __name(({
   className,
   type,
@@ -120,10 +140,10 @@ var Input = /* @__PURE__ */ __name(({
   ref,
   ...props
 }) => {
-  const inputRef = React4.useRef(null);
-  const startAdornmentRef = React4.useRef(null);
-  const endAdornmentRef = React4.useRef(null);
-  const [showPassword, setShowPassword] = React4__namespace.useState(false);
+  const inputRef = React3.useRef(null);
+  const startAdornmentRef = React3.useRef(null);
+  const endAdornmentRef = React3.useRef(null);
+  const [showPassword, setShowPassword] = React3__namespace.useState(false);
   const togglePasswordVisibility = /* @__PURE__ */ __name(() => {
     setShowPassword(!showPassword);
   }, "togglePasswordVisibility");
@@ -134,8 +154,8 @@ var Input = /* @__PURE__ */ __name(({
   if (endAdornment) {
     style.paddingRight = `${(endAdornmentRef?.current?.offsetWidth ?? 0) + 20}px`;
   }
-  React4.useImperativeHandle(ref, () => inputRef.current, []);
-  React4.useEffect(() => {
+  React3.useImperativeHandle(ref, () => inputRef.current, []);
+  React3.useEffect(() => {
     if (props.autoFocus) {
       setTimeout(() => {
         inputRef?.current?.focus();
@@ -180,7 +200,7 @@ var Input = /* @__PURE__ */ __name(({
         children: endAdornment
       }
     ) : null,
-    endAdornment && typeof endAdornment !== "string" && React4__namespace.isValidElement(endAdornment) ? React4__namespace.cloneElement(endAdornment, {
+    endAdornment && typeof endAdornment !== "string" && React3__namespace.isValidElement(endAdornment) ? React3__namespace.cloneElement(endAdornment, {
       ref: endAdornmentRef
     }) : null,
     type === "password" && !hidePasswordToggle && /* @__PURE__ */ jsxRuntime.jsx(
@@ -198,11 +218,11 @@ var Input = /* @__PURE__ */ __name(({
   ] });
 }, "Input");
 Input.displayName = "Input";
-var LimelightNav = React4__namespace.forwardRef(
+var LimelightNav = React3__namespace.forwardRef(
   ({ className, items = [], ...props }, ref) => {
-    const [isOpen, setIsOpen] = React4__namespace.useState(false);
-    const [search, setSearch] = React4__namespace.useState("");
-    React4__namespace.useEffect(() => {
+    const [isOpen, setIsOpen] = React3__namespace.useState(false);
+    const [search, setSearch] = React3__namespace.useState("");
+    React3__namespace.useEffect(() => {
       const down = /* @__PURE__ */ __name((e) => {
         if (e.key === "k" && (e.metaKey || e.ctrlKey)) {
           e.preventDefault();

package/dist/dock/limelight-nav.mjs

@@ -1,5 +1,5 @@
 "use client";
-import * as React4 from 'react';
+import * as React3 from 'react';
 import { useRef, useImperativeHandle, useEffect } from 'react';
 import { Loader2, Search, Command, EyeOffIcon, EyeIcon } from 'lucide-react';
 import { clsx } from 'clsx';
@@ -15,15 +15,15 @@ function cn(...inputs) {
 }
 __name(cn, "cn");
 var buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*="size-"])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
-        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
-        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
-        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline",
         // Keep the additional Hanzo variants for backward compatibility
         primary: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
@@ -31,10 +31,12 @@ var buttonVariants = cva(
         linkMuted: "text-muted-foreground underline-offset-4 hover:underline hover:text-foreground"
       },
       size: {
-        default: "h-9 px-4 py-2",
-        sm: "h-8 rounded-md px-3 text-xs",
-        lg: "h-10 rounded-md px-8",
-        icon: "h-9 w-9"
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
       }
     },
     defaultVariants: {
@@ -43,12 +45,15 @@ var buttonVariants = cva(
     }
   }
 );
-var Button = React4.forwardRef(
-  ({ className, variant, size, asChild = false, isLoading = false, children, ...props }, ref) => {
+var Button = React3.forwardRef(
+  ({ className, variant = "default", size = "default", asChild = false, isLoading = false, children, ...props }, ref) => {
     const Comp = asChild ? Slot : "button";
     return /* @__PURE__ */ jsxs(
       Comp,
       {
+        "data-slot": "button",
+        "data-variant": variant,
+        "data-size": size,
         className: cn(buttonVariants({ variant, size, className })),
         ref,
         ...props,
@@ -56,10 +61,10 @@ var Button = React4.forwardRef(
           isLoading ? /* @__PURE__ */ jsx(
             Loader2,
             {
-              className: cn("h-4 w-4 animate-spin", size !== "icon" && "mr-2")
+              className: cn("h-4 w-4 animate-spin", size !== "icon" && size !== "icon-sm" && size !== "icon-lg" && "mr-2")
             }
           ) : null,
-          isLoading && size === "icon" ? null : children
+          isLoading && (size === "icon" || size === "icon-sm" || size === "icon-lg") ? null : children
         ]
       }
     );
@@ -67,16 +72,19 @@ var Button = React4.forwardRef(
 );
 Button.displayName = "Button";
 var badgeVariants = cva(
-  "focus:ring-ring border-divider inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:ring-2 focus:ring-offset-2 focus:outline-hidden",
+  "inline-flex items-center justify-center w-fit whitespace-nowrap shrink-0 rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] focus-visible:outline-none aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive [&>svg]:pointer-events-none overflow-hidden",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/80 border-transparent shadow",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90 border-transparent shadow-sm",
         secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 border-transparent",
-        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/80 border-transparent shadow",
-        outline: "hover:bg-bg-secondary text-text-secondary hover:text-text-default border border-gray-500 bg-transparent shadow-xs",
-        inputAdornment: "bg-gray-600 px-2 font-medium text-white",
-        tags: "text-text-secondary border-divider bg-bg-quaternary rounded-lg px-2 py-1 font-normal capitalize"
+        destructive: "bg-destructive text-white hover:bg-destructive/90 border-transparent shadow-sm focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground border-transparent",
+        link: "text-primary underline-offset-4 hover:underline border-transparent",
+        // Hanzo-specific variants for backward compatibility
+        inputAdornment: "bg-gray-600 px-2 font-medium text-white border-transparent",
+        tags: "text-muted-foreground border-border bg-muted rounded-lg px-2 py-1 font-normal capitalize"
       }
     },
     defaultVariants: {
@@ -84,12 +92,24 @@ var badgeVariants = cva(
     }
   }
 );
-var Badge = React4.forwardRef(
-  ({ className, variant, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("div", { ref, className: cn(badgeVariants({ variant }), className), ...props });
-  }
-);
-Badge.displayName = "Badge";
+function Badge({
+  className,
+  variant = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "span";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      "data-variant": variant,
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+__name(Badge, "Badge");
 var Input = /* @__PURE__ */ __name(({
   className,
   type,
@@ -102,7 +122,7 @@ var Input = /* @__PURE__ */ __name(({
   const inputRef = useRef(null);
   const startAdornmentRef = useRef(null);
   const endAdornmentRef = useRef(null);
-  const [showPassword, setShowPassword] = React4.useState(false);
+  const [showPassword, setShowPassword] = React3.useState(false);
   const togglePasswordVisibility = /* @__PURE__ */ __name(() => {
     setShowPassword(!showPassword);
   }, "togglePasswordVisibility");
@@ -159,7 +179,7 @@ var Input = /* @__PURE__ */ __name(({
         children: endAdornment
       }
     ) : null,
-    endAdornment && typeof endAdornment !== "string" && React4.isValidElement(endAdornment) ? React4.cloneElement(endAdornment, {
+    endAdornment && typeof endAdornment !== "string" && React3.isValidElement(endAdornment) ? React3.cloneElement(endAdornment, {
       ref: endAdornmentRef
     }) : null,
     type === "password" && !hidePasswordToggle && /* @__PURE__ */ jsx(
@@ -177,11 +197,11 @@ var Input = /* @__PURE__ */ __name(({
   ] });
 }, "Input");
 Input.displayName = "Input";
-var LimelightNav = React4.forwardRef(
+var LimelightNav = React3.forwardRef(
   ({ className, items = [], ...props }, ref) => {
-    const [isOpen, setIsOpen] = React4.useState(false);
-    const [search, setSearch] = React4.useState("");
-    React4.useEffect(() => {
+    const [isOpen, setIsOpen] = React3.useState(false);
+    const [search, setSearch] = React3.useState("");
+    React3.useEffect(() => {
       const down = /* @__PURE__ */ __name((e) => {
         if (e.key === "k" && (e.metaKey || e.ctrlKey)) {
           e.preventDefault();