chore(Provider): add props

This commit is contained in:
Benjamin Canac
2024-03-11 18:43:23 +01:00
parent cd5b23a1f6
commit 158f0d2646

View File

@@ -1,14 +1,31 @@
<script lang="ts">
import type { ConfigProviderProps, ToastProviderProps, TooltipProviderProps } from 'radix-vue'
export interface ProviderProps extends ConfigProviderProps {
tooltip?: TooltipProviderProps
toast?: ToastProviderProps
}
</script>
<script setup lang="ts">
import { ConfigProvider, ToastProvider, TooltipProvider } from 'radix-vue'
import { toRef } from 'vue'
import { ConfigProvider, ToastProvider, TooltipProvider, useForwardProps } from 'radix-vue'
import { reactivePick } from '@vueuse/core'
import { useId } from '#imports'
const useIdFunction = () => useId()
const props = withDefaults(defineProps<ProviderProps>(), {
useId: () => useId()
})
const configProps = useForwardProps(reactivePick(props, 'dir', 'scrollBody', 'useId'))
const tooltipProps = toRef(() => props.tooltip as TooltipProviderProps)
const toastProps = toRef(() => props.toast as ToastProviderProps)
</script>
<template>
<ConfigProvider :use-id="useIdFunction">
<TooltipProvider>
<ToastProvider>
<ConfigProvider v-bind="configProps">
<TooltipProvider v-bind="tooltipProps">
<ToastProvider v-bind="toastProps">
<slot />
</ToastProvider>
</TooltipProvider>