@contractspec/lib.ui-kit-web 3.7.5 → 3.8.0

package/dist/ui/sidebar.js

@@ -2,23 +2,23 @@
 var __require = import.meta.require;
 
 // ui/button.tsx
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
 import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
-import { cn } from "@contractspec/lib.ui-kit-core/utils";
 import { jsxDEV } from "react/jsx-dev-runtime";
-var buttonVariants = cva("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-hidden 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", {
+var buttonVariants = cva("inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md font-medium text-sm outline-hidden transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", {
   variants: {
     variant: {
       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-2xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+      destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
+      outline: "border bg-background shadow-2xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 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"
     },
     size: {
       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",
+      sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
       lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
       icon: "size-9"
     }
@@ -64,14 +64,26 @@ function Input({ className, type, ...props }) {
   return /* @__PURE__ */ jsxDEV2("input", {
     type,
     "data-slot": "input",
-    className: cn3("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "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", className),
+    className: cn3("h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs outline-none transition-[color,box-shadow] selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:font-medium file:text-foreground file:text-sm placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:bg-input/30", "focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50", "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/skeleton.tsx
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+function Skeleton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV3("div", {
+    "data-slot": "skeleton",
+    className: cn2("animate-pulse rounded-md bg-accent", className),
     ...props
   }, undefined, false, undefined, this);
 }
 // ui/separator.tsx
-import * as SeparatorPrimitive from "@radix-ui/react-separator";
 import { cn as cn4 } from "@contractspec/lib.ui-kit-core/utils";
-import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
 "use client";
 function Separator({
   className,
@@ -79,30 +91,18 @@ function Separator({
   decorative = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsxDEV3(SeparatorPrimitive.Root, {
+  return /* @__PURE__ */ jsxDEV4(SeparatorPrimitive.Root, {
     "data-slot": "separator",
     decorative,
     orientation,
-    className: cn4("bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px", className),
-    ...props
-  }, undefined, false, undefined, this);
-}
-// ui/skeleton.tsx
-import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
-function Skeleton({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxDEV4("div", {
-    "data-slot": "skeleton",
-    className: cn2("bg-accent animate-pulse rounded-md", className),
+    className: cn4("shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=vertical]:h-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px", className),
     ...props
   }, undefined, false, undefined, this);
 }
 // ui/sheet.tsx
+import { cn as cn5 } from "@contractspec/lib.ui-kit-core/utils";
 import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { XIcon } from "lucide-react";
-import { cn as cn5 } from "@contractspec/lib.ui-kit-core/utils";
 import { jsxDEV as jsxDEV5 } from "react/jsx-dev-runtime";
 "use client";
 function Sheet({ ...props }) {
@@ -141,7 +141,7 @@ function SheetOverlay({
 }) {
   return /* @__PURE__ */ jsxDEV5(SheetPrimitive.Overlay, {
     "data-slot": "sheet-overlay",
-    className: cn5("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50", className),
+    className: cn5("data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=open]:animate-in", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -156,12 +156,12 @@ function SheetContent({
       /* @__PURE__ */ jsxDEV5(SheetOverlay, {}, undefined, false, undefined, this),
       /* @__PURE__ */ jsxDEV5(SheetPrimitive.Content, {
         "data-slot": "sheet-content",
-        className: cn5("bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500", side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm", side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm", side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b", side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t", className),
+        className: cn5("fixed z-50 flex flex-col gap-4 bg-background shadow-lg transition ease-in-out data-[state=closed]:animate-out data-[state=open]:animate-in data-[state=closed]:duration-300 data-[state=open]:duration-500", side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm", side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm", side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b", side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t", className),
         ...props,
         children: [
           children,
           /* @__PURE__ */ jsxDEV5(SheetPrimitive.Close, {
-            className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none",
+            className: "absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary",
             children: [
               /* @__PURE__ */ jsxDEV5(XIcon, {
                 className: "size-4"
@@ -203,7 +203,7 @@ function SheetTitle({
 }) {
   return /* @__PURE__ */ jsxDEV5(SheetPrimitive.Title, {
     "data-slot": "sheet-title",
-    className: cn5("text-foreground font-semibold", className),
+    className: cn5("font-semibold text-foreground", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -217,26 +217,9 @@ function SheetDescription({
     ...props
   }, undefined, false, undefined, this);
 }
-// ui/use-mobile.tsx
-import * as React from "react";
-var MOBILE_BREAKPOINT = 640;
-function useIsMobile() {
-  const [isMobile, setIsMobile] = React.useState(undefined);
-  React.useEffect(() => {
-    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
-    const onChange = () => {
-      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    };
-    mql.addEventListener("change", onChange);
-    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    return () => mql.removeEventListener("change", onChange);
-  }, []);
-  return !!isMobile;
-}
-
 // ui/tooltip.tsx
-import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import { cn as cn6 } from "@contractspec/lib.ui-kit-core/utils";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import { jsxDEV as jsxDEV6 } from "react/jsx-dev-runtime";
 "use client";
 function TooltipProvider({
@@ -277,23 +260,40 @@ function TooltipContent({
     children: /* @__PURE__ */ jsxDEV6(TooltipPrimitive.Content, {
       "data-slot": "tooltip-content",
       sideOffset,
-      className: cn6("bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance", className),
+      className: cn6("fade-in-0 zoom-in-95 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in text-balance rounded-md bg-foreground px-3 py-1.5 text-background text-xs data-[state=closed]:animate-out", className),
       ...props,
       children: [
         children,
         /* @__PURE__ */ jsxDEV6(TooltipPrimitive.Arrow, {
-          className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px]"
+          className: "z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground"
         }, undefined, false, undefined, this)
       ]
     }, undefined, true, undefined, this)
   }, undefined, false, undefined, this);
 }
+// ui/use-mobile.tsx
+import * as React from "react";
+var MOBILE_BREAKPOINT = 640;
+function useIsMobile() {
+  const [isMobile, setIsMobile] = React.useState(undefined);
+  React.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+  return !!isMobile;
+}
+
 // ui/sidebar.tsx
-import * as React2 from "react";
+import { cn as cn7 } from "@contractspec/lib.ui-kit-core/utils";
 import { Slot as Slot2 } from "@radix-ui/react-slot";
 import { cva as cva2 } from "class-variance-authority";
 import { PanelLeftIcon } from "lucide-react";
-import { cn as cn7 } from "@contractspec/lib.ui-kit-core/utils";
+import * as React2 from "react";
 import { jsxDEV as jsxDEV7 } from "react/jsx-dev-runtime";
 "use client";
 var SIDEBAR_COOKIE_NAME = "sidebar_state";
@@ -366,7 +366,7 @@ function SidebarProvider({
           "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
           ...style
         },
-        className: cn7("group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full", className),
+        className: cn7("group/sidebar-wrapper flex min-h-svh w-full has-data-[variant=inset]:bg-sidebar", className),
         ...props,
         children
       }, undefined, false, undefined, this)
@@ -385,7 +385,7 @@ function Sidebar({
   if (collapsible === "none") {
     return /* @__PURE__ */ jsxDEV7("div", {
       "data-slot": "sidebar",
-      className: cn7("bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col", className),
+      className: cn7("flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground", className),
       ...props,
       children
     }, undefined, false, undefined, this);
@@ -399,7 +399,7 @@ function Sidebar({
         "data-sidebar": "sidebar",
         "data-slot": "sidebar",
         "data-mobile": "true",
-        className: "bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden",
+        className: "w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
         style: {
           "--sidebar-width": SIDEBAR_WIDTH_MOBILE
         },
@@ -425,7 +425,7 @@ function Sidebar({
     }, undefined, false, undefined, this);
   }
   return /* @__PURE__ */ jsxDEV7("div", {
-    className: "group peer text-sidebar-foreground hidden md:block",
+    className: "group peer hidden text-sidebar-foreground md:block",
     "data-state": state,
     "data-collapsible": state === "collapsed" ? collapsible : "",
     "data-variant": variant,
@@ -443,7 +443,7 @@ function Sidebar({
         children: /* @__PURE__ */ jsxDEV7("div", {
           "data-sidebar": "sidebar",
           "data-slot": "sidebar-inner",
-          className: "bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm",
+          className: "flex h-full w-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow-sm",
           children
         }, undefined, false, undefined, this)
       }, undefined, false, undefined, this)
@@ -488,7 +488,7 @@ function SidebarRail({
     tabIndex: -1,
     onClick: toggleSidebar,
     title: "Toggle Sidebar",
-    className: cn7("hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex", "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize", "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize", "hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full", "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2", "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2", className),
+    className: cn7("absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex", "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize", "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize", "group-data-[collapsible=offcanvas]:translate-x-0 hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:after:left-full", "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2", "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -498,7 +498,7 @@ function SidebarInset({
 }) {
   return /* @__PURE__ */ jsxDEV7("main", {
     "data-slot": "sidebar-inset",
-    className: cn7("bg-background relative flex w-full flex-1 flex-col", "md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2", className),
+    className: cn7("relative flex w-full flex-1 flex-col bg-background", "md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2 md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -509,7 +509,7 @@ function SidebarInput({
   return /* @__PURE__ */ jsxDEV7(Input, {
     "data-slot": "sidebar-input",
     "data-sidebar": "input",
-    className: cn7("bg-background h-8 w-full shadow-none", className),
+    className: cn7("h-8 w-full bg-background shadow-none", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -542,7 +542,7 @@ function SidebarSeparator({
   return /* @__PURE__ */ jsxDEV7(Separator, {
     "data-slot": "sidebar-separator",
     "data-sidebar": "separator",
-    className: cn7("bg-sidebar-border mx-2 w-auto", className),
+    className: cn7("mx-2 w-auto bg-sidebar-border", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -577,7 +577,7 @@ function SidebarGroupLabel({
   return /* @__PURE__ */ jsxDEV7(Comp, {
     "data-slot": "sidebar-group-label",
     "data-sidebar": "group-label",
-    className: cn7("text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0", className),
+    className: cn7("flex h-8 shrink-0 items-center rounded-md px-2 font-medium text-sidebar-foreground/70 text-xs outline-hidden ring-sidebar-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -590,7 +590,7 @@ function SidebarGroupAction({
   return /* @__PURE__ */ jsxDEV7(Comp, {
     "data-slot": "sidebar-group-action",
     "data-sidebar": "group-action",
-    className: cn7("text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", "after:absolute after:-inset-2 md:after:hidden", "group-data-[collapsible=icon]:hidden", className),
+    className: cn7("absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", "after:absolute after:-inset-2 md:after:hidden", "group-data-[collapsible=icon]:hidden", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -696,7 +696,7 @@ function SidebarMenuAction({
   return /* @__PURE__ */ jsxDEV7(Comp, {
     "data-slot": "sidebar-menu-action",
     "data-sidebar": "menu-action",
-    className: cn7("text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", "after:absolute after:-inset-2 md:after:hidden", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1.5", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", showOnHover && "peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0", className),
+    className: cn7("absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0", "after:absolute after:-inset-2 md:after:hidden", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1.5", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", showOnHover && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground md:opacity-0", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -707,7 +707,7 @@ function SidebarMenuBadge({
   return /* @__PURE__ */ jsxDEV7("div", {
     "data-slot": "sidebar-menu-badge",
     "data-sidebar": "menu-badge",
-    className: cn7("text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none", "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1.5", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", className),
+    className: cn7("pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-md px-1 font-medium text-sidebar-foreground text-xs tabular-nums", "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1.5", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -746,7 +746,7 @@ function SidebarMenuSub({
   return /* @__PURE__ */ jsxDEV7("ul", {
     "data-slot": "sidebar-menu-sub",
     "data-sidebar": "menu-sub",
-    className: cn7("border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l px-2.5 py-0.5", "group-data-[collapsible=icon]:hidden", className),
+    className: cn7("mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-sidebar-border border-l px-2.5 py-0.5", "group-data-[collapsible=icon]:hidden", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -774,7 +774,7 @@ function SidebarMenuSubButton({
     "data-sidebar": "menu-sub-button",
     "data-size": size,
     "data-active": isActive,
-    className: cn7("text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0", "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground", size === "sm" && "text-xs", size === "md" && "text-sm", "group-data-[collapsible=icon]:hidden", className),
+    className: cn7("flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-hidden ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground", "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground", size === "sm" && "text-xs", size === "md" && "text-sm", "group-data-[collapsible=icon]:hidden", className),
     ...props
   }, undefined, false, undefined, this);
 }

package/dist/ui/skeleton.js

@@ -16,7 +16,7 @@ function Skeleton({
 }) {
   return /* @__PURE__ */ jsxDEV("div", {
     "data-slot": "skeleton",
-    className: cn("bg-accent animate-pulse rounded-md", className),
+    className: cn("animate-pulse rounded-md bg-accent", className),
     ...props
   }, undefined, false, undefined, this);
 }

package/dist/ui/slider.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
 import * as SliderPrimitive from '@radix-ui/react-slider';
+import * as React from 'react';
 declare function Slider({ className, defaultValue, value, min, max, ...props }: React.ComponentProps<typeof SliderPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
 export { Slider };

package/dist/ui/slider.js

@@ -2,9 +2,9 @@
 var __require = import.meta.require;
 
 // ui/slider.tsx
-import * as React from "react";
-import * as SliderPrimitive from "@radix-ui/react-slider";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import * as SliderPrimitive from "@radix-ui/react-slider";
+import * as React from "react";
 import { jsxDEV } from "react/jsx-dev-runtime";
 "use client";
 function Slider({
@@ -22,20 +22,20 @@ function Slider({
     value,
     min,
     max,
-    className: cn("relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col", className),
+    className: cn("relative flex w-full touch-none select-none items-center data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col data-disabled:opacity-50", className),
     ...props,
     children: [
       /* @__PURE__ */ jsxDEV(SliderPrimitive.Track, {
         "data-slot": "slider-track",
-        className: cn("bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"),
+        className: cn("relative grow overflow-hidden rounded-full bg-muted data-[orientation=horizontal]:h-1.5 data-[orientation=vertical]:h-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-1.5"),
         children: /* @__PURE__ */ jsxDEV(SliderPrimitive.Range, {
           "data-slot": "slider-range",
-          className: cn("bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full")
+          className: cn("absolute bg-primary data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full")
         }, undefined, false, undefined, this)
       }, undefined, false, undefined, this),
       Array.from({ length: _values.length }, (_, index) => /* @__PURE__ */ jsxDEV(SliderPrimitive.Thumb, {
         "data-slot": "slider-thumb",
-        className: "border-primary bg-background ring-ring/50 block size-4 shrink-0 rounded-full border shadow-2xs transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
+        className: "block size-4 shrink-0 rounded-full border border-primary bg-background shadow-2xs ring-ring/50 transition-[color,box-shadow] hover:ring-4 focus-visible:outline-hidden focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50"
       }, index, false, undefined, this))
     ]
   }, undefined, true, undefined, this);

package/dist/ui/stack.d.ts

@@ -1,5 +1,5 @@
-import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 declare const vStackVariants: (props?: ({
     gap?: "none" | "sm" | "lg" | "xs" | "md" | "xl" | "2xl" | null | undefined;
     align?: "center" | "end" | "start" | "stretch" | null | undefined;
@@ -12,7 +12,7 @@ type VStackProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof vS
 declare function VStack({ className, gap, align, justify, as, ref, ...props }: VStackProps): import("react/jsx-runtime").JSX.Element;
 declare const hStackVariants: (props?: ({
     gap?: "none" | "sm" | "lg" | "xs" | "md" | "xl" | "2xl" | null | undefined;
-    align?: "center" | "end" | "start" | "stretch" | "baseline" | null | undefined;
+    align?: "center" | "end" | "start" | "baseline" | "stretch" | null | undefined;
     justify?: "center" | "end" | "start" | "between" | "around" | "evenly" | null | undefined;
     wrap?: "wrap" | "nowrap" | "wrapReverse" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
@@ -23,7 +23,7 @@ type HStackProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof hS
 declare function HStack({ className, gap, align, justify, wrap, as, ref, ...props }: HStackProps): import("react/jsx-runtime").JSX.Element;
 declare const boxVariants: (props?: ({
     gap?: "none" | "sm" | "lg" | "xs" | "md" | "xl" | "2xl" | null | undefined;
-    align?: "center" | "end" | "start" | "stretch" | "baseline" | null | undefined;
+    align?: "center" | "end" | "start" | "baseline" | "stretch" | null | undefined;
     justify?: "center" | "end" | "start" | "between" | "around" | "evenly" | null | undefined;
     wrap?: "wrap" | "nowrap" | "wrapReverse" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
@@ -32,4 +32,4 @@ type BoxProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof boxVa
     ref?: React.Ref<HTMLDivElement>;
 };
 declare function Box({ className, gap, align, justify, wrap, as, ref, ...props }: BoxProps): import("react/jsx-runtime").JSX.Element;
-export { VStack, HStack, vStackVariants, hStackVariants, boxVariants, Box };
+export { Box, boxVariants, HStack, hStackVariants, VStack, vStackVariants };

package/dist/ui/stack.js

@@ -2,8 +2,8 @@
 var __require = import.meta.require;
 
 // ui/stack.tsx
-import { cva } from "class-variance-authority";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { cva } from "class-variance-authority";
 import { jsxDEV } from "react/jsx-dev-runtime";
 var vStackVariants = cva("flex flex-col", {
   variants: {

package/dist/ui/stat-card-group.js

@@ -7,7 +7,7 @@ import { jsxDEV } from "react/jsx-dev-runtime";
 function Card({ className, ...props }) {
   return /* @__PURE__ */ jsxDEV("div", {
     "data-slot": "card",
-    className: cn("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-2xs", className),
+    className: cn("flex flex-col gap-6 rounded-xl border bg-card py-6 text-card-foreground shadow-2xs", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -27,7 +27,7 @@ function CardTitle({
 }) {
   return /* @__PURE__ */ jsxDEV("div", {
     "data-slot": "card-title",
-    className: cn("leading-none font-semibold", className),
+    className: cn("font-semibold leading-none", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -72,8 +72,8 @@ function CardFooter({
   }, undefined, false, undefined, this);
 }
 // ui/stack.tsx
-import { cva } from "class-variance-authority";
 import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { cva } from "class-variance-authority";
 import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
 var vStackVariants = cva("flex flex-col", {
   variants: {
@@ -253,7 +253,7 @@ function StatCardGroup({
   className
 }) {
   return /* @__PURE__ */ jsxDEV3(HStack, {
-    className: className + " w-full flex-wrap gap-3",
+    className: className + "w-full flex-wrap gap-3",
     children: items.map((it, idx) => /* @__PURE__ */ jsxDEV3(Card, {
       className: "border-none shadow-2xs",
       children: /* @__PURE__ */ jsxDEV3(CardContent, {
@@ -266,7 +266,7 @@ function StatCardGroup({
               children: it.label
             }, undefined, false, undefined, this),
             /* @__PURE__ */ jsxDEV3("div", {
-              className: "text-xl font-semibold",
+              className: "font-semibold text-xl",
               children: it.value
             }, undefined, false, undefined, this)
           ]

package/dist/ui/stepper.js

@@ -2,8 +2,8 @@
 var __require = import.meta.require;
 
 // ui/stack.tsx
-import { cva } from "class-variance-authority";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { cva } from "class-variance-authority";
 import { jsxDEV } from "react/jsx-dev-runtime";
 var vStackVariants = cva("flex flex-col", {
   variants: {
@@ -166,8 +166,8 @@ function Box({
   }, undefined, false, undefined, this);
 }
 // ui/stepper.tsx
-import { cva as cva2 } from "class-variance-authority";
 import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { cva as cva2 } from "class-variance-authority";
 import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
 var dotVariants = cva2("h-2 w-2 rounded-full", {
   variants: {

package/dist/ui/switch.d.ts

@@ -1,5 +1,5 @@
-import * as React from 'react';
 import * as SwitchPrimitive from '@radix-ui/react-switch';
+import * as React from 'react';
 declare function Switch({ className, thumbClassName, ...props }: React.ComponentProps<typeof SwitchPrimitive.Root> & {
     thumbClassName?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/ui/switch.js

@@ -2,8 +2,8 @@
 var __require = import.meta.require;
 
 // ui/switch.tsx
-import * as SwitchPrimitive from "@radix-ui/react-switch";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import * as SwitchPrimitive from "@radix-ui/react-switch";
 import { jsxDEV } from "react/jsx-dev-runtime";
 "use client";
 function Switch({
@@ -13,11 +13,11 @@ function Switch({
 }) {
   return /* @__PURE__ */ jsxDEV(SwitchPrimitive.Root, {
     "data-slot": "switch",
-    className: cn("peer focus-visible:border-ring focus-visible:ring-ring/50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-2xs outline-hidden transition-all focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50", className),
+    className: cn("peer inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-2xs outline-hidden transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input dark:data-[state=unchecked]:bg-input/80", className),
     ...props,
     children: /* @__PURE__ */ jsxDEV(SwitchPrimitive.Thumb, {
       "data-slot": "switch-thumb",
-      className: cn("bg-background dark:data-[state=checked]:bg-primary-foreground dark:data-[state=unchecked]:bg-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0", thumbClassName)
+      className: cn("pointer-events-none block size-4 rounded-full bg-background ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0 dark:data-[state=checked]:bg-primary-foreground dark:data-[state=unchecked]:bg-foreground", thumbClassName)
     }, undefined, false, undefined, this)
   }, undefined, false, undefined, this);
 }

package/dist/ui/table.d.ts

@@ -7,4 +7,4 @@ declare function TableRow({ className, ...props }: React.ComponentPropsWithoutRe
 declare function TableHead({ className, ...props }: React.ComponentPropsWithoutRef<'th'>): import("react/jsx-runtime").JSX.Element;
 declare function TableCell({ className, ...props }: React.ComponentPropsWithoutRef<'td'>): import("react/jsx-runtime").JSX.Element;
 declare function TableCaption({ className, ...props }: React.ComponentPropsWithoutRef<'caption'>): import("react/jsx-runtime").JSX.Element;
-export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, };
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, };

package/dist/ui/table.js

@@ -45,7 +45,7 @@ function TableFooter({
 }) {
   return /* @__PURE__ */ jsxDEV("tfoot", {
     "data-slot": "table-footer",
-    className: cn("bg-muted/50 border-t font-medium [&>tr]:last:border-b-0", className),
+    className: cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -55,7 +55,7 @@ function TableRow({
 }) {
   return /* @__PURE__ */ jsxDEV("tr", {
     "data-slot": "table-row",
-    className: cn("hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors", className),
+    className: cn("border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -65,7 +65,7 @@ function TableHead({
 }) {
   return /* @__PURE__ */ jsxDEV("th", {
     "data-slot": "table-head",
-    className: cn("text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
+    className: cn("h-10 whitespace-nowrap px-2 text-left align-middle font-medium text-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -75,7 +75,7 @@ function TableCell({
 }) {
   return /* @__PURE__ */ jsxDEV("td", {
     "data-slot": "table-cell",
-    className: cn("p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
+    className: cn("whitespace-nowrap p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -85,7 +85,7 @@ function TableCaption({
 }) {
   return /* @__PURE__ */ jsxDEV("caption", {
     "data-slot": "table-caption",
-    className: cn("text-muted-foreground mt-4 text-sm", className),
+    className: cn("mt-4 text-muted-foreground text-sm", className),
     ...props
   }, undefined, false, undefined, this);
 }

package/dist/ui/tabs.d.ts

@@ -1,7 +1,7 @@
-import * as React from 'react';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
+import * as React from 'react';
 declare function Tabs({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
 declare function TabsList({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.List>): import("react/jsx-runtime").JSX.Element;
 declare function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
 declare function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
-export { Tabs, TabsList, TabsTrigger, TabsContent };
+export { Tabs, TabsContent, TabsList, TabsTrigger };