refactor: use useEmitAsProps from radix-vue

This commit is contained in:
zernonia 2023-09-28 15:52:20 +08:00
parent b60f22de90
commit 3b8ccab7ef
53 changed files with 81 additions and 149 deletions

View File

@ -3,8 +3,8 @@ import {
AccordionRoot,
type AccordionRootEmits,
type AccordionRootProps,
useEmitAsProps,
} from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<AccordionRootProps>()
const emits = defineEmits<AccordionRootEmits>()

View File

@ -1,9 +1,7 @@
<script setup lang="ts">
import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot, useEmitAsProps } from 'radix-vue'
const props = defineProps<AlertDialogProps>()
const emits = defineEmits<AlertDialogEmits>()
const emitsAsProps = useEmitAsProps(emits)

View File

@ -5,11 +5,11 @@ import {
type AlertDialogContentProps,
AlertDialogOverlay,
AlertDialogPortal,
useEmitAsProps,
} from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<AlertDialogContentProps & { class?: string }>()
const emits = defineEmits<AlertDialogContentEmits>()
const emitsAsProps = useEmitAsProps(emits)

View File

@ -1,8 +1,8 @@
<script setup lang="ts">
import type { CheckboxRootEmits, CheckboxRootProps } from 'radix-vue'
import { CheckboxIndicator, CheckboxRoot } from 'radix-vue'
import { CheckboxIndicator, CheckboxRoot, useEmitAsProps } from 'radix-vue'
import { Check } from 'lucide-vue-next'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<CheckboxRootProps>()
const emits = defineEmits<CheckboxRootEmits>()

View File

