chore: bump Radix Vue v1 (#139)

* refactor: apply all v1 changes

* chore: bump radix-vue version

* chore: remove WIP

* chore: update component preview

* chore: fix old pnpm lock

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">

apps/www/.vitepress/theme/components/LandingPage.vue

@@ -16,12 +16,12 @@ import DashboardExample from '@/examples/dashboard/Example.vue'
 <template>
   <PageHeader class="page-header pb-8">
     <a
-      href="/docs/changelog"
+      href="/docs/components/form"
       class="inline-flex items-center rounded-lg bg-muted px-3 py-1 text-sm font-medium"
     >
-      🚧   <Separator class="mx-2 h-4" orientation="vertical" />
+      🎉   <Separator class="mx-2 h-4" orientation="vertical" />
-      <span class="sm:hidden">WIP</span>
+      <span class="sm:hidden">New form & pagination component</span>
-      <span class="hidden sm:inline">WIP
+      <span class="hidden sm:inline">New form & pagination component
       </span>
       <!-- <ArrowRightIcon class="ml-1 h-4 w-4" /> -->
     </a>

apps/www/.vitepress/theme/layout/ExamplesLayout.vue

@@ -14,13 +14,13 @@ import { cn } from '@/lib/utils'
   <div class="container relative">
     <PageHeader class="page-header pb-8">
       <a
-        href="/docs/changelog"
+        href="/docs/components/form"
         class="inline-flex items-center rounded-lg bg-muted px-3 py-1 text-sm font-medium"
       >
         🎉 <Separator class="mx-2 h-4" orientation="vertical" />
-        <span class="sm:hidden">Style, a new CLI and more.</span>
+        <span class="sm:hidden">New form & pagination component</span>
         <span class="hidden sm:inline">
-          Introducing Style, a new CLI and more.
+          New form & pagination component
         </span>
         <ArrowRightIcon class="ml-1 h-4 w-4" />
       </a>

apps/www/package.json

@@ -26,7 +26,7 @@
     "codesandbox": "^2.2.3",
     "date-fns": "^2.30.0",
     "lucide-vue-next": "^0.276.0",
-    "radix-vue": "^0.4.1",
+    "radix-vue": "^1.0.0",
     "tailwindcss-animate": "^1.0.7",
     "v-calendar": "^3.1.2",
     "vee-validate": "4.11.8",
@@ -47,6 +47,7 @@
     "@vue/compiler-dom": "^3.3.6",
     "autoprefixer": "^10.4.16",
     "lodash.template": "^4.5.0",
+    "radix-vue": "^1.0.0",
     "rimraf": "^5.0.5",
     "tailwind-merge": "^1.14.0",
     "tailwindcss": "^3.3.3",

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
  

apps/www/src/content/docs/components/combobox.md

@@ -96,9 +96,9 @@ const value = ref({})
 
 <ComponentPreview name="ComboboxPopover" />
 
-<!-- ### Dropdown menu
+### Dropdown menu
 
-<ComponentPreview name="ComboboxDropdownMenu" /> -->
+<ComponentPreview name="ComboboxDropdownMenu" />
 
 ### Form
 

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
 

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
 

apps/www/src/lib/registry/default/example/ComboboxDemo.vue

@@ -45,7 +45,7 @@ const filterFunction = (list: typeof frameworks, search: string) => list.filter(
       </Button>
     </PopoverTrigger>
     <PopoverContent class="w-[200px] p-0">
-      <Command v-model="value" :filter-function="filterFunction">
+      <Command :filter-function="filterFunction">
         <CommandInput placeholder="Search framework..." />
         <CommandEmpty>No framework found.</CommandEmpty>
         <CommandGroup>
@@ -53,7 +53,10 @@ const filterFunction = (list: typeof frameworks, search: string) => list.filter(
             v-for="framework in frameworks"
             :key="framework.value"
             :value="framework"
-            @select="open = false"
+            @select="(ev) => {
+              value = ev.detail.value as typeof framework
+              open = false
+            }"
           >
             <Check
               :class="cn(

apps/www/src/lib/registry/default/example/ComboboxDropdownMenu.vue

@@ -47,7 +47,7 @@ const open = ref(false)
       </span>
       <span class="text-muted-foreground">Create a new project</span>
     </p>
-    <DropdownMenu :open="open">
+    <DropdownMenu v-model:open="open">
       <DropdownMenuTrigger as-child>
         <Button variant="ghost" size="sm">
           <MoreHorizontal />
@@ -83,8 +83,8 @@ const open = ref(false)
                       v-for="label in labels"
                       :key="label"
                       :value="label"
-                      @select="(value) => {
+                      @select="(ev) => {
-                        labelRef = value as string
+                        labelRef = ev.detail.value as string
                         open = false
                       }"
                     >

apps/www/src/lib/registry/default/example/ContextMenuDemo.vue

@@ -56,7 +56,7 @@ import {
       </ContextMenuCheckboxItem>
       <ContextMenuCheckboxItem>Show Full URLs</ContextMenuCheckboxItem>
       <ContextMenuSeparator />
-      <ContextMenuRadioGroup value="pedro">
+      <ContextMenuRadioGroup model-value="pedro">
         <ContextMenuLabel inset>
           People
         </ContextMenuLabel>

apps/www/src/lib/registry/default/example/DialogDemo.vue

@@ -20,7 +20,7 @@ import { Label } from '@/lib/registry/default/ui/label'
         Edit Profile
       </Button>
     </DialogTrigger>
-    <DialogContent class="sm:max-w-[425px]" @escape-key-down.prevent>
+    <DialogContent class="sm:max-w-[425px]">
       <DialogHeader>
         <DialogTitle>Edit profile</DialogTitle>
         <DialogDescription>

apps/www/src/lib/registry/default/ui/accordion/Accordion.vue

@@ -11,7 +11,7 @@ const emits = defineEmits<AccordionRootEmits>()
 </script>
 
 <template>
-  <AccordionRoot v-bind="{ ...props, ...useEmitAsProps(emits) }" class="accordion">
+  <AccordionRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
     <slot />
   </AccordionRoot>
 </template>

apps/www/src/lib/registry/default/ui/alert-dialog/AlertDialog.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot, useEmitAsProps } from 'radix-vue'
+import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot, useForwardPropsEmits } from 'radix-vue'
 
 const props = defineProps<AlertDialogProps>()
 const emits = defineEmits<AlertDialogEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <AlertDialogRoot v-bind="{ ...props, ...emitsAsProps }">
+  <AlertDialogRoot v-bind="forwarded">
     <slot />
   </AlertDialogRoot>
 </template>

apps/www/src/lib/registry/default/ui/checkbox/Checkbox.vue

@@ -1,18 +1,18 @@
 <script setup lang="ts">
 import type { CheckboxRootEmits, CheckboxRootProps } from 'radix-vue'
-import { CheckboxIndicator, CheckboxRoot, useEmitAsProps } from 'radix-vue'
+import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from 'radix-vue'
 import { Check } from 'lucide-vue-next'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<CheckboxRootProps>()
 const emits = defineEmits<CheckboxRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
   <CheckboxRoot
-    v-bind="{ ...props, ...emitsAsProps }"
+    v-bind="forwarded"
     :class="
       cn('peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground',
          $attrs.class ?? '')"

apps/www/src/lib/registry/default/ui/collapsible/CollapsibleContent.vue

@@ -5,7 +5,7 @@ const props = defineProps<CollapsibleContentProps>()
 </script>
 
 <template>
-  <CollapsibleContent v-bind="props">
+  <CollapsibleContent v-bind="props" class="overflow-hidden transition-all data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down">
     <slot />
   </CollapsibleContent>
 </template>

apps/www/src/lib/registry/default/ui/command/Command.vue

@@ -1,17 +1,17 @@
 <script setup lang="ts">
 import type { ComboboxRootEmits, ComboboxRootProps } from 'radix-vue'
-import { ComboboxRoot, useEmitAsProps } from 'radix-vue'
+import { ComboboxRoot, useForwardPropsEmits } from 'radix-vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<ComboboxRootProps>()
 const emits = defineEmits<ComboboxRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
   <ComboboxRoot
-    v-bind="{ ...props, ...emitsAsProps }"
+    v-bind="forwarded"
     :open="true"
     :model-value="''"
     :class="cn('flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground', $attrs.class ?? '')"

apps/www/src/lib/registry/default/ui/command/CommandItem.vue

@@ -13,6 +13,7 @@ const emitsAsProps = useEmitAsProps(emits)
   <ComboboxItem
     v-bind="{ ...props, ...emitsAsProps }"
     :class="cn('relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', $attrs.class ?? '')"
+    @select.prevent
   >
     <slot />
   </ComboboxItem>

apps/www/src/lib/registry/default/ui/context-menu/ContextMenu.vue

@@ -1,13 +1,15 @@
 <script setup lang="ts">
-import { ContextMenuRoot, useEmitAsProps } from 'radix-vue'
+import { ContextMenuRoot, useForwardPropsEmits } from 'radix-vue'
 import type { ContextMenuRootEmits, ContextMenuRootProps } from 'radix-vue'
 
 const props = defineProps<ContextMenuRootProps>()
 const emits = defineEmits<ContextMenuRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <ContextMenuRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
