feat: add button, input, label basic components

.eslintrc.cjs

@@ -6,6 +6,7 @@ module.exports = {
   extends: '@antfu',
 
   rules: {
+    'vue/no-reserved-component-names': 'off',
     'symbol-description': 'off',
     'no-console': 'warn',
     'no-tabs': 'off',

apps/www/package.json

@@ -26,6 +26,7 @@
     "clsx": "^2.0.0",
     "lucide-vue-next": "^0.268.0",
     "radix-vue": "file:../../../radix-vue/packages/radix-vue",
+    "tailwindcss-animate": "^1.0.6",
     "vue": "^3.3.4"
   },
   "devDependencies": {

apps/www/src/lib/registry/default/examples/AccordionDemo.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '../ui/accordion'
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/default/ui/accordion'
 
 const defaultValue = 'item-1'
 
@@ -32,4 +32,3 @@ const accordionItems = [
     </AccordionItem>
   </Accordion>
 </template>
-../ui/accordion

apps/www/src/lib/registry/default/examples/PopoverDemo.vue

@@ -3,15 +3,18 @@ import {
   Popover,
   PopoverContent,
   PopoverTrigger,
-} from '../ui/popover'
+} from '@/registry/default/ui/popover'
+import { Button } from '@/registry/default/ui/button'
+import { Label } from '@/registry/default/ui/label'
+import { Input } from '@/registry/default/ui/input'
 </script>
 
 <template>
   <Popover>
     <PopoverTrigger as-child>
-      <button>
+      <Button variant="outline">
         Open popover
-      </button>
+      </Button>
     </PopoverTrigger>
     <PopoverContent class="w-80" @open-auto-focus.prevent>
       <div class="grid gap-4">
@@ -25,40 +28,40 @@ import {
         </div>
         <div class="grid gap-2">
           <div class="grid grid-cols-3 items-center gap-4">
-            <label for="width">Width</label>
+            <Label for="width">Width</Label>
-            <input
+            <Input
               id="width"
               type="text"
               default-value="100%"
               class="col-span-2 h-8"
-            >
+            />
           </div>
           <div class="grid grid-cols-3 items-center gap-4">
-            <label for="maxWidth">Max. width</label>
+            <Label for="maxWidth">Max. width</Label>
-            <input
+            <Input
               id="maxWidth"
               type="text"
               default-value="300px"
               class="col-span-2 h-8"
-            >
+            />
           </div>
           <div class="grid grid-cols-3 items-center gap-4">
-            <label for="height">Height</label>
+            <Label for="height">Height</Label>
-            <input
+            <Input
               id="height"
               type="text"
               default-value="25px"
               class="col-span-2 h-8"
-            >
+            />
           </div>
           <div class="grid grid-cols-3 items-center gap-4">
-            <label for="maxHeight">Max. height</label>
+            <Label for="maxHeight">Max. height</Label>
-            <input
+            <Input
               id="maxHeight"
               type="text"
               default-value="none"
               class="col-span-2 h-8"
-            >
+            />
           </div>
         </div>
       </div>

apps/www/src/lib/registry/default/theme.ts

@@ -0,0 +1,636 @@
+export const themes = [
+  {
+    name: 'zinc',
+    label: 'Zinc',
+    activeColor: {
+      light: '240 5.9% 10%',
+      dark: '240 5.2% 33.9%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '240 10% 3.9%',
+        'card': '0 0% 100%',
+        'card-foreground': '240 10% 3.9%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '240 10% 3.9%',
+        'primary': '240 5.9% 10%',
+        'primary-foreground': '0 0% 98%',
+        'secondary': '240 4.8% 95.9%',
+        'secondary-foreground': '240 5.9% 10%',
+        'muted': '240 4.8% 95.9%',
+        'muted-foreground': '240 3.8% 46.1%',
+        'accent': '240 4.8% 95.9%',
+        'accent-foreground': '240 5.9% 10%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '0 0% 98%',
+        'border': '240 5.9% 90%',
+        'input': '240 5.9% 90%',
+        'ring': '240 5.9% 10%',
+        'radius': '0.5rem',
+      },
+      dark: {
+        'background': '240 10% 3.9%',
+        'foreground': '0 0% 98%',
+        'card': '240 10% 3.9%',
+        'card-foreground': '0 0% 98%',
+        'popover': '240 10% 3.9%',
+        'popover-foreground': '0 0% 98%',
+        'primary': '0 0% 98%',
+        'primary-foreground': '240 5.9% 10%',
+        'secondary': '240 3.7% 15.9%',
+        'secondary-foreground': '0 0% 98%',
+        'muted': '240 3.7% 15.9%',
+        'muted-foreground': '240 5% 64.9%',
+        'accent': '240 3.7% 15.9%',
+        'accent-foreground': '0 0% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '0 0% 98%',
+        'border': '240 3.7% 15.9%',
+        'input': '240 3.7% 15.9%',
+        'ring': '240 4.9% 83.9%',
+      },
+    },
+  },
+  {
+    name: 'slate',
+    label: 'Slate',
+    activeColor: {
+      light: '215.4 16.3% 46.9%',
+      dark: '215.3 19.3% 34.5%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '222.2 84% 4.9%',
+        'card': '0 0% 100%',
+        'card-foreground': '222.2 84% 4.9%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '222.2 84% 4.9%',
+        'primary': '222.2 47.4% 11.2%',
+        'primary-foreground': '210 40% 98%',
+        'secondary': '210 40% 96.1%',
+        'secondary-foreground': '222.2 47.4% 11.2%',
+        'muted': '210 40% 96.1%',
+        'muted-foreground': '215.4 16.3% 46.9%',
+        'accent': '210 40% 96.1%',
+        'accent-foreground': '222.2 47.4% 11.2%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '210 40% 98%',
+        'border': '214.3 31.8% 91.4%',
+        'input': '214.3 31.8% 91.4%',
+        'ring': '222.2 84% 4.9%',
+        'radius': '0.5rem',
+      },
+      dark: {
+        'background': '222.2 84% 4.9%',
+        'foreground': '210 40% 98%',
+        'card': '222.2 84% 4.9%',
+        'card-foreground': '210 40% 98%',
+        'popover': '222.2 84% 4.9%',
+        'popover-foreground': '210 40% 98%',
+        'primary': '210 40% 98%',
+        'primary-foreground': '222.2 47.4% 11.2%',
+        'secondary': '217.2 32.6% 17.5%',
+        'secondary-foreground': '210 40% 98%',
+        'muted': '217.2 32.6% 17.5%',
+        'muted-foreground': '215 20.2% 65.1%',
+        'accent': '217.2 32.6% 17.5%',
+        'accent-foreground': '210 40% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '210 40% 98%',
+        'border': '217.2 32.6% 17.5%',
+        'input': '217.2 32.6% 17.5%',
+        'ring': '212.7 26.8% 83.9',
+      },
+    },
+  },
+  {
+    name: 'stone',
+    label: 'Stone',
+    activeColor: {
+      light: '25 5.3% 44.7%',
+      dark: '33.3 5.5% 32.4%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '20 14.3% 4.1%',
+        'card': '0 0% 100%',
+        'card-foreground': '20 14.3% 4.1%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '20 14.3% 4.1%',
+        'primary': '24 9.8% 10%',
+        'primary-foreground': '60 9.1% 97.8%',
+        'secondary': '60 4.8% 95.9%',
+        'secondary-foreground': '24 9.8% 10%',
+        'muted': '60 4.8% 95.9%',
+        'muted-foreground': '25 5.3% 44.7%',
+        'accent': '60 4.8% 95.9%',
+        'accent-foreground': '24 9.8% 10%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '60 9.1% 97.8%',
+        'border': '20 5.9% 90%',
+        'input': '20 5.9% 90%',
+        'ring': '20 14.3% 4.1%',
+        'radius': '0.95rem',
+      },
+      dark: {
+        'background': '20 14.3% 4.1%',
+        'foreground': '60 9.1% 97.8%',
+        'card': '20 14.3% 4.1%',
+        'card-foreground': '60 9.1% 97.8%',
+        'popover': '20 14.3% 4.1%',
+        'popover-foreground': '60 9.1% 97.8%',
+        'primary': '60 9.1% 97.8%',
+        'primary-foreground': '24 9.8% 10%',
+        'secondary': '12 6.5% 15.1%',
+        'secondary-foreground': '60 9.1% 97.8%',
+        'muted': '12 6.5% 15.1%',
+        'muted-foreground': '24 5.4% 63.9%',
+        'accent': '12 6.5% 15.1%',
+        'accent-foreground': '60 9.1% 97.8%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '60 9.1% 97.8%',
+        'border': '12 6.5% 15.1%',
+        'input': '12 6.5% 15.1%',
+        'ring': '24 5.7% 82.9%',
+      },
+    },
+  },
+  {
+    name: 'gray',
+    label: 'Gray',
+    activeColor: {
+      light: '220 8.9% 46.1%',
+      dark: '215 13.8% 34.1%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '224 71.4% 4.1%',
+        'card': '0 0% 100%',
+        'card-foreground': '224 71.4% 4.1%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '224 71.4% 4.1%',
+        'primary': '220.9 39.3% 11%',
+        'primary-foreground': '210 20% 98%',
+        'secondary': '220 14.3% 95.9%',
+        'secondary-foreground': '220.9 39.3% 11%',
+        'muted': '220 14.3% 95.9%',
+        'muted-foreground': '220 8.9% 46.1%',
+        'accent': '220 14.3% 95.9%',
+        'accent-foreground': '220.9 39.3% 11%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '210 20% 98%',
+        'border': '220 13% 91%',
+        'input': '220 13% 91%',
+        'ring': '224 71.4% 4.1%',
+        'radius': '0.35rem',
+      },
+      dark: {
+        'background': '224 71.4% 4.1%',
+        'foreground': '210 20% 98%',
+        'card': '224 71.4% 4.1%',
+        'card-foreground': '210 20% 98%',
+        'popover': '224 71.4% 4.1%',
+        'popover-foreground': '210 20% 98%',
+        'primary': '210 20% 98%',
+        'primary-foreground': '220.9 39.3% 11%',
+        'secondary': '215 27.9% 16.9%',
+        'secondary-foreground': '210 20% 98%',
+        'muted': '215 27.9% 16.9%',
+        'muted-foreground': '217.9 10.6% 64.9%',
+        'accent': '215 27.9% 16.9%',
+        'accent-foreground': '210 20% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '210 20% 98%',
+        'border': '215 27.9% 16.9%',
+        'input': '215 27.9% 16.9%',
+        'ring': '216 12.2% 83.9%',
+      },
+    },
+  },
+  {
+    name: 'neutral',
+    label: 'Neutral',
+    activeColor: {
+      light: '0 0% 45.1%',
+      dark: '0 0% 32.2%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '0 0% 3.9%',
+        'card': '0 0% 100%',
+        'card-foreground': '0 0% 3.9%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '0 0% 3.9%',
+        'primary': '0 0% 9%',
+        'primary-foreground': '0 0% 98%',
+        'secondary': '0 0% 96.1%',
+        'secondary-foreground': '0 0% 9%',
+        'muted': '0 0% 96.1%',
+        'muted-foreground': '0 0% 45.1%',
+        'accent': '0 0% 96.1%',
+        'accent-foreground': '0 0% 9%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '0 0% 98%',
+        'border': '0 0% 89.8%',
+        'input': '0 0% 89.8%',
+        'ring': '0 0% 3.9%',
+      },
+      dark: {
+        'background': '0 0% 3.9%',
+        'foreground': '0 0% 98%',
+        'card': '0 0% 3.9%',
+        'card-foreground': '0 0% 98%',
+        'popover': '0 0% 3.9%',
+        'popover-foreground': '0 0% 98%',
+        'primary': '0 0% 98%',
+        'primary-foreground': '0 0% 9%',
+        'secondary': '0 0% 14.9%',
+        'secondary-foreground': '0 0% 98%',
+        'muted': '0 0% 14.9%',
+        'muted-foreground': '0 0% 63.9%',
+        'accent': '0 0% 14.9%',
+        'accent-foreground': '0 0% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '0 0% 98%',
+        'border': '0 0% 14.9%',
+        'input': '0 0% 14.9%',
+        'ring': '0 0% 83.1%',
+      },
+    },
+  },
+  {
+    name: 'red',
+    label: 'Red',
+    activeColor: {
+      light: '0 72.2% 50.6%',
+      dark: '0 72.2% 50.6%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '0 0% 3.9%',
+        'card': '0 0% 100%',
+        'card-foreground': '0 0% 3.9%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '0 0% 3.9%',
+        'primary': '0 72.2% 50.6%',
+        'primary-foreground': '0 85.7% 97.3%',
+        'secondary': '0 0% 96.1%',
+        'secondary-foreground': '0 0% 9%',
+        'muted': '0 0% 96.1%',
+        'muted-foreground': '0 0% 45.1%',
+        'accent': '0 0% 96.1%',
+        'accent-foreground': '0 0% 9%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '0 0% 98%',
+        'border': '0 0% 89.8%',
+        'input': '0 0% 89.8%',
+        'ring': '0 72.2% 50.6%',
+        'radius': '0.4rem',
+      },
+      dark: {
+        'background': '0 0% 3.9%',
+        'foreground': '0 0% 98%',
+        'card': '0 0% 3.9%',
+        'card-foreground': '0 0% 98%',
+        'popover': '0 0% 3.9%',
+        'popover-foreground': '0 0% 98%',
+        'primary': '0 72.2% 50.6%',
+        'primary-foreground': '0 85.7% 97.3%',
+        'secondary': '0 0% 14.9%',
+        'secondary-foreground': '0 0% 98%',
+        'muted': '0 0% 14.9%',
+        'muted-foreground': '0 0% 63.9%',
+        'accent': '0 0% 14.9%',
+        'accent-foreground': '0 0% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '0 0% 98%',
+        'border': '0 0% 14.9%',
+        'input': '0 0% 14.9%',
+        'ring': '0 72.2% 50.6%',
+      },
+    },
+  },
+  {
+    name: 'rose',
+    label: 'Rose',
+    activeColor: {
+      light: '346.8 77.2% 49.8%',
+      dark: '346.8 77.2% 49.8%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '240 10% 3.9%',
+        'card': '0 0% 100%',
+        'card-foreground': '240 10% 3.9%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '240 10% 3.9%',
+        'primary': '346.8 77.2% 49.8%',
+        'primary-foreground': '355.7 100% 97.3%',
+        'secondary': '240 4.8% 95.9%',
+        'secondary-foreground': '240 5.9% 10%',
+        'muted': '240 4.8% 95.9%',
+        'muted-foreground': '240 3.8% 46.1%',
+        'accent': '240 4.8% 95.9%',
+        'accent-foreground': '240 5.9% 10%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '0 0% 98%',
+        'border': '240 5.9% 90%',
+        'input': '240 5.9% 90%',
+        'ring': '346.8 77.2% 49.8%',
+        'radius': '0.5rem',
+      },
+      dark: {
+        'background': '20 14.3% 4.1%',
+        'foreground': '0 0% 95%',
+        'popover': '0 0% 9%',
+        'popover-foreground': '0 0% 95%',
+        'card': '24 9.8% 10%',
+        'card-foreground': '0 0% 95%',
+        'primary': '346.8 77.2% 49.8%',
+        'primary-foreground': '355.7 100% 97.3%',
+        'secondary': '240 3.7% 15.9%',
+        'secondary-foreground': '0 0% 98%',
+        'muted': '0 0% 15%',
+        'muted-foreground': '240 5% 64.9%',
+        'accent': '12 6.5% 15.1%',
+        'accent-foreground': '0 0% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '0 85.7% 97.3%',
+        'border': '240 3.7% 15.9%',
+        'input': '240 3.7% 15.9%',
+        'ring': '346.8 77.2% 49.8%',
+      },
+    },
+  },
+  {
+    name: 'orange',
+    label: 'Orange',
+    activeColor: {
+      light: '24.6 95% 53.1%',
+      dark: '20.5 90.2% 48.2%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '20 14.3% 4.1%',
+        'card': '0 0% 100%',
+        'card-foreground': '20 14.3% 4.1%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '20 14.3% 4.1%',
+        'primary': '24.6 95% 53.1%',
+        'primary-foreground': '60 9.1% 97.8%',
+        'secondary': '60 4.8% 95.9%',
+        'secondary-foreground': '24 9.8% 10%',
+        'muted': '60 4.8% 95.9%',
+        'muted-foreground': '25 5.3% 44.7%',
+        'accent': '60 4.8% 95.9%',
+        'accent-foreground': '24 9.8% 10%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '60 9.1% 97.8%',
+        'border': '20 5.9% 90%',
+        'input': '20 5.9% 90%',
+        'ring': '24.6 95% 53.1%',
+        'radius': '0.95rem',
+      },
+      dark: {
+        'background': '20 14.3% 4.1%',
+        'foreground': '60 9.1% 97.8%',
+        'card': '20 14.3% 4.1%',
+        'card-foreground': '60 9.1% 97.8%',
+        'popover': '20 14.3% 4.1%',
+        'popover-foreground': '60 9.1% 97.8%',
+        'primary': '20.5 90.2% 48.2%',
+        'primary-foreground': '60 9.1% 97.8%',
+        'secondary': '12 6.5% 15.1%',
+        'secondary-foreground': '60 9.1% 97.8%',
+        'muted': '12 6.5% 15.1%',
+        'muted-foreground': '24 5.4% 63.9%',
+        'accent': '12 6.5% 15.1%',
+        'accent-foreground': '60 9.1% 97.8%',
+        'destructive': '0 72.2% 50.6%',
+        'destructive-foreground': '60 9.1% 97.8%',
+        'border': '12 6.5% 15.1%',
+        'input': '12 6.5% 15.1%',
+        'ring': '20.5 90.2% 48.2%',
+      },
+    },
+  },
+  {
+    name: 'green',
+    label: 'Green',
+    activeColor: {
+      light: '142.1 76.2% 36.3%',
+      dark: '142.1 70.6% 45.3%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '240 10% 3.9%',
+        'card': '0 0% 100%',
+        'card-foreground': '240 10% 3.9%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '240 10% 3.9%',
+        'primary': '142.1 76.2% 36.3%',
+        'primary-foreground': '355.7 100% 97.3%',
+        'secondary': '240 4.8% 95.9%',
+        'secondary-foreground': '240 5.9% 10%',
+        'muted': '240 4.8% 95.9%',
+        'muted-foreground': '240 3.8% 46.1%',
+        'accent': '240 4.8% 95.9%',
+        'accent-foreground': '240 5.9% 10%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '0 0% 98%',
+        'border': '240 5.9% 90%',
+        'input': '240 5.9% 90%',
+        'ring': '142.1 76.2% 36.3%',
+      },
+      dark: {
+        'background': '20 14.3% 4.1%',
+        'foreground': '0 0% 95%',
+        'popover': '0 0% 9%',
+        'popover-foreground': '0 0% 95%',
+        'card': '24 9.8% 10%',
+        'card-foreground': '0 0% 95%',
+        'primary': '142.1 70.6% 45.3%',
+        'primary-foreground': '144.9 80.4% 10%',
+        'secondary': '240 3.7% 15.9%',
+        'secondary-foreground': '0 0% 98%',
+        'muted': '0 0% 15%',
+        'muted-foreground': '240 5% 64.9%',
+        'accent': '12 6.5% 15.1%',
+        'accent-foreground': '0 0% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '0 85.7% 97.3%',
+        'border': '240 3.7% 15.9%',
+        'input': '240 3.7% 15.9%',
+        'ring': '142.4 71.8% 29.2%',
+      },
+    },
+  },
+  {
+    name: 'blue',
+    label: 'Blue',
+    activeColor: {
+      light: '221.2 83.2% 53.3%',
+      dark: '217.2 91.2% 59.8%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '222.2 84% 4.9%',
+        'card': '0 0% 100%',
+        'card-foreground': '222.2 84% 4.9%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '222.2 84% 4.9%',
+        'primary': '221.2 83.2% 53.3%',
+        'primary-foreground': '210 40% 98%',
+        'secondary': '210 40% 96.1%',
+        'secondary-foreground': '222.2 47.4% 11.2%',
+        'muted': '210 40% 96.1%',
+        'muted-foreground': '215.4 16.3% 46.9%',
+        'accent': '210 40% 96.1%',
+        'accent-foreground': '222.2 47.4% 11.2%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '210 40% 98%',
+        'border': '214.3 31.8% 91.4%',
+        'input': '214.3 31.8% 91.4%',
+        'ring': '221.2 83.2% 53.3%',
+      },
+      dark: {
+        'background': '222.2 84% 4.9%',
+        'foreground': '210 40% 98%',
+        'card': '222.2 84% 4.9%',
+        'card-foreground': '210 40% 98%',
+        'popover': '222.2 84% 4.9%',
+        'popover-foreground': '210 40% 98%',
+        'primary': '217.2 91.2% 59.8%',
+        'primary-foreground': '222.2 47.4% 11.2%',
+        'secondary': '217.2 32.6% 17.5%',
+        'secondary-foreground': '210 40% 98%',
+        'muted': '217.2 32.6% 17.5%',
+        'muted-foreground': '215 20.2% 65.1%',
+        'accent': '217.2 32.6% 17.5%',
+        'accent-foreground': '210 40% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '210 40% 98%',
+        'border': '217.2 32.6% 17.5%',
+        'input': '217.2 32.6% 17.5%',
+        'ring': '224.3 76.3% 48%',
+      },
+    },
+  },
+  {
+    name: 'yellow',
+    label: 'Yellow',
+    activeColor: {
+      light: '47.9 95.8% 53.1%',
+      dark: '47.9 95.8% 53.1%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '20 14.3% 4.1%',
+        'card': '0 0% 100%',
+        'card-foreground': '20 14.3% 4.1%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '20 14.3% 4.1%',
+        'primary': '47.9 95.8% 53.1%',
+        'primary-foreground': '26 83.3% 14.1%',
+        'secondary': '60 4.8% 95.9%',
+        'secondary-foreground': '24 9.8% 10%',
+        'muted': '60 4.8% 95.9%',
+        'muted-foreground': '25 5.3% 44.7%',
+        'accent': '60 4.8% 95.9%',
+        'accent-foreground': '24 9.8% 10%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '60 9.1% 97.8%',
+        'border': '20 5.9% 90%',
+        'input': '20 5.9% 90%',
+        'ring': '20 14.3% 4.1%',
+        'radius': '0.95rem',
+      },
+      dark: {
+        'background': '20 14.3% 4.1%',
+        'foreground': '60 9.1% 97.8%',
+        'card': '20 14.3% 4.1%',
+        'card-foreground': '60 9.1% 97.8%',
+        'popover': '20 14.3% 4.1%',
+        'popover-foreground': '60 9.1% 97.8%',
+        'primary': '47.9 95.8% 53.1%',
+        'primary-foreground': '26 83.3% 14.1%',
+        'secondary': '12 6.5% 15.1%',
+        'secondary-foreground': '60 9.1% 97.8%',
+        'muted': '12 6.5% 15.1%',
+        'muted-foreground': '24 5.4% 63.9%',
+        'accent': '12 6.5% 15.1%',
+        'accent-foreground': '60 9.1% 97.8%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '60 9.1% 97.8%',
+        'border': '12 6.5% 15.1%',
+        'input': '12 6.5% 15.1%',
+        'ring': '35.5 91.7% 32.9%',
+      },
+    },
+  },
+  {
+    name: 'violet',
+    label: 'Violet',
+    activeColor: {
+      light: '262.1 83.3% 57.8%',
+      dark: '263.4 70% 50.4%',
+    },
+    cssVars: {
+      light: {
+        'background': '0 0% 100%',
+        'foreground': '224 71.4% 4.1%',
+        'card': '0 0% 100%',
+        'card-foreground': '224 71.4% 4.1%',
+        'popover': '0 0% 100%',
+        'popover-foreground': '224 71.4% 4.1%',
+        'primary': '262.1 83.3% 57.8%',
+        'primary-foreground': '210 20% 98%',
+        'secondary': '220 14.3% 95.9%',
+        'secondary-foreground': '220.9 39.3% 11%',
+        'muted': '220 14.3% 95.9%',
+        'muted-foreground': '220 8.9% 46.1%',
+        'accent': '220 14.3% 95.9%',
+        'accent-foreground': '220.9 39.3% 11%',
+        'destructive': '0 84.2% 60.2%',
+        'destructive-foreground': '210 20% 98%',
+        'border': '220 13% 91%',
+        'input': '220 13% 91%',
+        'ring': '262.1 83.3% 57.8%',
+      },
+      dark: {
+        'background': '224 71.4% 4.1%',
+        'foreground': '210 20% 98%',
+        'card': '224 71.4% 4.1%',
+        'card-foreground': '210 20% 98%',
+        'popover': '224 71.4% 4.1%',
+        'popover-foreground': '210 20% 98%',
+        'primary': '263.4 70% 50.4%',
+        'primary-foreground': '210 20% 98%',
+        'secondary': '215 27.9% 16.9%',
+        'secondary-foreground': '210 20% 98%',
+        'muted': '215 27.9% 16.9%',
+        'muted-foreground': '217.9 10.6% 64.9%',
+        'accent': '215 27.9% 16.9%',
+        'accent-foreground': '210 20% 98%',
+        'destructive': '0 62.8% 30.6%',
+        'destructive-foreground': '210 20% 98%',
+        'border': '215 27.9% 16.9%',
+        'input': '215 27.9% 16.9%',
+        'ring': '263.4 70% 50.4%',
+      },
+    },
+  },
+] as const
+
+export type Theme = (typeof themes)[number]