@ -1,7 +1,6 @@
<script setup lang="ts">
import { CollapsibleRoot } from 'radix-vue'
import { CollapsibleRoot, useEmitAsProps } from 'radix-vue'
import type { CollapsibleRootEmits, CollapsibleRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<CollapsibleRootProps>()
const emits = defineEmits<CollapsibleRootEmits>()

View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { ComboboxRootEmits, ComboboxRootProps } from 'radix-vue'
import { ComboboxRoot } from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { ComboboxRoot, useEmitAsProps } from 'radix-vue'
import { cn } from '@/lib/utils'
const props = defineProps<ComboboxRootProps>()
const emits = defineEmits<ComboboxRootEmits>()

View File

@ -1,8 +1,8 @@
<script setup lang="ts">
import { useEmitAsProps } from 'radix-vue'
import type { DialogRootEmits, DialogRootProps } from 'radix-vue'
import Command from './Command.vue'
import { Dialog, DialogContent } from '@/lib/registry/default/ui/dialog'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<DialogRootProps>()
const emits = defineEmits<DialogRootEmits>()

View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { ComboboxItemEmits, ComboboxItemProps } from 'radix-vue'
import { ComboboxItem } from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { ComboboxItem, useEmitAsProps } from 'radix-vue'
import { cn } from '@/lib/utils'
const props = defineProps<ComboboxItemProps>()
const emits = defineEmits<ComboboxItemEmits>()

View File

@ -1,7 +1,6 @@
<script setup lang="ts">
import { ContextMenuRoot } from 'radix-vue'
import { ContextMenuRoot, useEmitAsProps } from 'radix-vue'
import type { ContextMenuRootEmits, ContextMenuRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<ContextMenuRootProps>()
const emits = defineEmits<ContextMenuRootEmits>()

View File

@ -4,9 +4,10 @@ import {
type ContextMenuCheckboxItemEmits,
type ContextMenuCheckboxItemProps,
ContextMenuItemIndicator,
useEmitAsProps,
} from 'radix-vue'
import { Check } from 'lucide-vue-next'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<ContextMenuCheckboxItemProps & { class?: string }>()
const emits = defineEmits<ContextMenuCheckboxItemEmits>()

View File

@ -3,8 +3,9 @@ import {
ContextMenuItem,
type ContextMenuItemEmits,
type ContextMenuItemProps,
useEmitAsProps,
} from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<ContextMenuItemProps & { class?: string; inset?: boolean }>()
const emits = defineEmits<ContextMenuItemEmits>()

View File

@ -4,9 +4,10 @@ import {
ContextMenuRadioItem,
type ContextMenuRadioItemEmits,
type ContextMenuRadioItemProps,
useEmitAsProps,
} from 'radix-vue'
import { Circle } from 'lucide-vue-next'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<ContextMenuRadioItemProps & { class?: string }>()
const emits = defineEmits<ContextMenuRadioItemEmits>()

View File

@ -6,9 +6,10 @@ import {
type DialogContentProps,
DialogOverlay,
DialogPortal,
useEmitAsProps,
} from 'radix-vue'
import { X } from 'lucide-vue-next'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<DialogContentProps & { class?: string }>()
const emits = defineEmits<DialogContentEmits>()

View File

@ -1,6 +1,5 @@
<script setup lang="ts">
import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps, useEmitAsProps } from 'radix-vue'
const props = defineProps<DropdownMenuRootProps>()
const emits = defineEmits<DropdownMenuRootEmits>()

View File

@ -4,9 +4,10 @@ import {
type DropdownMenuCheckboxItemEmits,
type DropdownMenuCheckboxItemProps,
DropdownMenuItemIndicator,
useEmitAsProps,
} from 'radix-vue'
import { Check } from 'lucide-vue-next'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<DropdownMenuCheckboxItemProps & { class?: string }>()
const emits = defineEmits<DropdownMenuCheckboxItemEmits>()

View File

@ -4,9 +4,10 @@ import {
DropdownMenuRadioItem,
type DropdownMenuRadioItemEmits,
type DropdownMenuRadioItemProps,
useEmitAsProps,
} from 'radix-vue'
import { Circle } from 'lucide-vue-next'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<DropdownMenuRadioItemProps & { class?: string }>()

View File

@ -3,8 +3,9 @@ import {
NavigationMenuContent,
type NavigationMenuContentEmits,
type NavigationMenuContentProps,
useEmitAsProps,
} from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<NavigationMenuContentProps & { class?: string }>()

View File

@ -3,8 +3,8 @@ import {
NavigationMenuLink,
type NavigationMenuLinkEmits,
type NavigationMenuLinkProps,
useEmitAsProps,
} from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<NavigationMenuLinkProps>()
const emits = defineEmits<NavigationMenuLinkEmits>()

View File

@ -1,7 +1,6 @@
<script setup lang="ts">
import { PopoverRoot } from 'radix-vue'
import { PopoverRoot, useEmitAsProps } from 'radix-vue'
import type { PopoverRootEmits, PopoverRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<PopoverRootProps>()
const emits = defineEmits<PopoverRootEmits>()

View File

@ -1,6 +1,6 @@
<script setup lang="ts">
import { RadioGroupRoot, type RadioGroupRootEmits, type RadioGroupRootProps } from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { RadioGroupRoot, type RadioGroupRootEmits, type RadioGroupRootProps, useEmitAsProps } from 'radix-vue'
import { cn } from '@/lib/utils'
const props = defineProps<RadioGroupRootProps & { class?: string }>()

View File

@ -1,7 +1,6 @@
<script setup lang="ts">
import type { SelectRootEmits, SelectRootProps } from 'radix-vue'
import { SelectRoot } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
import { SelectRoot, useEmitAsProps } from 'radix-vue'
const props = defineProps<SelectRootProps>()
const emits = defineEmits<SelectRootEmits>()

View File

@ -6,10 +6,11 @@ import {
type DialogContentProps,
DialogOverlay,
DialogPortal,
useEmitAsProps,
} from 'radix-vue'
import { X } from 'lucide-vue-next'
import { cva } from 'class-variance-authority'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
interface SheetContentProps extends DialogContentProps {
side?: 'left' | 'right' | 'top' | 'bottom'

View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { SliderRootEmits, SliderRootProps } from 'radix-vue'
import { SliderRange, SliderRoot, SliderThumb, SliderTrack } from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { SliderRange, SliderRoot, SliderThumb, SliderTrack, useEmitAsProps } from 'radix-vue'
import { cn } from '@/lib/utils'
const props = defineProps<SliderRootProps>()
const emits = defineEmits<SliderRootEmits>()

View File

@ -1,10 +1,10 @@
<script setup lang="ts">
import type { ToggleEmits, ToggleProps } from 'radix-vue'
import { Toggle } from 'radix-vue'
import { Toggle, useEmitAsProps } from 'radix-vue'
import type { VariantProps } from 'class-variance-authority'
import { computed } from 'vue'
import { toggleVariants } from '.'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
interface ToggleVariantProps extends VariantProps<typeof toggleVariants> {}

View File

@ -1,6 +1,5 @@
<script setup lang="ts">
import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps, useEmitAsProps } from 'radix-vue'
const props = defineProps<TooltipRootProps>()
const emits = defineEmits<TooltipRootEmits>()

View File

@ -3,8 +3,8 @@ import {
AccordionRoot,
type AccordionRootEmits,
type AccordionRootProps,
useEmitAsProps,
} from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<AccordionRootProps>()
const emits = defineEmits<AccordionRootEmits>()

View File

@ -1,9 +1,7 @@
<script setup lang="ts">
import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot, useEmitAsProps } from 'radix-vue'
const props = defineProps<AlertDialogProps>()
const emits = defineEmits<AlertDialogEmits>()
const emitsAsProps = useEmitAsProps(emits)

View File

@ -5,8 +5,9 @@ import {
type AlertDialogContentProps,
AlertDialogOverlay,
AlertDialogPortal,
useEmitAsProps,
} from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<AlertDialogContentProps & { class?: string }>()

View File

@ -1,8 +1,8 @@
<script setup lang="ts">
import type { CheckboxRootEmits, CheckboxRootProps } from 'radix-vue'
import { CheckboxIndicator, CheckboxRoot } from 'radix-vue'
import { CheckboxIndicator, CheckboxRoot, useEmitAsProps } from 'radix-vue'
import { CheckIcon } from '@radix-icons/vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<CheckboxRootProps>()
const emits = defineEmits<CheckboxRootEmits>()

View File

@ -1,7 +1,6 @@
<script setup lang="ts">
import { CollapsibleRoot } from 'radix-vue'
import { CollapsibleRoot, useEmitAsProps } from 'radix-vue'
import type { CollapsibleRootEmits, CollapsibleRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<CollapsibleRootProps>()
const emits = defineEmits<CollapsibleRootEmits>()

View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { ComboboxRootEmits, ComboboxRootProps } from 'radix-vue'
import { ComboboxRoot } from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { ComboboxRoot, useEmitAsProps } from 'radix-vue'
import { cn } from '@/lib/utils'
const props = defineProps<ComboboxRootProps>()
const emits = defineEmits<ComboboxRootEmits>()

View File

@ -1,8 +1,8 @@
<script setup lang="ts">
import type { DialogRootEmits, DialogRootProps } from 'radix-vue'
import { useEmitAsProps } from 'radix-vue'
import Command from './Command.vue'
import { Dialog, DialogContent } from '@/lib/registry/new-york/ui/dialog'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<DialogRootProps>()
const emits = defineEmits<DialogRootEmits>()

View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { ComboboxItemEmits, ComboboxItemProps } from 'radix-vue'
import { ComboboxItem } from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { ComboboxItem, useEmitAsProps } from 'radix-vue'
import { cn } from '@/lib/utils'
const props = defineProps<ComboboxItemProps>()
const emits = defineEmits<ComboboxItemEmits>()

View File

@ -1,7 +1,6 @@
<script setup lang="ts">
import { ContextMenuRoot } from 'radix-vue'
import { ContextMenuRoot, useEmitAsProps } from 'radix-vue'
import type { ContextMenuRootEmits, ContextMenuRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<ContextMenuRootProps>()
const emits = defineEmits<ContextMenuRootEmits>()

View File

@ -4,9 +4,10 @@ import {
type ContextMenuCheckboxItemEmits,
type ContextMenuCheckboxItemProps,
ContextMenuItemIndicator,
useEmitAsProps,
} from 'radix-vue'
import { CheckIcon } from '@radix-icons/vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<ContextMenuCheckboxItemProps & { class?: string }>()
const emits = defineEmits<ContextMenuCheckboxItemEmits>()

View File

@ -3,8 +3,9 @@ import {
ContextMenuItem,
type ContextMenuItemEmits,
type ContextMenuItemProps,
useEmitAsProps,
} from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<ContextMenuItemProps & { class?: string; inset?: boolean }>()
const emits = defineEmits<ContextMenuItemEmits>()

View File

@ -4,9 +4,10 @@ import {
ContextMenuRadioItem,
type ContextMenuRadioItemEmits,
type ContextMenuRadioItemProps,
useEmitAsProps,
} from 'radix-vue'
import { DotFilledIcon } from '@radix-icons/vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<ContextMenuRadioItemProps & { class?: string }>()
const emits = defineEmits<ContextMenuRadioItemEmits>()

View File

@ -6,9 +6,10 @@ import {
type DialogContentProps,
DialogOverlay,
DialogPortal,
useEmitAsProps,
} from 'radix-vue'
import { Cross2Icon } from '@radix-icons/vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<DialogContentProps & { class?: string }>()
const emits = defineEmits<DialogContentEmits>()

View File

@ -1,6 +1,5 @@
<script setup lang="ts">
import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps, useEmitAsProps } from 'radix-vue'
const props = defineProps<DropdownMenuRootProps>()
const emits = defineEmits<DropdownMenuRootEmits>()

View File

@ -4,9 +4,10 @@ import {
type DropdownMenuCheckboxItemEmits,
type DropdownMenuCheckboxItemProps,
DropdownMenuItemIndicator,
useEmitAsProps,
} from 'radix-vue'
import { CheckIcon } from '@radix-icons/vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<DropdownMenuCheckboxItemProps & { class?: string }>()
const emits = defineEmits<DropdownMenuCheckboxItemEmits>()

View File

@ -4,9 +4,10 @@ import {
DropdownMenuRadioItem,
type DropdownMenuRadioItemEmits,
type DropdownMenuRadioItemProps,
useEmitAsProps,
} from 'radix-vue'
import { DotFilledIcon } from '@radix-icons/vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<DropdownMenuRadioItemProps & { class?: string }>()

View File

@ -3,8 +3,9 @@ import {
NavigationMenuContent,
type NavigationMenuContentEmits,
type NavigationMenuContentProps,
useEmitAsProps,
} from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
const props = defineProps<NavigationMenuContentProps & { class?: string }>()

View File

@ -3,8 +3,8 @@ import {
NavigationMenuLink,
type NavigationMenuLinkEmits,
type NavigationMenuLinkProps,
useEmitAsProps,
} from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<NavigationMenuLinkProps>()
const emits = defineEmits<NavigationMenuLinkEmits>()

View File

@ -1,7 +1,6 @@
<script setup lang="ts">
import { PopoverRoot } from 'radix-vue'
import { PopoverRoot, useEmitAsProps } from 'radix-vue'
import type { PopoverRootEmits, PopoverRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
const props = defineProps<PopoverRootProps>()
const emits = defineEmits<PopoverRootEmits>()

View File

@ -1,9 +1,8 @@
<script setup lang="ts">
import { RadioGroupRoot, type RadioGroupRootEmits, type RadioGroupRootProps } from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { RadioGroupRoot, type RadioGroupRootEmits, type RadioGroupRootProps, useEmitAsProps } from 'radix-vue'
import { cn } from '@/lib/utils'
const props = defineProps<RadioGroupRootProps & { class?: string }>()
const emits = defineEmits<RadioGroupRootEmits>()
const emitsAsProps = useEmitAsProps(emits)

View File

@ -1,7 +1,6 @@
<script setup lang="ts">
import type { SelectRootEmits, SelectRootProps } from 'radix-vue'
import { SelectRoot } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
import { SelectRoot, useEmitAsProps } from 'radix-vue'
const props = defineProps<SelectRootProps>()
const emits = defineEmits<SelectRootEmits>()

View File

@ -6,10 +6,11 @@ import {
type DialogContentProps,
DialogOverlay,
DialogPortal,
useEmitAsProps,
} from 'radix-vue'
import { cva } from 'class-variance-authority'
import { Cross2Icon } from '@radix-icons/vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
interface SheetContentProps extends DialogContentProps {
side?: 'left' | 'right' | 'top' | 'bottom'

View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { SliderRootEmits, SliderRootProps } from 'radix-vue'
import { SliderRange, SliderRoot, SliderThumb, SliderTrack } from 'radix-vue'
import { cn, useEmitAsProps } from '@/lib/utils'
import { SliderRange, SliderRoot, SliderThumb, SliderTrack, useEmitAsProps } from 'radix-vue'
import { cn } from '@/lib/utils'
const props = defineProps<SliderRootProps>()
const emits = defineEmits<SliderRootEmits>()

View File

@ -1,10 +1,10 @@
<script setup lang="ts">
import type { ToggleEmits, ToggleProps } from 'radix-vue'
import { Toggle } from 'radix-vue'
import { Toggle, useEmitAsProps } from 'radix-vue'
import type { VariantProps } from 'class-variance-authority'
import { computed } from 'vue'
import { toggleVariants } from '.'
import { cn, useEmitAsProps } from '@/lib/utils'
import { cn } from '@/lib/utils'
interface ToggleVariantProps extends VariantProps<typeof toggleVariants> {}

View File

@ -1,6 +1,5 @@
<script setup lang="ts">
import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps } from 'radix-vue'
import { useEmitAsProps } from '@/lib/utils'
import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps, useEmitAsProps } from 'radix-vue'
const props = defineProps<TooltipRootProps>()
const emits = defineEmits<TooltipRootEmits>()

View File

@ -7,40 +7,9 @@ export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
}
// Vue doesn't have emits forwarding, in order to bind the emits we have to convert events into `onXXX` handlers
// issue: https://github.com/vuejs/core/issues/5917
export function useEmitAsProps<Name extends string>(
emit: (name: Name, ...args: any[]) => void,
) {
const vm = getCurrentInstance()
const events = vm?.type.emits as Name[]
const result: Record<string, any> = {}
if (!events?.length) {
console.warn(
`No emitted event found. Please check component: ${vm?.type.__name}`,
)
}
events?.forEach((ev) => {
result[toHandlerKey(camelize(ev))] = (...arg: any) => emit(ev, ...arg)
})
return result
}
export function valueUpdater<T extends Updater<any>>(updaterOrValue: T, ref: Ref) {
ref.value
= typeof updaterOrValue === 'function'
? updaterOrValue(ref.value)
: updaterOrValue
}
// export type ParseEmits<T extends Record<string, any>> = {
// [K in keyof T]: (...args: T[K]) => void;
// }
// export function convertToComponent(component: FunctionalComponent) {
// return defineComponent({
// setup() { return () => h(component) },
// })
// }

View File

@ -5,25 +5,7 @@ import { camelize, getCurrentInstance, toHandlerKey } from 'vue'
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
}
export function useEmitAsProps<Name extends string>(
emit: (name: Name, ...args: any[]) => void,
) {
const vm = getCurrentInstance()
const events = vm?.type.emits as Name[]
const result: Record<string, any> = {}
if (!events?.length) {
console.warn(
\`No emitted event found. Please check component: \${vm?.type.__name}\`,
)
}
events?.forEach((ev) => {
result[toHandlerKey(camelize(ev))] = (...arg: any) => emit(ev, ...arg)
})
return result
}`
`
export const TAILWIND_CONFIG = `/** @type {import('tailwindcss').Config} */
module.exports = {

View File

@ -5,22 +5,3 @@ import { camelize, getCurrentInstance, toHandlerKey } from 'vue'
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
}
export function useEmitAsProps<Name extends string>(
emit: (name: Name, ...args: any[]) => void,
) {
const vm = getCurrentInstance()
const events = vm?.type.emits as Name[]
const result: Record<string, any> = {}
if (!events?.length) {
console.warn(
`No emitted event found. Please check component: ${vm?.type.__name}`,
)
}
events?.forEach((ev) => {
result[toHandlerKey(camelize(ev))] = (...arg: any) => emit(ev, ...arg)
})
return result
}