+  <ContextMenuRoot v-bind="forwarded">
     <slot />
   </ContextMenuRoot>
 </template>

apps/www/src/lib/registry/default/ui/context-menu/ContextMenuRadioGroup.vue

@@ -3,18 +3,17 @@ import {
   ContextMenuRadioGroup,
   type ContextMenuRadioGroupEmits,
   type ContextMenuRadioGroupProps,
+  useForwardPropsEmits,
 } from 'radix-vue'
 
 const props = defineProps<ContextMenuRadioGroupProps>()
-
 const emits = defineEmits<ContextMenuRadioGroupEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <ContextMenuRadioGroup
+  <ContextMenuRadioGroup v-bind="forwarded">
-    v-bind="props"
-    @update:model-value="emits('update:modelValue', $event)"
-  >
     <slot />
   </ContextMenuRadioGroup>
 </template>

apps/www/src/lib/registry/default/ui/context-menu/ContextMenuRadioItem.vue

@@ -4,18 +4,20 @@ import {
   ContextMenuRadioItem,
   type ContextMenuRadioItemEmits,
   type ContextMenuRadioItemProps,
-  useEmitAsProps,
+  useForwardPropsEmits,
 } from 'radix-vue'
 import { Circle } from 'lucide-vue-next'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<ContextMenuRadioItemProps & { class?: string }>()
 const emits = defineEmits<ContextMenuRadioItemEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
   <ContextMenuRadioItem
-    v-bind="{ ...props, ...useEmitAsProps(emits) }"
+    v-bind="forwarded"
     :class="[
       cn(
         'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',

apps/www/src/lib/registry/default/ui/context-menu/ContextMenuSub.vue

@@ -3,15 +3,17 @@ import {
   ContextMenuSub,
   type ContextMenuSubEmits,
   type ContextMenuSubProps,
+  useForwardPropsEmits,
 } from 'radix-vue'
 
 const props = defineProps<ContextMenuSubProps>()
-
 const emits = defineEmits<ContextMenuSubEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <ContextMenuSub v-bind="props" @update:open="emits('update:open', $event)">
+  <ContextMenuSub v-bind="forwarded">
     <slot />
   </ContextMenuSub>
 </template>

apps/www/src/lib/registry/default/ui/dropdown-menu/DropdownMenu.vue

@@ -1,12 +1,14 @@
 <script setup lang="ts">
-import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps, useEmitAsProps } from 'radix-vue'
+import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps, useEmitAsProps, useForwardPropsEmits } from 'radix-vue'
 
 const props = defineProps<DropdownMenuRootProps>()
 const emits = defineEmits<DropdownMenuRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <DropdownMenuRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
+  <DropdownMenuRoot v-bind="forwarded">
     <slot />
   </DropdownMenuRoot>
 </template>

apps/www/src/lib/registry/default/ui/dropdown-menu/DropdownMenuSub.vue

@@ -3,15 +3,17 @@ import {
   DropdownMenuSub,
   type DropdownMenuSubEmits,
   type DropdownMenuSubProps,
+  useForwardPropsEmits,
 } from 'radix-vue'
 
 const props = defineProps<DropdownMenuSubProps>()
-
 const emits = defineEmits<DropdownMenuSubEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <DropdownMenuSub v-bind="props" @update:open="emits('update:open', $event)">
+  <DropdownMenuSub v-bind="forwarded">
     <slot />
   </DropdownMenuSub>
 </template>

apps/www/src/lib/registry/default/ui/hover-card/HoverCard.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
-import { HoverCardRoot, type HoverCardRootProps } from 'radix-vue'
+import { HoverCardRoot, type HoverCardRootProps, useForwardProps } from 'radix-vue'
 
 const props = defineProps<HoverCardRootProps>()
+const forwarded = useForwardProps(props)
 </script>
 
 <template>
-  <HoverCardRoot v-bind="props">
+  <HoverCardRoot v-bind="forwarded">
     <slot />
   </HoverCardRoot>
 </template>

apps/www/src/lib/registry/default/ui/menubar/MenubarSub.vue

@@ -1,8 +1,5 @@
 <script setup lang="ts">
-import {
+import { MenubarSub, type MenubarSubEmits, useForwardPropsEmits } from 'radix-vue'
-  MenubarSub,
-  type MenubarSubEmits,
-} from 'radix-vue'
 
 interface MenubarSubRootProps {
   defaultOpen?: boolean
@@ -10,12 +7,13 @@ interface MenubarSubRootProps {
 }
 
 const props = defineProps<MenubarSubRootProps>()
-
 const emits = defineEmits<MenubarSubEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <MenubarSub v-bind="props" @update:open="emits('update:open', $event)">
+  <MenubarSub v-bind="forwarded">
     <slot />
   </MenubarSub>
 </template>

apps/www/src/lib/registry/default/ui/menubar/MenubarSubTrigger.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { MenubarSubTrigger, type MenubarSubTriggerProps } from 'radix-vue'
+import { ChevronRight } from 'lucide-vue-next'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarSubTriggerProps & { inset?: boolean; class?: string }>()
@@ -17,5 +18,6 @@ const props = defineProps<MenubarSubTriggerProps & { inset?: boolean; class?: st
     ]"
   >
     <slot />
+    <ChevronRight class="ml-auto h-4 w-4" />
   </MenubarSubTrigger>
 </template>

apps/www/src/lib/registry/default/ui/popover/Popover.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
-import { PopoverRoot, useEmitAsProps } from 'radix-vue'
+import { PopoverRoot, useForwardPropsEmits } from 'radix-vue'
 import type { PopoverRootEmits, PopoverRootProps } from 'radix-vue'
 
 const props = defineProps<PopoverRootProps>()
 const emits = defineEmits<PopoverRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <PopoverRoot v-bind="{ ...props, ...emitsAsProps }">
+  <PopoverRoot v-bind="forwarded">
     <slot />
   </PopoverRoot>
 </template>

apps/www/src/lib/registry/default/ui/radio-group/RadioGroup.vue

@@ -1,16 +1,15 @@
 <script setup lang="ts">
-import { RadioGroupRoot, type RadioGroupRootEmits, type RadioGroupRootProps, useEmitAsProps } from 'radix-vue'
+import { RadioGroupRoot, type RadioGroupRootEmits, type RadioGroupRootProps, useForwardPropsEmits } from 'radix-vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<RadioGroupRootProps & { class?: string }>()
-
 const emits = defineEmits<RadioGroupRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <RadioGroupRoot :class="cn('grid gap-2', props.class)" v-bind="{ ...props, ...emitsAsProps }">
+  <RadioGroupRoot :class="cn('grid gap-2', props.class)" v-bind="forwarded">
     <slot />
   </RadioGroupRoot>
 </template>

apps/www/src/lib/registry/default/ui/select/Select.vue

@@ -1,13 +1,15 @@
 <script setup lang="ts">
 import type { SelectRootEmits, SelectRootProps } from 'radix-vue'
-import { SelectRoot, useEmitAsProps } from 'radix-vue'
+import { SelectRoot, useForwardPropsEmits } from 'radix-vue'
 
 const props = defineProps<SelectRootProps>()
 const emits = defineEmits<SelectRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <SelectRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
+  <SelectRoot v-bind="forwarded">
     <slot />
   </SelectRoot>
 </template>

apps/www/src/lib/registry/default/ui/switch/Switch.vue

@@ -4,24 +4,26 @@ import {
   type SwitchRootEmits,
   type SwitchRootProps,
   SwitchThumb,
+  useForwardPropsEmits,
 } from 'radix-vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<SwitchRootProps & { class?: string }>()
-
 const emits = defineEmits<SwitchRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
+console.log(props, forwarded)
 </script>
 
 <template>
   <SwitchRoot
-    v-bind="props"
+    v-bind="forwarded"
     :class="
       cn(
         'peer inline-flex h-[24px] w-[44px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input',
         props.class,
       )
     "
-    @update:checked="emits('update:checked', $event)"
   >
     <SwitchThumb
       :class="

apps/www/src/lib/registry/default/ui/toggle/Toggle.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import type { ToggleEmits, ToggleProps } from 'radix-vue'
-import { Toggle, useEmitAsProps } from 'radix-vue'
+import { Toggle, useForwardPropsEmits } from 'radix-vue'
 import type { VariantProps } from 'class-variance-authority'
 import { computed } from 'vue'
 import { toggleVariants } from '.'
@@ -23,11 +23,13 @@ const toggleProps = computed(() => {
   const { variant, size, ...otherProps } = props
   return otherProps
 })
+
+const forwarded = useForwardPropsEmits(toggleProps, emits)
 </script>
 
 <template>
   <Toggle
-    v-bind="{ ...toggleProps, ...useEmitAsProps(emits) }"
+    v-bind="forwarded"
     :class="cn(toggleVariants({ variant, size, class: $attrs.class ?? '' }))"
   >
     <slot />

apps/www/src/lib/registry/default/ui/tooltip/Tooltip.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps, useEmitAsProps } from 'radix-vue'
+import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps, useForwardPropsEmits } from 'radix-vue'
 
 const props = defineProps<TooltipRootProps>()
 const emits = defineEmits<TooltipRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <TooltipRoot v-bind="{ ...props, ...emitsAsProps }">
