feat: toggle group (#275)

* feat: toggle group

* chore: remove dummy examples

* chore: update pathe and typescript, include scripts in tsconfig include

* refactor: move import type from normal script to script setup

don't know how detypes would react with that normal script

apps/www/.vitepress/theme/config/docs.ts

@@ -330,6 +330,11 @@ export const docsConfig: DocsConfig = {
           href: '/docs/components/toggle',
           items: [],
         },
+        {
+          title: 'Toggle Group',
+          href: '/docs/components/toggle-group',
+          items: [],
+        },
         {
           title: 'Tooltip',
           href: '/docs/components/tooltip',

apps/www/__registry__/index.ts

@@ -716,6 +716,48 @@ export const Index = {
       component: () => import('../src/lib/registry/default/example/ToggleSmallDemo.vue').then(m => m.default),
       files: ['../src/lib/registry/default/example/ToggleSmallDemo.vue'],
     },
+    ToggleGroupDemo: {
+      name: 'ToggleGroupDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/default/example/ToggleGroupDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/default/example/ToggleGroupDemo.vue'],
+    },
+    ToggleGroupDisabledDemo: {
+      name: 'ToggleGroupDisabledDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/default/example/ToggleGroupDisabledDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/default/example/ToggleGroupDisabledDemo.vue'],
+    },
+    ToggleGroupLargeDemo: {
+      name: 'ToggleGroupLargeDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/default/example/ToggleGroupLargeDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/default/example/ToggleGroupLargeDemo.vue'],
+    },
+    ToggleGroupOutlineDemo: {
+      name: 'ToggleGroupOutlineDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/default/example/ToggleGroupOutlineDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/default/example/ToggleGroupOutlineDemo.vue'],
+    },
+    ToggleGroupSingleDemo: {
+      name: 'ToggleGroupSingleDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/default/example/ToggleGroupSingleDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/default/example/ToggleGroupSingleDemo.vue'],
+    },
+    ToggleGroupSmallDemo: {
+      name: 'ToggleGroupSmallDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/default/example/ToggleGroupSmallDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/default/example/ToggleGroupSmallDemo.vue'],
+    },
     TooltipDemo: {
       name: 'TooltipDemo',
       type: 'components:example',
@@ -1558,6 +1600,48 @@ export const Index = {
       component: () => import('../src/lib/registry/new-york/example/ToggleSmallDemo.vue').then(m => m.default),
       files: ['../src/lib/registry/new-york/example/ToggleSmallDemo.vue'],
     },
+    ToggleGroupDemo: {
+      name: 'ToggleGroupDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/new-york/example/ToggleGroupDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/new-york/example/ToggleGroupDemo.vue'],
+    },
+    ToggleGroupDisabledDemo: {
+      name: 'ToggleGroupDisabledDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/new-york/example/ToggleGroupDisabledDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/new-york/example/ToggleGroupDisabledDemo.vue'],
+    },
+    ToggleGroupLargeDemo: {
+      name: 'ToggleGroupLargeDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/new-york/example/ToggleGroupLargeDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/new-york/example/ToggleGroupLargeDemo.vue'],
+    },
+    ToggleGroupOutlineDemo: {
+      name: 'ToggleGroupOutlineDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/new-york/example/ToggleGroupOutlineDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/new-york/example/ToggleGroupOutlineDemo.vue'],
+    },
+    ToggleGroupSingleDemo: {
+      name: 'ToggleGroupSingleDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/new-york/example/ToggleGroupSingleDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/new-york/example/ToggleGroupSingleDemo.vue'],
+    },
+    ToggleGroupSmallDemo: {
+      name: 'ToggleGroupSmallDemo',
+      type: 'components:example',
+      registryDependencies: ['toggle-group'],
+      component: () => import('../src/lib/registry/new-york/example/ToggleGroupSmallDemo.vue').then(m => m.default),
+      files: ['../src/lib/registry/new-york/example/ToggleGroupSmallDemo.vue'],
+    },
     TooltipDemo: {
       name: 'TooltipDemo',
       type: 'components:example',

apps/www/package.json

@@ -54,12 +54,12 @@
     "@vue/tsconfig": "^0.5.1",
     "autoprefixer": "^10.4.16",
     "lodash.template": "^4.5.0",
-    "pathe": "^1.1.1",
+    "pathe": "^1.1.2",
     "rimraf": "^5.0.5",
     "tailwind-merge": "^2.0.0",
     "tailwindcss": "^3.3.5",
     "tsx": "^4.7.0",
-    "typescript": "^5.2.2",
+    "typescript": "^5.3.3",
     "unplugin-icons": "^0.17.1",
     "vite": "^4.5.0",
     "vitepress": "^1.0.0-rc.24",

apps/www/src/content/docs/components/toggle-group.md

@@ -0,0 +1,93 @@
+---
+title: Toggle Group
+description: A set of two-state buttons that can be toggled on or off.
+source: apps/www/src/lib/registry/default/ui/toggle-group
+primitive: https://www.radix-vue.com/components/toggle-group.html
+---
+
+<ComponentPreview name="ToggleGroupDemo" /> 
+
+## Installation
+
+<TabPreview name="CLI">
+<template #CLI>
+
+```bash
+npx shadcn-vue@latest add toggle-group
+```
+</template>
+
+<template #Manual>
+
+<Steps>
+
+### Install the following dependencies:
+
+```bash
+npm install radix-vue
+```
+
+### Copy and paste the following code into your project
+
+<<< @/lib/registry/default/ui/toggle-group/ToggleGroup.vue
+
+</Steps>
+
+</template>
+</TabPreview>
+
+## Usage
+
+```vue
+<script setup lang="ts">
+import { ToggleGroup, ToggleGroupItem } from '@/components/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="single">
+    <ToggleGroupItem value="a">
+      A
+    </ToggleGroupItem>
+    <ToggleGroupItem value="b">
+      B
+    </ToggleGroupItem>
+    <ToggleGroupItem value="c">
+      C
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>
+```
+
+## Examples
+
+### Default 
+
+<ComponentPreview name="ToggleGroupDemo" /> 
+
+
+### Outline
+
+<ComponentPreview name="ToggleGroupOutlineDemo" /> 
+
+
+### Single
+
+<ComponentPreview name="ToggleGroupSingleDemo" />
+
+
+### Small
+
+<ComponentPreview name="ToggleGroupSmallDemo" />
+
+
+### Large
+
+<ComponentPreview name="ToggleGroupLargeDemo" />
+
+
+### Disabled
+
+<ComponentPreview name="ToggleGroupDisabledDemo" />
+
+
+

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

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { Bold, Italic, Underline } from 'lucide-vue-next'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/default/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <Bold class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <Italic class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <Underline class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { Bold, Italic, Underline } from 'lucide-vue-next'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/default/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple" disabled>
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <Bold class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <Italic class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <Underline class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { Bold, Italic, Underline } from 'lucide-vue-next'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/default/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple" size="lg">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <Bold class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <Italic class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <Underline class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { Bold, Italic, Underline } from 'lucide-vue-next'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/default/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple" variant="outline">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <Bold class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <Italic class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <Underline class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { Bold, Italic, Underline } from 'lucide-vue-next'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/default/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="single">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <Bold class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <Italic class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <Underline class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { Bold, Italic, Underline } from 'lucide-vue-next'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/default/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple" size="sm">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <Bold class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <Italic class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <Underline class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

apps/www/src/lib/registry/default/example/index.ts

@@ -1 +0,0 @@
-export { default as AccordionDemo } from './AccordionDemo.vue'

apps/www/src/lib/registry/default/ui/toggle-group/ToggleGroup.vue

@@ -0,0 +1,34 @@
+<script setup lang="ts">
+import type { VariantProps } from 'class-variance-authority'
+import { type HTMLAttributes, computed, provide } from 'vue'
+import { ToggleGroupRoot, type ToggleGroupRootEmits, type ToggleGroupRootProps, useForwardPropsEmits } from 'radix-vue'
+import type { toggleVariants } from '@/lib/registry/default/ui/toggle'
+import { cn } from '@/lib/utils'
+
+type ToggleGroupVariants = VariantProps<typeof toggleVariants>
+
+const props = defineProps<ToggleGroupRootProps & {
+  class?: HTMLAttributes['class']
+  variant?: ToggleGroupVariants['variant']
+  size?: ToggleGroupVariants['size']
+}>()
+const emits = defineEmits<ToggleGroupRootEmits>()
+
+provide('toggleGroup', {
+  variant: props.variant,
+  size: props.size,
+})
+
+const delegatedProps = computed(() => {
+  const { class: _, ...delegated } = props
+  return delegated
+})
+
+const forwarded = useForwardPropsEmits(delegatedProps.value, emits)
+</script>
+
+<template>
+  <ToggleGroupRoot v-bind="forwarded" :class="cn('flex items-center justify-center gap-1', props.class)">
+    <slot />
+  </ToggleGroupRoot>
+</template>

apps/www/src/lib/registry/default/ui/toggle-group/ToggleGroupItem.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import type { VariantProps } from 'class-variance-authority'
+import { type HTMLAttributes, computed, inject } from 'vue'
+import { ToggleGroupItem, type ToggleGroupItemProps, useForwardProps } from 'radix-vue'
+import { toggleVariants } from '@/lib/registry/default/ui/toggle'
+import { cn } from '@/lib/utils'
+
+type ToggleGroupVariants = VariantProps<typeof toggleVariants>
+
+const props = defineProps<ToggleGroupItemProps & {
+  class?: HTMLAttributes['class']
+  variant?: ToggleGroupVariants['variant']
+  size?: ToggleGroupVariants['size']
+}>()
+
+const context = inject<ToggleGroupVariants>('toggleGroup')
+
+const delegatedProps = computed(() => {
+  const { class: _, variant, size, ...delegated } = props
+  return delegated
+})
+
+const forwardedProps = useForwardProps(delegatedProps.value)
+</script>
+
+<template>
+  <ToggleGroupItem
+    v-bind="forwardedProps" :class="cn(toggleVariants({
+      variant: context?.variant || variant,
+      size: context?.size || size,
+    }), props.class)"
+  >
+    <slot />
+  </ToggleGroupItem>
+</template>

