Button

The primary action control.

Three variants — primary, secondary, ghost. Square edges, token-driven padding.

Demo

Demo loads from http://localhost:6006. Run pnpm storybook for it to render locally.

Usage

svelte

<script>
  import { Button } from 'dssoca';
</script>

<Button variant="primary" onclick={() => {}}>deploy</Button>
<Button variant="secondary">cancel</Button>
<Button variant="ghost">forgot?</Button>

Props

Prop	Type	Default	Description
`variant`	`'primary' \| 'secondary' \| 'ghost'`	`'secondary'`	Visual emphasis.
`type`	`'button' \| 'submit' \| 'reset'`	`'button'`	Native button type.
`disabled`	`boolean`	`false`	Disable the button.
`onclick`	`(e: MouseEvent) => void`	—	Click handler.
`size`	`'sm' \| 'md' \| 'lg'`	—	Per-instance size override; inherits the ancestor `data-size-variant` when unset.
`children`	`Snippet`	—	Required. Button label.