From 9ad7fcfd6db7a60d9b7b6548250c26fb3c002a4c Mon Sep 17 00:00:00 2001
From: sadeghbarati <sadeghbaratiwork@gmail.com>
Date: Tue, 23 Jan 2024 10:07:01 +0330
Subject: [PATCH] fix: `useForwardProps` for vue-sonner props

---
 apps/www/.vitepress/theme/config/docs.ts                 | 1 -
 apps/www/.vitepress/theme/layout/DocsLayout.vue          | 2 +-
 apps/www/src/lib/registry/default/ui/sonner/Sonner.vue   | 5 ++++-
 apps/www/src/lib/registry/new-york/ui/sonner/Sonner.vue  | 5 ++++-
 apps/www/src/public/registry/styles/default/sonner.json  | 2 +-
 apps/www/src/public/registry/styles/new-york/sonner.json | 2 +-
 6 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/apps/www/.vitepress/theme/config/docs.ts b/apps/www/.vitepress/theme/config/docs.ts
index 646cc85a..4f69dc39 100644
--- a/apps/www/.vitepress/theme/config/docs.ts
+++ b/apps/www/.vitepress/theme/config/docs.ts
@@ -328,7 +328,6 @@ export const docsConfig: DocsConfig = {
         {
           title: 'Toast',
           href: '/docs/components/toast',
-          label: 'New',
           items: [],
         },
         {
diff --git a/apps/www/.vitepress/theme/layout/DocsLayout.vue b/apps/www/.vitepress/theme/layout/DocsLayout.vue
index 388301e0..e1da426b 100644
--- a/apps/www/.vitepress/theme/layout/DocsLayout.vue
+++ b/apps/www/.vitepress/theme/layout/DocsLayout.vue
@@ -46,7 +46,7 @@ const sourceLink = 'https://github.com/radix-vue/shadcn-vue/tree/dev/'
                 >
                   {{ doc.title }}
 
-                  <Badge v-if="doc.label" class="ml-2" :variant="'secondary'">
+                  <Badge v-if="doc.label" class="ml-2 rounded-md !bg-[#adfa1d] px-1.5 py-0.5 text-xs leading-none text-[#000000] no-underline group-hover:no-underline" variant="default">
                     {{ doc.label }}
                   </Badge>
                 </a>
diff --git a/apps/www/src/lib/registry/default/ui/sonner/Sonner.vue b/apps/www/src/lib/registry/default/ui/sonner/Sonner.vue
index 98201a1e..6545d331 100644
--- a/apps/www/src/lib/registry/default/ui/sonner/Sonner.vue
+++ b/apps/www/src/lib/registry/default/ui/sonner/Sonner.vue
@@ -1,7 +1,10 @@
 <script lang="ts" setup>
+import { useForwardProps } from 'radix-vue'
 import { Toaster as Sonner, type ToasterProps } from 'vue-sonner'
 
 const props = defineProps<ToasterProps>()
+
+const forwardedProps = useForwardProps(props)
 </script>
 
 <template>
@@ -16,6 +19,6 @@ const props = defineProps<ToasterProps>()
       cancelButton:
         'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',
     }"
-    v-bind="props"
+    v-bind="forwardedProps"
   />
 </template>
diff --git a/apps/www/src/lib/registry/new-york/ui/sonner/Sonner.vue b/apps/www/src/lib/registry/new-york/ui/sonner/Sonner.vue
index 98201a1e..6545d331 100644
--- a/apps/www/src/lib/registry/new-york/ui/sonner/Sonner.vue
+++ b/apps/www/src/lib/registry/new-york/ui/sonner/Sonner.vue
@@ -1,7 +1,10 @@
 <script lang="ts" setup>
+import { useForwardProps } from 'radix-vue'
 import { Toaster as Sonner, type ToasterProps } from 'vue-sonner'
 
 const props = defineProps<ToasterProps>()
+
+const forwardedProps = useForwardProps(props)
 </script>
 
 <template>
@@ -16,6 +19,6 @@ const props = defineProps<ToasterProps>()
       cancelButton:
         'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',
     }"
-    v-bind="props"
+    v-bind="forwardedProps"
   />
 </template>
diff --git a/apps/www/src/public/registry/styles/default/sonner.json b/apps/www/src/public/registry/styles/default/sonner.json
index 3a7620a0..2366527d 100644
--- a/apps/www/src/public/registry/styles/default/sonner.json
+++ b/apps/www/src/public/registry/styles/default/sonner.json
@@ -7,7 +7,7 @@
   "files": [
     {
       "name": "Sonner.vue",
-      "content": "<script lang=\"ts\" setup>\nimport { Toaster as Sonner, type ToasterProps } from 'vue-sonner'\n\nconst props = defineProps<ToasterProps>()\n</script>\n\n<template>\n  <Sonner\n    class=\"toaster group\"\n    :class-names=\"{\n      toast:\n        'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n      description: 'group-[.toast]:text-muted-foreground',\n      actionButton:\n        'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',\n      cancelButton:\n        'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',\n    }\"\n    v-bind=\"props\"\n  />\n</template>\n"
+      "content": "<script lang=\"ts\" setup>\nimport { useForwardProps } from 'radix-vue'\nimport { Toaster as Sonner, type ToasterProps } from 'vue-sonner'\n\nconst props = defineProps<ToasterProps>()\n\nconst forwardedProps = useForwardProps(props)\n</script>\n\n<template>\n  <Sonner\n    class=\"toaster group\"\n    :class-names=\"{\n      toast:\n        'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n      description: 'group-[.toast]:text-muted-foreground',\n      actionButton:\n        'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',\n      cancelButton:\n        'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',\n    }\"\n    v-bind=\"forwardedProps\"\n  />\n</template>\n"
     },
     {
       "name": "index.ts",
diff --git a/apps/www/src/public/registry/styles/new-york/sonner.json b/apps/www/src/public/registry/styles/new-york/sonner.json
index 3a7620a0..2366527d 100644
--- a/apps/www/src/public/registry/styles/new-york/sonner.json
+++ b/apps/www/src/public/registry/styles/new-york/sonner.json
@@ -7,7 +7,7 @@
   "files": [
     {
       "name": "Sonner.vue",
-      "content": "<script lang=\"ts\" setup>\nimport { Toaster as Sonner, type ToasterProps } from 'vue-sonner'\n\nconst props = defineProps<ToasterProps>()\n</script>\n\n<template>\n  <Sonner\n    class=\"toaster group\"\n    :class-names=\"{\n      toast:\n        'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n      description: 'group-[.toast]:text-muted-foreground',\n      actionButton:\n        'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',\n      cancelButton:\n        'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',\n    }\"\n    v-bind=\"props\"\n  />\n</template>\n"
+      "content": "<script lang=\"ts\" setup>\nimport { useForwardProps } from 'radix-vue'\nimport { Toaster as Sonner, type ToasterProps } from 'vue-sonner'\n\nconst props = defineProps<ToasterProps>()\n\nconst forwardedProps = useForwardProps(props)\n</script>\n\n<template>\n  <Sonner\n    class=\"toaster group\"\n    :class-names=\"{\n      toast:\n        'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n      description: 'group-[.toast]:text-muted-foreground',\n      actionButton:\n        'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',\n      cancelButton:\n        'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',\n    }\"\n    v-bind=\"forwardedProps\"\n  />\n</template>\n"
     },
     {
       "name": "index.ts",