apps/www/src/lib/registry/default/ui/button.ts

@@ -0,0 +1,41 @@
+import { defineComponent, h } from 'vue'
+import { type VariantProps, cva } from 'class-variance-authority'
+import { cn } from '@/utils'
+
+export const buttonVariants = cva(
+  'inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
+  {
+    variants: {
+      variant: {
+        default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+        destructive:
+          'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+        outline:
+          'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
+        secondary:
+          'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+        ghost: 'hover:bg-accent hover:text-accent-foreground',
+        link: 'text-primary underline-offset-4 hover:underline',
+      },
+      size: {
+        default: 'h-10 px-4 py-2',
+        sm: 'h-9 rounded-md px-3',
+        lg: 'h-11 rounded-md px-8',
+        icon: 'h-10 w-10',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default',
+    },
+  },
+)
+
+interface ButtonProps extends VariantProps<typeof buttonVariants> {}
+
+export const Button = defineComponent<ButtonProps>(
+  (props, { attrs, slots }) => {
+    return () => h('button', { class: cn(buttonVariants(props), attrs.class ?? '') }, slots)
+  },
+  { name: 'Button', props: ['size', 'variant'] },
+)

apps/www/src/lib/registry/default/ui/input.ts

@@ -0,0 +1,11 @@
+import { defineComponent, h } from 'vue'
+import { cn } from '@/utils'
+
+export const Input = defineComponent(
+  (_props, { attrs, slots }) => {
+    return () => h('input',
+      { class: cn('flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50', attrs.class ?? '') },
+      slots)
+  },
+  { name: 'Input' },
+)

apps/www/src/lib/registry/default/ui/label.ts

@@ -0,0 +1,17 @@
+import { defineComponent, h } from 'vue'
+import { type VariantProps, cva } from 'class-variance-authority'
+import { type LabelProps } from 'radix-vue'
+import { cn } from '@/utils'
+
+export const labelVariants = cva(
+  'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
+)
+
+interface Props extends LabelProps, VariantProps<typeof labelVariants> {}
+
+export const Label = defineComponent<Props>(
+  (props, { attrs, slots }) => {
+    return () => h('label', { class: cn(labelVariants(), attrs.class ?? ''), ...props }, slots)
+  },
+  { name: 'Label' },
+)

apps/www/tailwind.config.js

@@ -1,5 +1,8 @@
+import tailwindcssAnimate from 'tailwindcss-animate'
+
 /** @type {import('tailwindcss').Config} */
 export default {
+  darkMode: ['class'],
   content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
   theme: {
     container: {
@@ -70,5 +73,5 @@ export default {
       },
     },
   },
-  plugins: [],
+  plugins: [tailwindcssAnimate],
 }

pnpm-lock.yaml

@@ -50,6 +50,9 @@ importers:
       radix-vue:
         specifier: file:../../../radix-vue/packages/radix-vue
         version: file:../radix-vue/packages/radix-vue(vue@3.3.4)
+      tailwindcss-animate:
+        specifier: ^1.0.6
+        version: 1.0.6(tailwindcss@3.3.2)
       vue:
         specifier: ^3.3.4
         version: 3.3.4
@@ -92,7 +95,6 @@ packages:
   /@alloc/quick-lru@5.2.0:
     resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
     engines: {node: '>=10'}
-    dev: true
 
   /@ampproject/remapping@2.2.1:
     resolution: {integrity: sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==}
@@ -579,7 +581,6 @@ packages:
     engines: {node: '>=12'}
     dependencies:
       '@jridgewell/trace-mapping': 0.3.9
-    dev: true
 
   /@esbuild/android-arm64@0.17.19:
     resolution: {integrity: sha512-KBMWvEZooR7+kzY0BtbTQn0OAYY7CsiydT63pVEaPtVYF0hXbUaOyZog37DKxK7NF3XacBJOpYT4adIJh+avxA==}
@@ -1010,19 +1011,15 @@ packages:
 
   /@tsconfig/node10@1.0.9:
     resolution: {integrity: sha512-jNsYVVxU8v5g43Erja32laIDHXeoNvFEpX33OK4d6hljo3jDhCBDhx5dhCCTMWUojscpAagGiRkBKxpdl9fxqA==}
-    dev: true
 
   /@tsconfig/node12@1.0.11:
     resolution: {integrity: sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==}
-    dev: true
 
   /@tsconfig/node14@1.0.3:
     resolution: {integrity: sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==}
-    dev: true
 
   /@tsconfig/node16@1.0.4:
     resolution: {integrity: sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==}
-    dev: true
 
   /@types/estree@1.0.1:
     resolution: {integrity: sha512-LG4opVs2ANWZ1TJoKc937iMmNstM/d0ae1vNbnBvBhqCSezgVUOzcLCqbI5elV8Vy6WKwKjaqR+zO9VKirBBCA==}
@@ -1044,7 +1041,6 @@ packages:
 
   /@types/node@20.4.7:
     resolution: {integrity: sha512-bUBrPjEry2QUTsnuEjzjbS7voGWCc30W0qzgMf90GPeDGFRakvrz47ju+oqDAKCXLUCe39u57/ORMl/O/04/9g==}
-    dev: true
 
   /@types/normalize-package-data@2.4.1:
     resolution: {integrity: sha512-Gj7cI7z+98M282Tqmp2K5EIsoouUEzbBJhQQzDE3jSIRk6r9gsz0oUokqIUR4u1R3dMHo0pDHM7sNOHyhulypw==}
@@ -1364,7 +1360,6 @@ packages:
   /acorn-walk@8.2.0:
     resolution: {integrity: sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==}
     engines: {node: '>=0.4.0'}
-    dev: true
 
   /acorn@8.10.0:
     resolution: {integrity: sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==}
@@ -1441,7 +1436,6 @@ packages:
 
   /any-promise@1.3.0:
     resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
-    dev: true
 
   /anymatch@3.1.3:
     resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
@@ -1452,11 +1446,9 @@ packages:
 
   /arg@4.1.3:
     resolution: {integrity: sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==}
-    dev: true
 
   /arg@5.0.2:
     resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
-    dev: true
 
   /argparse@2.0.1:
     resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
@@ -1549,7 +1541,6 @@ packages:
 
   /balanced-match@1.0.2:
     resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
-    dev: true
 
   /binary-extensions@2.2.0:
     resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
@@ -1564,7 +1555,6 @@ packages:
     dependencies:
       balanced-match: 1.0.2
       concat-map: 0.0.1
-    dev: true
 
   /brace-expansion@2.0.1:
     resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==}
