{"version":3,"file":"chunk-4a3bcbbc.js","sources":["../../../src/widgets/tooltip/Tooltip.svelte","../../../src/widgets/tooltip/index.svelte"],"sourcesContent":["<script>\n  import {fade} from 'svelte/transition';\n  import {createPopper} from '@popperjs/core';\n  /**\n   * ------- placement support value -----\n   * 'auto' | 'auto-start' | 'auto-end'\n   * 'top' | 'top-start' | 'top-end'\n   * 'bottom' | 'bottom-start' | 'bottom-end'\n   * 'right' | 'right-start' | 'right-end'\n   * 'left' | 'left-start' | 'left-end';\n   */\n\n  let className = '';\n  export {className as class};\n  export let anchorNode;\n  export let hover;\n  export let placement = 'auto';\n  export let background = '';\n  export let autoWidth = false;\n\n  let tooltipNode;\n\n  $: createTip(tooltipNode, anchorNode);\n\n  function createTip(tooltipNode, anchorNode) {\n    if (!tooltipNode || !anchorNode) {\n      return;\n    }\n    createPopper(anchorNode, tooltipNode, {\n      placement,\n      modifiers: [\n        {\n          name: 'offset',\n          options: {\n            offset: [0, 0],\n          },\n        },\n      ],\n    });\n  }\n\n  function handleMouseEnter() {\n    hover = true;\n  }\n\n  function handleMouseLeave() {\n    hover = false;\n  }\n</script>\n\n<style>\n  .tooltip-container {\n    z-index: 9999;\n    pointer-events: auto;\n  }\n  .tooltip {\n    box-shadow: 0 2px 8px 0 rgba(var(--B5), 0.15);\n    border-radius: 12px;\n    padding: 20px;\n    font-size: 12px;\n  }\n  .tooltip :global(a) {\n    text-decoration: underline;\n  }\n  .content {\n    white-space: normal;\n    color: var(--T1);\n  }\n  .arrow {\n    position: absolute;\n    width: 8px;\n    height: 8px;\n  }\n  .arrow2 {\n    transform: rotate(45deg);\n    width: 8px;\n    height: 8px;\n  }\n  .tooltip,\n  .arrow2 {\n    background: #ffffff;\n    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.1);\n  }\n  .tooltip-container[data-popper-placement^='top'] {\n    padding-bottom: 8px;\n  }\n  .tooltip-container[data-popper-placement^='top'] .arrow {\n    bottom: 4px;\n  }\n  .tooltip-container[data-popper-placement^='bottom'] {\n    padding-top: 8px;\n  }\n  .tooltip-container[data-popper-placement^='bottom'] .arrow {\n    top: 4px;\n  }\n  .tooltip-container[data-popper-placement^='left'] {\n    padding-right: 8px;\n  }\n  .tooltip-container[data-popper-placement^='left'] .arrow {\n    right: 4px;\n  }\n  .tooltip-container[data-popper-placement^='right'] {\n    padding-left: 8px;\n  }\n  .tooltip-container[data-popper-placement^='right'] .arrow {\n    left: 4px;\n  }\n  .tooltip-container[data-popper-placement$='-start'] .arrow,\n  .tooltip-container[data-popper-placement$='-end'] .arrow {\n    transform: unset !important;\n  }\n  .tooltip-container[data-popper-placement='bottom-start'] .arrow,\n  .tooltip-container[data-popper-placement='top-start'] .arrow {\n    left: 12px !important;\n  }\n  .tooltip-container[data-popper-placement='bottom-end'] .arrow,\n  .tooltip-container[data-popper-placement='top-end'] .arrow {\n    left: unset !important;\n    right: 12px !important;\n  }\n  .tooltip-container[data-popper-placement='left-start'] .arrow,\n  .tooltip-container[data-popper-placement='right-start'] .arrow {\n    top: 12px !important;\n  }\n  .tooltip-container[data-popper-placement='left-end'] .arrow,\n  .tooltip-container[data-popper-placement='right-end'] .arrow {\n    top: unset !important;\n    bottom: 12px !important;\n  }\n</style>\n\n<svelte:options accessors={true} />\n\n<div class=\"tooltip-container {className}\" transition:fade bind:this={tooltipNode} data-popper-placement={placement} role=\"tooltip\" on:mouseenter={handleMouseEnter} on:mouseleave={handleMouseLeave}>\n  <div class=\"tooltip\" style=\"max-width: {autoWidth ? 'unset' : '240px'};background:{background || ''};\">\n    <div class=\"content f14\">\n      <slot />\n    </div>\n    <div class=\"arrow\" data-popper-arrow>\n      <div class=\"arrow2\" style={background ? `background: ${background}` : ''} />\n    </div>\n  </div>\n</div>\n","<script>\n  import {onMount} from 'svelte';\n  import Tooltip from './Tooltip.svelte';\n\n  // const showEvents = [];\n  const triggerShowEvents = {\n    hover: ['mouseenter', 'focus'],\n    click: ['click'],\n  };\n  const hideEvents = ['mouseleave', 'blur'];\n\n  let className = '';\n  export {className as class};\n  export let title = '';\n  export let showDelay = 500;\n  export let hideDelay = 0;\n  export let visible = undefined; // 手动控制tooltip展示隐藏\n  export let closing = false;\n  /**\n   * @type {'hover' | 'click'}\n   */\n  export let trigger = 'hover';\n\n  export let placement = 'auto';\n  export let background = '';\n  export let autoWidth = false;\n  export let border = true;\n\n  let tooltipComHover = false;\n  let anchorNode = null;\n  let isHover = false;\n  let showTimeoutId = null;\n  let hideTimeoutId = null;\n\n  $: showEvents = triggerShowEvents[trigger] || triggerShowEvents.hover;\n  $: changeVisible(visible);\n  $: handleClosingChange(closing);\n\n  onMount(() => {\n    if (visible === undefined && anchorNode) {\n      showEvents.forEach((event) => anchorNode.addEventListener(event, showHandler));\n      hideEvents.forEach((event) => anchorNode.addEventListener(event, hideHandler));\n    }\n    return function () {\n      if (visible === undefined && anchorNode) {\n        showEvents.forEach((event) => anchorNode.removeEventListener(event, showHandler));\n        hideEvents.forEach((event) => anchorNode.removeEventListener(event, hideHandler));\n      }\n    };\n  });\n\n  function changeVisible(visible) {\n    if (visible) {\n      isHover = true;\n      tooltipComHover = true;\n      return;\n    }\n    isHover = false;\n    tooltipComHover = false;\n  }\n\n  function handleClosingChange(newClosing) {\n    if (newClosing) {\n      closing = false;\n      visible = false;\n      isHover = false;\n      tooltipComHover = false;\n    }\n  }\n\n  function showHandler() {\n    if (hideTimeoutId) {\n      clearTimeout(hideTimeoutId);\n    }\n    showTimeoutId = setTimeout(() => {\n      isHover = true;\n    }, showDelay);\n  }\n\n  function hideHandler() {\n    if (showTimeoutId) {\n      clearTimeout(showTimeoutId);\n    }\n    hideTimeoutId = setTimeout(() => {\n      isHover = false;\n    }, hideDelay);\n  }\n</script>\n\n<div class=\"dib\" class:tdud={border} class:ch={border} bind:this={anchorNode}>\n  <slot />\n</div>\n{#if isHover || tooltipComHover}\n  <Tooltip class={className} {placement} {autoWidth} {anchorNode} {background} bind:hover={tooltipComHover}>\n    <slot name=\"title\">\n      <span>{title}</span>\n    </slot>\n  </Tooltip>\n{/if}\n"],"names":["ctx","set_style","div3","insert_hydration","target","div4","anchor","append_hydration","div0","div2","div1","className","$$props","anchorNode","hover","placement","background","autoWidth","tooltipNode","createTip","createPopper","handleMouseEnter","$$invalidate","handleMouseLeave","$$value","span","if_block","create_if_block","div","triggerShowEvents","hideEvents","title","showDelay","hideDelay","visible","closing","trigger","border","tooltipComHover","isHover","showTimeoutId","hideTimeoutId","onMount","showEvents","event","showHandler","hideHandler","changeVisible","handleClosingChange","newClosing","value"],"mappings":"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"}