{"version":3,"file":"tooltip2.mjs","sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n  <hl-popper ref=\"popperRef\" :role=\"role\">\n    <hl-tooltip-trigger\n      :style=\"$attrs.style\"\n      :class=\"$attrs.class\"\n      :disabled=\"disabled\"\n      :trigger=\"trigger\"\n      :trigger-keys=\"triggerKeys\"\n      :virtual-ref=\"virtualRef\"\n      :virtual-triggering=\"virtualTriggering\"\n    >\n      <slot v-if=\"$slots.default\"></slot>\n    </hl-tooltip-trigger>\n    <hl-tooltip-content\n      ref=\"contentRef\"\n      :aria-label=\"ariaLabel\"\n      :boundaries-padding=\"boundariesPadding\"\n      :content=\"content\"\n      :disabled=\"disabled\"\n      :effect=\"effect\"\n      :enterable=\"enterable\"\n      :fallback-placements=\"fallbackPlacements\"\n      :hide-after=\"hideAfter\"\n      :gpu-acceleration=\"gpuAcceleration\"\n      :offset=\"offset\"\n      :persistent=\"persistent\"\n      :popper-class=\"popperClass\"\n      :popper-style=\"popperStyle\"\n      :placement=\"placement\"\n      :popper-options=\"popperOptions\"\n      :outside-ignore=\"outsideIgnore\"\n      :pure=\"pure\"\n      :raw-content=\"rawContent\"\n      :reference-el=\"referenceEl\"\n      :trigger-target-el=\"triggerTargetEl\"\n      :show-after=\"showAfter\"\n      :strategy=\"strategy\"\n      :teleported=\"teleported\"\n      :transition=\"transition\"\n      :virtual-triggering=\"virtualTriggering\"\n      :z-index=\"zIndex\"\n      :append-to=\"appendTo\"\n    >\n      <slot name=\"content\">\n        <span v-if=\"rawContent\" v-html=\"content\"></span>\n        <span v-else>{{ content }}</span>\n      </slot>\n      <hl-popper-arrow v-if=\"showArrow\" :arrow-offset=\"arrowOffset\" />\n    </hl-tooltip-content>\n  </hl-popper>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  onDeactivated,\n  provide,\n  readonly,\n  ref,\n  toRef,\n  unref,\n  watch,\n} from 'vue'\nimport { HlPopper, HlPopperArrow } from '@hongluan-ui/components/popper'\nimport { isBoolean } from '@hongluan-ui/utils'\nimport {\n  useDelayedToggle,\n  useId,\n  usePopperContainer,\n} from '@hongluan-ui/hooks'\nimport { TOOLTIP_INJECTION_KEY } from '@hongluan-ui/tokens'\nimport { tooltipEmits, useTooltipModelToggle, useTooltipProps } from './tooltip'\nimport HlTooltipTrigger from './trigger.vue'\nimport HlTooltipContent from './content.vue'\nimport type { PopperInstance } from '@hongluan-ui/components/popper'\n\ndefineOptions({\n  name: 'Tooltip',\n})\n\nconst props = defineProps(useTooltipProps)\nconst emit = defineEmits(tooltipEmits)\n\nusePopperContainer()\n\nconst id = useId()\nconst popperRef = ref<PopperInstance>()\n// TODO any is temporary, replace with `TooltipContentInstance` later\nconst contentRef = ref<any>()\n\nconst updatePopper = () => {\n  const popperComponent = unref(popperRef)\n  if (popperComponent) {\n    popperComponent.popperInstanceRef?.update()\n  }\n}\nconst open = ref(false)\nconst toggleReason = ref<Event>()\n\nconst { show, hide, hasUpdateHandler } = useTooltipModelToggle({\n  indicator: open,\n  toggleReason,\n})\n\nconst { onOpen, onClose } = useDelayedToggle({\n  showAfter: toRef(props, 'showAfter'),\n  hideAfter: toRef(props, 'hideAfter'),\n  autoClose: toRef(props, 'autoClose'),\n  open: show,\n  close: hide,\n})\n\nconst controlled = computed(\n  () => isBoolean(props.visible) && !hasUpdateHandler.value,\n)\n\nprovide(TOOLTIP_INJECTION_KEY, {\n  controlled,\n  id,\n  open: readonly(open),\n  trigger: toRef(props, 'trigger'),\n  onOpen: (event?: Event) => {\n    onOpen(event)\n  },\n  onClose: (event?: Event) => {\n    onClose(event)\n  },\n  onToggle: (event?: Event) => {\n    if (unref(open)) {\n      onClose(event)\n    } else {\n      onOpen(event)\n    }\n  },\n  onShow: () => {\n    emit('show', toggleReason.value)\n  },\n  onHide: () => {\n    emit('hide', toggleReason.value)\n  },\n  onBeforeShow: () => {\n    emit('before-show', toggleReason.value)\n  },\n  onBeforeHide: () => {\n    emit('before-hide', toggleReason.value)\n  },\n  updatePopper,\n})\n\nwatch(\n  () => props.disabled,\n  disabled => {\n    if (disabled && open.value) {\n      open.value = false\n    }\n  },\n)\n\nconst isFocusInsideContent = (event?: FocusEvent) => {\n  const popperContent: HTMLElement | undefined =\n    contentRef.value?.contentRef?.popperContentRef\n  const activeElement = (event?.relatedTarget as Node) || document.activeElement\n\n  return popperContent && popperContent.contains(activeElement)\n}\n\nonDeactivated(() => open.value && hide())\n\ndefineExpose({\n  /**\n   * @description el-popper component instance\n   */\n  popperRef,\n  /**\n   * @description el-tooltip-content component instance\n   */\n  contentRef,\n  /**\n   * @description validate current focus event is trigger inside el-tooltip-content\n   */\n  isFocusInsideContent,\n  /**\n   * @description update el-popper component instance\n   */\n  updatePopper,\n  /**\n   * @description expose onOpen function to mange el-tooltip open state\n   */\n  onOpen,\n  /**\n   * @description expose onOpen function to mange el-tooltip open state\n   */\n  onClose,\n  /**\n   * @description expose hide function\n   */\n  hide,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;oCA4Ec;AAAA,EACZ,MAAM;AACR;;;;;;;AAKA;AAEA,UAAM,KAAK;AACX,UAAM,YAAY;AAElB,UAAM,aAAa;AAEnB,UAAM,eAAe,MAAM;AACzB,YAAM;AACN,2BAAqB;AACnB;AAA0C;AAC5C;AAEF;AACA,UAAM;AAEN,UAAM;AAAyD;AAClD,MACX;AAAA;AAGF;AAA6C;AACR,MACnC,WAAW,MAAM,OAAO,WAAW;AAAA,MACnC,WAAW,MAAM,OAAO,WAAW;AAAA,MACnC;AAAM,MACN;AAAO;AAGT;AAIA;AAA+B;AAC7B,MACA;AAAA,MACA;AAAmB,MACnB,eAAe;AAAgB,MAC/B,SAAS;AACP,eAAO,KAAK;AAAA;AACd;AAEE,gBAAQ,KAAK;AAAA;AACf;AAEE,sBAAc;AACZ,kBAAQ,KAAK;AAAA;AAEb;AAAY;AACd;AACF;AAEE;AAA+B;AACjC;AAEE;AAA+B;AACjC;AAEE;AAAsC;AACxC;AAEE;AAAsC;AACxC;AACA;AAGF;AAGI,UAAI,YAAY;AACd;AAAa;AACf;AAIJ;AACE,uCACa;AACb,YAAM;AAEN;AAA4D;AAG9D,2CAAuC,CAAC;AAExC;AAAa;AAIX;AAIA,MAIA;AAAA,MAIA;AAAA,MAIA;AAAA,MAIA;AAAA,MAIA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}