@@ -1632,7 +1622,6 @@ packages:
   /camelcase-css@2.0.1:
     resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
     engines: {node: '>= 6'}
-    dev: true
 
   /camelcase-keys@6.2.2:
     resolution: {integrity: sha512-YrwaA0vEKazPBkn0ipTiMpSajYDSe+KjQfrjhcBMxJt/znbvlHd8Pw/Vamaz5EB4Wfhs3SUR3Z9mwRu/P3s3Yg==}
@@ -1785,7 +1774,6 @@ packages:
   /commander@4.1.1:
     resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
     engines: {node: '>= 6'}
-    dev: true
 
   /compare-func@2.0.0:
     resolution: {integrity: sha512-zHig5N+tPWARooBnb0Zx1MFcdfpyJrfTJ3Y5L+IFvUm8rM74hHz66z0gw0x4tijh5CorKkKUCnW82R2vmpeCRA==}
@@ -1796,7 +1784,6 @@ packages:
 
   /concat-map@0.0.1:
     resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
-    dev: true
 
   /consola@3.2.3:
     resolution: {integrity: sha512-I5qxpzLv+sJhTVEoLYNcTW+bThDCPsit0vLNKShZx6rLtpilNpmmeTPaeqJb9ZE9dV3DGaeby6Vuhrw38WjeyQ==}
