Merge pull request xiaoluoboding#90 from sadeghbarati/fix-toast-class

fix: fix toast `class`/`classes` and `onDismiss` callbacks for headless toasts

Author: xiaoluoboding

package.json

@@ -36,21 +36,21 @@
   "license": "MIT",
   "devDependencies": {
     "@iconify/json": "^2.2.172",
-    "@microsoft/api-extractor": "^7.47.9",
+    "@microsoft/api-extractor": "^7.47.10",
     "@types/node": "^18.19.8",
-    "@unocss/reset": "^0.62.4",
+    "@unocss/reset": "^0.63.4",
     "@vitejs/plugin-vue": "^5.1.4",
     "@vue/tsconfig": "^0.5.1",
     "@vueuse/core": "^11.1.0",
     "@vueuse/head": "^2.0.0",
     "clean-css": "^5.3.3",
     "highlight.js": "^11.10.0",
-    "typescript": "^5.6.2",
-    "unocss": "^0.62.4",
+    "typescript": "^5.6.3",
+    "unocss": "^0.63.4",
     "unplugin-icons": "^0.19.3",
     "unplugin-vue-components": "^0.27.4",
-    "vite": "^5.4.7",
-    "vue": "^3.5.8",
+    "vite": "^5.4.9",
+    "vue": "^3.5.12",
     "vue-tsc": "^2.1.6"
   }
 }

packages/Toast.vue

@@ -6,7 +6,16 @@
     role="status"
     tabindex="0"
     data-sonner-toast="true"
-    :class="toastClass"
+    :class="cn(
+      props.class,
+      toastClass,
+      classes?.toast,
+      toast.classes?.toast,
+      // @ts-ignore
+      classes?.[toastType],
+      // @ts-ignore
+      toast?.classes?.[toastType]
+    )"
     :data-rich-colors="toast.richColors ?? defaultRichColors"
     :data-styled="!Boolean(toast.component || toast?.unstyled || unstyled)"
     :data-mounted="mounted"
@@ -57,7 +66,7 @@
       <component
         :is="toast.component"
         v-bind="toast.componentProps"
-        :onCloseToast="deleteToast"
+        :onCloseToast="handleCloseToast"
       />
     </template>
 
@@ -81,7 +90,7 @@
         </div>
       </template>
 
-      <div data-content="">
+      <div data-content="" :class="cn(classes?.content, toast?.classes?.content)">
         <div data-title="" :class="cn(classes?.title, toast.classes?.title)">
           <template v-if="isStringOfTitle">
             <component :is="toast.title" v-bind="toast.componentProps" />