From 925aeb43d709d6fb3c3d04206f6eff39db83492a Mon Sep 17 00:00:00 2001
From: zernonia <zernonia@gmail.com>
Date: Tue, 24 Oct 2023 20:09:07 +0800
Subject: [PATCH] chore: update component preview

---
 .../.vitepress/theme/components/ComponentPreview.vue |  8 ++++++--
 apps/www/src/content/docs/components/accordion.md    |  2 +-
 apps/www/src/content/docs/components/input.md        | 12 ++++++------
 apps/www/src/content/docs/components/textarea.md     |  2 +-
 4 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/apps/www/.vitepress/theme/components/ComponentPreview.vue b/apps/www/.vitepress/theme/components/ComponentPreview.vue
index ed37d250..8653daa9 100644
--- a/apps/www/.vitepress/theme/components/ComponentPreview.vue
+++ b/apps/www/.vitepress/theme/components/ComponentPreview.vue
@@ -7,7 +7,11 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/lib/registry/default
 import { useConfigStore } from '@/stores/config'
 import { cn } from '@/lib/utils'
 
-const props = withDefaults(defineProps<{
+defineOptions({
+  inheritAttrs: false,
+})
+
+withDefaults(defineProps<{
   name: string
   align?: 'center' | 'start' | 'end'
   sfcTsCode?: string
@@ -54,7 +58,7 @@ const { style } = useConfigStore()
             'items-end': align === 'end',
           })"
         >
-          <ComponentLoader :key="style" :name="name" />
+          <ComponentLoader v-bind="$attrs" :key="style" :name="name" />
         </div>
       </TabsContent>
       <TabsContent value="code">
diff --git a/apps/www/src/content/docs/components/accordion.md b/apps/www/src/content/docs/components/accordion.md
index a2f6b862..451ab1d9 100644
--- a/apps/www/src/content/docs/components/accordion.md
+++ b/apps/www/src/content/docs/components/accordion.md
@@ -6,7 +6,7 @@ primitive: https://www.radix-vue.com/components/accordion.html
 ---
 
 
-<ComponentPreview name="AccordionDemo" class="[&_.accordion]:sm:max-w-[70%]" />
+<ComponentPreview name="AccordionDemo" class="sm:max-w-[70%]" />
 
 ## Installation
  
diff --git a/apps/www/src/content/docs/components/input.md b/apps/www/src/content/docs/components/input.md
index 6c120676..d1614790 100644
--- a/apps/www/src/content/docs/components/input.md
+++ b/apps/www/src/content/docs/components/input.md
@@ -4,7 +4,7 @@ description: Displays a form input field or a component that looks like an input
 ---
 
 
-<ComponentPreview name="InputDemo" class="[&_input]:max-w-xs" /> 
+<ComponentPreview name="InputDemo" class="max-w-xs" /> 
 
 ## Installation
 
@@ -45,23 +45,23 @@ import { Input } from '@/components/ui/input'
 
 ### Default
 
-<ComponentPreview name="InputDemo" class="[&_input]:max-w-xs" />
+<ComponentPreview name="InputDemo" class="max-w-xs" />
 
 ### File
 
-<ComponentPreview name="InputFile" class="[&_input]:max-w-xs" />
+<ComponentPreview name="InputFile" class="max-w-xs" />
 
 ### Disabled
 
-<ComponentPreview name="InputDisabled" class="[&_input]:max-w-xs" />
+<ComponentPreview name="InputDisabled" class="max-w-xs" />
 
 ### With Label
 
-<ComponentPreview name="InputWithLabel" class="[&_input]:max-w-xs" />
+<ComponentPreview name="InputWithLabel" class="max-w-xs" />
 
 ### With Button
 
-<ComponentPreview name="InputWithButton" class="[&_input]:max-w-xs" />
+<ComponentPreview name="InputWithButton" class="max-w-xs" />
 
 ### Form
 
diff --git a/apps/www/src/content/docs/components/textarea.md b/apps/www/src/content/docs/components/textarea.md
index 24b31da8..930a7762 100644
--- a/apps/www/src/content/docs/components/textarea.md
+++ b/apps/www/src/content/docs/components/textarea.md
@@ -59,7 +59,7 @@ import { Textarea } from '@/components/ui/textarea'
 
 ### With Label
 
-<ComponentPreview name="TextareaWithLabel" className="[&_div.grid]:w-full" />
+<ComponentPreview name="TextareaWithLabel"   />
 
 ### With Text