shadcn-vue/apps/www/src/lib/registry/default/example/ToastWithAction.vue
Nik ef4609abbf
feat: add toast (#122)
* feat: add toast

* feat: add new york version

* feat: add `VNode` type to toast description

* docs: use `toast` in form demos

* chore: run build registry

* docs: update announcement component, menu label

* refactor: change 'onUpdate:open' to 'onOpenChange' a more friendlier name

---------

Co-authored-by: Nik <dev@nkutinha.slmail.me>
Co-authored-by: Sadegh Barati <sadeghbaratiwork@gmail.com>
Co-authored-by: zernonia <zernonia@gmail.com>
2023-11-03 09:45:40 +08:00

27 lines
650 B
Vue

<script setup lang="ts">
import { h } from 'vue'
import { Button } from '@/lib/registry/default/ui/button'
import { useToast } from '@/lib/registry/default/ui/toast/use-toast'
import { ToastAction } from '@/lib/registry/default/ui/toast'
const { toast } = useToast()
</script>
<template>
<Button
variant="outline" @click="() => {
toast({
title: 'Uh oh! Something went wrong.',
description: 'There was a problem with your request.',
action: h(ToastAction, {
altText: 'Try again',
}, {
default: () => 'Try again',
}),
});
}"
>
Show Toast
</Button>
</template>