ui
ui copied to clipboard
fix(button): add aria-invalid border for all variants
Summary
- Add
aria-invalid:borderto Button component base styles - Enables visible aria-invalid feedback for all button variants
Fixes #8920
Description
The Button component had aria-invalid:border-destructive in its base classes, but this only worked for the outline variant which already has a border class. Other variants (default, secondary, ghost, destructive, link) showed no visual feedback when aria-invalid was set.
Before: Only outline variant showed red border on aria-invalid After: All variants show red border on aria-invalid
Changes
Added aria-invalid:border before aria-invalid:border-destructive in:
-
apps/v4/registry/new-york-v4/ui/button.tsx -
templates/monorepo-next/packages/ui/src/components/button.tsx
Testing
Tested all button variants with aria-invalid attribute:
- ✅ default - now shows red border
- ✅ secondary - now shows red border
- ✅ ghost - now shows red border
- ✅ destructive - now shows red border
- ✅ outline - still works as before
- ✅ link - now shows red border
@nathannewyen is attempting to deploy a commit to the shadcn-pro Team on Vercel.
A member of the Team first needs to authorize it.