apps/www/src/lib/registry/default/ui/toggle-group/index.ts

@@ -0,0 +1,2 @@
+export { default as ToggleGroup } from './ToggleGroup.vue'
+export { default as ToggleGroupItem } from './ToggleGroupItem.vue'

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

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import {
+  FontBoldIcon,
+  FontItalicIcon,
+  UnderlineIcon,
+} from '@radix-icons/vue'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/new-york/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <FontBoldIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <FontItalicIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <UnderlineIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import {
+  FontBoldIcon,
+  FontItalicIcon,
+  UnderlineIcon,
+} from '@radix-icons/vue'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/new-york/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple" disabled>
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <FontBoldIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <FontItalicIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <UnderlineIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import {
+  FontBoldIcon,
+  FontItalicIcon,
+  UnderlineIcon,
+} from '@radix-icons/vue'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/new-york/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple" size="lg">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <FontBoldIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <FontItalicIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <UnderlineIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import {
+  FontBoldIcon,
+  FontItalicIcon,
+  UnderlineIcon,
+} from '@radix-icons/vue'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/new-york/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple" variant="outline">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <FontBoldIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <FontItalicIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <UnderlineIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import {
+  FontBoldIcon,
+  FontItalicIcon,
+  UnderlineIcon,
+} from '@radix-icons/vue'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/new-york/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="single">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <FontBoldIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <FontItalicIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <UnderlineIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

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

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import {
+  FontBoldIcon,
+  FontItalicIcon,
+  UnderlineIcon,
+} from '@radix-icons/vue'
+
+import { ToggleGroup, ToggleGroupItem } from '@/lib/registry/new-york/ui/toggle-group'
+</script>
+
+<template>
+  <ToggleGroup type="multiple" size="sm">
+    <ToggleGroupItem value="bold" aria-label="Toggle bold">
+      <FontBoldIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="italic" aria-label="Toggle italic">
+      <FontItalicIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+    <ToggleGroupItem value="underline" aria-label="Toggle underline">
+      <UnderlineIcon class="h-4 w-4" />
+    </ToggleGroupItem>
+  </ToggleGroup>
+</template>