+  <TooltipRoot v-bind="forwarded">
     <slot />
   </TooltipRoot>
 </template>

apps/www/src/lib/registry/new-york/example/ComboboxDemo.vue

@@ -53,7 +53,10 @@ const filterFunction = (list: typeof frameworks, search: string) => list.filter(
             v-for="framework in frameworks"
             :key="framework.value"
             :value="framework"
-            @select="open = false"
+            @select="(ev) => {
+              value = ev.detail.value as typeof framework
+              open = false
+            }"
           >
             {{ framework.label }}
             <CheckIcon

apps/www/src/lib/registry/new-york/example/ComboboxDropdownMenu.vue

@@ -47,7 +47,7 @@ const open = ref(false)
       </span>
       <span class="text-muted-foreground">Create a new project</span>
     </p>
-    <DropdownMenu :open="open">
+    <DropdownMenu v-model:open="open">
       <DropdownMenuTrigger as-child>
         <Button variant="ghost" size="sm">
           <DotsHorizontalIcon />
@@ -80,8 +80,8 @@ const open = ref(false)
                       v-for="label in labels"
                       :key="label"
                       :value="label"
-                      @select="(value) => {
+                      @select="(ev) => {
-                        labelRef = value as string
+                        labelRef = ev.detail.value as string
                         open = false
                       }"
                     >

apps/www/src/lib/registry/new-york/example/ContextMenuDemo.vue

@@ -56,7 +56,7 @@ import {
       </ContextMenuCheckboxItem>
       <ContextMenuCheckboxItem>Show Full URLs</ContextMenuCheckboxItem>
       <ContextMenuSeparator />
-      <ContextMenuRadioGroup value="pedro">
+      <ContextMenuRadioGroup model-value="pedro">
         <ContextMenuLabel inset>
           People
         </ContextMenuLabel>

apps/www/src/lib/registry/new-york/example/DialogDemo.vue

@@ -20,7 +20,7 @@ import { Label } from '@/lib/registry/new-york/ui/label'
         Edit Profile
       </Button>
     </DialogTrigger>
-    <DialogContent class="sm:max-w-[425px]" @escape-key-down.prevent>
+    <DialogContent class="sm:max-w-[425px]">
       <DialogHeader>
         <DialogTitle>Edit profile</DialogTitle>
         <DialogDescription>

apps/www/src/lib/registry/new-york/ui/accordion/Accordion.vue

@@ -11,7 +11,7 @@ const emits = defineEmits<AccordionRootEmits>()
 </script>
 
 <template>
-  <AccordionRoot v-bind="{ ...props, ...useEmitAsProps(emits) }" class="accordion">
+  <AccordionRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
     <slot />
   </AccordionRoot>
 </template>

apps/www/src/lib/registry/new-york/ui/alert-dialog/AlertDialog.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot, useEmitAsProps } from 'radix-vue'
+import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot, useForwardPropsEmits } from 'radix-vue'
 
 const props = defineProps<AlertDialogProps>()
 const emits = defineEmits<AlertDialogEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <AlertDialogRoot v-bind="{ ...props, ...emitsAsProps }">
+  <AlertDialogRoot v-bind="forwarded">
     <slot />
   </AlertDialogRoot>
 </template>

apps/www/src/lib/registry/new-york/ui/checkbox/Checkbox.vue

@@ -1,18 +1,18 @@
 <script setup lang="ts">
 import type { CheckboxRootEmits, CheckboxRootProps } from 'radix-vue'
-import { CheckboxIndicator, CheckboxRoot, useEmitAsProps } from 'radix-vue'
+import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from 'radix-vue'
 import { CheckIcon } from '@radix-icons/vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<CheckboxRootProps>()
 const emits = defineEmits<CheckboxRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
   <CheckboxRoot
-    v-bind="{ ...props, ...emitsAsProps }"
+    v-bind="forwarded"
     :class="
       cn('peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground',
          $attrs.class ?? '')"

apps/www/src/lib/registry/new-york/ui/collapsible/CollapsibleContent.vue

@@ -5,7 +5,7 @@ const props = defineProps<CollapsibleContentProps>()
 </script>
 
 <template>
-  <CollapsibleContent v-bind="props">
+  <CollapsibleContent v-bind="props" class="overflow-hidden transition-all data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down">
     <slot />
   </CollapsibleContent>
 </template>

apps/www/src/lib/registry/new-york/ui/command/Command.vue

@@ -1,17 +1,17 @@
 <script setup lang="ts">
 import type { ComboboxRootEmits, ComboboxRootProps } from 'radix-vue'
-import { ComboboxRoot, useEmitAsProps } from 'radix-vue'
+import { ComboboxRoot, useEmitAsProps, useForwardPropsEmits } from 'radix-vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<ComboboxRootProps>()
 const emits = defineEmits<ComboboxRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
   <ComboboxRoot
-    v-bind="{ ...props, ...emitsAsProps }"
+    v-bind="forwarded"
     :open="true"
     :class="cn('flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground', $attrs.class ?? '')"
   >

apps/www/src/lib/registry/new-york/ui/command/CommandItem.vue

@@ -13,6 +13,7 @@ const emitsAsProps = useEmitAsProps(emits)
   <ComboboxItem
     v-bind="{ ...props, ...emitsAsProps }"
     :class="cn('relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', $attrs.class ?? '')"
+    @select.prevent
   >
     <slot />
   </ComboboxItem>

apps/www/src/lib/registry/new-york/ui/context-menu/ContextMenu.vue

@@ -1,13 +1,15 @@
 <script setup lang="ts">
-import { ContextMenuRoot, useEmitAsProps } from 'radix-vue'
+import { ContextMenuRoot, useForwardPropsEmits } from 'radix-vue'
 import type { ContextMenuRootEmits, ContextMenuRootProps } from 'radix-vue'
 
 const props = defineProps<ContextMenuRootProps>()
 const emits = defineEmits<ContextMenuRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <ContextMenuRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
+  <ContextMenuRoot v-bind="forwarded">
     <slot />
   </ContextMenuRoot>
 </template>

apps/www/src/lib/registry/new-york/ui/context-menu/ContextMenuRadioGroup.vue

@@ -3,18 +3,17 @@ import {
   ContextMenuRadioGroup,
   type ContextMenuRadioGroupEmits,
   type ContextMenuRadioGroupProps,
+  useForwardPropsEmits,
 } from 'radix-vue'
 
 const props = defineProps<ContextMenuRadioGroupProps>()
-
 const emits = defineEmits<ContextMenuRadioGroupEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <ContextMenuRadioGroup
+  <ContextMenuRadioGroup v-bind="forwarded">
-    v-bind="props"
-    @update:model-value="emits('update:modelValue', $event)"
-  >
     <slot />
   </ContextMenuRadioGroup>
 </template>

apps/www/src/lib/registry/new-york/ui/context-menu/ContextMenuRadioItem.vue

@@ -4,18 +4,20 @@ import {
   ContextMenuRadioItem,
   type ContextMenuRadioItemEmits,
   type ContextMenuRadioItemProps,
-  useEmitAsProps,
+  useForwardPropsEmits,
 } from 'radix-vue'
 import { DotFilledIcon } from '@radix-icons/vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<ContextMenuRadioItemProps & { class?: string }>()
 const emits = defineEmits<ContextMenuRadioItemEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
   <ContextMenuRadioItem
-    v-bind="{ ...props, ...useEmitAsProps(emits) }"
+    v-bind="forwarded"
     :class="[
       cn(
         'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',

apps/www/src/lib/registry/new-york/ui/context-menu/ContextMenuSub.vue

@@ -3,15 +3,17 @@ import {
   ContextMenuSub,
   type ContextMenuSubEmits,
   type ContextMenuSubProps,
+  useForwardPropsEmits,
 } from 'radix-vue'
 
 const props = defineProps<ContextMenuSubProps>()
-
 const emits = defineEmits<ContextMenuSubEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <ContextMenuSub v-bind="props" @update:open="emits('update:open', $event)">
+  <ContextMenuSub v-bind="forwarded">
     <slot />
   </ContextMenuSub>
 </template>

apps/www/src/lib/registry/new-york/ui/dropdown-menu/DropdownMenu.vue

@@ -1,12 +1,14 @@
 <script setup lang="ts">
-import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps, useEmitAsProps } from 'radix-vue'
+import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps, useEmitAsProps, useForwardPropsEmits } from 'radix-vue'
 
 const props = defineProps<DropdownMenuRootProps>()
 const emits = defineEmits<DropdownMenuRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <DropdownMenuRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
+  <DropdownMenuRoot v-bind="forwarded">
     <slot />
   </DropdownMenuRoot>
 </template>

apps/www/src/lib/registry/new-york/ui/dropdown-menu/DropdownMenuSub.vue

@@ -3,15 +3,17 @@ import {
   DropdownMenuSub,
   type DropdownMenuSubEmits,
   type DropdownMenuSubProps,
+  useForwardPropsEmits,
 } from 'radix-vue'
 
 const props = defineProps<DropdownMenuSubProps>()
-
 const emits = defineEmits<DropdownMenuSubEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <DropdownMenuSub v-bind="props" @update:open="emits('update:open', $event)">