@@ -1863,7 +1850,6 @@ packages:
 
   /create-require@1.1.1:
     resolution: {integrity: sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==}
-    dev: true
 
   /cross-spawn@7.0.3:
     resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
@@ -1878,7 +1864,6 @@ packages:
     resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
     engines: {node: '>=4'}
     hasBin: true
-    dev: true
 
   /csstype@3.1.2:
     resolution: {integrity: sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==}
@@ -1949,12 +1934,10 @@ packages:
 
   /didyoumean@1.2.2:
     resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
-    dev: true
 
   /diff@4.0.2:
     resolution: {integrity: sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==}
     engines: {node: '>=0.3.1'}
-    dev: true
 
   /dir-glob@3.0.1:
     resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
@@ -1964,7 +1947,6 @@ packages:
 
   /dlv@1.1.3:
     resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==}
-    dev: true
 
   /doctrine@2.1.0:
     resolution: {integrity: sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==}
@@ -2276,7 +2258,7 @@ packages:
       minimatch: 3.1.2
       object.values: 1.1.6
       resolve: 1.22.4
-      semver: 6.3.0
+      semver: 6.3.1
     transitivePeerDependencies:
       - '@typescript-eslint/parser'
       - eslint-import-resolver-typescript
@@ -2709,7 +2691,6 @@ packages:
 
   /fs.realpath@1.0.0:
     resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