apps/www/src/lib/registry/new-york/example/index.ts

@@ -1 +0,0 @@
-export { default as AccordionDemo } from './AccordionDemo.vue'

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

@@ -0,0 +1,34 @@
+<script setup lang="ts">
+import type { VariantProps } from 'class-variance-authority'
+import { type HTMLAttributes, computed, provide } from 'vue'
+import { ToggleGroupRoot, type ToggleGroupRootEmits, type ToggleGroupRootProps, useForwardPropsEmits } from 'radix-vue'
+import type { toggleVariants } from '@/lib/registry/new-york/ui/toggle'
+import { cn } from '@/lib/utils'
+
+type ToggleGroupVariants = VariantProps<typeof toggleVariants>
+
+const props = defineProps<ToggleGroupRootProps & {
+  class?: HTMLAttributes['class']
+  variant?: ToggleGroupVariants['variant']
+  size?: ToggleGroupVariants['size']
+}>()
+const emits = defineEmits<ToggleGroupRootEmits>()
+
+provide('toggleGroup', {
+  variant: props.variant,
+  size: props.size,
+})
+
+const delegatedProps = computed(() => {
+  const { class: _, ...delegated } = props
+  return delegated
+})
+
+const forwarded = useForwardPropsEmits(delegatedProps.value, emits)
+</script>
+
+<template>
+  <ToggleGroupRoot v-bind="forwarded" :class="cn('flex items-center justify-center gap-1', props.class)">
+    <slot />
+  </ToggleGroupRoot>
+</template>

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

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import type { VariantProps } from 'class-variance-authority'
+import { type HTMLAttributes, computed, inject } from 'vue'
+import { ToggleGroupItem, type ToggleGroupItemProps, useForwardProps } from 'radix-vue'
+import { toggleVariants } from '@/lib/registry/new-york/ui/toggle'
+import { cn } from '@/lib/utils'
+
+type ToggleGroupVariants = VariantProps<typeof toggleVariants>
+
+const props = defineProps<ToggleGroupItemProps & {
+  class?: HTMLAttributes['class']
+  variant?: ToggleGroupVariants['variant']
+  size?: ToggleGroupVariants['size']
+}>()
+
+const context = inject<ToggleGroupVariants>('toggleGroup')
+
+const delegatedProps = computed(() => {
+  const { class: _, variant, size, ...delegated } = props
+  return delegated
+})
+
+const forwardedProps = useForwardProps(delegatedProps.value)
+</script>
+
+<template>
+  <ToggleGroupItem
+    v-bind="forwardedProps" :class="cn(toggleVariants({
+      variant: context?.variant || variant,
+      size: context?.size || size,
+    }), props.class)"
+  >
+    <slot />
+  </ToggleGroupItem>
+</template>

apps/www/src/lib/registry/new-york/ui/toggle-group/index.ts

@@ -0,0 +1,2 @@
+export { default as ToggleGroup } from './ToggleGroup.vue'
+export { default as ToggleGroupItem } from './ToggleGroupItem.vue'

apps/www/src/public/registry/index.json

@@ -610,6 +610,19 @@
     ],
     "type": "components:ui"
   },
+  {
+    "name": "toggle-group",
+    "dependencies": [],
+    "registryDependencies": [
+      "utils"
+    ],
+    "files": [
+      "ui/toggle-group/ToggleGroup.vue",
+      "ui/toggle-group/ToggleGroupItem.vue",
+      "ui/toggle-group/index.ts"
+    ],
+    "type": "components:ui"
+  },
   {
     "name": "tooltip",
     "dependencies": [],
@@ -625,4 +638,4 @@
     ],
     "type": "components:ui"
   }
-]
+]

apps/www/tsconfig.json

@@ -12,6 +12,6 @@
     "sourceMap": true,
     "outDir": "dist"
   },
-  "include": ["src", ".vitepress/**/*.vue", ".vitepress/**/*.mts", ".vitepress/**/*.vue", "src/lib/**/*"],
+  "include": ["src", ".vitepress/**/*.vue", "scripts/build-registry.ts", ".vitepress/**/*.mts", ".vitepress/**/*.vue", "src/lib/**/*"],
-  "exclude": ["node_modules", "./scripts/build-registry.ts"]
+  "exclude": ["node_modules"]
 }

pnpm-lock.yaml

@@ -109,7 +109,7 @@ importers:
         version: 4.12.3(vue@3.4.8)
       vue:
         specifier: ^3.4.7
-        version: 3.4.8(typescript@5.2.2)
+        version: 3.4.8(typescript@5.3.3)
       vue-wrap-balancer:
         specifier: ^1.1.3
         version: 1.1.3(vue@3.4.8)
@@ -157,8 +157,8 @@ importers:
         specifier: ^4.5.0
         version: 4.5.0
       pathe:
-        specifier: ^1.1.1
+        specifier: ^1.1.2
-        version: 1.1.1
+        version: 1.1.2
       rimraf:
         specifier: ^5.0.5
         version: 5.0.5
@@ -172,8 +172,8 @@ importers:
         specifier: ^4.7.0
         version: 4.7.0
       typescript:
