mirror of
https://github.com/bitwarden/browser
synced 2025-12-06 00:13:28 +00:00
* Add switch component * fix focus state * updating stories * add switch role * updated story docs code examples * Add max length and long label story * Add disabled reason text * fix hint spacing * support rtl thumb transform * use correct input syntax. assign value to template variable * remove pointer when disabled * Show disabled text as title if it exists * add basic switch component tests * keep switch top aligned * move switch back to right side of label * add max width to label and hint * updated switch story docs * fix story html formatting * better comment about which are ControlValueAccessor functions * add JSDoc comment about model signals * update methods to mirror search input format * fix notify function type * fix typo * throw error if label is not provided * add hover and focus states * add label to failing spec * import bit-label
37 lines
643 B
Plaintext
37 lines
643 B
Plaintext
import { Meta, Canvas, Source, Primary, Controls, Title, Description } from "@storybook/addon-docs";
|
|
|
|
import * as stories from "./switch.stories";
|
|
|
|
<Meta of={stories} />
|
|
|
|
```ts
|
|
import { SwitchModule } from "@bitwarden/components";
|
|
```
|
|
|
|
<Title />
|
|
<Description />
|
|
|
|
NOTE: The switch component will span 100% of the width of its container. These stories have a
|
|
container with a `max-width` of 600px
|
|
|
|
<Primary />
|
|
<Controls />
|
|
|
|
## Stories
|
|
|
|
### Default
|
|
|
|
<Canvas of={stories.Default} />
|
|
|
|
### Used with a from
|
|
|
|
<Canvas of={stories.WithForm} />
|
|
|
|
### With Long Label
|
|
|
|
<Canvas of={stories.WithLongLabel} />
|
|
|
|
### Disabled
|
|
|
|
<Canvas of={stories.Disabled} />
|