Always Light Always Dark System

Component Demo

As seen right here

Button
<Button primary action={demoAction}>Button</Button>
<ComponentDemo>
	{#snippet demo()}
		<Button primary action={demoAction}>Button</Button>
	{/snippet}

```svelte
<Button primary action={demoAction}>Button</Button>
```

</ComponentDemo>

Look, I worked a little harder than I care to admit on this site. I wanted to have fully-interactive demos, but that felt like way too much re-work, especially since very few (if any) other Svelte libraries do that. Wake me up when there’s a way to reflect a component’s props interface.

But this does use the Copy Block combined with the syntax highlighting in MDSvex to make a nice little display. Yes, you do have to put the code in there twice; someday I’ll figure out a way around that. Someday.

But it is not this day.

Usage

Use the demo snippet for the displayable component. Put your code sample in the children snippet.