-        specifier: ^5.2.2
+        specifier: ^5.3.3
-        version: 5.2.2
+        version: 5.3.3
       unplugin-icons:
         specifier: ^0.17.1
         version: 0.17.1
@@ -182,10 +182,10 @@ importers:
         version: 4.5.0(@types/node@20.8.10)
       vitepress:
         specifier: ^1.0.0-rc.24
-        version: 1.0.0-rc.24(@algolia/client-search@4.22.0)(@types/node@20.8.10)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.2.2)
+        version: 1.0.0-rc.24(@algolia/client-search@4.22.0)(@types/node@20.8.10)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.3.3)
       vue-tsc:
         specifier: ^1.8.27
-        version: 1.8.27(typescript@5.2.2)
+        version: 1.8.27(typescript@5.3.3)
 
   packages/cli:
     dependencies:
@@ -1223,13 +1223,13 @@ packages:
       '@types/node': 20.4.7
       chalk: 4.1.2
       cosmiconfig: 8.3.6(typescript@5.2.2)
-      cosmiconfig-typescript-loader: 4.4.0(@types/node@20.4.7)(cosmiconfig@8.3.6)(ts-node@10.9.1)(typescript@5.2.2)
+      cosmiconfig-typescript-loader: 4.4.0(@types/node@20.4.7)(cosmiconfig@8.3.6)(ts-node@10.9.1)(typescript@5.3.3)
       lodash.isplainobject: 4.0.6
       lodash.merge: 4.6.2
       lodash.uniq: 4.5.0
       resolve-from: 5.0.0
       ts-node: 10.9.1(@types/node@20.4.7)(typescript@5.2.2)
-      typescript: 5.2.2
+      typescript: 5.3.3
     transitivePeerDependencies:
       - '@swc/core'
       - '@swc/wasm'
@@ -2386,7 +2386,7 @@ packages:
     resolution: {integrity: sha512-vxE3fNGgQEEu2nvMuR/g4Cu/CxPpQWjc3cwsk/KY3iTN4hLKL0lnBsi1GmQL1ITSsyib2f72h329j+D9S9esbg==}
     dependencies:
       '@iconify/types': 2.0.0
-      pathe: 1.1.1
+      pathe: 1.1.2
     dev: true
 
   /@iconify/types@2.0.0:
@@ -2412,7 +2412,7 @@ packages:
       vue: '>=3'
     dependencies:
       '@iconify/types': 2.0.0
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: true
 
   /@ioredis/commands@1.2.0:
@@ -2577,7 +2577,7 @@ packages:
     dependencies:
       '@morev/utils': 2.8.1
       '@nuxt/kit': 3.7.4
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     transitivePeerDependencies:
       - rollup
       - supports-color
@@ -2749,7 +2749,7 @@ packages:
       execa: 7.2.0
       global-directory: 4.0.1
       magicast: 0.3.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       prompts: 2.4.2
       rc9: 2.1.1
@@ -2788,7 +2788,7 @@ packages:
       ofetch: 1.3.3
       ohash: 1.1.3
       pacote: 17.0.4
-      pathe: 1.1.1
+      pathe: 1.1.2
       perfect-debounce: 1.0.0
       pkg-types: 1.0.3
       rc9: 2.1.1
@@ -2830,11 +2830,11 @@ packages:
       eslint: ^8.48.0
     dependencies:
       '@rushstack/eslint-patch': 1.6.0
-      '@typescript-eslint/eslint-plugin': 6.7.3(@typescript-eslint/parser@6.7.3)(eslint@8.56.0)(typescript@5.2.2)
+      '@typescript-eslint/eslint-plugin': 6.7.3(@typescript-eslint/parser@6.7.3)(eslint@8.56.0)(typescript@5.3.3)
       '@typescript-eslint/parser': 6.7.3(eslint@8.56.0)(typescript@5.3.3)
       eslint: 8.56.0
       eslint-plugin-vue: 9.17.0(eslint@8.56.0)
-      typescript: 5.2.2
+      typescript: 5.3.3
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -2853,7 +2853,7 @@ packages:
       jiti: 1.20.0
       knitwork: 1.0.0
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       scule: 1.0.0
       semver: 7.5.4
@@ -2880,7 +2880,7 @@ packages:
       jiti: 1.21.0
       knitwork: 1.0.0
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       scule: 1.0.0
       semver: 7.5.4
@@ -2907,7 +2907,7 @@ packages:
       jiti: 1.21.0
       knitwork: 1.0.0
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       scule: 1.1.0
       semver: 7.5.4
@@ -2931,7 +2931,7 @@ packages:
       consola: 3.2.3
       mlly: 1.4.2
       nuxi: 3.10.0
-      pathe: 1.1.1
+      pathe: 1.1.2
       unbuild: 2.0.0(typescript@5.3.3)
     transitivePeerDependencies:
       - sass
@@ -2947,7 +2947,7 @@ packages:
       consola: 3.2.3
       defu: 6.1.2
       hookable: 5.5.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       postcss-import-resolver: 2.0.0
       std-env: 3.4.3
@@ -2967,7 +2967,7 @@ packages:
       consola: 3.2.3
       defu: 6.1.3
       hookable: 5.5.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       std-env: 3.4.3
       ufo: 1.3.2
@@ -2986,7 +2986,7 @@ packages:
       consola: 3.2.3
       defu: 6.1.3
       hookable: 5.5.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       scule: 1.1.0
       std-env: 3.5.0
@@ -3015,7 +3015,7 @@ packages:
       nanoid: 4.0.2
       ofetch: 1.3.3
       parse-git-config: 3.0.0
-      pathe: 1.1.1
+      pathe: 1.1.2
       rc9: 2.1.1
       std-env: 3.5.0
     transitivePeerDependencies:
