svelma-pro

<script>
  import { Button, Toast } from 'svelma-pro'

  function open(type, position) {
    Toast.create({ message: 'I am a toast', type, position })
  }
</script>

<Button on:click={() => open()}>Toast</Button>
<Button type="is-success" on:click={() => open('is-success')}>Success</Button>
<Button type="is-danger" on:click={() => open('is-danger', 'is-bottom-right')}>Bottom Right</Button>
<Button type="is-primary" on:click={() => open('is-primary', 'is-top', 'has-background-grey-lighter')}>Custom Background</Button>

API

Name	Description	Type	Values	Default
`message`	Text or html message for toast	String	—	—
`duration`	Duration toast will remain on screen, optional	Number	—	`2000`
`position`	Where the toast will show on the screen, optional	String	`is-top`, `is-bottom`, `is-top-left`, `is-top-right`, `is-bottom-left`, `is-bottom-right`	`is-top`
`type`	Type (color), optional	String	`is-white`, `is-black`, `is-light`, `is-dark`, `is-primary`, `is-info`, `is-success`, `is-warning`, `is-danger`	`is-dark`
`background`	Background type (any of the Bulma `has-background-` classes will work), optional	String	`has-background-*`	—