-    dev: true
 
   /fsevents@2.3.3:
     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
@@ -2720,7 +2701,6 @@ packages:
 
   /function-bind@1.1.1:
     resolution: {integrity: sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==}
-    dev: true
 
   /function.prototype.name@1.1.5:
     resolution: {integrity: sha512-uN7m/BzVKQnCUF/iW8jYea67v++2u7m5UgENbHRtdDVclOUP+FMPlCNdmk0h/ysGyo2tavMJEDqJAkJdRa1vMA==}
@@ -2812,7 +2792,6 @@ packages:
     engines: {node: '>=10.13.0'}
     dependencies:
       is-glob: 4.0.3
-    dev: true
 
   /glob@7.1.6:
     resolution: {integrity: sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==}
@@ -2823,7 +2802,6 @@ packages:
       minimatch: 3.1.2
       once: 1.4.0
       path-is-absolute: 1.0.1
-    dev: true
 
   /global-dirs@0.1.1:
     resolution: {integrity: sha512-NknMLn7F2J7aflwFOlGdNIuCDpN3VGoSoB+aap3KABFWbHVn1TCgFC+np23J8W2BiZbjfEw3BFBycSMv1AFblg==}
@@ -2933,7 +2911,6 @@ packages:
     engines: {node: '>= 0.4.0'}
     dependencies:
       function-bind: 1.1.1