@@ -3046,7 +3046,7 @@ packages:
       execa: 8.0.1
       get-port-please: 3.1.1
       ofetch: 1.3.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       ufo: 1.3.2
       vitest: 0.33.0
       vue: 3.4.8(typescript@5.3.3)
@@ -3084,7 +3084,7 @@ packages:
       magic-string: 0.30.5
       mlly: 1.4.2
       ohash: 1.1.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       perfect-debounce: 1.0.0
       pkg-types: 1.0.3
       postcss: 8.4.31
@@ -3327,7 +3327,7 @@ packages:
     peerDependencies:
       vue: '>= 3'
     dependencies:
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: false
 
   /@rollup/plugin-alias@5.1.0(rollup@3.29.3):
@@ -3776,7 +3776,7 @@ packages:
       vue: ^3.2.33
     dependencies:
       '@tanstack/table-core': 8.10.7
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: false
 
   /@tootallnate/once@2.0.0:
@@ -4303,7 +4303,7 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/eslint-plugin@6.7.3(@typescript-eslint/parser@6.7.3)(eslint@8.56.0)(typescript@5.2.2):
+  /@typescript-eslint/eslint-plugin@6.7.3(@typescript-eslint/parser@6.7.3)(eslint@8.56.0)(typescript@5.3.3):
     resolution: {integrity: sha512-vntq452UHNltxsaaN+L9WyuMch8bMd9CqJ3zhzTPXXidwbf5mqqKCVXEuvRZUqLJSTLeWE65lQwyXsRGnXkCTA==}
     engines: {node: ^16.0.0 || >=18.0.0}
     peerDependencies:
@@ -4317,8 +4317,8 @@ packages:
       '@eslint-community/regexpp': 4.9.0
       '@typescript-eslint/parser': 6.7.3(eslint@8.56.0)(typescript@5.3.3)
       '@typescript-eslint/scope-manager': 6.7.3
-      '@typescript-eslint/type-utils': 6.7.3(eslint@8.56.0)(typescript@5.2.2)
+      '@typescript-eslint/type-utils': 6.7.3(eslint@8.56.0)(typescript@5.3.3)
-      '@typescript-eslint/utils': 6.7.3(eslint@8.56.0)(typescript@5.2.2)
+      '@typescript-eslint/utils': 6.7.3(eslint@8.56.0)(typescript@5.3.3)
       '@typescript-eslint/visitor-keys': 6.7.3
       debug: 4.3.4
       eslint: 8.56.0
@@ -4326,8 +4326,8 @@ packages:
       ignore: 5.2.4
       natural-compare: 1.4.0
       semver: 7.5.4
-      ts-api-utils: 1.0.3(typescript@5.2.2)
+      ts-api-utils: 1.0.3(typescript@5.3.3)
-      typescript: 5.2.2
+      typescript: 5.3.3
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -4410,7 +4410,7 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/type-utils@6.7.3(eslint@8.56.0)(typescript@5.2.2):
+  /@typescript-eslint/type-utils@6.7.3(eslint@8.56.0)(typescript@5.3.3):
     resolution: {integrity: sha512-Fc68K0aTDrKIBvLnKTZ5Pf3MXK495YErrbHb1R6aTpfK5OdSFj0rVN7ib6Tx6ePrZ2gsjLqr0s98NG7l96KSQw==}
     engines: {node: ^16.0.0 || >=18.0.0}
     peerDependencies:
@@ -4420,12 +4420,12 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/typescript-estree': 6.7.3(typescript@5.2.2)
+      '@typescript-eslint/typescript-estree': 6.7.3(typescript@5.3.3)
-      '@typescript-eslint/utils': 6.7.3(eslint@8.56.0)(typescript@5.2.2)
+      '@typescript-eslint/utils': 6.7.3(eslint@8.56.0)(typescript@5.3.3)
       debug: 4.3.4
       eslint: 8.56.0
-      ts-api-utils: 1.0.3(typescript@5.2.2)
+      ts-api-utils: 1.0.3(typescript@5.3.3)
-      typescript: 5.2.2
+      typescript: 5.3.3
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -4542,7 +4542,7 @@ packages:
       - typescript
     dev: true
 
-  /@typescript-eslint/utils@6.7.3(eslint@8.56.0)(typescript@5.2.2):
+  /@typescript-eslint/utils@6.7.3(eslint@8.56.0)(typescript@5.3.3):
     resolution: {integrity: sha512-vzLkVder21GpWRrmSR9JxGZ5+ibIUSudXlW52qeKpzUEQhRSmyZiVDDj3crAth7+5tmN1ulvgKaCU2f/bPRCzg==}
     engines: {node: ^16.0.0 || >=18.0.0}
     peerDependencies:
@@ -4553,7 +4553,7 @@ packages:
       '@types/semver': 7.5.3
       '@typescript-eslint/scope-manager': 6.7.3
       '@typescript-eslint/types': 6.7.3
-      '@typescript-eslint/typescript-estree': 6.7.3(typescript@5.2.2)
+      '@typescript-eslint/typescript-estree': 6.7.3(typescript@5.3.3)
       eslint: 8.56.0
       semver: 7.5.4
     transitivePeerDependencies:
@@ -4676,7 +4676,7 @@ packages:
       vue: ^3
     dependencies:
       '@unovis/ts': 1.2.3
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: false
 
   /@vee-validate/zod@4.12.3(vue@3.4.8):
@@ -4721,7 +4721,7 @@ packages:
       '@babel/plugin-transform-typescript': 7.22.15(@babel/core@7.23.0)
       '@vue/babel-plugin-jsx': 1.1.5(@babel/core@7.23.0)
       vite: 4.5.0(@types/node@20.8.10)
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -4750,7 +4750,7 @@ packages:
       vue: ^3.2.25
     dependencies:
       vite: 4.5.0(@types/node@20.8.10)
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: true
 
   /@vitejs/plugin-vue@4.4.0(vite@4.5.0)(vue@3.4.8):
