<script setup lang="ts">
import {
  Tooltip as ShadcnTooltip,
  TooltipContent as ShadcnTooltipContent,
  TooltipProvider as ShadcnTooltipProvider,
  TooltipTrigger as ShadcnTooltipTrigger,
} from '@/components/core/tooltip';
import type { UiTooltipProps } from './types';

defineOptions({
  name: 'UiTooltip',
});

const open = defineModel<boolean>('open');

const props = withDefaults(defineProps<UiTooltipProps>(), {
  side: 'top',
  sideOffset: 4,
  align: 'center',
  class: '',
  delayDuration: 500,
  disabled: false,
});
</script>

<template>
  <ShadcnTooltipProvider :delay-duration="props.delayDuration">
    <ShadcnTooltip v-model:open="open" :disabled="props.disabled">
      <ShadcnTooltipTrigger as-child>
        <slot />
      </ShadcnTooltipTrigger>
      <ShadcnTooltipContent
        :side="props.side"
        :side-offset="props.sideOffset"
        :align="props.align"
        :class="props.class"
      >
        {{ props.content }}
      </ShadcnTooltipContent>
    </ShadcnTooltip>
  </ShadcnTooltipProvider>
</template>