-    dev: true
 
   /hash-sum@2.0.0:
     resolution: {integrity: sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==}
@@ -3015,7 +2992,6 @@ packages:
     dependencies:
       once: 1.4.0
       wrappy: 1.0.2
-    dev: true
 
   /inherits@2.0.4:
     resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
@@ -3098,7 +3074,6 @@ packages:
     resolution: {integrity: sha512-Z7dk6Qo8pOCp3l4tsX2C5ZVas4V+UxwQodwZhLopL91TX8UyyHEXafPcyoeeWuLrwzHcr3igO78wNLwHJHsMCQ==}
     dependencies:
       has: 1.0.3
-    dev: true
 
   /is-date-object@1.0.5:
     resolution: {integrity: sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==}
@@ -3336,11 +3311,9 @@ packages:
   /lilconfig@2.1.0:
     resolution: {integrity: sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==}
     engines: {node: '>=10'}
-    dev: true
 
   /lines-and-columns@1.2.4:
     resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
-    dev: true
 
   /lint-staged@14.0.0:
     resolution: {integrity: sha512-0tLf0pqZYkar/wu3nTctk4rVIG+d7PanDYv4/IQR4qwdqfQkTDziLRFnqMcLuLBTuUqmcLwsHPD2EjQ18d/oaA==}