@@ -4761,7 +4761,7 @@ packages:
       vue: ^3.2.25
     dependencies:
       vite: 4.5.0(@types/node@20.8.10)
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: true
 
   /@vitejs/plugin-vue@4.5.0(vite@4.5.0)(vue@3.4.8):
@@ -4796,7 +4796,7 @@ packages:
     dependencies:
       '@vitest/utils': 0.33.0
       p-limit: 4.0.0
-      pathe: 1.1.1
+      pathe: 1.1.2
     dev: true
 
   /@vitest/runner@0.34.6:
@@ -4804,14 +4804,14 @@ packages:
     dependencies:
       '@vitest/utils': 0.34.6
       p-limit: 4.0.0
-      pathe: 1.1.1
+      pathe: 1.1.2
     dev: true
 
   /@vitest/snapshot@0.33.0:
     resolution: {integrity: sha512-tJjrl//qAHbyHajpFvr8Wsk8DIOODEebTu7pgBrP07iOepR5jYkLFiqLq2Ltxv+r0uptUb4izv1J8XBOwKkVYA==}
     dependencies:
       magic-string: 0.30.5
-      pathe: 1.1.1
+      pathe: 1.1.2
       pretty-format: 29.7.0
     dev: true
 
@@ -4819,7 +4819,7 @@ packages:
     resolution: {integrity: sha512-B3OZqYn6k4VaN011D+ve+AA4whM4QkcwcrwaKwAbyyvS/NB1hCWjFIBQxAQQSQir9/RtyAAGuq+4RJmbn2dH4w==}
     dependencies:
       magic-string: 0.30.5
-      pathe: 1.1.1
+      pathe: 1.1.2
       pretty-format: 29.7.0
     dev: true
 
@@ -4844,7 +4844,7 @@ packages:
       fast-glob: 3.3.1
       fflate: 0.8.1
       flatted: 3.2.9
-      pathe: 1.1.1
+      pathe: 1.1.2
       picocolors: 1.0.0
       sirv: 2.0.3
       vitest: 0.34.6(@vitest/ui@0.34.5)
@@ -5083,7 +5083,7 @@ packages:
   /@vue/devtools-api@6.5.1:
     resolution: {integrity: sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA==}
 
-  /@vue/language-core@1.8.27(typescript@5.2.2):
+  /@vue/language-core@1.8.27(typescript@5.3.3):
     resolution: {integrity: sha512-L8Kc27VdQserNaCUNiSFdDl9LWT24ly8Hpwf1ECy3aFb9m6bDhBGQYOujDm21N7EW3moKIOKEanQwe1q5BK+mA==}
     peerDependencies:
       typescript: '*'
@@ -5099,7 +5099,7 @@ packages:
       minimatch: 9.0.3
       muggle-string: 0.3.1
       path-browserify: 1.0.1
-      typescript: 5.2.2
+      typescript: 5.3.3
       vue-template-compiler: 2.7.14
     dev: true
 
@@ -5564,7 +5564,7 @@ packages:
     dependencies:
       '@babel/parser': 7.23.6
       '@rollup/pluginutils': 5.1.0(rollup@3.29.3)
-      pathe: 1.1.1
+      pathe: 1.1.2
     transitivePeerDependencies:
       - rollup
     dev: true
@@ -5575,7 +5575,7 @@ packages:
     dependencies:
       '@babel/parser': 7.23.6
       '@rollup/pluginutils': 5.0.4(rollup@3.29.3)
-      pathe: 1.1.1
+      pathe: 1.1.2
     transitivePeerDependencies:
       - rollup
     dev: true
@@ -5862,7 +5862,7 @@ packages:
       jiti: 1.20.0
       mlly: 1.4.2
       ohash: 1.1.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       perfect-debounce: 1.0.0
       pkg-types: 1.0.3
       rc9: 2.1.1
@@ -5879,7 +5879,7 @@ packages:
       jiti: 1.21.0
       mlly: 1.4.2
       ohash: 1.1.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       perfect-debounce: 1.0.0
       pkg-types: 1.0.3
       rc9: 2.1.1
@@ -5896,7 +5896,7 @@ packages:
       jiti: 1.21.0
       mlly: 1.4.2
       ohash: 1.1.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       perfect-debounce: 1.0.0
       pkg-types: 1.0.3
       rc9: 2.1.1
@@ -6444,7 +6444,7 @@ packages:
   /core-util-is@1.0.3:
     resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
 
-  /cosmiconfig-typescript-loader@4.4.0(@types/node@20.4.7)(cosmiconfig@8.3.6)(ts-node@10.9.1)(typescript@5.2.2):
+  /cosmiconfig-typescript-loader@4.4.0(@types/node@20.4.7)(cosmiconfig@8.3.6)(ts-node@10.9.1)(typescript@5.3.3):
     resolution: {integrity: sha512-BabizFdC3wBHhbI4kJh0VkQP9GkBfoHPydD0COMce1nJ1kJAB3F2TmJ/I7diULBKtmEWSwEbuN/KDtgnmUUVmw==}
     engines: {node: '>=v14.21.3'}
     peerDependencies:
@@ -6456,7 +6456,7 @@ packages:
       '@types/node': 20.4.7
       cosmiconfig: 8.3.6(typescript@5.2.2)
       ts-node: 10.9.1(@types/node@20.4.7)(typescript@5.2.2)
-      typescript: 5.2.2
+      typescript: 5.3.3
     dev: true
 
   /cosmiconfig@7.1.0:
@@ -7177,7 +7177,7 @@ packages:
       '@vuedx/template-ast-types': 0.7.1
       fast-glob: 3.3.1
       prettier: 2.8.8
-      typescript: 5.2.2
+      typescript: 5.3.3
     transitivePeerDependencies:
       - supports-color
     dev: false
@@ -7347,7 +7347,7 @@ packages:
     dependencies:
       embla-carousel: 8.0.0-rc19
       embla-carousel-reactive-utils: 8.0.0-rc19(embla-carousel@8.0.0-rc19)
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: false
 
   /embla-carousel@8.0.0-rc19:
@@ -8145,7 +8145,7 @@ packages:
     dependencies:
       enhanced-resolve: 5.15.0
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       ufo: 1.3.2
     dev: true
 
@@ -8519,7 +8519,7 @@ packages:
       https-proxy-agent: 5.0.1
       mri: 1.2.0
       node-fetch-native: 1.4.0
-      pathe: 1.1.1
+      pathe: 1.1.2
       tar: 6.2.0
     transitivePeerDependencies:
       - supports-color
@@ -8533,7 +8533,7 @@ packages:
       https-proxy-agent: 7.0.2
       mri: 1.2.0
       node-fetch-native: 1.4.1
-      pathe: 1.1.1
+      pathe: 1.1.2
       tar: 6.2.0
     transitivePeerDependencies:
       - supports-color
@@ -8548,7 +8548,7 @@ packages:
       node-fetch-native: 1.6.1
       nypm: 0.3.4
       ohash: 1.1.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       tar: 6.2.0
     dev: true
 
@@ -9718,7 +9718,7 @@ packages:
       jiti: 1.21.0
       mlly: 1.4.2
       node-forge: 1.3.1
-      pathe: 1.1.1
+      pathe: 1.1.2
       std-env: 3.7.0
       ufo: 1.3.2
       untun: 0.1.2
@@ -9926,7 +9926,7 @@ packages:
     peerDependencies:
       vue: '>=3.0.1'
     dependencies:
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: false
 
   /lz-string@1.5.0:
@@ -10369,7 +10369,7 @@ packages:
       jiti: 1.21.0
       mlly: 1.4.2
       mri: 1.2.0
-      pathe: 1.1.1
+      pathe: 1.1.2
       postcss: 8.4.31
       postcss-nested: 6.0.1(postcss@8.4.31)
       typescript: 5.3.3
@@ -10379,7 +10379,7 @@ packages:
     resolution: {integrity: sha512-i/Ykufi2t1EZ6NaPLdfnZk2AX8cs0d+mTzVKuPfqPKPatxLApaBoxJQ9x1/uckXtrS/U5oisPMDkNs0yQTaBRg==}
     dependencies:
       acorn: 8.11.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       ufo: 1.3.2
 
@@ -10520,7 +10520,7 @@ packages:
       ofetch: 1.3.3
       ohash: 1.1.3
       openapi-typescript: 6.7.1
-      pathe: 1.1.1
+      pathe: 1.1.2
       perfect-debounce: 1.0.0
       pkg-types: 1.0.3
       pretty-bytes: 6.1.1
@@ -10882,7 +10882,7 @@ packages:
       nypm: 0.3.3
       ofetch: 1.3.3
       ohash: 1.1.3
-      pathe: 1.1.1
+      pathe: 1.1.2
       perfect-debounce: 1.0.0
       pkg-types: 1.0.3
       radix3: 1.1.0
@@ -10946,7 +10946,7 @@ packages:
     dependencies:
       citty: 0.1.5
       execa: 8.0.1
-      pathe: 1.1.1
+      pathe: 1.1.2
       ufo: 1.3.2
     dev: true
 
@@ -10957,7 +10957,7 @@ packages:
     dependencies:
       citty: 0.1.5
       execa: 8.0.1
-      pathe: 1.1.1
+      pathe: 1.1.2
       ufo: 1.3.2
     dev: true
 
@@ -11387,8 +11387,8 @@ packages:
     resolution: {integrity: sha512-5HviZNaZcfqP95rwpv+1HDgUamezbqdSYTyzjTvwtJSnIH+3vnbmWsItli8OFEndS984VT55M3jduxZbX351gg==}
     engines: {node: '>=12'}
 
-  /pathe@1.1.1:
+  /pathe@1.1.2:
-    resolution: {integrity: sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==}
+    resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==}
 
   /pathval@1.1.1:
     resolution: {integrity: sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==}
