Button, Cairn

Show code

import { Button } from '@six-vallees/ui-react';

export default function ButtonDemo() {
  return (
    <div className="flex flex-wrap items-center gap-3">
      <Button>Primary</Button>
      <Button variant="secondary">Secondary</Button>
      <Button variant="ghost">Ghost</Button>
      <Button variant="danger">Danger</Button>
    </div>
  );
}

npx shadcn@latest add https://cairn.sixvallees.com/r/button.json

Prop	Type	Default
variant	'primary' \| 'secondary' \| 'ghost' \| 'danger' Visual style of the button.	'primary'
size	'sm' \| 'md' \| 'lg' Height and padding.	'md'
asChild	boolean Render as the child element (e.g. an <a>) instead of a <button>.	false
...props	ButtonHTMLAttributes All native <button> attributes (onClick, disabled, type…).	-

Table hand-authored for now, auto-generation from the TS types (react-docgen-typescript) is a follow-up.