@legion-ui-kit/react-core
Version:
To install the package into your project:
1 lines • 4.64 kB
Source Map (JSON)
{"version":3,"file":"Tooltip.cjs","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["// Modules\r\nimport { cloneElement, useEffect, useRef, useState } from 'react';\r\nimport { createPortal } from 'react-dom';\r\n\r\n// Types\r\nimport type { RefObject } from 'react';\r\nimport type { TTooltipProps } from './Tooltip.type';\r\n\r\n// Components\r\nimport TooltipDialogue from './TooltipDialogue';\r\n\r\n// Hooks\r\nimport useMounted from '../../hooks/useMounted';\r\n\r\n// Helpers\r\nimport { getTooltipPosition } from './Tooltip.helper';\r\n\r\n// Constants\r\nimport { TOOLTIP_DEFAULT_PROPS } from './Tooltip.constant';\r\n\r\nconst Tooltip = (props: TTooltipProps) => {\r\n\tconst {\r\n\t\tchildren: target,\r\n\t\tclassName,\r\n\t\tcontent,\r\n\t\tnoArrow,\r\n\t\tposition = TOOLTIP_DEFAULT_PROPS.position,\r\n\t\tref,\r\n\t\t...restProps\r\n\t} = props\r\n\tconst localRef = useRef<HTMLDivElement | null>(null);\r\n\tconst tooltipRef = ref as RefObject<HTMLDivElement> || localRef;\r\n\tconst targetRef = useRef<HTMLDivElement | null>(null);\r\n\r\n const isMounted = useMounted()\r\n\r\n\tconst [isShowTooltip, setIsShowTooltip] = useState<boolean>(true)\r\n\r\n\tconst clonedTarget = cloneElement(target!, {\r\n\t\t...target.props,\r\n\t\tref: targetRef,\r\n\t\tonMouseEnter: (e: React.MouseEvent) => {\r\n\t\t\ttarget.props.onMouseEnter?.(e)\r\n\t\t\tsetIsShowTooltip(true)\r\n\t\t},\r\n\t\tonMouseLeave: (e: React.MouseEvent) => {\r\n\t\t\ttarget.props.onMouseLeave?.(e)\r\n\t\t\tsetIsShowTooltip(false)\r\n\t\t}\r\n\t})\r\n\r\n\tconst [tooltipTop, setTooltipTop] = useState<number>(0)\r\n\tconst [tooltipLeft, setTooltipLeft] = useState<number>(0)\r\n\r\n\tuseEffect(() => {\r\n\t\tsetIsShowTooltip(false)\r\n\t}, [])\r\n\r\n\tuseEffect(() => {\r\n\t\tconst { top, left } = getTooltipPosition({\r\n\t\t\tposition: position!,\r\n\t\t\ttargetHeight: targetRef.current?.offsetHeight || 0,\r\n\t\t\ttargetWidth: targetRef.current?.offsetWidth || 0,\r\n\t\t\ttargetTop: targetRef.current?.offsetTop || 0,\r\n\t\t\ttargetLeft: targetRef.current?.offsetLeft || 0,\r\n\t\t\ttooltipHeight: tooltipRef?.current?.offsetHeight || 0,\r\n\t\t\ttooltipWidth: tooltipRef?.current?.offsetWidth || 0\r\n\t\t})\r\n\r\n\t\tsetTooltipTop(top)\r\n\t\tsetTooltipLeft(left)\r\n\t}, [targetRef, tooltipRef, position])\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t{isMounted && createPortal(\r\n\t\t\t\tisShowTooltip && (\r\n\t\t\t\t\t<TooltipDialogue\r\n\t\t\t\t\t\tref={tooltipRef}\r\n\t\t\t\t\t\tclassName={className}\r\n\t\t\t\t\t\tposition={position}\r\n\t\t\t\t\t\tnoArrow={noArrow}\r\n\t\t\t\t\t\tstyle={{\r\n\t\t\t\t\t\t\ttop: tooltipTop,\r\n\t\t\t\t\t\t\tleft: tooltipLeft\r\n\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t{...restProps}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{content}\r\n\t\t\t\t\t</TooltipDialogue>\r\n\t\t\t\t),\r\n\t\t\t\tdocument.body\r\n\t\t\t)}\r\n\t\t\t{clonedTarget}\r\n\t\t</>\r\n\t)\r\n}\r\n\r\nexport default Tooltip\r\n"],"names":["props","children","target","className","content","noArrow","position","TOOLTIP_DEFAULT_PROPS","ref","restProps","localRef","useRef","tooltipRef","targetRef","isMounted","useMounted","isShowTooltip","setIsShowTooltip","useState","clonedTarget","cloneElement","onMouseEnter","e","onMouseLeave","tooltipTop","setTooltipTop","tooltipLeft","setTooltipLeft","useEffect","top","left","getTooltipPosition","targetHeight","current","offsetHeight","targetWidth","offsetWidth","targetTop","offsetTop","targetLeft","offsetLeft","tooltipHeight","tooltipWidth","_jsxs","_Fragment","createPortal","_jsx","TooltipDialogue","style","document","body"],"mappings":"kTAoBiBA,IAChB,MACCC,SAAUC,EAAMC,UAChBA,EAASC,QACTA,EAAOC,QACPA,EAAOC,SACPA,EAAWC,EAAAA,sBAAsBD,SAAQE,IACzCA,KACGC,GACAT,EACEU,EAAWC,EAAAA,OAA8B,MACzCC,EAAaJ,GAAoCE,EACjDG,EAAYF,EAAAA,OAA8B,MAEzCG,EAAYC,EAAAA,WAEZC,EAAeC,GAAoBC,EAAAA,UAAkB,GAEtDC,EAAeC,EAAAA,aAAalB,EAAS,IACvCA,EAAOF,MACVQ,IAAKK,EACLQ,aAAeC,IACdpB,EAAOF,MAAMqB,eAAeC,GAC5BL,GAAiB,IAElBM,aAAeD,IACdpB,EAAOF,MAAMuB,eAAeD,GAC5BL,GAAiB,OAIZO,EAAYC,GAAiBP,EAAAA,SAAiB,IAC9CQ,EAAaC,GAAkBT,EAAAA,SAAiB,GAqBvD,OAnBAU,EAAAA,UAAU,KACTX,GAAiB,IACf,IAEHW,EAAAA,UAAU,KACT,MAAMC,IAAEA,EAAGC,KAAEA,GAASC,qBAAmB,CACxCzB,SAAUA,EACV0B,aAAcnB,EAAUoB,SAASC,cAAgB,EACjDC,YAAatB,EAAUoB,SAASG,aAAe,EAC/CC,UAAWxB,EAAUoB,SAASK,WAAa,EAC3CC,WAAY1B,EAAUoB,SAASO,YAAc,EAC7CC,cAAe7B,GAAYqB,SAASC,cAAgB,EACpDQ,aAAc9B,GAAYqB,SAASG,aAAe,IAGnDX,EAAcI,GACdF,EAAeG,IACb,CAACjB,EAAWD,EAAYN,IAG1BqC,EAAAA,KAAAC,EAAAA,SAAA,CAAA3C,SAAA,CACEa,GAAa+B,EAAAA,aACb7B,GACC8B,MAACC,EAAAA,QAAe,CACfvC,IAAKI,EACLT,UAAWA,EACXG,SAAUA,EACVD,QAASA,EACT2C,MAAO,CACNnB,IAAKL,EACLM,KAAMJ,MAEHjB,EAASR,SAEZG,IAGH6C,SAASC,MAET/B"}