atom
gy-action-button
Irreversible-action primitive that wraps gy-button with a two-state click ramp so deploy/rollback/delete operations require explicit confirmation.
Live
What you ship.
variant="primary"variant="secondary"variant="ghost"variant="danger"Markup
<gy-action-button variant="danger" size="md" confirm-text="Click again to confirm" confirm-ms="3000">Delete cluster</gy-action-button>Prop space
Tier
Tag
Variants
Sizes
| Prop | Type | Default | Description |
|---|---|---|---|
variant | 'primary' | 'secondary' | 'ghost' | 'danger' | 'danger' | Visual emphasis. Defaults to `danger` because the canonical use is destructive operations. |
size | 'sm' | 'md' | 'lg' | 'md' | Control density. Matches GyButton so a confirm-ramp drops in. |
disabled | boolean | false | Disables interaction and blocks both clicks of the ramp. |
confirmText | string | 'Click again to confirm' | Label shown while the host is in the confirming state. |
confirmMs | number | 3000 | Duration of the confirm window in milliseconds. After this many ms with no second click, the host auto-resets to idle. |
onaction | (ev: CustomEvent<{ confirmed: true }>) => void; /** The idle-state label (text or inline icons). */ children?: Snippet; | no default | Handler for the user-confirmed activation. `detail` is `{ confirmed: true }` so consumers can verify the event came from the second click rather than a synthetic dispatch. |
Where this lives
import '@gyrum-labs/components/action-button/action-button.js';