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

package/dist/browser/ui/field.js

@@ -7,8 +7,8 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 });
 
 // ui/label.tsx
-import * as LabelPrimitive from "@radix-ui/react-label";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import * as LabelPrimitive from "@radix-ui/react-label";
 import { jsxDEV } from "react/jsx-dev-runtime";
 "use client";
 function Label({
@@ -17,13 +17,13 @@ function Label({
 }) {
   return /* @__PURE__ */ jsxDEV(LabelPrimitive.Root, {
     "data-slot": "label",
-    className: cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className),
+    className: cn("flex select-none items-center gap-2 font-medium text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-50 group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50", className),
     ...props
   }, undefined, false, undefined, this);
 }
 // ui/separator.tsx
-import * as SeparatorPrimitive from "@radix-ui/react-separator";
 import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
 import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
 "use client";
 function Separator({
@@ -36,14 +36,14 @@ function Separator({
     "data-slot": "separator",
     decorative,
     orientation,
-    className: cn2("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),
+    className: cn2("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/field.tsx
-import * as React from "react";
-import { cva } from "class-variance-authority";
 import { cn as cn3 } from "@contractspec/lib.ui-kit-core/utils";
+import { cva } from "class-variance-authority";
+import * as React from "react";
 import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
 "use client";
 function FieldSet({
@@ -88,7 +88,7 @@ var fieldVariants = cva("group/field flex w-full gap-3 data-[invalid=true]:text-
         "has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"
       ],
       responsive: [
-        "flex-col *:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto",
+        "@md/field-group:flex-row flex-col @md/field-group:items-center *:w-full @md/field-group:*:w-auto [&>.sr-only]:w-auto",
         "@md/field-group:data-[slot=field-label]:*:flex-auto",
         "@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"
       ]
@@ -127,7 +127,7 @@ function FieldLabel({
 }) {
   return /* @__PURE__ */ jsxDEV3(Label, {
     "data-slot": "field-label",
-    className: cn3("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border *:data-[slot=field]:p-4", "has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10", className),
+    className: cn3("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border *:data-[slot=field]:p-4", "has-data-[state=checked]:border-primary has-data-[state=checked]:bg-primary/5 dark:has-data-[state=checked]:bg-primary/10", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -137,7 +137,7 @@ function FieldTitle({
 }) {
   return /* @__PURE__ */ jsxDEV3("div", {
     "data-slot": "field-label",
-    className: cn3("flex w-fit items-center gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50", className),
+    className: cn3("flex w-fit items-center gap-2 font-medium text-sm leading-snug group-data-[disabled=true]/field:opacity-50", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -147,7 +147,7 @@ function FieldDescription({
 }) {
   return /* @__PURE__ */ jsxDEV3("p", {
     "data-slot": "field-description",
-    className: cn3("text-muted-foreground text-sm leading-normal font-normal group-has-data-[orientation=horizontal]/field:text-balance", "last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5", "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4", className),
+    className: cn3("font-normal text-muted-foreground text-sm leading-normal group-has-data-[orientation=horizontal]/field:text-balance", "nth-last-2:-mt-1 last:mt-0 [[data-variant=legend]+&]:-mt-1.5", "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -166,7 +166,7 @@ function FieldSeparator({
         className: "absolute inset-0 top-1/2"
       }, undefined, false, undefined, this),
       children && /* @__PURE__ */ jsxDEV3("span", {
-        className: "bg-background text-muted-foreground relative mx-auto block w-fit px-2",
+        className: "relative mx-auto block w-fit bg-background px-2 text-muted-foreground",
         "data-slot": "field-separator-content",
         children
       }, undefined, false, undefined, this)
@@ -202,7 +202,7 @@ function FieldError({
   return /* @__PURE__ */ jsxDEV3("div", {
     role: "alert",
     "data-slot": "field-error",
-    className: cn3("text-destructive text-sm font-normal", className),
+    className: cn3("font-normal text-destructive text-sm", className),
     ...props,
     children: content
   }, undefined, false, undefined, this);

package/dist/browser/ui/form.js

@@ -7,8 +7,8 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 });
 
 // ui/label.tsx
-import * as LabelPrimitive from "@radix-ui/react-label";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import * as LabelPrimitive from "@radix-ui/react-label";
 import { jsxDEV } from "react/jsx-dev-runtime";
 "use client";
 function Label({
@@ -17,7 +17,7 @@ function Label({
 }) {
   return /* @__PURE__ */ jsxDEV(LabelPrimitive.Root, {
     "data-slot": "label",
-    className: cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className),
+    className: cn("flex select-none items-center gap-2 font-medium text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-50 group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50", className),
     ...props
   }, undefined, false, undefined, this);
 }
@@ -29,8 +29,8 @@ function cn2(...inputs) {
 }
 
 // ui/form.tsx
-import * as React from "react";
 import { Slot } from "@radix-ui/react-slot";
+import * as React from "react";
 import {
   Controller,
   FormProvider,
@@ -38,7 +38,7 @@ import {
   useFormState
 } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { useForm, useFieldArray } from "react-hook-form";
+import { useFieldArray, useForm } from "react-hook-form";
 import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
 "use client";
 var Form = FormProvider;

package/dist/browser/ui/hover-card.js

@@ -7,8 +7,8 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 });
 
 // ui/hover-card.tsx
-import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
 import { jsxDEV } from "react/jsx-dev-runtime";
 "use client";
 function HoverCard({
@@ -39,7 +39,7 @@ function HoverCardContent({
       "data-slot": "hover-card-content",
       align,
       sideOffset,
-      className: cn("bg-popover text-popover-foreground 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 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden", className),
+      className: cn("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 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[state=closed]:animate-out data-[state=open]:animate-in", className),
       ...props
     }, undefined, false, undefined, this)
   }, undefined, false, undefined, this);

package/dist/browser/ui/input-group.js

@@ -7,23 +7,23 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? 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"
     }
@@ -62,7 +62,7 @@ function Input({ className, type, ...props }) {
   return /* @__PURE__ */ jsxDEV2("input", {
     type,
     "data-slot": "input",
-    className: cn2("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: cn2("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);
 }
@@ -72,13 +72,13 @@ import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
 function Textarea({ className, ...props }) {
   return /* @__PURE__ */ jsxDEV3("textarea", {
     "data-slot": "textarea",
-    className: cn3("aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-2xs outline-hidden transition-[color,box-shadow] focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", className),
+    className: cn3("field-sizing-content flex min-h-16 w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-2xs outline-hidden transition-[color,box-shadow] placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:aria-invalid:ring-destructive/40", className),
     ...props
   }, undefined, false, undefined, this);
 }
 // ui/input-group.tsx
-import { cva as cva2 } from "class-variance-authority";
 import { cn as cn4 } from "@contractspec/lib.ui-kit-core/utils";
+import { cva as cva2 } from "class-variance-authority";
 import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
 "use client";
 function InputGroup({
@@ -88,17 +88,17 @@ function InputGroup({
   return /* @__PURE__ */ jsxDEV4("div", {
     "data-slot": "input-group",
     role: "group",
-    className: cn4("group/input-group border-input dark:bg-input/30 relative flex w-full items-center rounded-md border shadow-xs transition-[color,box-shadow] outline-none", "h-9 min-w-0 has-[>textarea]:h-auto", "has-[>[data-align=inline-start]]:[&>input]:pl-2", "has-[>[data-align=inline-end]]:[&>input]:pr-2", "has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3", "has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3", "has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot=input-group-control]:focus-visible]:ring-[3px]", "has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40", className),
+    className: cn4("group/input-group relative flex w-full items-center rounded-md border border-input shadow-xs outline-none transition-[color,box-shadow] dark:bg-input/30", "h-9 min-w-0 has-[>textarea]:h-auto", "has-[>[data-align=inline-start]]:[&>input]:pl-2", "has-[>[data-align=inline-end]]:[&>input]:pr-2", "has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3", "has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3", "has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-[3px] has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50", "has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-destructive/20 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40", className),
     ...props
   }, undefined, false, undefined, this);
 }
-var inputGroupAddonVariants = cva2("text-muted-foreground flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium select-none [&>svg:not([class*='size-'])]:size-4 [&>kbd]:rounded-[calc(var(--radius)-5px)] group-data-[disabled=true]/input-group:opacity-50", {
+var inputGroupAddonVariants = cva2("flex h-auto cursor-text select-none items-center justify-center gap-2 py-1.5 font-medium text-muted-foreground text-sm group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
   variants: {
     align: {
       "inline-start": "order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]",
       "inline-end": "order-last pr-3 has-[>button]:mr-[-0.45rem] has-[>kbd]:mr-[-0.35rem]",
-      "block-start": "order-first w-full justify-start px-3 pt-3 [.border-b]:pb-3 group-has-[>input]/input-group:pt-2.5",
-      "block-end": "order-last w-full justify-start px-3 pb-3 [.border-t]:pt-3 group-has-[>input]/input-group:pb-2.5"
+      "block-start": "order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5 [.border-b]:pb-3",
+      "block-end": "order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5 [.border-t]:pt-3"
     }
   },
   defaultVariants: {
@@ -130,11 +130,11 @@ function InputGroupAddon({
     ...props
   }, undefined, false, undefined, this);
 }
-var inputGroupButtonVariants = cva2("text-sm shadow-none flex gap-2 items-center", {
+var inputGroupButtonVariants = cva2("flex items-center gap-2 text-sm shadow-none", {
   variants: {
     size: {
-      xs: "h-6 gap-1 px-2 rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2",
-      sm: "h-8 px-2.5 gap-1.5 rounded-md has-[>svg]:px-2.5",
+      xs: "h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg:not([class*='size-'])]:size-3.5",
+      sm: "h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5",
       "icon-xs": "size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0",
       "icon-sm": "size-8 p-0 has-[>svg]:p-0"
     }
@@ -163,7 +163,7 @@ function InputGroupText({
   ...props
 }) {
   return /* @__PURE__ */ jsxDEV4("span", {
-    className: cn4("text-muted-foreground flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
+    className: cn4("flex items-center gap-2 text-muted-foreground text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none", className),
     ...props
   }, undefined, false, undefined, this);
 }

package/dist/browser/ui/input-otp.js

@@ -7,10 +7,10 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 });
 
 // ui/input-otp.tsx
-import * as React from "react";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
 import { OTPInput, OTPInputContext } from "input-otp";
 import { Dot } from "lucide-react";
-import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import * as React from "react";
 import { jsxDEV } from "react/jsx-dev-runtime";
 "use client";
 function InputOTP({
@@ -47,14 +47,14 @@ function InputOTPSlot({
   const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index] || {};
   return /* @__PURE__ */ jsxDEV("div", {
     ref,
-    className: cn("border-input relative flex h-10 w-10 items-center justify-center border-y border-r text-base transition-all first:rounded-l-md first:border-l last:rounded-r-md", isActive && "ring-ring ring-offset-background z-10 ring-2", className),
+    className: cn("relative flex h-10 w-10 items-center justify-center border-input border-y border-r text-base transition-all first:rounded-l-md first:border-l last:rounded-r-md", isActive && "z-10 ring-2 ring-ring ring-offset-background", className),
     ...props,
     children: [
       char,
       hasFakeCaret && /* @__PURE__ */ jsxDEV("div", {
         className: "pointer-events-none absolute inset-0 flex items-center justify-center",
         children: /* @__PURE__ */ jsxDEV("div", {
-          className: "animate-caret-blink bg-foreground h-4 w-px duration-1000"
+          className: "h-4 w-px animate-caret-blink bg-foreground duration-1000"
         }, undefined, false, undefined, this)
       }, undefined, false, undefined, this)
     ]

package/dist/browser/ui/input.js

@@ -13,7 +13,7 @@ function Input({ className, type, ...props }) {
   return /* @__PURE__ */ jsxDEV("input", {
     type,
     "data-slot": "input",
-    className: cn("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: cn("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);
 }

package/dist/browser/ui/label.js

@@ -7,8 +7,8 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 });
 
 // ui/label.tsx
-import * as LabelPrimitive from "@radix-ui/react-label";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import * as LabelPrimitive from "@radix-ui/react-label";
 import { jsxDEV } from "react/jsx-dev-runtime";
 "use client";
 function Label({
@@ -17,7 +17,7 @@ function Label({
 }) {
   return /* @__PURE__ */ jsxDEV(LabelPrimitive.Root, {
     "data-slot": "label",
-    className: cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className),
+    className: cn("flex select-none items-center gap-2 font-medium text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-50 group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50", className),
     ...props
   }, undefined, false, undefined, this);
 }

package/dist/browser/ui/loading-button.js

@@ -7,23 +7,23 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? 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"
     }
@@ -56,8 +56,8 @@ function Button({
   }, undefined, false, undefined, this);
 }
 // ui/stack.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 vStackVariants = cva2("flex flex-col", {
   variants: {
@@ -220,13 +220,13 @@ function Box({
   }, undefined, false, undefined, this);
 }
 // ui/text.tsx
-import { Slot as Slot2 } from "@radix-ui/react-slot";
 import { cn as cn3 } from "@contractspec/lib.ui-kit-core/utils";
+import { Slot as Slot2 } from "@radix-ui/react-slot";
 import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
 function Text({ className, asChild = false, ...props }) {
   const Component = asChild ? Slot2 : "p";
   return /* @__PURE__ */ jsxDEV3(Component, {
-    className: cn3("text-foreground web:select-text text-base", className),
+    className: cn3("web:select-text text-base text-foreground", className),
     ...props
   }, undefined, false, undefined, this);
 }

package/dist/browser/ui/marketing/FeatureGrid.js

@@ -29,15 +29,15 @@ function FeatureGrid({
         className: "rounded-lg border p-6",
         children: [
           it.icon && /* @__PURE__ */ jsxDEV("div", {
-            className: "text-primary mb-3",
+            className: "mb-3 text-primary",
             children: it.icon
           }, undefined, false, undefined, this),
           /* @__PURE__ */ jsxDEV("h3", {
-            className: "text-lg font-semibold",
+            className: "font-semibold text-lg",
             children: it.title
           }, undefined, false, undefined, this),
           it.description && /* @__PURE__ */ jsxDEV("p", {
-            className: "text-muted-foreground mt-2 text-base",
+            className: "mt-2 text-base text-muted-foreground",
             children: it.description
           }, undefined, false, undefined, this)
         ]

package/dist/browser/ui/marketing/Hero.js

@@ -7,23 +7,23 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? 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"
     }
@@ -75,11 +75,11 @@ function Hero({
     className: cn2("mx-auto max-w-4xl py-16 text-center", className),
     children: [
       /* @__PURE__ */ jsxDEV2("h1", {
-        className: "text-4xl font-bold tracking-tight md:text-5xl",
+        className: "font-bold text-4xl tracking-tight md:text-5xl",
         children: title
       }, undefined, false, undefined, this),
       subtitle && /* @__PURE__ */ jsxDEV2("p", {
-        className: "text-muted-foreground mt-4 text-lg md:text-xl",
+        className: "mt-4 text-lg text-muted-foreground md:text-xl",
         children: subtitle
       }, undefined, false, undefined, this),
       (primaryCta || secondaryCta) && /* @__PURE__ */ jsxDEV2("div", {

package/dist/browser/ui/marketing/PricingTable.js

@@ -7,23 +7,23 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? 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"
     }
@@ -77,15 +77,15 @@ function PricingTable({
           className: cn2("flex flex-col rounded-lg border p-6", t.highlighted && "border-primary shadow-lg"),
           children: [
             /* @__PURE__ */ jsxDEV2("div", {
-              className: "text-muted-foreground mb-2 text-base font-medium",
+              className: "mb-2 font-medium text-base text-muted-foreground",
               children: t.name
             }, undefined, false, undefined, this),
             /* @__PURE__ */ jsxDEV2("div", {
-              className: "text-3xl font-semibold",
+              className: "font-semibold text-3xl",
               children: t.price
             }, undefined, false, undefined, this),
             t.tagline && /* @__PURE__ */ jsxDEV2("div", {
-              className: "text-muted-foreground mt-1 text-base",
+              className: "mt-1 text-base text-muted-foreground",
               children: t.tagline
             }, undefined, false, undefined, this),
             /* @__PURE__ */ jsxDEV2("ul", {
@@ -94,7 +94,7 @@ function PricingTable({
                 className: "flex items-start gap-2",
                 children: [
                   /* @__PURE__ */ jsxDEV2("span", {
-                    className: "bg-primary mt-1 h-1.5 w-1.5 rounded-full"
+                    className: "mt-1 h-1.5 w-1.5 rounded-full bg-primary"
                   }, undefined, false, undefined, this),
                   /* @__PURE__ */ jsxDEV2("span", {
                     children: f
@@ -121,7 +121,7 @@ function PricingTable({
         }, idx, true, undefined, this))
       }, undefined, false, undefined, this),
       /* @__PURE__ */ jsxDEV2("p", {
-        className: "text-muted-foreground mt-6 text-center text-base",
+        className: "mt-6 text-center text-base text-muted-foreground",
         children: "Usage-based tiers inspired by generous free allowances and per-unit pricing."
       }, undefined, false, undefined, this)
     ]