{"version":3,"file":"JTooltip.vue.cjs","sources":["../../../../src/components/atoms/JTooltip.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed, ref, onMounted, onUnmounted } from 'vue'\r\nimport Tooltip from '@/components/shadcn/Tooltip.vue'\r\nimport TooltipContent from '@/components/shadcn/TooltipContent.vue'\r\nimport TooltipProvider from '@/components/shadcn/TooltipProvider.vue'\r\nimport TooltipTrigger from '@/components/shadcn/TooltipTrigger.vue'\r\n\r\ntype StyleType =\r\n  | 'default'   // 기본 스타일\r\n  | 'primary'   // 강조 스타일 (파랑)\r\n  | 'success'   // 성공 스타일 (초록)\r\n  | 'warning'   // 경고 스타일 (주황)\r\n  | 'danger'    // 위험 스타일 (빨강)\r\n\r\ntype Size = 'xs' | 'sm' | 'md' | 'lg'\n\r\ntype Trigger = 'hover' | 'focus' | 'click' | 'manual'\r\n\r\nconst props = withDefaults(\r\n  defineProps<{\r\n    content?: string\r\n    side?: 'top' | 'right' | 'bottom' | 'left'\r\n    align?: 'start' | 'center' | 'end'\r\n    class?: string\r\n    /** 스타일 프리셋 */\r\n    styletype?: StyleType\r\n    /** 툴팁 크기 */\r\n    size?: Size\r\n    /** 툴팁 비활성화 */\r\n    disabled?: boolean\r\n    /** 표시 지연 시간 (ms) */\r\n    delay?: number\r\n    /** 툴팁 최대 너비 */\r\n    maxWidth?: string | number\r\n    /** 툴팁 트리거 타입 */\r\n    trigger?: Trigger\r\n  }>(),\r\n  {\n    side: 'top',\n    align: 'center',\n    styletype: 'default',\n    size: 'sm',\n    disabled: false,\n    delay: 200,\n    maxWidth: '200px',\n    trigger: 'hover',\r\n  },\r\n)\r\n\r\n/**\r\n * styletype -> class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { class: string }> = {\r\n  default: { class: '' },\r\n  primary: { \r\n    class: 'bg-blue-500 text-white border-blue-600',\r\n  },\r\n  success: { \r\n    class: 'bg-green-500 text-white border-green-600',\r\n  },\r\n  warning: { \r\n    class: 'bg-amber-500 text-white border-amber-600',\r\n  },\r\n  danger: { \r\n    class: 'bg-red-500 text-white border-red-600',\r\n  },\r\n}\r\n\r\n/**\r\n * size -> class 매핑\r\n */\r\nconst SIZE_PRESETS: Record<Size, { class: string }> = {\n  xs: { \n    class: 'text-[10px] px-1.5 py-0.5 max-w-40',\n  },\n  sm: { \n    class: 'text-xs px-2 py-1 max-w-48',\n  },\n  md: { \n    class: 'text-xs px-2.5 py-1 max-w-56',\n  },\n  lg: { \n    class: 'text-sm px-3 py-1.5 max-w-64',\n  },\n}\n\r\n// click과 manual 트리거를 위한 상태 관리\r\nconst isOpen = ref(false)\r\n\r\n// 각 트리거 타입별 핸들러\r\nconst handleClick = (event: MouseEvent) => {\r\n  console.log('Click handler called, trigger:', props.trigger)\r\n  if (props.trigger === 'click') {\r\n    console.log('Toggling tooltip, current state:', isOpen.value)\r\n    isOpen.value = !isOpen.value\r\n    console.log('New state:', isOpen.value)\r\n  } else if (props.trigger === 'focus') {\r\n    // focus 트리거에서는 클릭 이벤트 무시\r\n    event.preventDefault()\r\n    event.stopPropagation()\r\n  }\r\n}\r\n\r\n// delay를 위한 타이머 관리\r\nlet hoverTimer: number | null = null\r\n\r\nconst handleMouseEnter = () => {\r\n  if (props.trigger === 'hover') {\r\n    // 기존 타이머가 있으면 취소\r\n    if (hoverTimer) {\r\n      clearTimeout(hoverTimer)\r\n    }\r\n    // delay 적용\r\n    hoverTimer = setTimeout(() => {\r\n      isOpen.value = true\r\n    }, props.delay)\r\n  }\r\n}\r\n\r\nconst handleMouseLeave = () => {\r\n  if (props.trigger === 'hover') {\r\n    // 타이머 취소\r\n    if (hoverTimer) {\r\n      clearTimeout(hoverTimer)\r\n      hoverTimer = null\r\n    }\r\n    isOpen.value = false\r\n  }\r\n}\r\n\r\nconst handleFocus = () => {\r\n  if (props.trigger === 'focus') {\r\n    isOpen.value = true\r\n  }\r\n}\r\n\r\nconst handleBlur = () => {\r\n  if (props.trigger === 'focus') {\r\n    isOpen.value = false\r\n  }\r\n}\r\n\r\n// 트리거 타입에 따른 Tooltip 설정 계산\r\nconst tooltipConfig = computed(() => {\r\n  const config: any = {\r\n    disabled: props.disabled,\r\n  }\r\n  \r\n  // 모든 트리거 타입에 대해 수동 제어\r\n  config.open = isOpen.value\r\n  \r\n  return config\r\n})\r\n\r\n// 외부 클릭 감지를 위한 핸들러\r\nconst handleOutsideClick = (event: Event) => {\r\n  if (props.trigger === 'hover' && isOpen.value) {\r\n    const target = event.target as HTMLElement\r\n    const tooltipElement = document.querySelector('[data-tooltip-trigger]')\r\n    if (tooltipElement && !tooltipElement.contains(target)) {\r\n      isOpen.value = false\r\n    }\r\n  }\r\n}\r\n\r\n// manual 트리거를 위한 메서드들\r\nconst showTooltip = () => {\r\n  if (props.trigger === 'manual') {\r\n    isOpen.value = true\r\n  }\r\n}\r\n\r\nconst hideTooltip = () => {\r\n  if (props.trigger === 'manual') {\r\n    isOpen.value = false\r\n  }\r\n}\r\n\r\n// 외부에서 사용할 수 있도록 expose\r\ndefineExpose({\r\n  showTooltip,\r\n  hideTooltip,\r\n})\r\n\r\n// 외부 클릭 감지를 위한 이벤트 리스너 등록/해제\r\nonMounted(() => {\r\n  if (props.trigger === 'hover') {\r\n    document.addEventListener('click', handleOutsideClick)\r\n  }\r\n})\r\n\r\nonUnmounted(() => {\r\n  if (props.trigger === 'hover') {\r\n    document.removeEventListener('click', handleOutsideClick)\r\n  }\r\n  \r\n  // 타이머 정리\r\n  if (hoverTimer) {\r\n    clearTimeout(hoverTimer)\r\n  }\r\n})\r\n\r\n/** 최종 바인딩: 직접 넘긴 class가 있으면 styletype과 size 기본값과 병합 */\r\nconst mapped = computed(() => {\r\n  const stylePreset = STYLE_PRESETS[props.styletype!]\r\n  const sizePreset = SIZE_PRESETS[props.size!]\r\n  const finalClass = [stylePreset.class, sizePreset.class, props.class].filter(Boolean).join(' ')\r\n  \r\n  // maxWidth 스타일 처리\r\n  const maxWidthStyle = typeof props.maxWidth === 'number' \r\n    ? `${props.maxWidth}px` \r\n    : props.maxWidth\r\n  \r\n  return {\r\n    side: props.side,\r\n    align: props.align,\r\n    class: finalClass,\r\n    style: {\r\n      maxWidth: maxWidthStyle,\r\n    },\r\n  }\r\n})\r\n</script>\r\n\r\n<template>\r\n  <TooltipProvider :delay-duration=\"props.delay\">\r\n    <Tooltip v-bind=\"tooltipConfig\">\r\n      <TooltipTrigger \r\n        as-child\r\n        :data-tooltip-trigger=\"true\"\r\n        @click=\"handleClick\"\r\n        @mouseenter=\"handleMouseEnter\"\r\n        @mouseleave=\"handleMouseLeave\"\r\n        @focus=\"handleFocus\"\r\n        @blur=\"handleBlur\"\r\n      >\r\n        <slot name=\"trigger\" />\r\n      </TooltipTrigger>\r\n      <TooltipContent v-bind=\"mapped\">\r\n        {{ props.content }}\r\n      </TooltipContent>\r\n    </Tooltip>\r\n  </TooltipProvider>\r\n</template>\r\n"],"names":["props","__props","STYLE_PRESETS","SIZE_PRESETS","isOpen","ref","handleClick","event","hoverTimer","handleMouseEnter","handleMouseLeave","handleFocus","handleBlur","tooltipConfig","computed","config","handleOutsideClick","target","tooltipElement","__expose","onMounted","onUnmounted","mapped","stylePreset","sizePreset","finalClass","maxWidthStyle","_createBlock","TooltipProvider","_createVNode","Tooltip","TooltipTrigger","_renderSlot","_ctx","TooltipContent","_createTextVNode","_toDisplayString"],"mappings":"wlBAkBA,MAAMA,EAAQC,EAkCRC,EAAsD,CAC1D,QAAS,CAAE,MAAO,EAAA,EAClB,QAAS,CACP,MAAO,wCAAA,EAET,QAAS,CACP,MAAO,0CAAA,EAET,QAAS,CACP,MAAO,0CAAA,EAET,OAAQ,CACN,MAAO,sCAAA,CACT,EAMIC,EAAgD,CACpD,GAAI,CACF,MAAO,oCAAA,EAET,GAAI,CACF,MAAO,4BAAA,EAET,GAAI,CACF,MAAO,8BAAA,EAET,GAAI,CACF,MAAO,8BAAA,CACT,EAIIC,EAASC,EAAAA,IAAI,EAAK,EAGlBC,EAAeC,GAAsB,CACzC,QAAQ,IAAI,iCAAkCP,EAAM,OAAO,EACvDA,EAAM,UAAY,SACpB,QAAQ,IAAI,mCAAoCI,EAAO,KAAK,EAC5DA,EAAO,MAAQ,CAACA,EAAO,MACvB,QAAQ,IAAI,aAAcA,EAAO,KAAK,GAC7BJ,EAAM,UAAY,UAE3BO,EAAM,eAAA,EACNA,EAAM,gBAAA,EAEV,EAGA,IAAIC,EAA4B,KAEhC,MAAMC,EAAmB,IAAM,CACzBT,EAAM,UAAY,UAEhBQ,GACF,aAAaA,CAAU,EAGzBA,EAAa,WAAW,IAAM,CAC5BJ,EAAO,MAAQ,EACjB,EAAGJ,EAAM,KAAK,EAElB,EAEMU,EAAmB,IAAM,CACzBV,EAAM,UAAY,UAEhBQ,IACF,aAAaA,CAAU,EACvBA,EAAa,MAEfJ,EAAO,MAAQ,GAEnB,EAEMO,EAAc,IAAM,CACpBX,EAAM,UAAY,UACpBI,EAAO,MAAQ,GAEnB,EAEMQ,EAAa,IAAM,CACnBZ,EAAM,UAAY,UACpBI,EAAO,MAAQ,GAEnB,EAGMS,EAAgBC,EAAAA,SAAS,IAAM,CACnC,MAAMC,EAAc,CAClB,SAAUf,EAAM,QAAA,EAIlB,OAAAe,EAAO,KAAOX,EAAO,MAEdW,CACT,CAAC,EAGKC,EAAsBT,GAAiB,CAC3C,GAAIP,EAAM,UAAY,SAAWI,EAAO,MAAO,CAC7C,MAAMa,EAASV,EAAM,OACfW,EAAiB,SAAS,cAAc,wBAAwB,EAClEA,GAAkB,CAACA,EAAe,SAASD,CAAM,IACnDb,EAAO,MAAQ,GAEnB,CACF,EAgBAe,EAAa,CACX,YAdkB,IAAM,CACpBnB,EAAM,UAAY,WACpBI,EAAO,MAAQ,GAEnB,EAWE,YATkB,IAAM,CACpBJ,EAAM,UAAY,WACpBI,EAAO,MAAQ,GAEnB,CAKE,CACD,EAGDgB,EAAAA,UAAU,IAAM,CACVpB,EAAM,UAAY,SACpB,SAAS,iBAAiB,QAASgB,CAAkB,CAEzD,CAAC,EAEDK,EAAAA,YAAY,IAAM,CACZrB,EAAM,UAAY,SACpB,SAAS,oBAAoB,QAASgB,CAAkB,EAItDR,GACF,aAAaA,CAAU,CAE3B,CAAC,EAGD,MAAMc,EAASR,EAAAA,SAAS,IAAM,CAC5B,MAAMS,EAAcrB,EAAcF,EAAM,SAAU,EAC5CwB,EAAarB,EAAaH,EAAM,IAAK,EACrCyB,EAAa,CAACF,EAAY,MAAOC,EAAW,MAAOxB,EAAM,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAGxF0B,EAAgB,OAAO1B,EAAM,UAAa,SAC5C,GAAGA,EAAM,QAAQ,KACjBA,EAAM,SAEV,MAAO,CACL,KAAMA,EAAM,KACZ,MAAOA,EAAM,MACb,MAAOyB,EACP,MAAO,CACL,SAAUC,CAAA,CACZ,CAEJ,CAAC,8BAICC,EAAAA,YAiBkBC,UAAA,CAjBA,iBAAgB5B,EAAM,KAAA,qBACtC,IAeU,CAfV6B,EAAAA,YAeUC,EAAAA,8CAfOjB,EAAA,KAAa,CAAA,EAAA,mBAC5B,IAUiB,CAVjBgB,EAAAA,YAUiBE,EAAAA,QAAA,CATf,WAAA,GACC,uBAAsB,GACtB,QAAOzB,EACP,aAAYG,EACZ,aAAYC,EACZ,QAAOC,EACP,OAAMC,CAAA,qBAEP,IAAuB,CAAvBoB,aAAuBC,EAAA,OAAA,SAAA,CAAA,SAEzBJ,EAAAA,YAEiBK,EAAAA,8CAFOZ,EAAA,KAAM,CAAA,EAAA,mBAC5B,IAAmB,CAAhBa,EAAAA,gBAAAC,EAAAA,gBAAApC,EAAM,OAAO,EAAA,CAAA,CAAA"}