@@ -3480,7 +3453,6 @@ packages:
 
   /make-error@1.3.6:
     resolution: {integrity: sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==}
-    dev: true
 
   /map-obj@1.0.1:
     resolution: {integrity: sha512-7N/q3lyZ+LVCp7PzuxrJr4KMbBE2hW7BT7YNia330OFxIf4d3r5zVpicP2650l7CPN6RM9zOJRl3NGpqSiw3Eg==}
@@ -3576,7 +3548,6 @@ packages:
     resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
     dependencies:
       brace-expansion: 1.1.11
-    dev: true
 
   /minimatch@9.0.3:
     resolution: {integrity: sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==}
@@ -3651,7 +3622,6 @@ packages:
       any-promise: 1.3.0
       object-assign: 4.1.1
       thenify-all: 1.6.0
-    dev: true
 
   /nanoid@3.3.6:
     resolution: {integrity: sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==}
@@ -3724,12 +3694,10 @@ packages:
   /object-assign@4.1.1:
     resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
     engines: {node: '>=0.10.0'}
-    dev: true
 
   /object-hash@3.0.0:
     resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==}
     engines: {node: '>= 6'}
-    dev: true
 
   /object-inspect@1.12.3:
     resolution: {integrity: sha512-geUvdk7c+eizMNUDkRpW1wJwgfOiOeHbxBR/hLXK1aT6zmVSO0jsQcs7fj6MGw89jC/cjGfLcNOrtMYtGqm81g==}
@@ -3767,7 +3735,6 @@ packages:
     resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
     dependencies:
       wrappy: 1.0.2
-    dev: true
 
   /onetime@5.1.2:
     resolution: {integrity: sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==}
@@ -3864,7 +3831,6 @@ packages:
   /path-is-absolute@1.0.1:
     resolution: {integrity: sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==}
     engines: {node: '>=0.10.0'}
-    dev: true
 
   /path-key@3.1.1:
     resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
@@ -3878,7 +3844,6 @@ packages:
 
   /path-parse@1.0.7:
     resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
-    dev: true
 
   /path-type@4.0.0:
     resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
@@ -3908,12 +3873,10 @@ packages:
   /pify@2.3.0:
     resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
     engines: {node: '>=0.10.0'}
-    dev: true
 
   /pirates@4.0.6:
     resolution: {integrity: sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==}
     engines: {node: '>= 6'}
-    dev: true
 
   /pkg-types@1.0.3:
     resolution: {integrity: sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==}
@@ -3950,7 +3913,6 @@ packages:
       postcss-value-parser: 4.2.0
       read-cache: 1.0.0
       resolve: 1.22.4
-    dev: true
 
   /postcss-js@4.0.1(postcss@8.4.24):
     resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
@@ -3960,7 +3922,6 @@ packages:
     dependencies:
       camelcase-css: 2.0.1
       postcss: 8.4.24
-    dev: true
 
   /postcss-load-config@4.0.1(postcss@8.4.24)(ts-node@10.9.1):
     resolution: {integrity: sha512-vEJIc8RdiBRu3oRAI0ymerOn+7rPuMvRXslTvZUKZonDHFIczxztIyJ1urxM1x9JXEikvpWWTUUqal5j/8QgvA==}
@@ -3978,7 +3939,6 @@ packages:
       postcss: 8.4.24
       ts-node: 10.9.1(@types/node@20.4.7)(typescript@5.0.2)
       yaml: 2.3.1
-    dev: true
 
   /postcss-nested@6.0.1(postcss@8.4.24):
     resolution: {integrity: sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==}
@@ -3988,7 +3948,6 @@ packages:
     dependencies:
       postcss: 8.4.24
       postcss-selector-parser: 6.0.13
-    dev: true
 
   /postcss-selector-parser@6.0.13:
     resolution: {integrity: sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==}
@@ -3996,11 +3955,9 @@ packages:
     dependencies:
       cssesc: 3.0.0
       util-deprecate: 1.0.2
-    dev: true
 
   /postcss-value-parser@4.2.0:
     resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
-    dev: true
 
   /postcss@8.4.24:
     resolution: {integrity: sha512-M0RzbcI0sO/XJNucsGjvWU9ERWxb/ytp1w6dKtxTKgixdtQDq4rmx/g8W1hnaheq9jgwL/oyEdH5Bc4WwJKMqg==}
@@ -4048,7 +4005,6 @@ packages:
     resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
     dependencies:
       pify: 2.3.0