+  <DropdownMenuSub v-bind="forwarded">
     <slot />
   </DropdownMenuSub>
 </template>

apps/www/src/lib/registry/new-york/ui/hover-card/HoverCard.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
-import { HoverCardRoot, type HoverCardRootProps } from 'radix-vue'
+import { HoverCardRoot, type HoverCardRootProps, useForwardProps } from 'radix-vue'
 
 const props = defineProps<HoverCardRootProps>()
+const forwarded = useForwardProps(props)
 </script>
 
 <template>
-  <HoverCardRoot v-bind="props">
+  <HoverCardRoot v-bind="forwarded">
     <slot />
   </HoverCardRoot>
 </template>

apps/www/src/lib/registry/new-york/ui/menubar/MenubarContent.vue

@@ -3,6 +3,7 @@ import {
   MenubarContent,
   type MenubarContentProps,
   MenubarPortal,
+  useForwardProps,
 } from 'radix-vue'
 import { cn } from '@/lib/utils'
 
@@ -14,17 +15,13 @@ const props = withDefaults(
     sideOffset: 8,
   },
 )
+const forwarded = useForwardProps(props)
 </script>
 
 <template>
   <MenubarPortal>
     <MenubarContent
-      :loop="props.loop"
+      v-bind="forwarded"
-      :as-child="props.asChild"
-      :side-offset="props.sideOffset"
-      :side="props.side"
-      :align="props.align"
-      :align-offset="props.alignOffset"
       :class="
         cn(
           'z-50 min-w-[12rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',

apps/www/src/lib/registry/new-york/ui/menubar/MenubarSub.vue

@@ -1,8 +1,5 @@
 <script setup lang="ts">
-import {
+import { MenubarSub, type MenubarSubEmits, useForwardPropsEmits } from 'radix-vue'
-  MenubarSub,
-  type MenubarSubEmits,
-} from 'radix-vue'
 
 interface MenubarSubRootProps {
   defaultOpen?: boolean
@@ -10,12 +7,13 @@ interface MenubarSubRootProps {
 }
 
 const props = defineProps<MenubarSubRootProps>()
-
 const emits = defineEmits<MenubarSubEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <MenubarSub v-bind="props" @update:open="emits('update:open', $event)">
+  <MenubarSub v-bind="forwarded">
     <slot />
   </MenubarSub>
 </template>

apps/www/src/lib/registry/new-york/ui/menubar/MenubarSubTrigger.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { MenubarSubTrigger, type MenubarSubTriggerProps } from 'radix-vue'
+import { ChevronRightIcon } from '@radix-icons/vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarSubTriggerProps & { inset?: boolean; class?: string }>()
@@ -17,5 +18,6 @@ const props = defineProps<MenubarSubTriggerProps & { inset?: boolean; class?: st
     ]"
   >
     <slot />
+    <ChevronRightIcon class="ml-auto h-4 w-4" />
   </MenubarSubTrigger>
 </template>

apps/www/src/lib/registry/new-york/ui/popover/Popover.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
-import { PopoverRoot, useEmitAsProps } from 'radix-vue'
+import { PopoverRoot, useForwardPropsEmits } from 'radix-vue'
 import type { PopoverRootEmits, PopoverRootProps } from 'radix-vue'
 
 const props = defineProps<PopoverRootProps>()
 const emits = defineEmits<PopoverRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <PopoverRoot v-bind="{ ...props, ...emitsAsProps }">
+  <PopoverRoot v-bind="forwarded">
     <slot />
   </PopoverRoot>
 </template>

apps/www/src/lib/registry/new-york/ui/radio-group/RadioGroup.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
-import { RadioGroupRoot, type RadioGroupRootEmits, type RadioGroupRootProps, useEmitAsProps } from 'radix-vue'
+import { RadioGroupRoot, type RadioGroupRootEmits, type RadioGroupRootProps, useForwardPropsEmits } from 'radix-vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<RadioGroupRootProps & { class?: string }>()
 const emits = defineEmits<RadioGroupRootEmits>()
 
-const emitsAsProps = useEmitAsProps(emits)
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <RadioGroupRoot :class="cn('grid gap-2', props.class)" v-bind="{ ...props, ...emitsAsProps }">
+  <RadioGroupRoot :class="cn('grid gap-2', props.class)" v-bind="forwarded">
     <slot />
   </RadioGroupRoot>
 </template>

apps/www/src/lib/registry/new-york/ui/select/Select.vue

@@ -1,13 +1,15 @@
 <script setup lang="ts">
 import type { SelectRootEmits, SelectRootProps } from 'radix-vue'
-import { SelectRoot, useEmitAsProps } from 'radix-vue'
+import { SelectRoot, useForwardPropsEmits } from 'radix-vue'
 
 const props = defineProps<SelectRootProps>()
 const emits = defineEmits<SelectRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <SelectRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
+  <SelectRoot v-bind="forwarded">
     <slot />
   </SelectRoot>
 </template>

apps/www/src/lib/registry/new-york/ui/switch/Switch.vue

@@ -4,24 +4,25 @@ import {
   type SwitchRootEmits,
   type SwitchRootProps,
   SwitchThumb,
+  useForwardPropsEmits,
 } from 'radix-vue'
 import { cn } from '@/lib/utils'
 
 const props = defineProps<SwitchRootProps & { class?: string }>()
-
 const emits = defineEmits<SwitchRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
   <SwitchRoot
-    v-bind="props"
+    v-bind="forwarded"
     :class="
       cn(
         'peer inline-flex h-[20px] w-[36px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input',
         props.class,
       )
     "
-    @update:checked="emits('update:checked', $event)"
   >
     <SwitchThumb
       :class="

apps/www/src/lib/registry/new-york/ui/toggle/Toggle.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import type { ToggleEmits, ToggleProps } from 'radix-vue'
-import { Toggle, useEmitAsProps } from 'radix-vue'
+import { Toggle, useForwardPropsEmits } from 'radix-vue'
 import type { VariantProps } from 'class-variance-authority'
 import { computed } from 'vue'
 import { toggleVariants } from '.'
@@ -23,11 +23,13 @@ const toggleProps = computed(() => {
   const { variant, size, ...otherProps } = props
   return otherProps
 })
+
+const forwarded = useForwardPropsEmits(toggleProps, emits)
 </script>
 
 <template>
   <Toggle
-    v-bind="{ ...toggleProps, ...useEmitAsProps(emits) }"
+    v-bind="forwarded"
     :class="cn(toggleVariants({ variant, size, class: $attrs.class ?? '' }))"
   >
     <slot />

apps/www/src/lib/registry/new-york/ui/tooltip/Tooltip.vue

@@ -1,12 +1,14 @@
 <script setup lang="ts">
-import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps, useEmitAsProps } from 'radix-vue'
+import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps, useForwardPropsEmits } from 'radix-vue'
 
 const props = defineProps<TooltipRootProps>()
 const emits = defineEmits<TooltipRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
 </script>
 
 <template>
-  <TooltipRoot v-bind="{ ...props, ...useEmitAsProps(emits) }">
+  <TooltipRoot v-bind="forwarded">
     <slot />
   </TooltipRoot>
 </template>

packages/cli/package.json

@@ -63,7 +63,7 @@
     "node-fetch": "^3.3.2",
     "ora": "^7.0.1",
     "prompts": "^2.4.2",
-    "radix-vue": "^0.4.1",
+    "radix-vue": "^1.0.0",
     "recast": "^0.23.4",
     "rimraf": "^5.0.1",
     "ts-morph": "^19.0.0",

packages/cli/test/fixtures/nuxt/package.json

@@ -13,7 +13,7 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
     "lucide-vue-next": "^0.276.0",
-    "radix-vue": "^0.4.1",
+    "radix-vue": "^1.0.0",
     "tailwind-merge": "^1.14.0",
     "tailwindcss-animate": "^1.0.7"
   },

pnpm-lock.yaml

@@ -22,10 +22,10 @@ importers:
         version: 0.43.1(eslint@8.52.0)(typescript@5.2.2)
       '@commitlint/cli':
         specifier: ^17.7.1
-        version: 17.8.1
+        version: 17.7.1
       '@commitlint/config-conventional':
         specifier: ^17.7.0
-        version: 17.8.1
+        version: 17.7.0
       eslint:
         specifier: ^8.52.0
         version: 8.52.0
@@ -46,7 +46,7 @@ importers:
         version: 5.2.2
       vitest:
         specifier: ^0.34.6
-        version: 0.34.6(@vitest/ui@0.34.6)
+        version: 0.34.6(@vitest/ui@0.34.4)
 
   apps/www:
     dependencies:
@@ -93,8 +93,8 @@ importers:
         specifier: ^0.276.0
         version: 0.276.0(vue@3.3.6)
       radix-vue:
-        specifier: ^0.4.1
+        specifier: ^1.0.0
-        version: 0.4.1(vue@3.3.6)
+        version: 1.0.0(vue@3.3.6)
       tailwindcss-animate:
         specifier: ^1.0.7
         version: 1.0.7(tailwindcss@3.3.3)
@@ -119,10 +119,10 @@ importers:
         version: 1.1.11
       '@iconify-json/tabler':
         specifier: ^1.1.89
-        version: 1.1.95
+        version: 1.1.89
       '@iconify/json':
         specifier: ^2.2.108
