mirror of
https://github.com/storybookjs/storybook.git
synced 2025-04-08 11:11:53 +08:00
37 lines
718 B
Plaintext
37 lines
718 B
Plaintext
```html
|
|
<!-- Button.svelte -->
|
|
|
|
<script>
|
|
import { createEventDispatcher } from 'svelte';
|
|
/**
|
|
* Is this the principal call to action on the page?
|
|
*/
|
|
export let primary = false;
|
|
|
|
/**
|
|
* What background color to use
|
|
*/
|
|
export let backgroundColor;
|
|
/**
|
|
* How large should the button be?
|
|
*/
|
|
export let size = 'medium';
|
|
/**
|
|
* Button contents
|
|
*/
|
|
export let label = '';
|
|
|
|
$: style = backgroundColor ? `background-color: ${backgroundColor}` : '';
|
|
|
|
const dispatch = createEventDispatcher();
|
|
|
|
/**
|
|
* Optional click handler
|
|
*/
|
|
export let onClick = (event) => {
|
|
dispatch('click', event);
|
|
};
|
|
</script>
|
|
|
|
<button type="button" {style} on:click="{onClick}">{label}</button>
|
|
``` |