Toggle — Atelier

Demo

Live PreviewReact

Email notifications

Push notifications

Always enabled

html

<llm-toggle [(checked)]="notifications">Enable notifications</llm-toggle>
<llm-toggle [(checked)]="active">Active toggle</llm-toggle>
<llm-toggle [disabled]="true">Disabled</llm-toggle>

API (Angular)

Prop	Type	Default	Description
`checked`	`boolean`	`false`	Controlled checked state
`onCheckedChange`	`(checked: boolean) => void`	`—`	Called when the checked state changes
`disabled`	`boolean`	`false`	Disables the toggle
`readonly`	`boolean`	`false`	Makes the toggle read-only
`invalid`	`boolean`	`false`	Applies invalid/error styling
`required`	`boolean`	`false`	Marks field as required
`name`	`string`	`''`	HTML name attribute for form submission

Import

import { LlmToggle } from '@atelier-ui/angular';

Explore in Storybook

Edit this page on GitHub