docs(toggle): add reactive example

This commit is contained in:
Eric Liu 2020-12-05 15:24:30 -08:00
commit 72ac7192ae
2 changed files with 26 additions and 0 deletions

View file

@ -15,6 +15,10 @@ components: ["Toggle", "ToggleSkeleton"]
<Toggle labelText="Push notifications" toggled /> <Toggle labelText="Push notifications" toggled />
### Reactive example
<FileSource src="/framed/Toggle/ToggleReactive" />
### Custom labels ### Custom labels
<Toggle labelText="Push notifications" labelA="No" labelB="Yes" /> <Toggle labelText="Push notifications" labelA="No" labelB="Yes" />

View file

@ -0,0 +1,22 @@
<script>
import { Toggle, Button } from "carbon-components-svelte";
let toggled = true;
</script>
<style>
div {
margin-top: var(--cds-spacing-05);
}
</style>
<Toggle labelText="Push notifications" bind:toggled />
<div>
<Button size="small" on:click="{() => (toggled = !toggled)}">
Toggle
{toggled ? 'off' : 'on'}
</Button>
</div>
<div>Toggled: {toggled}</div>