-        version: 2.2.132
+        version: 2.2.108
       '@iconify/vue':
         specifier: ^4.1.1
         version: 4.1.1(vue@3.3.6)
@@ -185,13 +185,13 @@ importers:
         version: 0.21.8
       '@babel/core':
         specifier: ^7.22.17
-        version: 7.23.2
+        version: 7.22.17
       '@babel/parser':
         specifier: ^7.22.16
-        version: 7.23.0
+        version: 7.22.16
       '@babel/plugin-transform-typescript':
         specifier: ^7.22.15
-        version: 7.22.15(@babel/core@7.23.2)
+        version: 7.22.15(@babel/core@7.22.17)
       '@vue/compiler-sfc':
         specifier: ^3.3.6
         version: 3.3.6
@@ -200,7 +200,7 @@ importers:
         version: 5.3.0
       commander:
         specifier: ^11.0.0
-        version: 11.1.0
+        version: 11.0.0
       cosmiconfig:
         specifier: ^8.3.6
         version: 8.3.6(typescript@5.2.2)
@@ -224,7 +224,7 @@ importers:
         version: 4.5.0
       magic-string:
         specifier: ^0.30.3
-        version: 0.30.5
+        version: 0.30.3
       node-fetch:
         specifier: ^3.3.2
         version: 3.3.2
@@ -235,8 +235,8 @@ importers:
         specifier: ^2.4.2
         version: 2.4.2
       radix-vue:
-        specifier: ^0.4.1
+        specifier: ^1.0.0
-        version: 0.4.1(vue@3.3.6)
+        version: 1.0.0(vue@3.3.6)
       recast:
         specifier: ^0.23.4
         version: 0.23.4
@@ -258,28 +258,28 @@ importers:
     devDependencies:
       '@types/babel__core':
         specifier: ^7.20.1
-        version: 7.20.3
+        version: 7.20.1
       '@types/diff':
         specifier: ^5.0.3
-        version: 5.0.7
+        version: 5.0.3
       '@types/fs-extra':
         specifier: ^11.0.1
-        version: 11.0.3
+        version: 11.0.1
       '@types/lodash.template':
         specifier: ^4.5.1
-        version: 4.5.2
+        version: 4.5.1
       '@types/prompts':
         specifier: ^2.4.4
-        version: 2.4.7
+        version: 2.4.4
       '@vitest/ui':
         specifier: ^0.34.4
-        version: 0.34.6(vitest@0.34.6)
+        version: 0.34.4(vitest@0.34.6)
       tsup:
         specifier: ^7.2.0
         version: 7.2.0(ts-node@10.9.1)(typescript@5.2.2)
       type-fest:
         specifier: ^4.3.1
-        version: 4.5.0
+        version: 4.3.1
       typescript:
         specifier: ^5.2.2
         version: 5.2.2
@@ -456,7 +456,7 @@ packages:
       eslint-plugin-unicorn: 48.0.1(eslint@8.52.0)
       eslint-plugin-unused-imports: 3.0.0(@typescript-eslint/eslint-plugin@6.9.0)(eslint@8.52.0)
       eslint-plugin-yml: 1.10.0(eslint@8.52.0)
-      jsonc-eslint-parser: 2.3.0
+      jsonc-eslint-parser: 2.4.0
       yaml-eslint-parser: 1.2.2
     transitivePeerDependencies:
       - '@typescript-eslint/eslint-plugin'
@@ -495,7 +495,7 @@ packages:
       '@antfu/eslint-config-basic': 0.43.1(@typescript-eslint/eslint-plugin@6.9.0)(@typescript-eslint/parser@6.9.0)(eslint@8.52.0)(typescript@5.2.2)
       '@antfu/eslint-config-ts': 0.43.1(eslint@8.52.0)(typescript@5.2.2)
       eslint: 8.52.0
-      eslint-plugin-vue: 9.17.0(eslint@8.52.0)
+      eslint-plugin-vue: 9.18.0(eslint@8.52.0)
       local-pkg: 0.4.3
     transitivePeerDependencies:
       - '@typescript-eslint/eslint-plugin'
@@ -523,9 +523,9 @@ packages:
       eslint-plugin-n: 16.2.0(eslint@8.52.0)
       eslint-plugin-promise: 6.1.1(eslint@8.52.0)
       eslint-plugin-unicorn: 48.0.1(eslint@8.52.0)
-      eslint-plugin-vue: 9.17.0(eslint@8.52.0)
+      eslint-plugin-vue: 9.18.0(eslint@8.52.0)
       eslint-plugin-yml: 1.10.0(eslint@8.52.0)
-      jsonc-eslint-parser: 2.3.0
+      jsonc-eslint-parser: 2.4.0
       yaml-eslint-parser: 1.2.2
     transitivePeerDependencies:
       - eslint-import-resolver-typescript
@@ -561,21 +561,21 @@ packages:
     resolution: {integrity: sha512-0S9TQMmDHlqAZ2ITT95irXKfxN9bncq8ZCoJhun3nHL/lLUxd2NKBJYoNGWH7S0hz6fRQwWlAWn/ILM0C70KZQ==}
     engines: {node: '>=6.9.0'}
 
-  /@babel/core@7.23.2:
+  /@babel/core@7.22.17:
-    resolution: {integrity: sha512-n7s51eWdaWZ3vGT2tD4T7J6eJs3QoBXydv7vkUM06Bf1cbVD2Kc2UrkzhiQwobfV7NwOnQXYL7UBJ5VPU+RGoQ==}
+    resolution: {integrity: sha512-2EENLmhpwplDux5PSsZnSbnSkB3tZ6QTksgO25xwEL7pIDcNOMhF5v/s6RzwjMZzZzw9Ofc30gHv5ChCC8pifQ==}
     engines: {node: '>=6.9.0'}
     dependencies:
       '@ampproject/remapping': 2.2.1
       '@babel/code-frame': 7.22.13
       '@babel/generator': 7.23.0
       '@babel/helper-compilation-targets': 7.22.15
-      '@babel/helper-module-transforms': 7.23.0(@babel/core@7.23.2)
+      '@babel/helper-module-transforms': 7.23.0(@babel/core@7.22.17)
       '@babel/helpers': 7.23.2
-      '@babel/parser': 7.23.0
+      '@babel/parser': 7.22.16
       '@babel/template': 7.22.15
       '@babel/traverse': 7.23.2
       '@babel/types': 7.23.0
-      convert-source-map: 2.0.0
+      convert-source-map: 1.9.0
       debug: 4.3.4
       gensync: 1.0.0-beta.2
       json5: 2.2.3
@@ -608,19 +608,19 @@ packages:
       lru-cache: 5.1.1
       semver: 6.3.1
 
