minerva-design 1.0.1 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";const e=require("../../_virtual/_rolldown/runtime.cjs");require("../../utils/cn.cjs");const t=require("../../internal/stylingHooks.cjs"),n=require("../../internal/devWarnings.cjs"),ee=require("../../internal/mergeRefs.cjs"),te=require("../../internal/useControllableState.cjs"),ne=require("../../internal/Slot.cjs"),r=require("../../internal/Portal.cjs"),re=require("../../internal/useDismissableLayer.cjs"),i=require("../../internal/FloatingPanel.cjs"),a=require("./TooltipProvider.cjs"),o=require("./tooltip.module.scss.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("react/jsx-runtime"),l=require("../../../dom/index.cjs"),u=require("../../../core/index.cjs");var ie=6,ae=300,d=s.default.memo(({ref:e,content:d,children:f,open:p,defaultOpen:m,onOpenChange:oe,placement:h=`top`,color:g=`neutral`,variant:_=`solid`,shape:v=`default`,animation:se=`fade`,enterDelay:ce,leaveDelay:le,offset:y,disabled:b=!1,followCursor:x=!1,className:S=``,zIndex:ue=1500,arrow:C=!1,onOpen:de,onClose:fe,"aria-label":pe,asChild:me=!1,contentClassName:he,contentRef:ge})=>{let w=a.useTooltipConfig(),T=ce??w?.enterDelay??200,E=le??w?.leaveDelay??0;process.env.NODE_ENV!==`production`&&n.warnControlledProps(`Tooltip`,{prop:`open`,value:p,defaultProp:`defaultOpen`,defaultValue:m});let[D,O]=te.useControllableState({value:p,defaultValue:m??!1,onChange:oe,name:`Tooltip`,prop:`open`}),[k,A]=(0,s.useState)(null),[_e,ve]=(0,s.useState)(null),[j,M]=(0,s.useState)(null),N=(0,s.useRef)(void 0),P=(0,s.useRef)(void 0),F=`tooltip-${(0,s.useId)().replace(/:/g,``)}`,[I]=(0,s.useState)(()=>(0,l.createPointerGrace)({timeout:0})),L=()=>{clearTimeout(N.current),clearTimeout(P.current),I.clear()};(0,s.useEffect)(()=>()=>{clearTimeout(N.current),clearTimeout(P.current)},[]);let R=()=>{D||(O(!0),de?.())},z=()=>{D&&(w?.markClosed(),O(!1),fe?.())};(0,s.useImperativeHandle)(e,()=>({open:()=>O(!0),close:()=>O(!1),toggle:()=>O(e=>!e)}),[O]);let ye=(0,s.useMemo)(()=>x&&j?{getBoundingClientRect:()=>DOMRect.fromRect({x:j.x,y:j.y,width:0,height:0})}:null,[x,j]),B=h.startsWith(`top`)||h.startsWith(`bottom`),V=C?ie:0,H=D&&!b,U=i.useFloatingLayer({open:H,anchor:ye??k,placement:h,offset:y?{mainAxis:(B?y[1]:y[0])+V,crossAxis:B?y[0]:y[1]}:{mainAxis:8+V},arrowElement:C?_e:null,branches:()=>[k],dismissOnPointerDownOutside:!1,dismissOnFocusOutside:!1,onDismiss:()=>{L(),z()}}),{floatingStyles:be,placement:W,isPositioned:xe,arrowStyles:Se}=U,Ce=ee.useMergedRefs(U.ref,ge);(0,s.useEffect)(()=>{if(!x||!D)return;let e=e=>M({x:e.clientX,y:e.clientY});return document.addEventListener(`mousemove`,e),()=>document.removeEventListener(`mousemove`,e)},[x,D]);let G=()=>{clearTimeout(P.current),P.current=setTimeout(z,E)};(0,s.useEffect)(()=>{if(!D||x)return;let e=e=>{if(!I.getArea())return;let t=e.target,n=U.element;t&&(k?.contains(t)||n?.contains(t))||I.isInGraceArea({x:e.clientX,y:e.clientY})||(I.clear(),G())};return document.addEventListener(`pointermove`,e),()=>document.removeEventListener(`pointermove`,e)});let K=e=>{if(!b){if(x&&M({x:e.clientX,y:e.clientY}),L(),T<=0||w?.shouldSkipDelay()){R();return}N.current=setTimeout(R,T)}},q=e=>{if(b)return;L();let t=U.element?.getBoundingClientRect();if(D&&!x&&t&&t.width>0&&t.height>0){I.start({x:e.clientX,y:e.clientY},t,(0,l.parsePlacement)(W).side),P.current=setTimeout(z,Math.max(E,ae));return}G()},we=()=>{b||L()},J=()=>{b||(L(),R())},Y=()=>{b||(L(),z())},X=H?F:void 0,Z=(0,s.isValidElement)(f),Q=[(Z?f.props:{})[`aria-describedby`],X].filter(Boolean).join(` `)||void 0,Te=me&&Z,Ee=t.hooks(`tooltip`,`trigger`,{state:H?`open`:`closed`,disabled:b}),$;return $=Te?
|
|
1
|
+
"use client";const e=require("../../_virtual/_rolldown/runtime.cjs");require("../../utils/cn.cjs");const t=require("../../internal/stylingHooks.cjs"),n=require("../../internal/devWarnings.cjs"),ee=require("../../internal/mergeRefs.cjs"),te=require("../../internal/useControllableState.cjs"),ne=require("../../internal/Slot.cjs"),r=require("../../internal/Portal.cjs"),re=require("../../internal/useDismissableLayer.cjs"),i=require("../../internal/FloatingPanel.cjs"),a=require("./TooltipProvider.cjs"),o=require("./tooltip.module.scss.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("react/jsx-runtime"),l=require("../../../dom/index.cjs"),u=require("../../../core/index.cjs");var ie=6,ae=300,d=s.default.memo(({ref:e,content:d,children:f,open:p,defaultOpen:m,onOpenChange:oe,placement:h=`top`,color:g=`neutral`,variant:_=`solid`,shape:v=`default`,animation:se=`fade`,enterDelay:ce,leaveDelay:le,offset:y,disabled:b=!1,followCursor:x=!1,className:S=``,zIndex:ue=1500,arrow:C=!1,onOpen:de,onClose:fe,"aria-label":pe,asChild:me=!1,contentClassName:he,contentRef:ge})=>{let w=a.useTooltipConfig(),T=ce??w?.enterDelay??200,E=le??w?.leaveDelay??0;process.env.NODE_ENV!==`production`&&n.warnControlledProps(`Tooltip`,{prop:`open`,value:p,defaultProp:`defaultOpen`,defaultValue:m});let[D,O]=te.useControllableState({value:p,defaultValue:m??!1,onChange:oe,name:`Tooltip`,prop:`open`}),[k,A]=(0,s.useState)(null),[_e,ve]=(0,s.useState)(null),[j,M]=(0,s.useState)(null),N=(0,s.useRef)(void 0),P=(0,s.useRef)(void 0),F=`tooltip-${(0,s.useId)().replace(/:/g,``)}`,[I]=(0,s.useState)(()=>(0,l.createPointerGrace)({timeout:0})),L=()=>{clearTimeout(N.current),clearTimeout(P.current),I.clear()};(0,s.useEffect)(()=>()=>{clearTimeout(N.current),clearTimeout(P.current)},[]);let R=()=>{D||(O(!0),de?.())},z=()=>{D&&(w?.markClosed(),O(!1),fe?.())};(0,s.useImperativeHandle)(e,()=>({open:()=>O(!0),close:()=>O(!1),toggle:()=>O(e=>!e)}),[O]);let ye=(0,s.useMemo)(()=>x&&j?{getBoundingClientRect:()=>DOMRect.fromRect({x:j.x,y:j.y,width:0,height:0})}:null,[x,j]),B=h.startsWith(`top`)||h.startsWith(`bottom`),V=C?ie:0,H=D&&!b,U=i.useFloatingLayer({open:H,anchor:ye??k,placement:h,offset:y?{mainAxis:(B?y[1]:y[0])+V,crossAxis:B?y[0]:y[1]}:{mainAxis:8+V},arrowElement:C?_e:null,branches:()=>[k],dismissOnPointerDownOutside:!1,dismissOnFocusOutside:!1,onDismiss:()=>{L(),z()}}),{floatingStyles:be,placement:W,isPositioned:xe,arrowStyles:Se}=U,Ce=ee.useMergedRefs(U.ref,ge);(0,s.useEffect)(()=>{if(!x||!D)return;let e=e=>M({x:e.clientX,y:e.clientY});return document.addEventListener(`mousemove`,e),()=>document.removeEventListener(`mousemove`,e)},[x,D]);let G=()=>{clearTimeout(P.current),P.current=setTimeout(z,E)};(0,s.useEffect)(()=>{if(!D||x)return;let e=e=>{if(!I.getArea())return;let t=e.target,n=U.element;t&&(k?.contains(t)||n?.contains(t))||I.isInGraceArea({x:e.clientX,y:e.clientY})||(I.clear(),G())};return document.addEventListener(`pointermove`,e),()=>document.removeEventListener(`pointermove`,e)});let K=e=>{if(!b){if(x&&M({x:e.clientX,y:e.clientY}),L(),T<=0||w?.shouldSkipDelay()){R();return}N.current=setTimeout(R,T)}},q=e=>{if(b)return;L();let t=U.element?.getBoundingClientRect();if(D&&!x&&t&&t.width>0&&t.height>0){I.start({x:e.clientX,y:e.clientY},t,(0,l.parsePlacement)(W).side),P.current=setTimeout(z,Math.max(E,ae));return}G()},we=()=>{b||L()},J=()=>{b||(L(),R())},Y=()=>{b||(L(),z())},X=H?F:void 0,Z=(0,s.isValidElement)(f),Q=[(Z?f.props:{})[`aria-describedby`],X].filter(Boolean).join(` `)||void 0,Te=me&&Z,Ee=t.hooks(`tooltip`,`trigger`,{state:H?`open`:`closed`,disabled:b}),$;return $=Te?(0,c.jsx)(ne.Slot,{ref:A,className:S||void 0,onMouseEnter:b?void 0:K,onMouseLeave:b?void 0:q,onFocus:b?void 0:J,onBlur:b?void 0:Y,children:(0,s.cloneElement)(f,{"aria-describedby":Q})}):(0,c.jsx)(`div`,{ref:A,className:(0,u.cn)(o.default.tooltipTrigger,S),onMouseEnter:K,onMouseLeave:q,onFocus:J,onBlur:Y,"aria-describedby":Z?void 0:X,...Ee,children:Z?(0,s.cloneElement)(f,{"aria-describedby":Q}):f}),(0,c.jsxs)(c.Fragment,{children:[$,H&&(0,c.jsx)(r.Portal,{children:(0,c.jsxs)(`div`,{ref:Ce,dir:U.dir,id:F,role:`tooltip`,"aria-label":pe,...t.hooks(`tooltip`,`content`,{state:`open`,color:g,variant:_,shape:v,...(0,l.parsePlacement)(W),placement:W}),onMouseEnter:we,onMouseLeave:x||b?void 0:G,className:(0,u.cn)(o.default.tooltip,o.default[g],o.default[_],o.default[v],o.default[`animation-${se}`],x&&o.default.followCursor,C&&o.default.arrow,xe&&o.default.show,he),style:{...be,zIndex:ue},children:[(0,c.jsx)(re.LayerContext.Provider,{value:U.element,children:d}),C&&(0,c.jsx)(`div`,{ref:ve,className:o.default.tooltipArrow,style:Se,...t.hooks(`tooltip`,`arrow`)})]})})]})});exports.default=d;
|
|
2
2
|
//# sourceMappingURL=Tooltip.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.cjs","names":["useTooltipConfig","useControllableState","useState","useRef","useId","createPointerGrace","useMemo","useFloatingLayer","useMergedRefs","parsePlacement","isValidElement","hooks","Slot","cloneElement","cn","styles","_Fragment","Portal","LayerContext","React","require_runtime","require_stylingHooks","require_devWarnings","require_mergeRefs","require_useControllableState","require_Slot","require_Portal","require_useDismissableLayer","require_FloatingPanel","require_TooltipProvider","require_tooltip_module","react","react_jsx_runtime","_minerva_dom","_minerva_core","ARROW_GAP","HOVER_GRACE_MS","Tooltip_default","openProp","enterDelayProp","leaveDelayProp","ariaLabel","config","enterDelay","leaveDelay","defaultOpen","open","setOpen","onOpenChange","triggerEl","setTriggerEl","arrowEl","setArrowEl","cursor","setCursor","enterTimeoutRef","leaveTimeoutRef","tooltipId","grace","clearTimers","show","onOpen","hide","onClose","ref","prev","cursorAnchor","followCursor","isVertical","placement","gap","arrow","visible","disabled","layer","offset","finalPlacement","setContentRef","contentRef","handleMouseMove","scheduleHide","handlePointerMove","target","floating","handleMouseEnter","handleMouseLeave","rect","handleContentMouseEnter","handleFocus","handleBlur","describedBy","isElementChild","children","childDescribedBy","useChildAsTrigger","asChild","triggerHooks","triggerNode","className","color","variant","shape","animation","isPositioned","contentClassName","floatingStyles","content","arrowStyles"],"sources":["../../../../../react/src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\n cloneElement,\n isValidElement,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPointerGrace, parsePlacement } from \"@minerva/dom\";\nimport { cn } from \"../../utils/cn\";\nimport { hooks } from \"../../internal/stylingHooks\";\nimport { Slot } from \"../../internal/Slot\";\nimport type { TooltipProps } from \"./types\";\nimport { useFloatingLayer } from \"../../internal/FloatingPanel\";\nimport { Portal } from \"../../internal/Portal\";\nimport type { VirtualElement } from \"../../internal/useAnchoredPosition\";\nimport { LayerContext } from \"../../internal/useDismissableLayer\";\nimport { useControllableState } from \"../../internal/useControllableState\";\nimport { warnControlledProps } from \"../../internal/devWarnings\";\nimport { useMergedRefs } from \"../../internal/mergeRefs\";\nimport { useTooltipConfig } from \"./TooltipProvider\";\nimport styles from \"./tooltip.module.scss\";\n\n/** Extra gap so the arrow does not overlap the trigger. */\nconst ARROW_GAP = 6;\n/**\n * How long the pointer may travel from the trigger to the tooltip (through\n * the gap between them) before the tooltip closes (WCAG 1.4.13 hoverable).\n */\nconst HOVER_GRACE_MS = 300;\n\ntype TriggerChildProps = {\n \"aria-describedby\"?: string;\n};\n\n/**\n * Tooltip: shows informative content when the wrapped element is hovered or\n * focused. Flips / shifts to stay inside the viewport.\n *\n * WCAG 1.4.13: dismissable with Escape (a non-modal layer: only when it is\n * the topmost one, so in an open Popover the first Escape closes the\n * tooltip only), hoverable (the pointer can move from the trigger onto the\n * tooltip through the gap between them) and persistent.\n */\nconst Tooltip = ({\n ref,\n content,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n placement = \"top\",\n color = \"neutral\",\n variant = \"solid\",\n shape = \"default\",\n animation = \"fade\",\n enterDelay: enterDelayProp,\n leaveDelay: leaveDelayProp,\n offset,\n disabled = false,\n followCursor = false,\n className = \"\",\n zIndex = 1500,\n arrow = false,\n onOpen,\n onClose,\n \"aria-label\": ariaLabel,\n asChild = false,\n contentClassName,\n contentRef,\n}: TooltipProps) => {\n const config = useTooltipConfig();\n const enterDelay = enterDelayProp ?? config?.enterDelay ?? 200;\n const leaveDelay = leaveDelayProp ?? config?.leaveDelay ?? 0;\n if (process.env.NODE_ENV !== \"production\") {\n warnControlledProps(\"Tooltip\", {\n prop: \"open\",\n value: openProp,\n defaultProp: \"defaultOpen\",\n defaultValue: defaultOpen,\n });\n }\n const [open, setOpen] = useControllableState({\n value: openProp,\n defaultValue: defaultOpen ?? false,\n onChange: onOpenChange,\n name: \"Tooltip\",\n prop: \"open\",\n });\n const [triggerEl, setTriggerEl] = useState<HTMLElement | null>(null);\n const [arrowEl, setArrowEl] = useState<HTMLDivElement | null>(null);\n const [cursor, setCursor] = useState<{ x: number; y: number } | null>(null);\n const enterTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(\n undefined,\n );\n const leaveTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(\n undefined,\n );\n const tooltipId = `tooltip-${useId().replace(/:/g, \"\")}`;\n\n // Pointer travelling from the trigger towards the tooltip\n const [grace] = useState(() => createPointerGrace({ timeout: 0 }));\n\n const clearTimers = () => {\n clearTimeout(enterTimeoutRef.current);\n clearTimeout(leaveTimeoutRef.current);\n grace.clear();\n };\n useEffect(\n () => () => {\n clearTimeout(enterTimeoutRef.current);\n clearTimeout(leaveTimeoutRef.current);\n },\n [],\n );\n\n const show = () => {\n if (open) return;\n setOpen(true);\n onOpen?.();\n };\n const hide = () => {\n if (!open) return;\n config?.markClosed();\n setOpen(false);\n onClose?.();\n };\n\n useImperativeHandle(\n ref,\n () => ({\n open: () => setOpen(true),\n close: () => setOpen(false),\n toggle: () => setOpen((prev) => !prev),\n }),\n [setOpen],\n );\n\n // A virtual element at the cursor position when following the cursor\n const cursorAnchor = useMemo<VirtualElement | null>(\n () =>\n followCursor && cursor\n ? {\n getBoundingClientRect: () =>\n DOMRect.fromRect({\n x: cursor.x,\n y: cursor.y,\n width: 0,\n height: 0,\n }),\n }\n : null,\n [followCursor, cursor],\n );\n\n const isVertical =\n placement.startsWith(\"top\") || placement.startsWith(\"bottom\");\n const gap = arrow ? ARROW_GAP : 0;\n const visible = open && !disabled;\n const layer = useFloatingLayer({\n open: visible,\n anchor: cursorAnchor ?? triggerEl,\n placement,\n offset: offset\n ? {\n mainAxis: (isVertical ? offset[1] : offset[0]) + gap,\n crossAxis: isVertical ? offset[0] : offset[1],\n }\n : { mainAxis: 8 + gap },\n arrowElement: arrow ? arrowEl : null,\n branches: () => [triggerEl],\n // Escape only (topmost layer); hover / focus handle the rest\n dismissOnPointerDownOutside: false,\n dismissOnFocusOutside: false,\n onDismiss: () => {\n clearTimers();\n hide();\n },\n });\n const {\n floatingStyles,\n placement: finalPlacement,\n isPositioned,\n arrowStyles,\n } = layer;\n const setContentRef = useMergedRefs<HTMLElement>(\n layer.ref,\n contentRef as React.Ref<HTMLElement>,\n );\n\n // Track the cursor while open (followCursor)\n useEffect(() => {\n if (!followCursor || !open) return;\n const handleMouseMove = (e: MouseEvent) =>\n setCursor({ x: e.clientX, y: e.clientY });\n document.addEventListener(\"mousemove\", handleMouseMove);\n return () => document.removeEventListener(\"mousemove\", handleMouseMove);\n }, [followCursor, open]);\n\n const scheduleHide = () => {\n clearTimeout(leaveTimeoutRef.current);\n leaveTimeoutRef.current = setTimeout(hide, leaveDelay);\n };\n\n // Hoverable (WCAG 1.4.13): while the pointer heads from the trigger to the\n // tooltip through the gap between them, keep it open.\n useEffect(() => {\n if (!open || followCursor) return;\n const handlePointerMove = (e: PointerEvent) => {\n if (!grace.getArea()) return;\n const target = e.target as Node | null;\n const floating = layer.element;\n if (\n target &&\n (triggerEl?.contains(target) || floating?.contains(target))\n ) {\n return;\n }\n if (grace.isInGraceArea({ x: e.clientX, y: e.clientY })) return;\n grace.clear();\n scheduleHide();\n };\n document.addEventListener(\"pointermove\", handlePointerMove);\n return () => document.removeEventListener(\"pointermove\", handlePointerMove);\n });\n\n const handleMouseEnter = (e: React.MouseEvent) => {\n if (disabled) return;\n if (followCursor) setCursor({ x: e.clientX, y: e.clientY });\n clearTimers();\n // Within a provider, moving quickly between tooltips skips the delay\n if (enterDelay <= 0 || config?.shouldSkipDelay()) {\n show();\n return;\n }\n enterTimeoutRef.current = setTimeout(show, enterDelay);\n };\n\n const handleMouseLeave = (e: React.MouseEvent) => {\n if (disabled) return;\n clearTimers();\n const rect = layer.element?.getBoundingClientRect();\n if (open && !followCursor && rect && rect.width > 0 && rect.height > 0) {\n // Heading for the tooltip: keep it open while the pointer crosses the\n // gap (pointermove above), at most HOVER_GRACE_MS.\n grace.start(\n { x: e.clientX, y: e.clientY },\n rect,\n parsePlacement(finalPlacement).side,\n );\n leaveTimeoutRef.current = setTimeout(\n hide,\n Math.max(leaveDelay, HOVER_GRACE_MS),\n );\n return;\n }\n scheduleHide();\n };\n\n // The pointer reached the tooltip: stay open until it leaves it\n const handleContentMouseEnter = () => {\n if (disabled) return;\n clearTimers();\n };\n\n // Keyboard users get the tooltip when the wrapped (interactive) child\n // receives focus. Activation keys are left alone so they still reach it.\n const handleFocus = () => {\n if (disabled) return;\n clearTimers();\n show();\n };\n\n const handleBlur = () => {\n if (disabled) return;\n clearTimers();\n hide();\n };\n\n const describedBy = visible ? tooltipId : undefined;\n\n // Point the interactive child at the tooltip; fall back to the wrapper\n // when children is not a single element (e.g. plain text).\n const isElementChild = isValidElement<TriggerChildProps>(children);\n const childProps: TriggerChildProps = isElementChild\n ? (children.props as TriggerChildProps)\n : {};\n const childDescribedBy =\n [childProps[\"aria-describedby\"], describedBy].filter(Boolean).join(\" \") ||\n undefined;\n const useChildAsTrigger = asChild && isElementChild;\n\n // The wrapper only: with asChild the child keeps its own hooks.\n const triggerHooks = hooks(\"tooltip\", \"trigger\", {\n state: visible ? \"open\" : \"closed\",\n disabled,\n });\n\n let triggerNode: React.ReactNode;\n if (useChildAsTrigger) {\n // Disabled: render the child untouched (no handlers, no state hooks)\n triggerNode = disabled ? (\n children\n ) : (\n <Slot\n ref={setTriggerEl}\n className={className || undefined}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onFocus={handleFocus}\n onBlur={handleBlur}\n >\n {cloneElement(children, { \"aria-describedby\": childDescribedBy })}\n </Slot>\n );\n } else {\n triggerNode = (\n <div\n ref={setTriggerEl}\n className={cn(styles.tooltipTrigger, className)}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onFocus={handleFocus}\n onBlur={handleBlur}\n aria-describedby={isElementChild ? undefined : describedBy}\n {...triggerHooks}\n >\n {isElementChild\n ? cloneElement(children, { \"aria-describedby\": childDescribedBy })\n : children}\n </div>\n );\n }\n\n return (\n <>\n {triggerNode}\n {visible && (\n <Portal>\n <div\n ref={setContentRef}\n dir={layer.dir}\n id={tooltipId}\n role=\"tooltip\"\n aria-label={ariaLabel}\n {...hooks(\"tooltip\", \"content\", {\n state: \"open\",\n color,\n variant,\n shape,\n ...parsePlacement(finalPlacement),\n placement: finalPlacement,\n })}\n onMouseEnter={handleContentMouseEnter}\n onMouseLeave={followCursor || disabled ? undefined : scheduleHide}\n className={cn(\n styles.tooltip,\n styles[color],\n styles[variant],\n styles[shape],\n styles[`animation-${animation}`],\n followCursor && styles.followCursor,\n arrow && styles.arrow,\n isPositioned && styles.show,\n contentClassName,\n )}\n style={{\n ...floatingStyles,\n zIndex,\n }}\n >\n <LayerContext.Provider value={layer.element}>\n {content}\n </LayerContext.Provider>\n {arrow && (\n <div\n ref={setArrowEl}\n className={styles.tooltipArrow}\n style={arrowStyles}\n {...hooks(\"tooltip\", \"arrow\")}\n />\n )}\n </div>\n </Portal>\n )}\n </>\n );\n};\n\nexport default React.memo(Tooltip);\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tooltip.cjs","names":["useTooltipConfig","useControllableState","useState","useRef","useId","createPointerGrace","useMemo","useFloatingLayer","useMergedRefs","parsePlacement","isValidElement","hooks","Slot","cloneElement","cn","styles","_Fragment","Portal","LayerContext","React","require_runtime","require_stylingHooks","require_devWarnings","require_mergeRefs","require_useControllableState","require_Slot","require_Portal","require_useDismissableLayer","require_FloatingPanel","require_TooltipProvider","require_tooltip_module","react","react_jsx_runtime","_minerva_dom","_minerva_core","ARROW_GAP","HOVER_GRACE_MS","Tooltip_default","openProp","enterDelayProp","leaveDelayProp","ariaLabel","config","enterDelay","leaveDelay","defaultOpen","open","setOpen","onOpenChange","triggerEl","setTriggerEl","arrowEl","setArrowEl","cursor","setCursor","enterTimeoutRef","leaveTimeoutRef","tooltipId","grace","clearTimers","show","onOpen","hide","onClose","ref","prev","cursorAnchor","followCursor","isVertical","placement","gap","arrow","visible","disabled","layer","offset","finalPlacement","setContentRef","contentRef","handleMouseMove","scheduleHide","handlePointerMove","target","floating","handleMouseEnter","handleMouseLeave","rect","handleContentMouseEnter","handleFocus","handleBlur","describedBy","isElementChild","children","childDescribedBy","useChildAsTrigger","asChild","triggerHooks","triggerNode","className","color","variant","shape","animation","isPositioned","contentClassName","floatingStyles","content","arrowStyles"],"sources":["../../../../../react/src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\n cloneElement,\n isValidElement,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPointerGrace, parsePlacement } from \"@minerva/dom\";\nimport { cn } from \"../../utils/cn\";\nimport { hooks } from \"../../internal/stylingHooks\";\nimport { Slot } from \"../../internal/Slot\";\nimport type { TooltipProps } from \"./types\";\nimport { useFloatingLayer } from \"../../internal/FloatingPanel\";\nimport { Portal } from \"../../internal/Portal\";\nimport type { VirtualElement } from \"../../internal/useAnchoredPosition\";\nimport { LayerContext } from \"../../internal/useDismissableLayer\";\nimport { useControllableState } from \"../../internal/useControllableState\";\nimport { warnControlledProps } from \"../../internal/devWarnings\";\nimport { useMergedRefs } from \"../../internal/mergeRefs\";\nimport { useTooltipConfig } from \"./TooltipProvider\";\nimport styles from \"./tooltip.module.scss\";\n\n/** Extra gap so the arrow does not overlap the trigger. */\nconst ARROW_GAP = 6;\n/**\n * How long the pointer may travel from the trigger to the tooltip (through\n * the gap between them) before the tooltip closes (WCAG 1.4.13 hoverable).\n */\nconst HOVER_GRACE_MS = 300;\n\ntype TriggerChildProps = {\n \"aria-describedby\"?: string;\n};\n\n/**\n * Tooltip: shows informative content when the wrapped element is hovered or\n * focused. Flips / shifts to stay inside the viewport.\n *\n * WCAG 1.4.13: dismissable with Escape (a non-modal layer: only when it is\n * the topmost one, so in an open Popover the first Escape closes the\n * tooltip only), hoverable (the pointer can move from the trigger onto the\n * tooltip through the gap between them) and persistent.\n */\nconst Tooltip = ({\n ref,\n content,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n placement = \"top\",\n color = \"neutral\",\n variant = \"solid\",\n shape = \"default\",\n animation = \"fade\",\n enterDelay: enterDelayProp,\n leaveDelay: leaveDelayProp,\n offset,\n disabled = false,\n followCursor = false,\n className = \"\",\n zIndex = 1500,\n arrow = false,\n onOpen,\n onClose,\n \"aria-label\": ariaLabel,\n asChild = false,\n contentClassName,\n contentRef,\n}: TooltipProps) => {\n const config = useTooltipConfig();\n const enterDelay = enterDelayProp ?? config?.enterDelay ?? 200;\n const leaveDelay = leaveDelayProp ?? config?.leaveDelay ?? 0;\n if (process.env.NODE_ENV !== \"production\") {\n warnControlledProps(\"Tooltip\", {\n prop: \"open\",\n value: openProp,\n defaultProp: \"defaultOpen\",\n defaultValue: defaultOpen,\n });\n }\n const [open, setOpen] = useControllableState({\n value: openProp,\n defaultValue: defaultOpen ?? false,\n onChange: onOpenChange,\n name: \"Tooltip\",\n prop: \"open\",\n });\n const [triggerEl, setTriggerEl] = useState<HTMLElement | null>(null);\n const [arrowEl, setArrowEl] = useState<HTMLDivElement | null>(null);\n const [cursor, setCursor] = useState<{ x: number; y: number } | null>(null);\n const enterTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(\n undefined,\n );\n const leaveTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(\n undefined,\n );\n const tooltipId = `tooltip-${useId().replace(/:/g, \"\")}`;\n\n // Pointer travelling from the trigger towards the tooltip\n const [grace] = useState(() => createPointerGrace({ timeout: 0 }));\n\n const clearTimers = () => {\n clearTimeout(enterTimeoutRef.current);\n clearTimeout(leaveTimeoutRef.current);\n grace.clear();\n };\n useEffect(\n () => () => {\n clearTimeout(enterTimeoutRef.current);\n clearTimeout(leaveTimeoutRef.current);\n },\n [],\n );\n\n const show = () => {\n if (open) return;\n setOpen(true);\n onOpen?.();\n };\n const hide = () => {\n if (!open) return;\n config?.markClosed();\n setOpen(false);\n onClose?.();\n };\n\n useImperativeHandle(\n ref,\n () => ({\n open: () => setOpen(true),\n close: () => setOpen(false),\n toggle: () => setOpen((prev) => !prev),\n }),\n [setOpen],\n );\n\n // A virtual element at the cursor position when following the cursor\n const cursorAnchor = useMemo<VirtualElement | null>(\n () =>\n followCursor && cursor\n ? {\n getBoundingClientRect: () =>\n DOMRect.fromRect({\n x: cursor.x,\n y: cursor.y,\n width: 0,\n height: 0,\n }),\n }\n : null,\n [followCursor, cursor],\n );\n\n const isVertical =\n placement.startsWith(\"top\") || placement.startsWith(\"bottom\");\n const gap = arrow ? ARROW_GAP : 0;\n const visible = open && !disabled;\n const layer = useFloatingLayer({\n open: visible,\n anchor: cursorAnchor ?? triggerEl,\n placement,\n offset: offset\n ? {\n mainAxis: (isVertical ? offset[1] : offset[0]) + gap,\n crossAxis: isVertical ? offset[0] : offset[1],\n }\n : { mainAxis: 8 + gap },\n arrowElement: arrow ? arrowEl : null,\n branches: () => [triggerEl],\n // Escape only (topmost layer); hover / focus handle the rest\n dismissOnPointerDownOutside: false,\n dismissOnFocusOutside: false,\n onDismiss: () => {\n clearTimers();\n hide();\n },\n });\n const {\n floatingStyles,\n placement: finalPlacement,\n isPositioned,\n arrowStyles,\n } = layer;\n const setContentRef = useMergedRefs<HTMLElement>(\n layer.ref,\n contentRef as React.Ref<HTMLElement>,\n );\n\n // Track the cursor while open (followCursor)\n useEffect(() => {\n if (!followCursor || !open) return;\n const handleMouseMove = (e: MouseEvent) =>\n setCursor({ x: e.clientX, y: e.clientY });\n document.addEventListener(\"mousemove\", handleMouseMove);\n return () => document.removeEventListener(\"mousemove\", handleMouseMove);\n }, [followCursor, open]);\n\n const scheduleHide = () => {\n clearTimeout(leaveTimeoutRef.current);\n leaveTimeoutRef.current = setTimeout(hide, leaveDelay);\n };\n\n // Hoverable (WCAG 1.4.13): while the pointer heads from the trigger to the\n // tooltip through the gap between them, keep it open.\n useEffect(() => {\n if (!open || followCursor) return;\n const handlePointerMove = (e: PointerEvent) => {\n if (!grace.getArea()) return;\n const target = e.target as Node | null;\n const floating = layer.element;\n if (\n target &&\n (triggerEl?.contains(target) || floating?.contains(target))\n ) {\n return;\n }\n if (grace.isInGraceArea({ x: e.clientX, y: e.clientY })) return;\n grace.clear();\n scheduleHide();\n };\n document.addEventListener(\"pointermove\", handlePointerMove);\n return () => document.removeEventListener(\"pointermove\", handlePointerMove);\n });\n\n const handleMouseEnter = (e: React.MouseEvent) => {\n if (disabled) return;\n if (followCursor) setCursor({ x: e.clientX, y: e.clientY });\n clearTimers();\n // Within a provider, moving quickly between tooltips skips the delay\n if (enterDelay <= 0 || config?.shouldSkipDelay()) {\n show();\n return;\n }\n enterTimeoutRef.current = setTimeout(show, enterDelay);\n };\n\n const handleMouseLeave = (e: React.MouseEvent) => {\n if (disabled) return;\n clearTimers();\n const rect = layer.element?.getBoundingClientRect();\n if (open && !followCursor && rect && rect.width > 0 && rect.height > 0) {\n // Heading for the tooltip: keep it open while the pointer crosses the\n // gap (pointermove above), at most HOVER_GRACE_MS.\n grace.start(\n { x: e.clientX, y: e.clientY },\n rect,\n parsePlacement(finalPlacement).side,\n );\n leaveTimeoutRef.current = setTimeout(\n hide,\n Math.max(leaveDelay, HOVER_GRACE_MS),\n );\n return;\n }\n scheduleHide();\n };\n\n // The pointer reached the tooltip: stay open until it leaves it\n const handleContentMouseEnter = () => {\n if (disabled) return;\n clearTimers();\n };\n\n // Keyboard users get the tooltip when the wrapped (interactive) child\n // receives focus. Activation keys are left alone so they still reach it.\n const handleFocus = () => {\n if (disabled) return;\n clearTimers();\n show();\n };\n\n const handleBlur = () => {\n if (disabled) return;\n clearTimers();\n hide();\n };\n\n const describedBy = visible ? tooltipId : undefined;\n\n // Point the interactive child at the tooltip; fall back to the wrapper\n // when children is not a single element (e.g. plain text).\n const isElementChild = isValidElement<TriggerChildProps>(children);\n const childProps: TriggerChildProps = isElementChild\n ? (children.props as TriggerChildProps)\n : {};\n const childDescribedBy =\n [childProps[\"aria-describedby\"], describedBy].filter(Boolean).join(\" \") ||\n undefined;\n const useChildAsTrigger = asChild && isElementChild;\n\n // The wrapper only: with asChild the child keeps its own hooks.\n const triggerHooks = hooks(\"tooltip\", \"trigger\", {\n state: visible ? \"open\" : \"closed\",\n disabled,\n });\n\n let triggerNode: React.ReactNode;\n if (useChildAsTrigger) {\n // Always render through the Slot, even when disabled: swapping between the\n // bare child and a Slot changes the element type at this position, which\n // remounts the child and drops its focus, pointer capture and any click in\n // progress (e.g. toggling `disabled` on pointerdown).\n triggerNode = (\n <Slot\n ref={setTriggerEl}\n className={className || undefined}\n onMouseEnter={disabled ? undefined : handleMouseEnter}\n onMouseLeave={disabled ? undefined : handleMouseLeave}\n onFocus={disabled ? undefined : handleFocus}\n onBlur={disabled ? undefined : handleBlur}\n >\n {cloneElement(children, { \"aria-describedby\": childDescribedBy })}\n </Slot>\n );\n } else {\n triggerNode = (\n <div\n ref={setTriggerEl}\n className={cn(styles.tooltipTrigger, className)}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onFocus={handleFocus}\n onBlur={handleBlur}\n aria-describedby={isElementChild ? undefined : describedBy}\n {...triggerHooks}\n >\n {isElementChild\n ? cloneElement(children, { \"aria-describedby\": childDescribedBy })\n : children}\n </div>\n );\n }\n\n return (\n <>\n {triggerNode}\n {visible && (\n <Portal>\n <div\n ref={setContentRef}\n dir={layer.dir}\n id={tooltipId}\n role=\"tooltip\"\n aria-label={ariaLabel}\n {...hooks(\"tooltip\", \"content\", {\n state: \"open\",\n color,\n variant,\n shape,\n ...parsePlacement(finalPlacement),\n placement: finalPlacement,\n })}\n onMouseEnter={handleContentMouseEnter}\n onMouseLeave={followCursor || disabled ? undefined : scheduleHide}\n className={cn(\n styles.tooltip,\n styles[color],\n styles[variant],\n styles[shape],\n styles[`animation-${animation}`],\n followCursor && styles.followCursor,\n arrow && styles.arrow,\n isPositioned && styles.show,\n contentClassName,\n )}\n style={{\n ...floatingStyles,\n zIndex,\n }}\n >\n <LayerContext.Provider value={layer.element}>\n {content}\n </LayerContext.Provider>\n {arrow && (\n <div\n ref={setArrowEl}\n className={styles.tooltipArrow}\n style={arrowStyles}\n {...hooks(\"tooltip\", \"arrow\")}\n />\n )}\n </div>\n </Portal>\n )}\n </>\n );\n};\n\nexport default React.memo(Tooltip);\n"],"mappings":"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"}
|
|
@@ -121,13 +121,13 @@ var pe = 6, me = 300, f = i.memo(({ ref: i, content: f, children: p, open: he, d
|
|
|
121
121
|
state: H ? "open" : "closed",
|
|
122
122
|
disabled: b
|
|
123
123
|
}), $;
|
|
124
|
-
return $ = Fe ?
|
|
124
|
+
return $ = Fe ? /* @__PURE__ */ l(ne, {
|
|
125
125
|
ref: A,
|
|
126
126
|
className: S || void 0,
|
|
127
|
-
onMouseEnter: K,
|
|
128
|
-
onMouseLeave: q,
|
|
129
|
-
onFocus: J,
|
|
130
|
-
onBlur: Y,
|
|
127
|
+
onMouseEnter: b ? void 0 : K,
|
|
128
|
+
onMouseLeave: b ? void 0 : q,
|
|
129
|
+
onFocus: b ? void 0 : J,
|
|
130
|
+
onBlur: b ? void 0 : Y,
|
|
131
131
|
children: a(p, { "aria-describedby": Q })
|
|
132
132
|
}) : /* @__PURE__ */ l("div", {
|
|
133
133
|
ref: A,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","names":["styles","_Fragment","tooltip_module_default","React","Fragment$1","ARROW_GAP","HOVER_GRACE_MS","Tooltip_default","openProp","enterDelayProp","leaveDelayProp","ariaLabel","config","useTooltipConfig","enterDelay","leaveDelay","warnControlledProps","defaultOpen","open","setOpen","useControllableState","onOpenChange","triggerEl","setTriggerEl","useState","arrowEl","setArrowEl","cursor","setCursor","enterTimeoutRef","useRef","leaveTimeoutRef","tooltipId","useId","grace","createPointerGrace","clearTimers","show","onOpen","hide","onClose","ref","prev","cursorAnchor","useMemo","followCursor","isVertical","placement","gap","arrow","visible","disabled","layer","useFloatingLayer","offset","finalPlacement","setContentRef","useMergedRefs","contentRef","handleMouseMove","scheduleHide","handlePointerMove","target","floating","handleMouseEnter","handleMouseLeave","rect","parsePlacement","handleContentMouseEnter","handleFocus","handleBlur","describedBy","isElementChild","isValidElement","children","childDescribedBy","useChildAsTrigger","asChild","triggerHooks","hooks","triggerNode","Slot","className","cloneElement","cn","Portal","color","variant","shape","animation","isPositioned","contentClassName","floatingStyles","LayerContext","content","arrowStyles"],"sources":["../../../../../react/src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\n cloneElement,\n isValidElement,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPointerGrace, parsePlacement } from \"@minerva/dom\";\nimport { cn } from \"../../utils/cn\";\nimport { hooks } from \"../../internal/stylingHooks\";\nimport { Slot } from \"../../internal/Slot\";\nimport type { TooltipProps } from \"./types\";\nimport { useFloatingLayer } from \"../../internal/FloatingPanel\";\nimport { Portal } from \"../../internal/Portal\";\nimport type { VirtualElement } from \"../../internal/useAnchoredPosition\";\nimport { LayerContext } from \"../../internal/useDismissableLayer\";\nimport { useControllableState } from \"../../internal/useControllableState\";\nimport { warnControlledProps } from \"../../internal/devWarnings\";\nimport { useMergedRefs } from \"../../internal/mergeRefs\";\nimport { useTooltipConfig } from \"./TooltipProvider\";\nimport styles from \"./tooltip.module.scss\";\n\n/** Extra gap so the arrow does not overlap the trigger. */\nconst ARROW_GAP = 6;\n/**\n * How long the pointer may travel from the trigger to the tooltip (through\n * the gap between them) before the tooltip closes (WCAG 1.4.13 hoverable).\n */\nconst HOVER_GRACE_MS = 300;\n\ntype TriggerChildProps = {\n \"aria-describedby\"?: string;\n};\n\n/**\n * Tooltip: shows informative content when the wrapped element is hovered or\n * focused. Flips / shifts to stay inside the viewport.\n *\n * WCAG 1.4.13: dismissable with Escape (a non-modal layer: only when it is\n * the topmost one, so in an open Popover the first Escape closes the\n * tooltip only), hoverable (the pointer can move from the trigger onto the\n * tooltip through the gap between them) and persistent.\n */\nconst Tooltip = ({\n ref,\n content,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n placement = \"top\",\n color = \"neutral\",\n variant = \"solid\",\n shape = \"default\",\n animation = \"fade\",\n enterDelay: enterDelayProp,\n leaveDelay: leaveDelayProp,\n offset,\n disabled = false,\n followCursor = false,\n className = \"\",\n zIndex = 1500,\n arrow = false,\n onOpen,\n onClose,\n \"aria-label\": ariaLabel,\n asChild = false,\n contentClassName,\n contentRef,\n}: TooltipProps) => {\n const config = useTooltipConfig();\n const enterDelay = enterDelayProp ?? config?.enterDelay ?? 200;\n const leaveDelay = leaveDelayProp ?? config?.leaveDelay ?? 0;\n if (process.env.NODE_ENV !== \"production\") {\n warnControlledProps(\"Tooltip\", {\n prop: \"open\",\n value: openProp,\n defaultProp: \"defaultOpen\",\n defaultValue: defaultOpen,\n });\n }\n const [open, setOpen] = useControllableState({\n value: openProp,\n defaultValue: defaultOpen ?? false,\n onChange: onOpenChange,\n name: \"Tooltip\",\n prop: \"open\",\n });\n const [triggerEl, setTriggerEl] = useState<HTMLElement | null>(null);\n const [arrowEl, setArrowEl] = useState<HTMLDivElement | null>(null);\n const [cursor, setCursor] = useState<{ x: number; y: number } | null>(null);\n const enterTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(\n undefined,\n );\n const leaveTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(\n undefined,\n );\n const tooltipId = `tooltip-${useId().replace(/:/g, \"\")}`;\n\n // Pointer travelling from the trigger towards the tooltip\n const [grace] = useState(() => createPointerGrace({ timeout: 0 }));\n\n const clearTimers = () => {\n clearTimeout(enterTimeoutRef.current);\n clearTimeout(leaveTimeoutRef.current);\n grace.clear();\n };\n useEffect(\n () => () => {\n clearTimeout(enterTimeoutRef.current);\n clearTimeout(leaveTimeoutRef.current);\n },\n [],\n );\n\n const show = () => {\n if (open) return;\n setOpen(true);\n onOpen?.();\n };\n const hide = () => {\n if (!open) return;\n config?.markClosed();\n setOpen(false);\n onClose?.();\n };\n\n useImperativeHandle(\n ref,\n () => ({\n open: () => setOpen(true),\n close: () => setOpen(false),\n toggle: () => setOpen((prev) => !prev),\n }),\n [setOpen],\n );\n\n // A virtual element at the cursor position when following the cursor\n const cursorAnchor = useMemo<VirtualElement | null>(\n () =>\n followCursor && cursor\n ? {\n getBoundingClientRect: () =>\n DOMRect.fromRect({\n x: cursor.x,\n y: cursor.y,\n width: 0,\n height: 0,\n }),\n }\n : null,\n [followCursor, cursor],\n );\n\n const isVertical =\n placement.startsWith(\"top\") || placement.startsWith(\"bottom\");\n const gap = arrow ? ARROW_GAP : 0;\n const visible = open && !disabled;\n const layer = useFloatingLayer({\n open: visible,\n anchor: cursorAnchor ?? triggerEl,\n placement,\n offset: offset\n ? {\n mainAxis: (isVertical ? offset[1] : offset[0]) + gap,\n crossAxis: isVertical ? offset[0] : offset[1],\n }\n : { mainAxis: 8 + gap },\n arrowElement: arrow ? arrowEl : null,\n branches: () => [triggerEl],\n // Escape only (topmost layer); hover / focus handle the rest\n dismissOnPointerDownOutside: false,\n dismissOnFocusOutside: false,\n onDismiss: () => {\n clearTimers();\n hide();\n },\n });\n const {\n floatingStyles,\n placement: finalPlacement,\n isPositioned,\n arrowStyles,\n } = layer;\n const setContentRef = useMergedRefs<HTMLElement>(\n layer.ref,\n contentRef as React.Ref<HTMLElement>,\n );\n\n // Track the cursor while open (followCursor)\n useEffect(() => {\n if (!followCursor || !open) return;\n const handleMouseMove = (e: MouseEvent) =>\n setCursor({ x: e.clientX, y: e.clientY });\n document.addEventListener(\"mousemove\", handleMouseMove);\n return () => document.removeEventListener(\"mousemove\", handleMouseMove);\n }, [followCursor, open]);\n\n const scheduleHide = () => {\n clearTimeout(leaveTimeoutRef.current);\n leaveTimeoutRef.current = setTimeout(hide, leaveDelay);\n };\n\n // Hoverable (WCAG 1.4.13): while the pointer heads from the trigger to the\n // tooltip through the gap between them, keep it open.\n useEffect(() => {\n if (!open || followCursor) return;\n const handlePointerMove = (e: PointerEvent) => {\n if (!grace.getArea()) return;\n const target = e.target as Node | null;\n const floating = layer.element;\n if (\n target &&\n (triggerEl?.contains(target) || floating?.contains(target))\n ) {\n return;\n }\n if (grace.isInGraceArea({ x: e.clientX, y: e.clientY })) return;\n grace.clear();\n scheduleHide();\n };\n document.addEventListener(\"pointermove\", handlePointerMove);\n return () => document.removeEventListener(\"pointermove\", handlePointerMove);\n });\n\n const handleMouseEnter = (e: React.MouseEvent) => {\n if (disabled) return;\n if (followCursor) setCursor({ x: e.clientX, y: e.clientY });\n clearTimers();\n // Within a provider, moving quickly between tooltips skips the delay\n if (enterDelay <= 0 || config?.shouldSkipDelay()) {\n show();\n return;\n }\n enterTimeoutRef.current = setTimeout(show, enterDelay);\n };\n\n const handleMouseLeave = (e: React.MouseEvent) => {\n if (disabled) return;\n clearTimers();\n const rect = layer.element?.getBoundingClientRect();\n if (open && !followCursor && rect && rect.width > 0 && rect.height > 0) {\n // Heading for the tooltip: keep it open while the pointer crosses the\n // gap (pointermove above), at most HOVER_GRACE_MS.\n grace.start(\n { x: e.clientX, y: e.clientY },\n rect,\n parsePlacement(finalPlacement).side,\n );\n leaveTimeoutRef.current = setTimeout(\n hide,\n Math.max(leaveDelay, HOVER_GRACE_MS),\n );\n return;\n }\n scheduleHide();\n };\n\n // The pointer reached the tooltip: stay open until it leaves it\n const handleContentMouseEnter = () => {\n if (disabled) return;\n clearTimers();\n };\n\n // Keyboard users get the tooltip when the wrapped (interactive) child\n // receives focus. Activation keys are left alone so they still reach it.\n const handleFocus = () => {\n if (disabled) return;\n clearTimers();\n show();\n };\n\n const handleBlur = () => {\n if (disabled) return;\n clearTimers();\n hide();\n };\n\n const describedBy = visible ? tooltipId : undefined;\n\n // Point the interactive child at the tooltip; fall back to the wrapper\n // when children is not a single element (e.g. plain text).\n const isElementChild = isValidElement<TriggerChildProps>(children);\n const childProps: TriggerChildProps = isElementChild\n ? (children.props as TriggerChildProps)\n : {};\n const childDescribedBy =\n [childProps[\"aria-describedby\"], describedBy].filter(Boolean).join(\" \") ||\n undefined;\n const useChildAsTrigger = asChild && isElementChild;\n\n // The wrapper only: with asChild the child keeps its own hooks.\n const triggerHooks = hooks(\"tooltip\", \"trigger\", {\n state: visible ? \"open\" : \"closed\",\n disabled,\n });\n\n let triggerNode: React.ReactNode;\n if (useChildAsTrigger) {\n // Disabled: render the child untouched (no handlers, no state hooks)\n triggerNode = disabled ? (\n children\n ) : (\n <Slot\n ref={setTriggerEl}\n className={className || undefined}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onFocus={handleFocus}\n onBlur={handleBlur}\n >\n {cloneElement(children, { \"aria-describedby\": childDescribedBy })}\n </Slot>\n );\n } else {\n triggerNode = (\n <div\n ref={setTriggerEl}\n className={cn(styles.tooltipTrigger, className)}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onFocus={handleFocus}\n onBlur={handleBlur}\n aria-describedby={isElementChild ? undefined : describedBy}\n {...triggerHooks}\n >\n {isElementChild\n ? cloneElement(children, { \"aria-describedby\": childDescribedBy })\n : children}\n </div>\n );\n }\n\n return (\n <>\n {triggerNode}\n {visible && (\n <Portal>\n <div\n ref={setContentRef}\n dir={layer.dir}\n id={tooltipId}\n role=\"tooltip\"\n aria-label={ariaLabel}\n {...hooks(\"tooltip\", \"content\", {\n state: \"open\",\n color,\n variant,\n shape,\n ...parsePlacement(finalPlacement),\n placement: finalPlacement,\n })}\n onMouseEnter={handleContentMouseEnter}\n onMouseLeave={followCursor || disabled ? undefined : scheduleHide}\n className={cn(\n styles.tooltip,\n styles[color],\n styles[variant],\n styles[shape],\n styles[`animation-${animation}`],\n followCursor && styles.followCursor,\n arrow && styles.arrow,\n isPositioned && styles.show,\n contentClassName,\n )}\n style={{\n ...floatingStyles,\n zIndex,\n }}\n >\n <LayerContext.Provider value={layer.element}>\n {content}\n </LayerContext.Provider>\n {arrow && (\n <div\n ref={setArrowEl}\n className={styles.tooltipArrow}\n style={arrowStyles}\n {...hooks(\"tooltip\", \"arrow\")}\n />\n )}\n </div>\n </Portal>\n )}\n </>\n );\n};\n\nexport default React.memo(Tooltip);\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tooltip.js","names":["styles","_Fragment","tooltip_module_default","React","Fragment$1","ARROW_GAP","HOVER_GRACE_MS","Tooltip_default","openProp","enterDelayProp","leaveDelayProp","ariaLabel","config","useTooltipConfig","enterDelay","leaveDelay","warnControlledProps","defaultOpen","open","setOpen","useControllableState","onOpenChange","triggerEl","setTriggerEl","useState","arrowEl","setArrowEl","cursor","setCursor","enterTimeoutRef","useRef","leaveTimeoutRef","tooltipId","useId","grace","createPointerGrace","clearTimers","show","onOpen","hide","onClose","ref","prev","cursorAnchor","useMemo","followCursor","isVertical","placement","gap","arrow","visible","disabled","layer","useFloatingLayer","offset","finalPlacement","setContentRef","useMergedRefs","contentRef","handleMouseMove","scheduleHide","handlePointerMove","target","floating","handleMouseEnter","handleMouseLeave","rect","parsePlacement","handleContentMouseEnter","handleFocus","handleBlur","describedBy","isElementChild","isValidElement","children","childDescribedBy","useChildAsTrigger","asChild","triggerHooks","hooks","triggerNode","Slot","className","cloneElement","cn","Portal","color","variant","shape","animation","isPositioned","contentClassName","floatingStyles","LayerContext","content","arrowStyles"],"sources":["../../../../../react/src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\n cloneElement,\n isValidElement,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPointerGrace, parsePlacement } from \"@minerva/dom\";\nimport { cn } from \"../../utils/cn\";\nimport { hooks } from \"../../internal/stylingHooks\";\nimport { Slot } from \"../../internal/Slot\";\nimport type { TooltipProps } from \"./types\";\nimport { useFloatingLayer } from \"../../internal/FloatingPanel\";\nimport { Portal } from \"../../internal/Portal\";\nimport type { VirtualElement } from \"../../internal/useAnchoredPosition\";\nimport { LayerContext } from \"../../internal/useDismissableLayer\";\nimport { useControllableState } from \"../../internal/useControllableState\";\nimport { warnControlledProps } from \"../../internal/devWarnings\";\nimport { useMergedRefs } from \"../../internal/mergeRefs\";\nimport { useTooltipConfig } from \"./TooltipProvider\";\nimport styles from \"./tooltip.module.scss\";\n\n/** Extra gap so the arrow does not overlap the trigger. */\nconst ARROW_GAP = 6;\n/**\n * How long the pointer may travel from the trigger to the tooltip (through\n * the gap between them) before the tooltip closes (WCAG 1.4.13 hoverable).\n */\nconst HOVER_GRACE_MS = 300;\n\ntype TriggerChildProps = {\n \"aria-describedby\"?: string;\n};\n\n/**\n * Tooltip: shows informative content when the wrapped element is hovered or\n * focused. Flips / shifts to stay inside the viewport.\n *\n * WCAG 1.4.13: dismissable with Escape (a non-modal layer: only when it is\n * the topmost one, so in an open Popover the first Escape closes the\n * tooltip only), hoverable (the pointer can move from the trigger onto the\n * tooltip through the gap between them) and persistent.\n */\nconst Tooltip = ({\n ref,\n content,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n placement = \"top\",\n color = \"neutral\",\n variant = \"solid\",\n shape = \"default\",\n animation = \"fade\",\n enterDelay: enterDelayProp,\n leaveDelay: leaveDelayProp,\n offset,\n disabled = false,\n followCursor = false,\n className = \"\",\n zIndex = 1500,\n arrow = false,\n onOpen,\n onClose,\n \"aria-label\": ariaLabel,\n asChild = false,\n contentClassName,\n contentRef,\n}: TooltipProps) => {\n const config = useTooltipConfig();\n const enterDelay = enterDelayProp ?? config?.enterDelay ?? 200;\n const leaveDelay = leaveDelayProp ?? config?.leaveDelay ?? 0;\n if (process.env.NODE_ENV !== \"production\") {\n warnControlledProps(\"Tooltip\", {\n prop: \"open\",\n value: openProp,\n defaultProp: \"defaultOpen\",\n defaultValue: defaultOpen,\n });\n }\n const [open, setOpen] = useControllableState({\n value: openProp,\n defaultValue: defaultOpen ?? false,\n onChange: onOpenChange,\n name: \"Tooltip\",\n prop: \"open\",\n });\n const [triggerEl, setTriggerEl] = useState<HTMLElement | null>(null);\n const [arrowEl, setArrowEl] = useState<HTMLDivElement | null>(null);\n const [cursor, setCursor] = useState<{ x: number; y: number } | null>(null);\n const enterTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(\n undefined,\n );\n const leaveTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(\n undefined,\n );\n const tooltipId = `tooltip-${useId().replace(/:/g, \"\")}`;\n\n // Pointer travelling from the trigger towards the tooltip\n const [grace] = useState(() => createPointerGrace({ timeout: 0 }));\n\n const clearTimers = () => {\n clearTimeout(enterTimeoutRef.current);\n clearTimeout(leaveTimeoutRef.current);\n grace.clear();\n };\n useEffect(\n () => () => {\n clearTimeout(enterTimeoutRef.current);\n clearTimeout(leaveTimeoutRef.current);\n },\n [],\n );\n\n const show = () => {\n if (open) return;\n setOpen(true);\n onOpen?.();\n };\n const hide = () => {\n if (!open) return;\n config?.markClosed();\n setOpen(false);\n onClose?.();\n };\n\n useImperativeHandle(\n ref,\n () => ({\n open: () => setOpen(true),\n close: () => setOpen(false),\n toggle: () => setOpen((prev) => !prev),\n }),\n [setOpen],\n );\n\n // A virtual element at the cursor position when following the cursor\n const cursorAnchor = useMemo<VirtualElement | null>(\n () =>\n followCursor && cursor\n ? {\n getBoundingClientRect: () =>\n DOMRect.fromRect({\n x: cursor.x,\n y: cursor.y,\n width: 0,\n height: 0,\n }),\n }\n : null,\n [followCursor, cursor],\n );\n\n const isVertical =\n placement.startsWith(\"top\") || placement.startsWith(\"bottom\");\n const gap = arrow ? ARROW_GAP : 0;\n const visible = open && !disabled;\n const layer = useFloatingLayer({\n open: visible,\n anchor: cursorAnchor ?? triggerEl,\n placement,\n offset: offset\n ? {\n mainAxis: (isVertical ? offset[1] : offset[0]) + gap,\n crossAxis: isVertical ? offset[0] : offset[1],\n }\n : { mainAxis: 8 + gap },\n arrowElement: arrow ? arrowEl : null,\n branches: () => [triggerEl],\n // Escape only (topmost layer); hover / focus handle the rest\n dismissOnPointerDownOutside: false,\n dismissOnFocusOutside: false,\n onDismiss: () => {\n clearTimers();\n hide();\n },\n });\n const {\n floatingStyles,\n placement: finalPlacement,\n isPositioned,\n arrowStyles,\n } = layer;\n const setContentRef = useMergedRefs<HTMLElement>(\n layer.ref,\n contentRef as React.Ref<HTMLElement>,\n );\n\n // Track the cursor while open (followCursor)\n useEffect(() => {\n if (!followCursor || !open) return;\n const handleMouseMove = (e: MouseEvent) =>\n setCursor({ x: e.clientX, y: e.clientY });\n document.addEventListener(\"mousemove\", handleMouseMove);\n return () => document.removeEventListener(\"mousemove\", handleMouseMove);\n }, [followCursor, open]);\n\n const scheduleHide = () => {\n clearTimeout(leaveTimeoutRef.current);\n leaveTimeoutRef.current = setTimeout(hide, leaveDelay);\n };\n\n // Hoverable (WCAG 1.4.13): while the pointer heads from the trigger to the\n // tooltip through the gap between them, keep it open.\n useEffect(() => {\n if (!open || followCursor) return;\n const handlePointerMove = (e: PointerEvent) => {\n if (!grace.getArea()) return;\n const target = e.target as Node | null;\n const floating = layer.element;\n if (\n target &&\n (triggerEl?.contains(target) || floating?.contains(target))\n ) {\n return;\n }\n if (grace.isInGraceArea({ x: e.clientX, y: e.clientY })) return;\n grace.clear();\n scheduleHide();\n };\n document.addEventListener(\"pointermove\", handlePointerMove);\n return () => document.removeEventListener(\"pointermove\", handlePointerMove);\n });\n\n const handleMouseEnter = (e: React.MouseEvent) => {\n if (disabled) return;\n if (followCursor) setCursor({ x: e.clientX, y: e.clientY });\n clearTimers();\n // Within a provider, moving quickly between tooltips skips the delay\n if (enterDelay <= 0 || config?.shouldSkipDelay()) {\n show();\n return;\n }\n enterTimeoutRef.current = setTimeout(show, enterDelay);\n };\n\n const handleMouseLeave = (e: React.MouseEvent) => {\n if (disabled) return;\n clearTimers();\n const rect = layer.element?.getBoundingClientRect();\n if (open && !followCursor && rect && rect.width > 0 && rect.height > 0) {\n // Heading for the tooltip: keep it open while the pointer crosses the\n // gap (pointermove above), at most HOVER_GRACE_MS.\n grace.start(\n { x: e.clientX, y: e.clientY },\n rect,\n parsePlacement(finalPlacement).side,\n );\n leaveTimeoutRef.current = setTimeout(\n hide,\n Math.max(leaveDelay, HOVER_GRACE_MS),\n );\n return;\n }\n scheduleHide();\n };\n\n // The pointer reached the tooltip: stay open until it leaves it\n const handleContentMouseEnter = () => {\n if (disabled) return;\n clearTimers();\n };\n\n // Keyboard users get the tooltip when the wrapped (interactive) child\n // receives focus. Activation keys are left alone so they still reach it.\n const handleFocus = () => {\n if (disabled) return;\n clearTimers();\n show();\n };\n\n const handleBlur = () => {\n if (disabled) return;\n clearTimers();\n hide();\n };\n\n const describedBy = visible ? tooltipId : undefined;\n\n // Point the interactive child at the tooltip; fall back to the wrapper\n // when children is not a single element (e.g. plain text).\n const isElementChild = isValidElement<TriggerChildProps>(children);\n const childProps: TriggerChildProps = isElementChild\n ? (children.props as TriggerChildProps)\n : {};\n const childDescribedBy =\n [childProps[\"aria-describedby\"], describedBy].filter(Boolean).join(\" \") ||\n undefined;\n const useChildAsTrigger = asChild && isElementChild;\n\n // The wrapper only: with asChild the child keeps its own hooks.\n const triggerHooks = hooks(\"tooltip\", \"trigger\", {\n state: visible ? \"open\" : \"closed\",\n disabled,\n });\n\n let triggerNode: React.ReactNode;\n if (useChildAsTrigger) {\n // Always render through the Slot, even when disabled: swapping between the\n // bare child and a Slot changes the element type at this position, which\n // remounts the child and drops its focus, pointer capture and any click in\n // progress (e.g. toggling `disabled` on pointerdown).\n triggerNode = (\n <Slot\n ref={setTriggerEl}\n className={className || undefined}\n onMouseEnter={disabled ? undefined : handleMouseEnter}\n onMouseLeave={disabled ? undefined : handleMouseLeave}\n onFocus={disabled ? undefined : handleFocus}\n onBlur={disabled ? undefined : handleBlur}\n >\n {cloneElement(children, { \"aria-describedby\": childDescribedBy })}\n </Slot>\n );\n } else {\n triggerNode = (\n <div\n ref={setTriggerEl}\n className={cn(styles.tooltipTrigger, className)}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onFocus={handleFocus}\n onBlur={handleBlur}\n aria-describedby={isElementChild ? undefined : describedBy}\n {...triggerHooks}\n >\n {isElementChild\n ? cloneElement(children, { \"aria-describedby\": childDescribedBy })\n : children}\n </div>\n );\n }\n\n return (\n <>\n {triggerNode}\n {visible && (\n <Portal>\n <div\n ref={setContentRef}\n dir={layer.dir}\n id={tooltipId}\n role=\"tooltip\"\n aria-label={ariaLabel}\n {...hooks(\"tooltip\", \"content\", {\n state: \"open\",\n color,\n variant,\n shape,\n ...parsePlacement(finalPlacement),\n placement: finalPlacement,\n })}\n onMouseEnter={handleContentMouseEnter}\n onMouseLeave={followCursor || disabled ? undefined : scheduleHide}\n className={cn(\n styles.tooltip,\n styles[color],\n styles[variant],\n styles[shape],\n styles[`animation-${animation}`],\n followCursor && styles.followCursor,\n arrow && styles.arrow,\n isPositioned && styles.show,\n contentClassName,\n )}\n style={{\n ...floatingStyles,\n zIndex,\n }}\n >\n <LayerContext.Provider value={layer.element}>\n {content}\n </LayerContext.Provider>\n {arrow && (\n <div\n ref={setArrowEl}\n className={styles.tooltipArrow}\n style={arrowStyles}\n {...hooks(\"tooltip\", \"arrow\")}\n />\n )}\n </div>\n </Portal>\n )}\n </>\n );\n};\n\nexport default React.memo(Tooltip);\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "minerva-design",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"description": "Minerva Design: React, Vue, Angular, Web Components and native platform components with shared design tokens and contracts",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "fwx5618177 <fwx5618177@gmail.com>",
|