import { DaffSwitchComponent } from '@daffodil/design/switch'
The switch component provides a way to toggle between two settings.
<daff-switch>
Label
</daff-switch>
@Component()
class DaffSwitchComponent {
@Input() @HostBinding() disabled: any
@Input() @HostBinding() loading: boolean = false
@Input() checked: boolean = false
@Input() labelPosition: DaffLabelPosition = DaffLabelPositionEnum.LEFT
@Input() error: boolean = false
@Input() ariaLabel: string = ''
@Input() id: string = 'daff-switch-' + switchUniqueId++
@Output() toggled: EventEmitter<boolean> = new EventEmitter<boolean>()
@HostListener() handleKeydown(event: KeyboardEvent): void
}
void| Parameter | event: KeyboardEvent |
|---|---|
| Description |
any| Default | – |
|---|---|
| Description | Whether the switch is disabled and/or loading. |
boolean| Default | false |
|---|---|
| Description | Whether the switch is loading. |
boolean| Default | false |
|---|---|
| Description | Current state of switch (on/off). |
DaffLabelPosition| Default | DaffLabelPositionEnum.LEFT |
|---|---|
| Description | The position of the label relative to the switch. |
boolean| Default | false |
|---|---|
| Description | Whether the switch shows an error. |
string| Default | '' |
|---|---|
| Description | aria-label for the switch. |
string| Default | 'daff-switch-' + switchUniqueId++ |
|---|---|
| Description | A unique id for the switch. The |
EventEmitter<boolean>| Default | – |
|---|---|
| Description | Output event triggered when the switch has been toggled. |