-  /@babel/helper-create-class-features-plugin@7.22.15(@babel/core@7.23.2):
+  /@babel/helper-create-class-features-plugin@7.22.15(@babel/core@7.22.17):
     resolution: {integrity: sha512-jKkwA59IXcvSaiK2UN45kKwSC9o+KuoXsBDvHvU/7BecYIp8GQ2UwrVvFgJASUT+hBnwJx6MhvMCuMzwZZ7jlg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/helper-annotate-as-pure': 7.22.5
       '@babel/helper-environment-visitor': 7.22.20
       '@babel/helper-function-name': 7.23.0
       '@babel/helper-member-expression-to-functions': 7.23.0
       '@babel/helper-optimise-call-expression': 7.22.5
-      '@babel/helper-replace-supers': 7.22.20(@babel/core@7.23.2)
+      '@babel/helper-replace-supers': 7.22.20(@babel/core@7.22.17)
       '@babel/helper-skip-transparent-expression-wrappers': 7.22.5
       '@babel/helper-split-export-declaration': 7.22.6
       semver: 6.3.1
@@ -654,13 +654,13 @@ packages:
     dependencies:
       '@babel/types': 7.23.0
 
-  /@babel/helper-module-transforms@7.23.0(@babel/core@7.23.2):
+  /@babel/helper-module-transforms@7.23.0(@babel/core@7.22.17):
     resolution: {integrity: sha512-WhDWw1tdrlT0gMgUJSlX0IQvoO1eN279zrAUbVB+KpV2c3Tylz8+GnKOLllCS6Z/iZQEyVYxhZVUdPTqs2YYPw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/helper-environment-visitor': 7.22.20
       '@babel/helper-module-imports': 7.22.15
       '@babel/helper-simple-access': 7.22.5
@@ -677,13 +677,13 @@ packages:
     resolution: {integrity: sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==}
     engines: {node: '>=6.9.0'}
 
-  /@babel/helper-replace-supers@7.22.20(@babel/core@7.23.2):
+  /@babel/helper-replace-supers@7.22.20(@babel/core@7.22.17):
     resolution: {integrity: sha512-qsW0In3dbwQUbK8kejJ4R7IHVGwHJlV6lpG6UA7a9hSa2YEiAib+N1T2kr6PEeUT+Fl7najmSOS6SmAwCHK6Tw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/helper-environment-visitor': 7.22.20
       '@babel/helper-member-expression-to-functions': 7.23.0
       '@babel/helper-optimise-call-expression': 7.22.5
@@ -736,6 +736,13 @@ packages:
       chalk: 2.4.2
       js-tokens: 4.0.0
 
+  /@babel/parser@7.22.16:
+    resolution: {integrity: sha512-+gPfKv8UWeKKeJTUxe59+OobVcrYHETCsORl61EmSkmgymguYk/X5bp7GuUIXaFsc6y++v8ZxPsLSSuujqDphA==}
+    engines: {node: '>=6.0.0'}
+    hasBin: true
+    dependencies:
+      '@babel/types': 7.23.0
+
   /@babel/parser@7.23.0:
     resolution: {integrity: sha512-vvPKKdMemU85V9WE/l5wZEmImpCtLqbnTvqDS2U1fJ96KrxoW7KrXhNsNCblQlg8Ck4b85yxdTyelsMUgFUXiw==}
     engines: {node: '>=6.0.0'}
@@ -743,60 +750,60 @@ packages:
     dependencies:
       '@babel/types': 7.23.0
 
-  /@babel/plugin-syntax-jsx@7.22.5(@babel/core@7.23.2):
+  /@babel/plugin-syntax-jsx@7.22.5(@babel/core@7.22.17):
     resolution: {integrity: sha512-gvyP4hZrgrs/wWMaocvxZ44Hw0b3W8Pe+cMxc8V1ULQ07oh8VNbIRaoD1LRZVTvD+0nieDKjfgKg89sD7rrKrg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/helper-plugin-utils': 7.22.5
 
-  /@babel/plugin-syntax-typescript@7.22.5(@babel/core@7.23.2):
+  /@babel/plugin-syntax-typescript@7.22.5(@babel/core@7.22.17):
     resolution: {integrity: sha512-1mS2o03i7t1c6VzH6fdQ3OA8tcEIxwG18zIPRp+UY1Ihv6W+XZzBCVxExF9upussPXJ0xE9XRHwMoNs1ep/nRQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/helper-plugin-utils': 7.22.5
 
-  /@babel/plugin-transform-modules-commonjs@7.23.0(@babel/core@7.23.2):
+  /@babel/plugin-transform-modules-commonjs@7.23.0(@babel/core@7.22.17):
     resolution: {integrity: sha512-32Xzss14/UVc7k9g775yMIvkVK8xwKE0DPdP5JTapr3+Z9w4tzeOuLNY6BXDQR6BdnzIlXnCGAzsk/ICHBLVWQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
-      '@babel/helper-module-transforms': 7.23.0(@babel/core@7.23.2)
+      '@babel/helper-module-transforms': 7.23.0(@babel/core@7.22.17)
       '@babel/helper-plugin-utils': 7.22.5
       '@babel/helper-simple-access': 7.22.5
     dev: false
 
-  /@babel/plugin-transform-typescript@7.22.15(@babel/core@7.23.2):
+  /@babel/plugin-transform-typescript@7.22.15(@babel/core@7.22.17):
     resolution: {integrity: sha512-1uirS0TnijxvQLnlv5wQBwOX3E1wCFX7ITv+9pBV2wKEk4K+M5tqDaoNXnTH8tjEIYHLO98MwiTWO04Ggz4XuA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/helper-annotate-as-pure': 7.22.5
-      '@babel/helper-create-class-features-plugin': 7.22.15(@babel/core@7.23.2)
+      '@babel/helper-create-class-features-plugin': 7.22.15(@babel/core@7.22.17)
       '@babel/helper-plugin-utils': 7.22.5
-      '@babel/plugin-syntax-typescript': 7.22.5(@babel/core@7.23.2)
+      '@babel/plugin-syntax-typescript': 7.22.5(@babel/core@7.22.17)
 
-  /@babel/preset-typescript@7.23.2(@babel/core@7.23.2):
+  /@babel/preset-typescript@7.23.2(@babel/core@7.22.17):
     resolution: {integrity: sha512-u4UJc1XsS1GhIGteM8rnGiIvf9rJpiVgMEeCnwlLA7WJPC+jcXWJAGxYmeqs5hOZD8BbAfnV5ezBOxQbb4OUxA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/helper-plugin-utils': 7.22.5
       '@babel/helper-validator-option': 7.22.15
-      '@babel/plugin-syntax-jsx': 7.22.5(@babel/core@7.23.2)
+      '@babel/plugin-syntax-jsx': 7.22.5(@babel/core@7.22.17)
-      '@babel/plugin-transform-modules-commonjs': 7.23.0(@babel/core@7.23.2)
+      '@babel/plugin-transform-modules-commonjs': 7.23.0(@babel/core@7.22.17)
-      '@babel/plugin-transform-typescript': 7.22.15(@babel/core@7.23.2)
+      '@babel/plugin-transform-typescript': 7.22.15(@babel/core@7.22.17)
     dev: false
 
   /@babel/runtime@7.23.2:
@@ -816,7 +823,7 @@ packages:
     engines: {node: '>=6.9.0'}
     dependencies:
       '@babel/code-frame': 7.22.13
-      '@babel/parser': 7.23.0
+      '@babel/parser': 7.22.16
       '@babel/types': 7.23.0
 
   /@babel/traverse@7.23.2:
@@ -844,8 +851,8 @@ packages:
       '@babel/helper-validator-identifier': 7.22.20
       to-fast-properties: 2.0.0
 
-  /@commitlint/cli@17.8.1:
+  /@commitlint/cli@17.7.1:
-    resolution: {integrity: sha512-ay+WbzQesE0Rv4EQKfNbSMiJJ12KdKTDzIt0tcK4k11FdsWmtwP0Kp1NWMOUswfIWo6Eb7p7Ln721Nx9FLNBjg==}
+    resolution: {integrity: sha512-BCm/AT06SNCQtvFv921iNhudOHuY16LswT0R3OeolVGLk8oP+Rk9TfQfgjH7QPMjhvp76bNqGFEcpKojxUNW1g==}
     engines: {node: '>=v14'}
     hasBin: true
     dependencies:
@@ -864,8 +871,8 @@ packages:
       - '@swc/wasm'
     dev: true
 
-  /@commitlint/config-conventional@17.8.1:
+  /@commitlint/config-conventional@17.7.0:
-    resolution: {integrity: sha512-NxCOHx1kgneig3VLauWJcDWS40DVjg7nKOpBEEK9E5fjJpQqLCilcnKkIIjdBH98kEO1q3NpE5NSrZ2kl/QGJg==}
+    resolution: {integrity: sha512-iicqh2o6et+9kWaqsQiEYZzfLbtoWv9uZl8kbI8EGfnc0HeGafQBF7AJ0ylN9D/2kj6txltsdyQs8+2fTMwWEw==}
     engines: {node: '>=v14'}
     dependencies:
       conventional-changelog-conventionalcommits: 6.1.0
@@ -1432,14 +1439,14 @@ packages:
       '@iconify/types': 2.0.0
     dev: true
 
-  /@iconify-json/tabler@1.1.95:
+  /@iconify-json/tabler@1.1.89:
-    resolution: {integrity: sha512-Qg+VpKgSImpA9g2ger17cWIBvirlixUplTXshu/miegBCfaicYEyyX2pCilCJEuujeNVh47+ySD7CoBJS2f6pQ==}
+    resolution: {integrity: sha512-G2NFjRcmAeMO08I+6uJh05NmMrL74kU+tbbd4DSmlAfnkcCZg9ugojOPCRkT33IBlPSr7pXAO2EXHJwrAKP2lg==}
     dependencies:
       '@iconify/types': 2.0.0
     dev: true
 
-  /@iconify/json@2.2.132:
+  /@iconify/json@2.2.108:
-    resolution: {integrity: sha512-iRhfaUp7yQvez1lubMgjtBflpPXl2/2ItOoEybbA+u4Xv9sOJ3n7131DavvzhXqWiRu2NOhGpiGoqcU4RlOLnA==}
+    resolution: {integrity: sha512-s6iHOPNaTgrl3SxcIHruoE05MiGqhQllZd/pXJlZAC652vzLXfJhCe5SNQiiI3V1RqiXCmdU1Z2dZydk86UaTQ==}
     dependencies:
       '@iconify/types': 2.0.0
       pathe: 1.1.1
@@ -1580,7 +1587,7 @@ packages:
       fast-copy: 3.0.1
       fast-equals: 5.0.1
       ohash: 1.1.3
-      type-fest: 4.5.0
+      type-fest: 4.3.1
     dev: false
 
   /@morev/vue-transitions@2.3.6(vue@3.3.6):
@@ -1925,10 +1932,10 @@ packages:
       minimatch: 9.0.3
     dev: true
 
-  /@types/babel__core@7.20.3:
+  /@types/babel__core@7.20.1:
-    resolution: {integrity: sha512-54fjTSeSHwfan8AyHWrKbfBWiEUrNTZsUwPTDSNaaP1QDQIZbeNUg3a59E9D+375MzUw/x1vx2/0F5LBz+AeYA==}
+    resolution: {integrity: sha512-aACu/U/omhdk15O4Nfb+fHgH/z3QsfQzpnvRZhYhThms83ZnAOZz7zZAWO7mn2yyNQaA4xTO8GLK3uqFU4bYYw==}
     dependencies:
-      '@babel/parser': 7.23.0
+      '@babel/parser': 7.22.16
       '@babel/types': 7.23.0
       '@types/babel__generator': 7.6.6
       '@types/babel__template': 7.4.3
@@ -1944,7 +1951,7 @@ packages:
   /@types/babel__template@7.4.3:
     resolution: {integrity: sha512-ciwyCLeuRfxboZ4isgdNZi/tkt06m8Tw6uGbBSBgWrnnZGNXiEyM27xc/PjXGQLqlZ6ylbgHMnm7ccF9tCkOeQ==}
     dependencies:
-      '@babel/parser': 7.23.0
+      '@babel/parser': 7.22.16
       '@babel/types': 7.23.0
     dev: true
 
@@ -2163,16 +2170,16 @@ packages:
       '@types/d3-zoom': 3.0.6
     dev: false
 
-  /@types/diff@5.0.7:
+  /@types/diff@5.0.3:
-    resolution: {integrity: sha512-adBosR2GntaQQiuHnfRN9HtxYpoHHJBcdyz7VSXhjpSAmtvIfu/S1fjTqwuIx/Ypba6LCZdfWIqPYx2BR5TneQ==}
+    resolution: {integrity: sha512-amrLbRqTU9bXMCc6uX0sWpxsQzRIo9z6MJPkH1pkez/qOxuqSZVuryJAWoBRq94CeG8JxY+VK4Le9HtjQR5T9A==}
     dev: true
 
   /@types/estree@1.0.3:
     resolution: {integrity: sha512-CS2rOaoQ/eAgAfcTfq6amKG7bsN+EMcgGY4FAFQdvSj2y1ixvOZTUA9mOtCai7E1SYu283XNw7urKK30nP3wkQ==}
     dev: false
 
-  /@types/fs-extra@11.0.3:
+  /@types/fs-extra@11.0.1:
-    resolution: {integrity: sha512-sF59BlXtUdzEAL1u0MSvuzWd7PdZvZEtnaVkzX5mjpdWTJ8brG0jUqve3jPCzSzvAKKMHTG8F8o/WMQLtleZdQ==}
+    resolution: {integrity: sha512-MxObHvNl4A69ofaTRU8DFqvgzzv8s9yRtaPPm5gud9HDNvpB3GPQFvNuTWAI59B9huVGV5jXYJwbCsmBsOGYWA==}
     dependencies:
       '@types/jsonfile': 6.1.3
       '@types/node': 20.8.7
@@ -2208,6 +2215,12 @@ packages:
     resolution: {integrity: sha512-hPpIeeHb/2UuCw06kSNAOVWgehBLXEo0/fUs0mw3W2qhqX89PI2yvok83MnuctYGCPrabGIoi0fFso4DQ+sNUQ==}
     dev: true
 
+  /@types/lodash.template@4.5.1:
+    resolution: {integrity: sha512-0y71S2dGgmwdkSsyW95JBp8HSZchgKCsjr6F0lsT3eSMtaT3Nn9rcMHU1U4UKu6XjQT3YC6/PNwgFI7k9f+ltw==}
+    dependencies:
+      '@types/lodash': 4.14.200
+    dev: true
+
   /@types/lodash.template@4.5.2:
     resolution: {integrity: sha512-9V69JSviqXywQC9O/vZ5WjO4kmcol55t+pZDcsrKXkO4D5rGdF2/J0Ke2iChq689xIRoVGWXTQ8DGh9Lbg/UVg==}
     dependencies:
@@ -2270,8 +2283,8 @@ packages:
     resolution: {integrity: sha512-SOFlLGZkLbEXJRwcWCqeP/Koyaf/uAqLXHUsdo/nMfjLsNd8kqauwHe9GBOljSmpcHp/LC6kOjo3SidGjNirVA==}
     dev: false
 
-  /@types/prompts@2.4.7:
+  /@types/prompts@2.4.4:
-    resolution: {integrity: sha512-5zTamE+QQM4nR6Ab3yHK+ovWuhLJXaa2ZLt3mT1en8U3ubWtjVT1vXDaVFC2+cL89uVn7Y+gIq5B3IcVvBl5xQ==}
+    resolution: {integrity: sha512-p5N9uoTH76lLvSAaYSZtBCdEXzpOOufsRjnhjVSrZGXikVGHX9+cc9ERtHRV4hvBKHyZb1bg4K+56Bd2TqUn4A==}
     dependencies:
       '@types/node': 20.8.7
       kleur: 3.0.3
@@ -2608,7 +2621,7 @@ packages:
   /@vee-validate/zod@4.11.8(vue@3.3.6):
     resolution: {integrity: sha512-qAyqDEigklMf669ZqIw9t95g0Ipzu9rMYUqcZpANlCvyaIAeBlJGcsv+2CewlqgwuC6BL9EAURLJ8Ux5WlBgXg==}
     dependencies:
-      type-fest: 4.5.0
+      type-fest: 4.3.1
       vee-validate: 4.11.8(vue@3.3.6)
       zod: 3.22.4
     transitivePeerDependencies:
@@ -2622,9 +2635,9 @@ packages:
       vite: ^4.0.0
       vue: ^3.0.0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
-      '@babel/plugin-transform-typescript': 7.22.15(@babel/core@7.23.2)
+      '@babel/plugin-transform-typescript': 7.22.15(@babel/core@7.22.17)
-      '@vue/babel-plugin-jsx': 1.1.5(@babel/core@7.23.2)
+      '@vue/babel-plugin-jsx': 1.1.5(@babel/core@7.22.17)
       vite: 4.5.0(@types/node@20.8.7)
       vue: 3.3.6(typescript@5.2.2)
     transitivePeerDependencies:
@@ -2661,7 +2674,7 @@ packages:
   /@vitest/snapshot@0.34.6:
     resolution: {integrity: sha512-B3OZqYn6k4VaN011D+ve+AA4whM4QkcwcrwaKwAbyyvS/NB1hCWjFIBQxAQQSQir9/RtyAAGuq+4RJmbn2dH4w==}
     dependencies:
-      magic-string: 0.30.5
+      magic-string: 0.30.3
       pathe: 1.1.1
       pretty-format: 29.7.0
     dev: true
@@ -2672,19 +2685,27 @@ packages:
       tinyspy: 2.2.0
     dev: true
 
-  /@vitest/ui@0.34.6(vitest@0.34.6):
+  /@vitest/ui@0.34.4(vitest@0.34.6):
-    resolution: {integrity: sha512-/fxnCwGC0Txmr3tF3BwAbo3v6U2SkBTGR9UB8zo0Ztlx0BTOXHucE0gDHY7SjwEktCOHatiGmli9kZD6gYSoWQ==}
+    resolution: {integrity: sha512-gz0m0r9ErFG32r+DRdwuLJpUDpbi+jrMcw9nJZAau48Fs4LDIBg561PvczvGqyYxzbyFU7vgkSnSlSDfK0d53w==}
     peerDependencies:
       vitest: '>=0.30.1 <1'
     dependencies:
-      '@vitest/utils': 0.34.6
+      '@vitest/utils': 0.34.4
       fast-glob: 3.3.1
       fflate: 0.8.1
       flatted: 3.2.9
       pathe: 1.1.1
       picocolors: 1.0.0
       sirv: 2.0.3
-      vitest: 0.34.6(@vitest/ui@0.34.6)
+      vitest: 0.34.6(@vitest/ui@0.34.4)
+    dev: true
+
+  /@vitest/utils@0.34.4:
+    resolution: {integrity: sha512-yR2+5CHhp/K4ySY0Qtd+CAL9f5Yh1aXrKfAT42bq6CtlGPh92jIDDDSg7ydlRow1CP+dys4TrOrbELOyNInHSg==}
+    dependencies:
+      diff-sequences: 29.6.3
+      loupe: 2.3.7
+      pretty-format: 29.7.0
     dev: true
 
   /@vitest/utils@0.34.6:
@@ -2717,14 +2738,14 @@ packages:
     resolution: {integrity: sha512-SgUymFpMoAyWeYWLAY+MkCK3QEROsiUnfaw5zxOVD/M64KQs8D/4oK6Q5omVA2hnvEOE0SCkH2TZxs/jnnUj7w==}
     dev: true
 
-  /@vue/babel-plugin-jsx@1.1.5(@babel/core@7.23.2):
+  /@vue/babel-plugin-jsx@1.1.5(@babel/core@7.22.17):
     resolution: {integrity: sha512-nKs1/Bg9U1n3qSWnsHhCVQtAzI6aQXqua8j/bZrau8ywT1ilXQbK4FwEJGmU8fV7tcpuFvWmmN7TMmV1OBma1g==}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/helper-module-imports': 7.22.15
-      '@babel/plugin-syntax-jsx': 7.22.5(@babel/core@7.23.2)
+      '@babel/plugin-syntax-jsx': 7.22.5(@babel/core@7.22.17)
       '@babel/template': 7.22.15
       '@babel/traverse': 7.23.2
       '@babel/types': 7.23.0
@@ -3313,7 +3334,7 @@ packages:
     hasBin: true
     dependencies:
       caniuse-lite: 1.0.30001553
-      electron-to-chromium: 1.4.564
+      electron-to-chromium: 1.4.565
       node-releases: 2.0.13
       update-browserslist-db: 1.0.13(browserslist@4.22.1)
 
@@ -3766,12 +3787,6 @@ packages:
   /commander@11.0.0:
     resolution: {integrity: sha512-9HMlXtt/BNoYr8ooyjjNRdIilOTkVJXB+GhxMTtOKwk0R4j4lS4NpjuqmRxroBfnfTSHQIHQB7wryHhXarNjmQ==}
     engines: {node: '>=16'}
-    dev: true
-
-  /commander@11.1.0:
-    resolution: {integrity: sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==}
-    engines: {node: '>=16'}
-    dev: false
 
   /commander@2.20.3:
     resolution: {integrity: sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==}
@@ -3863,10 +3878,6 @@ packages:
 
   /convert-source-map@1.9.0:
     resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==}
-    dev: false
-
-  /convert-source-map@2.0.0:
-    resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
 
   /copy-concurrently@1.0.5:
     resolution: {integrity: sha512-f2domd9fsVDFtaFcbaRZuYXwtdmnzqbADSwhSWYxYB/Q8zsdUUFMXVRwXGDMWmbEzAn1kdRrtI1T/KTFOL4X2A==}
@@ -4415,8 +4426,8 @@ packages:
     engines: {node: '>=14.19.3'}
     hasBin: true
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
-      '@babel/preset-typescript': 7.23.2(@babel/core@7.23.2)
+      '@babel/preset-typescript': 7.23.2(@babel/core@7.22.17)
       '@vue/compiler-dom': 3.3.6
       '@vuedx/compiler-sfc': 0.7.1
       '@vuedx/template-ast-types': 0.7.1
@@ -4542,8 +4553,8 @@ packages:
       semver: 6.3.1
     dev: false
 
-  /electron-to-chromium@1.4.564:
+  /electron-to-chromium@1.4.565:
-    resolution: {integrity: sha512-bGAx9+teIzL5I4esQwCMtiXtb78Ysc8xOKTPOvmafbJZ4SQ40kDO1ym3yRcGSkfaBtV81fGgHOgPoe6DsmpmkA==}
+    resolution: {integrity: sha512-XbMoT6yIvg2xzcbs5hCADi0dXBh4//En3oFXmtPX+jiyyiCTiM9DGFT2SLottjpEs9Z8Mh8SqahbR96MaHfuSg==}
 
   /elkjs@0.8.2:
     resolution: {integrity: sha512-L6uRgvZTH+4OF5NE/MBbzQx/WYpru1xCBE9respNj6qznEewGUIfhzmm7horWWxbNO2M0WckQypGctR8lH79xQ==}
@@ -4893,7 +4904,7 @@ packages:
       '@eslint-community/eslint-utils': 4.4.0(eslint@8.52.0)
       eslint: 8.52.0
       eslint-compat-utils: 0.1.2(eslint@8.52.0)
-      jsonc-eslint-parser: 2.3.0
+      jsonc-eslint-parser: 2.4.0
       natural-compare: 1.4.0
     dev: true
 
@@ -4980,8 +4991,8 @@ packages:
       eslint-rule-composer: 0.3.0
     dev: true
 
-  /eslint-plugin-vue@9.17.0(eslint@8.52.0):
+  /eslint-plugin-vue@9.18.0(eslint@8.52.0):
-    resolution: {integrity: sha512-r7Bp79pxQk9I5XDP0k2dpUC7Ots3OSWgvGZNu3BxmKK6Zg7NgVtcOB6OCna5Kb9oQwJPl5hq183WD0SY5tZtIQ==}
+    resolution: {integrity: sha512-yUM8a2OD/7Qs0PiugkRaxgz5KBRvzMvWShity2UvVFAN0yk8029mGpTdg/TNARPiYzp335mEwDHwcAR8tQNe4g==}
     engines: {node: ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: ^6.2.0 || ^7.0.0 || ^8.0.0
@@ -6488,8 +6499,8 @@ packages:
     engines: {node: '>=6'}
     hasBin: true
 
-  /jsonc-eslint-parser@2.3.0:
+  /jsonc-eslint-parser@2.4.0:
-    resolution: {integrity: sha512-9xZPKVYp9DxnM3sd1yAsh/d59iIaswDkai8oTxbursfKYbg/ibjX0IzFt35+VZ8iEW453TVTXztnRvYUQlAfUQ==}
+    resolution: {integrity: sha512-WYDyuc/uFcGp6YtM2H0uKmUwieOuzeE/5YocFJLnLfclZ4inf3mRn8ZVy1s7Hxji7Jxm6Ss8gqpexD/GlKoGgg==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dependencies:
       acorn: 8.10.0
@@ -6786,6 +6797,12 @@ packages:
     hasBin: true
     dev: false
 
+  /magic-string@0.30.3:
+    resolution: {integrity: sha512-B7xGbll2fG/VjP+SWg4sX3JynwIU0mjoTc6MPpKNuIvftk6u6vqhDnk1R80b8C2GBR6ywqy+1DcKBrevBg+bmw==}
+    engines: {node: '>=12'}
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.4.15
+
   /magic-string@0.30.5:
     resolution: {integrity: sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==}
     engines: {node: '>=12'}
@@ -8054,8 +8071,8 @@ packages:
     resolution: {integrity: sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw==}
     dev: false
 
-  /radix-vue@0.4.1(vue@3.3.6):
+  /radix-vue@1.0.0(vue@3.3.6):
-    resolution: {integrity: sha512-uJLHSwCzvUzaXYdr3r5HkhQ7bATegpvo3pAscPM1TDVCuGrVtnD3/7DpLPvDRkrwibWcu855agoqHSPsukQL3g==}
+    resolution: {integrity: sha512-93OXRmRXyBQXue286urMvXX9/sri3ODEjdJHca04aN0V/YLGpx9Muvu3f2FOlh6RlccoxvQ8EUtd2sl120XUSA==}
     dependencies:
       '@floating-ui/dom': 1.5.3
       '@floating-ui/vue': 1.0.2(vue@3.3.6)
@@ -9328,8 +9345,8 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  /type-fest@4.5.0:
+  /type-fest@4.3.1:
-    resolution: {integrity: sha512-diLQivFzddJl4ylL3jxSkEc39Tpw7o1QeEHIPxVwryDK2lpB7Nqhzhuo6v5/Ls08Z0yPSAhsyAWlv1/H0ciNmw==}
+    resolution: {integrity: sha512-pphNW/msgOUSkJbH58x8sqpq8uQj6b0ZKGxEsLKMUnGorRcDjrUaLS+39+/ub41JNTwrrMyJcUB8+YZs3mbwqw==}
     engines: {node: '>=16'}
 
   /typed-array-buffer@1.0.0:
@@ -9405,7 +9422,7 @@ packages:
     dependencies:
       acorn: 8.10.0
       estree-walker: 3.0.3
-      magic-string: 0.30.5
+      magic-string: 0.30.3
       unplugin: 1.5.0
     dev: false
 
@@ -9419,7 +9436,7 @@ packages:
       escape-string-regexp: 5.0.0
       fast-glob: 3.3.1
       local-pkg: 0.4.3
-      magic-string: 0.30.5
+      magic-string: 0.30.3
       mlly: 1.4.2
       pathe: 1.1.1
       pkg-types: 1.0.3
@@ -9521,7 +9538,7 @@ packages:
     resolution: {integrity: sha512-Egkr/s4zcMTEuulcIb7dgURS6QpN7DyqQYdf+jBtiaJvQ+eRsrtWUoX84SbvQWuLkXsOjM+8sJC9u6KoMK/U7Q==}
     hasBin: true
     dependencies:
-      '@babel/core': 7.23.2
+      '@babel/core': 7.22.17
       '@babel/standalone': 7.23.2
       '@babel/types': 7.23.0
       defu: 6.1.2
@@ -9633,7 +9650,7 @@ packages:
       vue: ^3.3.4
     dependencies:
       '@vue/devtools-api': 6.5.1
-      type-fest: 4.5.0
+      type-fest: 4.3.1
       vue: 3.3.6(typescript@5.2.2)
     dev: false
 
@@ -9764,7 +9781,7 @@ packages:
       - universal-cookie
     dev: true
 
-  /vitest@0.34.6(@vitest/ui@0.34.6):
+  /vitest@0.34.6(@vitest/ui@0.34.4):
     resolution: {integrity: sha512-+5CALsOvbNKnS+ZHMXtuUC7nL8/7F1F2DnHGjSsszX8zCjWSSviphCb/NuS9Nzf4Q03KyyDRBAXhF/8lffME4Q==}
     engines: {node: '>=v14.18.0'}
     hasBin: true
@@ -9802,7 +9819,7 @@ packages:
       '@vitest/runner': 0.34.6
       '@vitest/snapshot': 0.34.6
       '@vitest/spy': 0.34.6
-      '@vitest/ui': 0.34.6(vitest@0.34.6)
+      '@vitest/ui': 0.34.4(vitest@0.34.6)
       '@vitest/utils': 0.34.6
       acorn: 8.10.0
       acorn-walk: 8.2.0
@@ -9810,7 +9827,7 @@ packages:
       chai: 4.3.10
       debug: 4.3.4
       local-pkg: 0.4.3
-      magic-string: 0.30.5
+      magic-string: 0.30.3
       pathe: 1.1.1
       picocolors: 1.0.0
       std-env: 3.4.3