Components

Toast

Easily display a notification to the user.

Usage

<template>
  <NXW-Toast
    type="success"
    title="Install NuxtWind"
    message="Successfully installed NuxtWind! 🎉"
    :auto-close="false"
  />
</template>

Props

auto-close

boolean
Default
false

color

object
Default
<template>
  <NXW-Toast
    :color="{
      progress: {},
      text: 'text-gray-700 dark:text-gray-300',
      bg: 'bg-gray-100 dark:bg-zinc-800',
      icon: {
        info: '[object Object]',
        warning: '[object Object]',
        error: '[object Object]',
        success: '[object Object]',
      },
    }"
  />
</template>

duration

number
Default
5

id

string
required
Default
"" (empty string)

message

string
Default
Toast-Message

rounded

boolean
|
string
Default
true
Example
rounded-lg

shadow

boolean
|
string
Default
true
Example
shadow-lg

title

string
Default
Toast-Title

type

info
|
success
|
warning
|
error
Default
info

width

string
Default
w-full

Copyright © 2024