@codapet/design-system 0.8.2 → 0.8.3

package/AGENTS.md

@@ -100,7 +100,7 @@ These don't exist in shadcn — reach for them instead of building your own:
 The brand palette lives in CSS variables exposed as Tailwind colors. Use these, not `bg-blue-600`, `text-gray-500`, `border-red-300`, etc. — raw colors won't dark-mode correctly.
 
 - **Brand**: `brand-{subtle,light,normal,vibrant,dark}`, `brand-text-vibrant`. `primary` aliases `brand-normal`.
-- **Surfaces** (backgrounds): `gray-surface-{light,default,dark}`, `primary-surface-{subtle,light,default}`, `secondary-surface-default`, `sand-{subtle,light,normal,dark}`, `sage-{light,normal,dark}`, `rose-{light,normal,dark}`, `error-surface-{subtle,light,default,dark}`, `success-surface-{subtle,default}`, `warning-surface-{subtle,light}`.
+- **Surfaces** (backgrounds): `gray-surface-{light,default,dark}`, `primary-surface-{subtle,light,default}`, `secondary-surface-default`, `sand-{subtle,light,normal,dark}`, `sage-{light,normal,dark}`, `rose-{light,normal,dark}`, `error-surface-{subtle,light,default,dark}`, `error-destructive` (filled destructive buttons only), `success-surface-{subtle,default}`, `warning-surface-{subtle,light}`.
 - **Strokes** (borders): `gray-stroke-{light,default}`, `primary-stroke-default`, `secondary-stroke-{light,default}`, `error-stroke-{light,default}`, `success-stroke-light`, `warning-stroke-{default,dark}`, `sand-stroke-disabled`.
 - **Text**: `vibrant-text-{display,heading,body,details,white-darker}`, `secondary-text-dark`, `gray-subtle`, `foreground-secondary`, `destructive-text`.
 - **Icons**: `gray-icon-{subtle,light,default,dark}`, `icon-disabled`.

package/dist/index.mjs

@@ -255,7 +255,7 @@ var buttonVariants = cva3(
         "ghost-secondary": "text-foreground-secondary hover:bg-gray-surface-light hover:text-accent-foreground dark:hover:bg-accent/50 active:bg-gray-surface-default",
         "ghost-destructive": "bg-transparent text-destructive-text hover:bg-destructive-hover focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 active:bg-destructive-active",
         link: "text-foreground-secondary underline-offset-4 underline hover:bg-none active:bg-none hover:text-brand-vibrant",
-        destructive: "bg-error-surface-default text-primary-foreground hover:bg-red-800 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 active:bg-error-surface-dark",
+        destructive: "bg-error-destructive text-primary-foreground hover:bg-red-800 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 active:bg-error-surface-dark",
         "destructive-secondary": "bg-error-surface-light border border-error-stroke-light text-destructive-text hover:border-error-surface-default focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 active:bg-destructive-active",
         "destructive-tertiary": "bg-transparent border border-error-stroke-light text-destructive-text hover:bg-destructive-hover focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 active:bg-destructive-active"
       },
@@ -448,7 +448,8 @@ var textareaBaseStyles = [
   "border-gray-stroke-default bg-background",
   // Hover/Focus/Active states
   "hover:border-focus-ring",
-  "focus:border-focus-ring focus:ring-[1px] focus:ring-focus-ring",
+  "focus:border-focus-ring",
+  "focus-visible:border",
   "active:border-focus-ring",
   // Textarea specific
   "field-sizing-content min-h-16 resize-y px-3 py-2"
@@ -456,7 +457,8 @@ var textareaBaseStyles = [
 var errorStyles = [
   "border-error-stroke-default bg-background",
   "hover:border-error-stroke-default",
-  "focus:border-error-stroke-default focus:ring-[1px] focus:ring-error-stroke-default",
+  "focus:border-error-stroke-default",
+  "focus-visible:border",
   "active:border-error-stroke-default"
 ].join(" ");
 var Textarea = React6.forwardRef(
@@ -2272,7 +2274,7 @@ var inputVariants = cva8(
     // File input styles
     "file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium",
     // Disabled styles
-    "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-60"
+    "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-60 disabled:text-gray-icon-subtle"
   ],
   {
     variants: {
@@ -2304,12 +2306,14 @@ var Input = React22.forwardRef(
     const stateStyles = error ? [
       "border-error-stroke-default bg-background",
       "hover:border-error-stroke-default",
-      "focus:border-error-stroke-default focus:ring-[1px] focus:ring-error-stroke-default",
+      "focus:border-error-stroke-default",
+      "focus-visible:border",
       "active:border-error-stroke-default"
     ] : [
       "border-gray-stroke-default bg-background",
       "hover:border-focus-ring",
-      "focus:border-focus-ring focus:ring-[1px] focus:ring-focus-ring",
+      "focus:border-focus-ring",
+      "focus-visible:border",
       "active:border-focus-ring"
     ];
     if (leftIcon || rightIcon) {