Vue Sonner

screenshot of Vue Sonner
vite
vue
unocss

An opinionated toast component for Vue & Nuxt.

Overview

Vue Sonner is an opinionated toast component for Vue. It is a customizable toast component that comes with default styling and a swipe-to-dismiss animation.

Features

  • Customizable toast component for Vue
  • Default styling for easy implementation
  • Swipe-to-dismiss animation
  • Multiple toast types: Default, Success, Error, Action, Promise, Custom Component
  • Headless version available for custom, unstyled toast
  • Theme customization
  • Position customization
  • Expanded toast option
  • Global styling and individual toast styling options
  • Programmatically remove toasts
  • Customizable toast duration
  • Callback functions for toast dismiss and auto-close
  • Keyboard focus option

Summary

Vue Sonner is an opinionated toast component for Vue that provides customizable toast messages with default styling and a swipe-to-dismiss animation. It offers various features such as different toast types, theme customization, position customization, and the ability to programmatically remove toasts. With Vue Sonner, developers can easily implement toast messages in their Vue applications with minimal effort.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

vue
Vue

Vue.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.

unocss
UnoCSS

UnoCSS is an instant, on-demand atomic CSS engine that generates utility classes at build time. It's highly customizable, extremely fast, and compatible with Tailwind CSS utilities while offering additional features like attributify mode and pure CSS icons.

ui-kit
UI Kits & Components

A UI kit provides developers with a set of reusable components that can be easily integrated into a website or application. These components are pre-designed with consistent styling and functionality, allowing developers to save time and effort in the design and development process. UI kits can be either custom-built or third-party, and often include components for buttons, forms, typography, icons, and more.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.