@@ -11436,7 +11436,7 @@ packages:
     dependencies:
       jsonc-parser: 3.2.0
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
 
   /pluralize@8.0.0:
     resolution: {integrity: sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA==}
@@ -13488,7 +13488,6 @@ packages:
     resolution: {integrity: sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==}
     engines: {node: '>=14.17'}
     hasBin: true
-    dev: true
 
   /ufo@1.3.0:
     resolution: {integrity: sha512-bRn3CsoojyNStCZe0BG0Mt4Nr/4KF+rhFlnNXybgqt5pXHNFRlqinSoQaTrGyzE4X8aHplSb+TorH+COin9Yxw==}
@@ -13527,7 +13526,7 @@ packages:
       magic-string: 0.30.5
       mkdist: 1.4.0(typescript@5.3.3)
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       pretty-bytes: 6.1.1
       rollup: 3.29.3
@@ -13582,7 +13581,7 @@ packages:
       defu: 6.1.4
       mime: 3.0.0
       node-fetch-native: 1.4.1
-      pathe: 1.1.1
+      pathe: 1.1.2
     dev: true
 
   /unenv@1.9.0:
@@ -13592,7 +13591,7 @@ packages:
       defu: 6.1.4
       mime: 3.0.0
       node-fetch-native: 1.6.1
-      pathe: 1.1.1
+      pathe: 1.1.2
     dev: true
 
   /unhead@1.8.8:
@@ -13617,7 +13616,7 @@ packages:
       local-pkg: 0.4.3
       magic-string: 0.30.3
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       scule: 1.0.0
       strip-literal: 1.3.0
@@ -13634,7 +13633,7 @@ packages:
       local-pkg: 0.5.0
       magic-string: 0.30.5
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       scule: 1.1.0
       strip-literal: 1.3.0
