fix secondary button border

.changeset/giant-otters-jump.md

@@ -0,0 +1,5 @@
+---
+"@baselayer/components": patch
+---
+
+fix secondary button border

packages/components/src/core/button/button.tsx

@@ -13,7 +13,7 @@ const button = tv({
 			primary:
 				"bg-primary text-primary-fg data-[hovered]:bg-primary/80",
 			secondary:
-				"text-fg shadow-[inset_0_0_0_1px_rgba(0,0,0,0.1)] shadow-border data-[hovered]:border-secondary data-[hovered]:bg-secondary",
+				"border border-border text-fg data-[hovered]:border-secondary data-[hovered]:bg-secondary",
 			ghost:
 				"bg-transparent text-fg data-[hovered]:bg-secondary data-[hovered]:text-secondary-fg",
 			danger:

packages/components/src/registry.ts

@@ -4,7 +4,7 @@
 import type { ComponentRegistry, ComponentRegistryEntry } from '@baselayer/registry';
 
 const registry: ComponentRegistry = {
-  "version": "1.9.0",
+  "version": "2.0.0",
   "components": [
     {
         "id": "accordion",
@@ -393,7 +393,7 @@ const templateContents: Record<string, string> = {
   "accordion": "\"use client\";\n\nimport type { ReactNode } from \"react\";\n\nimport {\n\tButton,\n\tDisclosure,\n\tDisclosureGroup,\n\ttype DisclosureGroupProps,\n\tDisclosurePanel,\n\ttype DisclosureProps,\n\tHeading,\n} from \"react-aria-components\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nimport { Minus, Plus } from \"lucide-react\";\n\nconst accordion = tv({\n\tslots: {\n\t\troot: \"group w-full\",\n\t\tgroup: \"flex flex-col gap-3\",\n\t\tbutton:\n\t\t\t\"flex w-full items-center justify-between gap-6 rounded-2xl border border-border bg-surface-2 p-4 data-[focus-visible]:outline-none data-[focus-visible]:ring-2 data-[focus-visible]:ring-focus data-[focus-visible]:ring-offset-2 data-[focus-visible]:ring-offset-surface group-data-[expanded]:rounded-b-none group-data-[expanded]:border-b-0\",\n\t\ticon: \"size-4 shrink-0 fill-none transition-transform duration-200\",\n\t\tpanel:\n\t\t\t\"rounded-b-2xl border-border bg-surface-2 px-4 text-muted-foreground text-sm group-data-[expanded]:border-x group-data-[expanded]:border-b group-data-[expanded]:pb-4\",\n\t},\n});\n\nconst styles = accordion();\n\ntype AccordionVariantProps = VariantProps<typeof accordion>;\n\ninterface AccordionProps\n\textends AccordionVariantProps,\n\t\tOmit<DisclosureProps, \"children\"> {\n\tclassName?: string;\n\ttitle?: string;\n\tchildren?: ReactNode;\n}\n\nconst Accordion = ({\n\tclassName,\n\ttitle,\n\tchildren,\n\t...props\n}: AccordionProps) => {\n\treturn (\n\t\t<Disclosure className={styles.root({ className })} {...props}>\n\t\t\t{({ isExpanded }) => (\n\t\t\t\t<>\n\t\t\t\t\t<Heading>\n\t\t\t\t\t\t<Button slot=\"trigger\" className={styles.button()}>\n\t\t\t\t\t\t\t<span className=\"font-bold\">{title}</span>\n\t\t\t\t\t\t\t{isExpanded ? (\n\t\t\t\t\t\t\t\t<Minus className={styles.icon()} />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Plus className={styles.icon()} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</Heading>\n\t\t\t\t\t<DisclosurePanel className={styles.panel()}>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</DisclosurePanel>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</Disclosure>\n\t);\n};\n\ninterface AccordionGroupProps extends DisclosureGroupProps {\n\tclassName?: string;\n\tchildren: ReactNode;\n}\n\nconst AccordionGroup = ({\n\tclassName,\n\tchildren,\n\t...props\n}: AccordionGroupProps) => (\n\t<DisclosureGroup {...props} className={styles.group({ className })}>\n\t\t{children}\n\t</DisclosureGroup>\n);\n\nexport { Accordion, AccordionGroup };\nexport type { AccordionProps, AccordionGroupProps };\n",
   "badge": "import type { HTMLAttributes } from \"react\";\n\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nexport const badge = tv({\n\tbase: \"flex items-center justify-center rounded-4xl px-3 py-2 font-semibold text-xs\",\n\tvariants: {\n\t\tvariant: {\n\t\t\tattention: \"bg-gradient-to-r from-pink-500 to-purple-500 text-white\",\n\t\t\tneutral: \"bg-secondary text-secondary-fg\",\n\t\t\tdanger: \"bg-danger text-danger-fg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tvariant: \"attention\",\n\t},\n});\n\ntype BadgeProps = VariantProps<typeof badge> & HTMLAttributes<HTMLSpanElement>;\n\nconst Badge = ({ className, variant, ...props }: BadgeProps) => (\n\t<span className={badge({ variant, className })} {...props} />\n);\n\nexport { Badge };\nexport type { BadgeProps };\n",
   "breadcrumbs": "\"use client\";\n\nimport {\n\tBreadcrumbs as AriaBreadcrumbs,\n\ttype BreadcrumbsProps as AriaBreadcrumbsProps,\n\tBreadcrumb,\n\ttype BreadcrumbProps,\n\tLink,\n\ttype LinkProps,\n} from \"react-aria-components\";\nimport { tv } from \"tailwind-variants\";\n\nconst breadcrumbs = tv({\n\tslots: {\n\t\troot: \"m-0 flex list-none items-center gap-2 p-0 font-md\",\n\t\tlink: \"relative cursor-pointer rounded-md text-fg outline-none ring-focus data-[hovered]:underline data-[focus-visible]:ring-2 [&[aria-current]]:font-extrabold [&[aria-current]]:text-fg\",\n\t\titem: \"flex items-center gap-2\",\n\t},\n});\n\nconst styles = breadcrumbs();\n\nconst Breadcrumbs = <T extends object>({\n\tchildren,\n\tclassName,\n\t...props\n}: AriaBreadcrumbsProps<T> & { className?: string }) => (\n\t<AriaBreadcrumbs className={styles.root({ className })} {...props}>\n\t\t{children}\n\t</AriaBreadcrumbs>\n);\n\nconst BreadcrumbsLink = ({\n\tchildren,\n\tclassName,\n\t...props\n}: LinkProps & { className?: string }) => (\n\t<Link className={styles.link({ className })} {...props}>\n\t\t{children}\n\t</Link>\n);\n\nconst BreadcrumbsItem = ({\n\tchildren,\n\tclassName,\n\t...props\n}: BreadcrumbProps & { className?: string }) => (\n\t<Breadcrumb className={styles.item({ className })} {...props}>\n\t\t{children}\n\t</Breadcrumb>\n);\n\nexport { BreadcrumbsItem, BreadcrumbsLink, Breadcrumbs };",
-  "button": "\"use client\";\n\nimport {\n\tButton as AriaButton,\n\ttype ButtonProps as AriaButtonProps,\n} from \"react-aria-components\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nconst button = tv({\n\tbase: \"inline-flex appearance-none items-center justify-center rounded-full font-semibold outline-none ring-focus ring-offset-3 ring-offset-surface transition-transform duration-100 disabled:pointer-events-none disabled:opacity-50 data-[focus-visible]:ring-2\",\n\tvariants: {\n\t\tvariant: {\n\t\t\tprimary:\n\t\t\t\t\"bg-primary text-primary-fg data-[hovered]:bg-primary/80\",\n\t\t\tsecondary:\n\t\t\t\t\"text-fg shadow-[inset_0_0_0_1px_rgba(0,0,0,0.1)] shadow-border data-[hovered]:border-secondary data-[hovered]:bg-secondary\",\n\t\t\tghost:\n\t\t\t\t\"bg-transparent text-fg data-[hovered]:bg-secondary data-[hovered]:text-secondary-fg\",\n\t\t\tdanger:\n\t\t\t\t\"border border-transparent bg-danger text-danger-fg data-[hovered]:bg-danger/80\",\n\t\t},\n\t\tsize: {\n\t\t\tsm: \"px-2 py-1.5 text-sm\",\n\t\t\tmd: \"px-4 py-2.5 text-base\",\n\t\t\tlg: \"px-6 py-3.5 font-bold text-lg\",\n\t\t\ticon: \"size-9\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tvariant: \"primary\",\n\t\tsize: \"md\",\n\t},\n});\n\ntype ButtonVariantProps = VariantProps<typeof button>;\n\ninterface ButtonProps\n\textends Omit<AriaButtonProps, \"className\">,\n\t\tButtonVariantProps {\n\tclassName?: string;\n}\n\nconst Button = ({\n\tclassName,\n\tsize,\n\tvariant,\n\tchildren,\n\t...props\n}: ButtonProps) => (\n\t<AriaButton className={button({ className, size, variant })} {...props}>\n\t\t{children}\n\t</AriaButton>\n);\n\nButton.displayName = \"Button\";\n\nexport { Button };\nexport type { ButtonProps };\n",
+  "button": "\"use client\";\n\nimport {\n\tButton as AriaButton,\n\ttype ButtonProps as AriaButtonProps,\n} from \"react-aria-components\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nconst button = tv({\n\tbase: \"inline-flex appearance-none items-center justify-center rounded-full font-semibold outline-none ring-focus ring-offset-3 ring-offset-surface transition-transform duration-100 disabled:pointer-events-none disabled:opacity-50 data-[focus-visible]:ring-2\",\n\tvariants: {\n\t\tvariant: {\n\t\t\tprimary:\n\t\t\t\t\"bg-primary text-primary-fg data-[hovered]:bg-primary/80\",\n\t\t\tsecondary:\n\t\t\t\t\"border border-border text-fg data-[hovered]:border-secondary data-[hovered]:bg-secondary\",\n\t\t\tghost:\n\t\t\t\t\"bg-transparent text-fg data-[hovered]:bg-secondary data-[hovered]:text-secondary-fg\",\n\t\t\tdanger:\n\t\t\t\t\"border border-transparent bg-danger text-danger-fg data-[hovered]:bg-danger/80\",\n\t\t},\n\t\tsize: {\n\t\t\tsm: \"px-2 py-1.5 text-sm\",\n\t\t\tmd: \"px-4 py-2.5 text-base\",\n\t\t\tlg: \"px-6 py-3.5 font-bold text-lg\",\n\t\t\ticon: \"size-9\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tvariant: \"primary\",\n\t\tsize: \"md\",\n\t},\n});\n\ntype ButtonVariantProps = VariantProps<typeof button>;\n\ninterface ButtonProps\n\textends Omit<AriaButtonProps, \"className\">,\n\t\tButtonVariantProps {\n\tclassName?: string;\n}\n\nconst Button = ({\n\tclassName,\n\tsize,\n\tvariant,\n\tchildren,\n\t...props\n}: ButtonProps) => (\n\t<AriaButton className={button({ className, size, variant })} {...props}>\n\t\t{children}\n\t</AriaButton>\n);\n\nButton.displayName = \"Button\";\n\nexport { Button };\nexport type { ButtonProps };\n",
   "calendar": "\"use client\";\n\nimport {\n\tCalendar as AriaCalendar,\n\ttype CalendarProps as AriaCalendarProps,\n\tRangeCalendar as AriaRangeCalendar,\n\ttype RangeCalendarProps as AriaRangeCalendarProps,\n\tButton,\n\tCalendarCell,\n\tCalendarGrid,\n\tCalendarGridBody,\n\tCalendarGridHeader,\n\tCalendarHeaderCell,\n\ttype DateValue,\n\tHeading,\n\tText,\n} from \"react-aria-components\";\nimport { tv } from \"tailwind-variants\";\n\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\n\nconst baseStyles = tv({\n\tslots: {\n\t\troot: \"w-fit max-w-full rounded-2xl border border-border bg-surface p-4 text-fg\",\n\t\theader: \"flex w-full items-center gap-1 pb-4\",\n\t\theading: \"flex-1 text-center font-bold\",\n\t\theaderCell: \"pb-2 text-fg-muted text-sm\",\n\t\tmonthButton:\n\t\t\t\"flex appearance-none items-center justify-center rounded-full p-2 text-center outline-none ring-focus data-[hovered]:bg-secondary data-[focus-visible]:ring-2\",\n\t},\n});\n\nconst calendar = tv({\n\textend: baseStyles,\n\tslots: {\n\t\tcell: \"flex size-9 cursor-default items-center justify-center rounded-full border-border text-center text-sm outline-focus outline-offset-2 data-[hovered]:bg-secondary data-[pressed]:bg-secondary data-[selected]:bg-primary data-[selected]:text-primary-fg data-[unavailable]:text-fg-muted data-[unavailable]:line-through data-[focus-visible]:outline-2 data-[focus-visible]:outline-focus [&[data-outside-month]]:hidden\",\n\t},\n});\n\nconst rangeCalendar = tv({\n\textend: baseStyles,\n\tslots: {\n\t\tcell: \"flex size-9 cursor-default items-center justify-center rounded-full text-center text-sm outline-none outline-offset-2 data-[selected]:rounded-none data-[hovered]:bg-secondary data-[pressed]:bg-secondary data-[selected]:bg-primary data-[selected]:text-primary-fg data-[unavailable]:text-fg-muted data-[unavailable]:line-through data-[focus-visible]:ring-2 data-[focus-visible]:ring-focus data-[focus-visible]:ring-offset-2 [&[data-outside-month]]:hidden [&[data-selection-end]]:rounded-r-full [&[data-selection-start]]:rounded-l-full\",\n\t},\n});\n\nconst styles = calendar();\nconst rangeStyles = rangeCalendar();\n\ninterface CalendarProps<T extends DateValue>\n\textends Omit<AriaCalendarProps<T>, \"className\"> {\n\terrorMessage?: string;\n\tclassName?: string;\n}\n\nconst Calendar = ({\n\tclassName,\n\terrorMessage,\n\t...props\n}: CalendarProps<DateValue>) => (\n\t<AriaCalendar {...props} className={styles.root({ className })}>\n\t\t<header className={styles.header()}>\n\t\t\t<Button className={styles.monthButton()} slot=\"previous\">\n\t\t\t\t<ChevronLeft className=\"h-5 w-5 self-center\" />\n\t\t\t</Button>\n\t\t\t<Heading className={styles.heading()} slot=\"label\" />\n\t\t\t<Button className={styles.monthButton()} slot=\"next\">\n\t\t\t\t<ChevronRight className=\"h-5 w-5 self-center\" />\n\t\t\t</Button>\n\t\t</header>\n\t\t<CalendarGrid>\n\t\t\t<CalendarGridHeader>\n\t\t\t\t{(day) => (\n\t\t\t\t\t<CalendarHeaderCell className={styles.headerCell()}>\n\t\t\t\t\t\t{day}\n\t\t\t\t\t</CalendarHeaderCell>\n\t\t\t\t)}\n\t\t\t</CalendarGridHeader>\n\t\t\t<CalendarGridBody>\n\t\t\t\t{(date) => <CalendarCell className={styles.cell()} date={date} />}\n\t\t\t</CalendarGridBody>\n\t\t</CalendarGrid>\n\t\t{errorMessage && (\n\t\t\t<Text className=\"text-danger text-sm\" slot=\"errorMessage\">\n\t\t\t\t{errorMessage}\n\t\t\t</Text>\n\t\t)}\n\t</AriaCalendar>\n);\n\ninterface RangeCalendarProps<T extends DateValue>\n\textends Omit<AriaRangeCalendarProps<T>, \"className\"> {\n\terrorMessage?: string;\n\tclassName?: string;\n}\n\nconst RangeCalendar = ({\n\tclassName,\n\terrorMessage,\n\t...props\n}: RangeCalendarProps<DateValue>) => (\n\t<AriaRangeCalendar {...props} className={rangeStyles.root({ className })}>\n\t\t<header className={rangeStyles.header()}>\n\t\t\t<Button className={rangeStyles.monthButton()} slot=\"previous\">\n\t\t\t\t<ChevronLeft className=\"h-5 w-5 self-center\" />\n\t\t\t</Button>\n\t\t\t<Heading className={rangeStyles.heading()} slot=\"label\" />\n\t\t\t<Button className={rangeStyles.monthButton()} slot=\"next\">\n\t\t\t\t<ChevronRight className=\"h-5 w-5 self-center\" />\n\t\t\t</Button>\n\t\t</header>\n\t\t<CalendarGrid>\n\t\t\t<CalendarGridHeader>\n\t\t\t\t{(day) => (\n\t\t\t\t\t<CalendarHeaderCell className={rangeStyles.headerCell()}>\n\t\t\t\t\t\t{day}\n\t\t\t\t\t</CalendarHeaderCell>\n\t\t\t\t)}\n\t\t\t</CalendarGridHeader>\n\t\t\t<CalendarGridBody>\n\t\t\t\t{(date) => <CalendarCell className={rangeStyles.cell()} date={date} />}\n\t\t\t</CalendarGridBody>\n\t\t</CalendarGrid>\n\t\t{errorMessage && (\n\t\t\t<Text className=\"text-danger text-sm\" slot=\"errorMessage\">\n\t\t\t\t{errorMessage}\n\t\t\t</Text>\n\t\t)}\n\t</AriaRangeCalendar>\n);\n\nexport { Calendar, RangeCalendar };\nexport type { CalendarProps, RangeCalendarProps };\n",
   "card": "\"use client\";\n\nimport type { HTMLAttributes } from \"react\";\n\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nconst card = tv({\n\tslots: {\n\t\troot: \"rounded-2xl border-2 bg-surface text-fg\",\n\t\theader: \"flex flex-col space-y-1.5 p-6\",\n\t\ttitle: \"font-semibold text-2xl leading-none tracking-tight\",\n\t\tdescription: \"text-fg-muted text-sm\",\n\t\tcontent: \"p-6 pt-0\",\n\t\tfooter: \"flex items-center p-6 pt-0\",\n\t},\n\tvariants: {\n\t\tvariant: {\n\t\t\toutlined: {\n\t\t\t\troot: \"border border-border/50\",\n\t\t\t},\n\t\t\tfilled: {\n\t\t\t\troot: \"border-surface-2 bg-surface-2\",\n\t\t\t},\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tvariant: \"outlined\",\n\t},\n});\n\nconst styles = card();\n\ntype CardVariantProps = VariantProps<typeof card>;\n\ninterface CardProps extends HTMLAttributes<HTMLDivElement>, CardVariantProps {\n\tclassName?: string;\n\ttitle?: string;\n\tdescription?: string;\n}\n\ninterface CardHeaderProps extends HTMLAttributes<HTMLDivElement> {\n\tclassName?: string;\n}\n\ninterface CardContentProps extends HTMLAttributes<HTMLDivElement> {\n\tclassName?: string;\n}\n\ninterface CardFooterProps extends HTMLAttributes<HTMLDivElement> {\n\tclassName?: string;\n}\n\nconst Card = ({\n\tclassName,\n\tvariant,\n\ttitle,\n\tdescription,\n\tchildren,\n\t...props\n}: CardProps) => (\n\t<div className={styles.root({ variant, className })} {...props}>\n\t\t{(title || description) && (\n\t\t\t<div className={styles.header()}>\n\t\t\t\t{title && <h3 className={styles.title()}>{title}</h3>}\n\t\t\t\t{description && <p className={styles.description()}>{description}</p>}\n\t\t\t</div>\n\t\t)}\n\t\t{children}\n\t</div>\n);\n\nconst CardHeader = ({ className, ...props }: CardHeaderProps) => (\n\t<div className={styles.header({ className })} {...props} />\n);\n\nconst CardContent = ({ className, ...props }: CardContentProps) => (\n\t<div className={styles.content({ className })} {...props} />\n);\n\nconst CardFooter = ({ className, ...props }: CardFooterProps) => (\n\t<div className={styles.footer({ className })} {...props} />\n);\n\nexport { Card, CardHeader, CardContent, CardFooter };\nexport type { CardProps, CardHeaderProps, CardContentProps, CardFooterProps };\n",
   "checkbox": "\"use client\";\n\nimport type { ReactNode } from \"react\";\n\nimport {\n\ttype CheckboxProps as AriaCheckBoxProps,\n\tCheckbox as AriaCheckbox,\n\tCheckboxGroup as AriaCheckboxGroup,\n\ttype CheckboxGroupProps as AriaCheckboxGroupProps,\n\tFieldError,\n\tText,\n\ttype ValidationResult,\n} from \"react-aria-components\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nimport { Check } from \"lucide-react\";\n\nconst checkbox = tv({\n\tbase: \"group flex items-center justify-center gap-2 py-1 text-fg\",\n});\n\nconst checkboxGroup = tv({\n\tbase: \"flex flex-col gap-2\",\n});\n\ntype CheckboxVariantProps = VariantProps<typeof checkbox>;\n\ninterface CheckboxProps extends CheckboxVariantProps, AriaCheckBoxProps {\n\tclassName?: string;\n\tchildren: ReactNode;\n\tdescription?: string;\n\terrorMessage?: string | ((validation: ValidationResult) => string);\n}\n\nconst Checkbox = ({\n\tclassName,\n\terrorMessage,\n\tchildren,\n\tdescription,\n\t...props\n}: CheckboxProps) => {\n\treturn (\n\t\t<AriaCheckbox className={checkbox({ className })} {...props}>\n\t\t\t{({ isSelected }) => (\n\t\t\t\t<>\n\t\t\t\t\t<div className=\"flex size-6 shrink-0 items-center justify-center rounded-lg border border-border transition-all group-data-[selected]:border-primary group-data-[selected]:bg-primary group-data-[focus-visible]:ring-2 group-data-[focus-visible]:ring-focus group-data-[focus-visible]:ring-offset-2 group-data-[focus-visible]:ring-offset-surface\">\n\t\t\t\t\t\t{isSelected && <Check className=\"size-4 text-primary-fg\" />}\n\t\t\t\t\t</div>\n\t\t\t\t\t{children}\n\t\t\t\t\t{description && (\n\t\t\t\t\t\t<Text className=\"text-sm\" slot=\"description\">\n\t\t\t\t\t\t\t{description}\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t)}\n\t\t\t\t\t<FieldError className=\"text-danger text-sm\">\n\t\t\t\t\t\t{errorMessage}\n\t\t\t\t\t</FieldError>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaCheckbox>\n\t);\n};\n\ninterface CheckboxGroupProps extends AriaCheckboxGroupProps {\n\tclassName?: string;\n\tlabel?: string;\n\tchildren: ReactNode;\n\tdescription?: string;\n\terrorMessage?: string | ((validation: ValidationResult) => string);\n}\n\nconst CheckboxGroup = ({\n\tclassName,\n\tlabel,\n\tdescription,\n\terrorMessage,\n\tchildren,\n\t...props\n}: CheckboxGroupProps) => (\n\t<AriaCheckboxGroup {...props} className={checkboxGroup({ className })}>\n\t\t{label && (\n\t\t\t<Text className=\"text-md\" slot=\"label\">\n\t\t\t\t{label}\n\t\t\t</Text>\n\t\t)}\n\t\t{children}\n\t\t{description && (\n\t\t\t<Text className=\"text-md\" slot=\"description\">\n\t\t\t\t{description}\n\t\t\t</Text>\n\t\t)}\n\t\t<FieldError className=\"text-danger text-sm\">{errorMessage}</FieldError>\n\t</AriaCheckboxGroup>\n);\n\nexport { Checkbox, CheckboxGroup };\nexport type { CheckboxProps, CheckboxGroupProps };\n",

web/public/build-info.json

@@ -1,5 +1,5 @@
 {
-  "git": "281691a7451eaf590646ab3af33e7e4135604a40",
-  "builtAt": "2025-07-01T05:12:13.485Z",
-  "registrySHA256": "490f0479c8eaea65"
+  "git": "17982bc1ea526cd9977525c2f5fbed2d4a144788",
+  "builtAt": "2025-07-01T06:25:54.839Z",
+  "registrySHA256": "ab8d76391d5d99df"
 }

web/public/registry.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.9.0",
+  "version": "2.0.0",
   "components": [
     {
       "id": "accordion",

web/public/templates/button.txt

@@ -13,7 +13,7 @@ const button = tv({
 			primary:
 				"bg-primary text-primary-fg data-[hovered]:bg-primary/80",
 			secondary:
-				"text-fg shadow-[inset_0_0_0_1px_rgba(0,0,0,0.1)] shadow-border data-[hovered]:border-secondary data-[hovered]:bg-secondary",
+				"border border-border text-fg data-[hovered]:border-secondary data-[hovered]:bg-secondary",
 			ghost:
 				"bg-transparent text-fg data-[hovered]:bg-secondary data-[hovered]:text-secondary-fg",
 			danger: