Skip to content

Releases: xiaoluoboding/vue-sonner

Release v2.0.9

01 Oct 09:57

Choose a tag to compare

What's Changed

New Contributors

Full Changelog: v2.0.8...v2.0.9

Release v2.0.8

18 Aug 10:50

Choose a tag to compare

What's Changed

Full Changelog: v2.0.7...v2.0.8

Release v2.0.7

17 Aug 09:47

Choose a tag to compare

What's Changed

New Contributors

Credits

Full Changelog: v2.0.2...v2.0.7

Release v2.0.2, Support Nuxt 4

17 Jul 08:34

Choose a tag to compare

What's Changed

  • Add safe area inset to mobile top and bottom by @ygyg70 in #137
  • chore: indicate compatibility with new v4 major by @NamesMT in #136

New Contributors

Full Changelog: v2.0.1...v2.0.2

Release v2.0.1

23 Jun 06:43

Choose a tag to compare

What's Changed

  • Add css import on web page by @MaxTechnics in #120
  • fix(tsconfig): add tsconfig.includes files by @ffgenius in #121
  • fix: active toasts by @jals1212 in #124
  • 🎨 fix(theme): make theme="system" reactive in by @excho0 in #130
  • πŸ“¦ feat(umd): add UMD-compatible plugin entrypoint and tsdown build by @excho0 in #131

New Contributors

Full Changelog: v2.0.0...v2.0.1

Release v2.0.0 πŸŽ‰

22 May 03:42

Choose a tag to compare

What's Changed

Full Changelog: v1.3.2...v2.0.0

How to Migrate from Version v1.3.2 to v2.0.0

When you upgrade to v2.0.0, you need to manually import vue-sonner/style.css. This gives developers greater flexibility, allowing you to even customize your own CSS.

For Vue 3

Inline CSS is separated and must be imported manually.

<!-- App.vue -->
<template>
  <Toaster />
  <button @click="() => toast('My first toast')">Render a toast</button>
</template>

<script lang="ts" setup>
  import 'vue-sonner/style.css' // add vue-sonner css.
  import { Toaster, toast } from 'vue-sonner'
</script>

In Nuxt 3

CSS is imported by default, but you can disable this behavior to prevent CSS from being imported.

Use vue-sonner/nuxt module

// nuxt.config.ts
export default defineNuxtConfig({
  ...
  modules: ['vue-sonner/nuxt']
  vueSonner: {
    css: false // true by default to include css file
  }
})

Release v1.3.2

12 Apr 10:03

Choose a tag to compare

Full Changelog: v1.3.2...v1.3.2

What's Changed

New Contributors

Full Changelog: v1.3.0...v1.3.2

Release v1.3.0

21 Nov 14:43

Choose a tag to compare

What's Changed

New Contributors

Full Changelog: v1.2.5...v1.3.0

Release v1.2.4

29 Oct 03:44

Choose a tag to compare

What's Changed

Vue Sonner now supports a Nuxt 3 module

Use vue-sonner/nuxt module

// nuxt.config.ts
export default defineNuxtConfig({
  ...
  modules: ['vue-sonner/nuxt']
})

Use Toaster component and $toast function anywhere in the Vue SFC

<!-- app.vue -->
<template>
  <div>
    <Toaster position="top-right" />
    <button @click="() => $toast('My first toast')">Render a toast</button>
  </div>
</template>

<script setup lang="ts">
  const { $toast } = useNuxtApp()
</script>

Full Changelog: v1.2.3...v1.2.4

Release v1.2.3

21 Oct 13:42

Choose a tag to compare

What's Changed

  • Add playwright test from Sonner package and fix dismiss function by @CMarzin in #91
  • feat: add github action for tests by @adrienZ in #93
  • feature: pkg-pr-new by @adrienZ in #95

New Contributors

Full Changelog: v1.2.2...v1.2.3