fix(components): ui prop override with class (#136)

This commit is contained in:
Benjamin Canac
2024-07-03 14:35:58 +02:00
committed by GitHub
parent 5a22c62b2a
commit 235556d3e0
50 changed files with 383 additions and 375 deletions

View File

@@ -59,7 +59,10 @@ const rootProps = useForwardPropsEmits(reactivePick(props, 'defaultOpen', 'open'
const contentProps = toRef(() => defu(props.content, { side: 'bottom', sideOffset: 8 }) as TooltipContentProps)
const arrowProps = toRef(() => props.arrow as TooltipArrowProps)
const ui = computed(() => tv({ extend: tooltip, slots: props.ui })({ side: contentProps.value.side }))
// eslint-disable-next-line vue/no-dupe-keys
const ui = computed(() => tooltip({
side: contentProps.value.side
}))
</script>
<template>
@@ -71,14 +74,14 @@ const ui = computed(() => tv({ extend: tooltip, slots: props.ui })({ side: conte
<TooltipPortal :disabled="!portal">
<TooltipContent v-bind="contentProps" :class="ui.content({ class: props.class })">
<slot name="content">
<span v-if="text" :class="ui.text()">{{ text }}</span>
<span v-if="text" :class="ui.text({ class: props.ui?.text })">{{ text }}</span>
<span v-if="kbds?.length" :class="ui.kbds()">
<span v-if="kbds?.length" :class="ui.kbds({ class: props.ui?.kbds })">
<UKbd v-for="(kbd, index) in kbds" :key="index" size="sm" v-bind="typeof kbd === 'string' ? { value: kbd } : kbd" />
</span>
</slot>
<TooltipArrow v-if="!!arrow" v-bind="arrowProps" :class="ui.arrow()" />
<TooltipArrow v-if="!!arrow" v-bind="arrowProps" :class="ui.arrow({ class: props.ui?.arrow })" />
</TooltipContent>
</TooltipPortal>
</TooltipRoot>