@@ -13653,7 +13652,7 @@ packages:
       local-pkg: 0.5.0
       magic-string: 0.30.5
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       pkg-types: 1.0.3
       scule: 1.2.0
       strip-literal: 1.3.0
@@ -13758,7 +13757,7 @@ packages:
       json5: 2.2.3
       local-pkg: 0.4.3
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       scule: 1.1.0
       unplugin: 1.5.1
       vue-router: 4.2.5(vue@3.4.8)
@@ -13859,7 +13858,7 @@ packages:
     dependencies:
       citty: 0.1.5
       consola: 3.2.3
-      pathe: 1.1.1
+      pathe: 1.1.2
     dev: true
 
   /untyped@1.4.0:
@@ -13964,7 +13963,7 @@ packages:
       date-fns: 2.30.0
       date-fns-tz: 2.0.0(date-fns@2.30.0)
       lodash: 4.17.21
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
       vue-screen-utils: 1.0.0-beta.13(vue@3.4.8)
     dev: false
 
@@ -13997,7 +13996,7 @@ packages:
     dependencies:
       '@vue/devtools-api': 6.5.1
       type-fest: 4.8.3
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: false
 
   /vite-node@0.33.0(@types/node@20.10.1):
@@ -14008,7 +14007,7 @@ packages:
       cac: 6.7.14
       debug: 4.3.4
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       picocolors: 1.0.0
       vite: 4.5.0(@types/node@20.10.1)
     transitivePeerDependencies:
@@ -14030,7 +14029,7 @@ packages:
       cac: 6.7.14
       debug: 4.3.4
       mlly: 1.4.2
-      pathe: 1.1.1
+      pathe: 1.1.2
       picocolors: 1.0.0
       vite: 4.5.0(@types/node@20.8.8)
     transitivePeerDependencies:
@@ -14301,7 +14300,7 @@ packages:
       fsevents: 2.3.3
     dev: true
 
-  /vitepress@1.0.0-rc.24(@algolia/client-search@4.22.0)(@types/node@20.8.10)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.2.2):
+  /vitepress@1.0.0-rc.24(@algolia/client-search@4.22.0)(@types/node@20.8.10)(postcss@8.4.33)(search-insights@2.13.0)(typescript@5.3.3):
     resolution: {integrity: sha512-RpnL8cnOGwiRlBbrYQUm9sYkJbtyOt/wYXk2diTcokY4yvks/5lq9LuSt+MURWB6ZqwpSNHvTmxgaSfLoG0/OA==}
     hasBin: true
     peerDependencies:
@@ -14326,7 +14325,7 @@ packages:
       postcss: 8.4.33
       shiki: 0.14.5
       vite: 4.5.0(@types/node@20.8.10)
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     transitivePeerDependencies:
       - '@algolia/client-search'
       - '@types/node'
@@ -14401,7 +14400,7 @@ packages:
       debug: 4.3.4
       local-pkg: 0.4.3
       magic-string: 0.30.5
-      pathe: 1.1.1
+      pathe: 1.1.2
       picocolors: 1.0.0
       std-env: 3.4.3
       strip-literal: 1.3.0
@@ -14467,7 +14466,7 @@ packages:
       debug: 4.3.4
       local-pkg: 0.4.3
       magic-string: 0.30.5
-      pathe: 1.1.1
+      pathe: 1.1.2
       picocolors: 1.0.0
       std-env: 3.4.3
       strip-literal: 1.3.0
@@ -14560,7 +14559,7 @@ packages:
       '@vue/composition-api':
         optional: true
     dependencies:
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
 
   /vue-devtools-stub@0.1.0:
     resolution: {integrity: sha512-RutnB7X8c5hjq39NceArgXg28WZtZpGc3+J16ljMiYnFhKvd8hITxSWQSQ5bvldxMDU6gG5mkxl1MTQLXckVSQ==}
@@ -14616,7 +14615,7 @@ packages:
     peerDependencies:
       vue: ^3.2.0
     dependencies:
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: false
 
   /vue-template-compiler@2.7.14:
@@ -14626,16 +14625,16 @@ packages:
       he: 1.2.0
     dev: true
 
-  /vue-tsc@1.8.27(typescript@5.2.2):
+  /vue-tsc@1.8.27(typescript@5.3.3):
     resolution: {integrity: sha512-WesKCAZCRAbmmhuGl3+VrdWItEvfoFIPXOvUJkjULi+x+6G/Dy69yO3TBRJDr9eUlmsNAwVmxsNZxvHKzbkKdg==}
     hasBin: true
     peerDependencies:
       typescript: '*'
     dependencies:
       '@volar/typescript': 1.11.1
-      '@vue/language-core': 1.8.27(typescript@5.2.2)
+      '@vue/language-core': 1.8.27(typescript@5.3.3)
       semver: 7.5.4
-      typescript: 5.2.2
+      typescript: 5.3.3
     dev: true
 
   /vue-wrap-balancer@1.1.3(vue@3.4.8):
@@ -14644,7 +14643,7 @@ packages:
       vue: ^3.3.0
     dependencies:
       nanoid: 3.3.6
-      vue: 3.4.8(typescript@5.2.2)
+      vue: 3.4.8(typescript@5.3.3)
     dev: false
 
   /vue@3.4.8(typescript@5.2.2):
@@ -14676,7 +14675,6 @@ packages:
       '@vue/server-renderer': 3.4.8(vue@3.4.8)
       '@vue/shared': 3.4.8
       typescript: 5.3.3
-    dev: true
 
   /walk-up-path@3.0.1:
     resolution: {integrity: sha512-9YlCL/ynK3CTlrSRrDxZvUauLzAswPCrsaCgilqFevUYpeEW0/3ScEjaa3kbW/T0ghhkEr7mv+fpjqn1Y1YuTA==}