-    dev: true
 
   /read-pkg-up@7.0.1:
     resolution: {integrity: sha512-zK0TB7Xd6JpCLmlLmufqykGE+/TlOePD6qKClNW7hHDKFh/J7/7gCWGR7joEQEW1bKq3a3yUZSObOoWLFQ4ohg==}
@@ -4172,7 +4128,6 @@ packages:
       is-core-module: 2.13.0
       path-parse: 1.0.7
       supports-preserve-symlinks-flag: 1.0.0
-    dev: true
 
   /restore-cursor@4.0.0:
     resolution: {integrity: sha512-I9fPXU9geO9bHOt9pHHOhOkYerIMsmVaWB0rA2AI9ERh/+x/i7MV5HKBNrg+ljO5eoPVgCcnFuRjJ9uH6I/3eg==}
@@ -4246,15 +4201,9 @@ packages:
     hasBin: true
     dev: true
 
-  /semver@6.3.0:
-    resolution: {integrity: sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==}
-    hasBin: true
-    dev: true
-
   /semver@6.3.1:
     resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
     hasBin: true
-    dev: false
 
   /semver@7.5.3:
     resolution: {integrity: sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ==}
@@ -4462,7 +4411,6 @@ packages:
       mz: 2.7.0
       pirates: 4.0.6
       ts-interface-checker: 0.1.13
-    dev: true
 
   /supports-color@5.5.0:
     resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
@@ -4480,12 +4428,19 @@ packages:
   /supports-preserve-symlinks-flag@1.0.0:
     resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
     engines: {node: '>= 0.4'}
-    dev: true
 
   /tailwind-merge@1.14.0:
     resolution: {integrity: sha512-3mFKyCo/MBcgyOTlrY8T7odzZFx+w+qKSMAmdFzRvqBfLlSigU6TZnlFHK0lkMwj9Bj8OYU+9yW9lmGuS0QEnQ==}
     dev: true
 
+  /tailwindcss-animate@1.0.6(tailwindcss@3.3.2):
+    resolution: {integrity: sha512-4WigSGMvbl3gCCact62ZvOngA+PRqhAn7si3TQ3/ZuPuQZcIEtVap+ENSXbzWhpojKB8CpvnIsrwBu8/RnHtuw==}
+    peerDependencies:
+      tailwindcss: '>=3.0.0 || insiders'
+    dependencies:
+      tailwindcss: 3.3.2(ts-node@10.9.1)
+    dev: false
+
   /tailwindcss@3.3.2(ts-node@10.9.1):
     resolution: {integrity: sha512-9jPkMiIBXvPc2KywkraqsUfbfj+dHDb+JPWtSJa9MLFdrPyazI7q6WX2sUrm7R9eVR7qqv3Pas7EvQFzxKnI6w==}
     engines: {node: '>=14.0.0'}
@@ -4516,7 +4471,6 @@ packages:
       sucrase: 3.34.0
     transitivePeerDependencies:
       - ts-node
-    dev: true
 
   /tapable@1.1.3:
     resolution: {integrity: sha512-4WK/bYZmj8xLr+HUCODHGF1ZFzsYffasLUgEiMBY4fgtltdO6B4WJtlSbPaDTLpYTcGVwM2qLnFTICEcNxs3kA==}
@@ -4549,13 +4503,11 @@ packages:
     engines: {node: '>=0.8'}
     dependencies:
       thenify: 3.3.1
-    dev: true
 
   /thenify@3.3.1:
     resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==}
     dependencies:
       any-promise: 1.3.0
-    dev: true
 
   /through2@4.0.2:
     resolution: {integrity: sha512-iOqSav00cVxEEICeD7TjLB1sueEL+81Wpzp2bY17uZjZN0pWZPuo4suZ/61VujxmqSGFfgOcNuTZ85QJwNZQpw==}
@@ -4584,7 +4536,6 @@ packages:
 
   /ts-interface-checker@0.1.13:
     resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
-    dev: true
 
   /ts-node@10.9.1(@types/node@20.4.7)(typescript@5.0.2):
     resolution: {integrity: sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==}
@@ -4615,7 +4566,6 @@ packages:
       typescript: 5.0.2
       v8-compile-cache-lib: 3.0.1
       yn: 3.1.1
-    dev: true
 
   /tslib@1.14.1:
     resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==}
@@ -4710,7 +4660,6 @@ packages:
     resolution: {integrity: sha512-wVORMBGO/FAs/++blGNeAVdbNKtIh1rbBL2EyQ1+J9lClJ93KiiKe8PmFIVdXhHcyv44SL9oglmfeSsndo0jRw==}
     engines: {node: '>=12.20'}
     hasBin: true
-    dev: true
 
   /ufo@1.2.0:
     resolution: {integrity: sha512-RsPyTbqORDNDxqAdQPQBpgqhWle1VcTSou/FraClYlHf6TZnQcGslpLcAphNR+sQW4q5lLWLbOsRlh9j24baQg==}
@@ -4808,7 +4757,6 @@ packages:
 
   /v8-compile-cache-lib@3.0.1:
     resolution: {integrity: sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==}
-    dev: true
 
   /validate-npm-package-license@3.0.4:
     resolution: {integrity: sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==}
@@ -4969,7 +4917,6 @@ packages:
 
   /wrappy@1.0.2:
     resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
-    dev: true
 
   /xml-name-validator@4.0.0:
     resolution: {integrity: sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==}
@@ -5000,7 +4947,6 @@ packages:
   /yaml@2.3.1:
     resolution: {integrity: sha512-2eHWfjaoXgTBC2jNM1LRef62VQa0umtvRiDSk6HSzW7RvS5YtkabJrwYLLEKWBc8a5U2PTSCs+dJjUTJdlHsWQ==}
     engines: {node: '>= 14'}
-    dev: true
 
   /yargs-parser@20.2.9:
     resolution: {integrity: sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==}
@@ -5028,7 +4974,6 @@ packages:
   /yn@3.1.1:
     resolution: {integrity: sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==}
     engines: {node: '>=6'}
-    dev: true
 
   /yocto-queue@0.1.0:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}