UNPKG

@stanfordspezi/spezi-web-design-system

Version:

Stanford Biodesign Digital Health Spezi Web Design System

2 lines (1 loc) 8.93 kB
"use strict";const d=require("react/jsx-runtime"),X=require("./index-DwV9MiDB.js"),K=require("react"),C=require("./index-CLdeiAAB.js"),A=require("./index-UhBwhhTY.js"),W=require("./index-vkqCyWtx.js"),J=require("./index-Bqh8zfKH.js"),w=require("./index-Cz0nKoO6.js"),Q=require("./index-DM1mqyG5.js"),Z=require("./index-14SsMENa.js"),ee=require("./index-CdWW7AxQ.js");function te(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(o,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return o.default=e,Object.freeze(o)}const s=te(K);var[_,we]=C.createContextScope("Tooltip",[w.createPopperScope]),O=w.createPopperScope(),I="TooltipProvider",oe=700,L="tooltip.open",[re,H]=_(I),N=e=>{const{__scopeTooltip:o,delayDuration:t=oe,skipDelayDuration:r=300,disableHoverableContent:n=!1,children:c}=e,a=s.useRef(!0),v=s.useRef(!1),i=s.useRef(0);return s.useEffect(()=>{const p=i.current;return()=>window.clearTimeout(p)},[]),d.jsx(re,{scope:o,isOpenDelayedRef:a,delayDuration:t,onOpen:s.useCallback(()=>{window.clearTimeout(i.current),a.current=!1},[]),onClose:s.useCallback(()=>{window.clearTimeout(i.current),i.current=window.setTimeout(()=>a.current=!0,r)},[r]),isPointerInTransitRef:v,onPointerInTransitChange:s.useCallback(p=>{v.current=p},[]),disableHoverableContent:n,children:c})};N.displayName=I;var j="Tooltip",[ne,D]=_(j),q=e=>{const{__scopeTooltip:o,children:t,open:r,defaultOpen:n=!1,onOpenChange:c,disableHoverableContent:a,delayDuration:v}=e,i=H(j,e.__scopeTooltip),p=O(o),[l,f]=s.useState(null),T=J.useId(),u=s.useRef(0),x=a??i.disableHoverableContent,m=v??i.delayDuration,h=s.useRef(!1),[y=!1,g]=C.useControllableState({prop:r,defaultProp:n,onChange:S=>{S?(i.onOpen(),document.dispatchEvent(new CustomEvent(L))):i.onClose(),c==null||c(S)}}),E=s.useMemo(()=>y?h.current?"delayed-open":"instant-open":"closed",[y]),P=s.useCallback(()=>{window.clearTimeout(u.current),u.current=0,h.current=!1,g(!0)},[g]),R=s.useCallback(()=>{window.clearTimeout(u.current),u.current=0,g(!1)},[g]),M=s.useCallback(()=>{window.clearTimeout(u.current),u.current=window.setTimeout(()=>{h.current=!0,g(!0),u.current=0},m)},[m,g]);return s.useEffect(()=>()=>{u.current&&(window.clearTimeout(u.current),u.current=0)},[]),d.jsx(w.Root2,{...p,children:d.jsx(ne,{scope:o,contentId:T,open:y,stateAttribute:E,trigger:l,onTriggerChange:f,onTriggerEnter:s.useCallback(()=>{i.isOpenDelayedRef.current?M():P()},[i.isOpenDelayedRef,M,P]),onTriggerLeave:s.useCallback(()=>{x?R():(window.clearTimeout(u.current),u.current=0)},[R,x]),onOpen:P,onClose:R,disableHoverableContent:x,children:t})})};q.displayName=j;var k="TooltipTrigger",$=s.forwardRef((e,o)=>{const{__scopeTooltip:t,...r}=e,n=D(k,t),c=H(k,t),a=O(t),v=s.useRef(null),i=A.useComposedRefs(o,v,n.onTriggerChange),p=s.useRef(!1),l=s.useRef(!1),f=s.useCallback(()=>p.current=!1,[]);return s.useEffect(()=>()=>document.removeEventListener("pointerup",f),[f]),d.jsx(w.Anchor,{asChild:!0,...a,children:d.jsx(Z.Primitive.button,{"aria-describedby":n.open?n.contentId:void 0,"data-state":n.stateAttribute,...r,ref:i,onPointerMove:C.composeEventHandlers(e.onPointerMove,T=>{T.pointerType!=="touch"&&!l.current&&!c.isPointerInTransitRef.current&&(n.onTriggerEnter(),l.current=!0)}),onPointerLeave:C.composeEventHandlers(e.onPointerLeave,()=>{n.onTriggerLeave(),l.current=!1}),onPointerDown:C.composeEventHandlers(e.onPointerDown,()=>{n.open&&n.onClose(),p.current=!0,document.addEventListener("pointerup",f,{once:!0})}),onFocus:C.composeEventHandlers(e.onFocus,()=>{p.current||n.onOpen()}),onBlur:C.composeEventHandlers(e.onBlur,n.onClose),onClick:C.composeEventHandlers(e.onClick,n.onClose)})})});$.displayName=k;var se="TooltipPortal",[Ee,ie]=_(se,{forceMount:void 0}),b="TooltipContent",G=s.forwardRef((e,o)=>{const t=ie(b,e.__scopeTooltip),{forceMount:r=t.forceMount,side:n="top",...c}=e,a=D(b,e.__scopeTooltip);return d.jsx(Q.Presence,{present:r||a.open,children:a.disableHoverableContent?d.jsx(F,{side:n,...c,ref:o}):d.jsx(ae,{side:n,...c,ref:o})})}),ae=s.forwardRef((e,o)=>{const t=D(b,e.__scopeTooltip),r=H(b,e.__scopeTooltip),n=s.useRef(null),c=A.useComposedRefs(o,n),[a,v]=s.useState(null),{trigger:i,onClose:p}=t,l=n.current,{onPointerInTransitChange:f}=r,T=s.useCallback(()=>{v(null),f(!1)},[f]),u=s.useCallback((x,m)=>{const h=x.currentTarget,y={x:x.clientX,y:x.clientY},g=pe(y,h.getBoundingClientRect()),E=fe(y,g),P=ve(m.getBoundingClientRect()),R=Te([...E,...P]);v(R),f(!0)},[f]);return s.useEffect(()=>()=>T(),[T]),s.useEffect(()=>{if(i&&l){const x=h=>u(h,l),m=h=>u(h,i);return i.addEventListener("pointerleave",x),l.addEventListener("pointerleave",m),()=>{i.removeEventListener("pointerleave",x),l.removeEventListener("pointerleave",m)}}},[i,l,u,T]),s.useEffect(()=>{if(a){const x=m=>{const h=m.target,y={x:m.clientX,y:m.clientY},g=(i==null?void 0:i.contains(h))||(l==null?void 0:l.contains(h)),E=!xe(y,a);g?T():E&&(T(),p())};return document.addEventListener("pointermove",x),()=>document.removeEventListener("pointermove",x)}},[i,l,a,p,T]),d.jsx(F,{...e,ref:c})}),[ce,le]=_(j,{isInside:!1}),ue=A.createSlottable("TooltipContent"),F=s.forwardRef((e,o)=>{const{__scopeTooltip:t,children:r,"aria-label":n,onEscapeKeyDown:c,onPointerDownOutside:a,...v}=e,i=D(b,t),p=O(t),{onClose:l}=i;return s.useEffect(()=>(document.addEventListener(L,l),()=>document.removeEventListener(L,l)),[l]),s.useEffect(()=>{if(i.trigger){const f=T=>{const u=T.target;u!=null&&u.contains(i.trigger)&&l()};return window.addEventListener("scroll",f,{capture:!0}),()=>window.removeEventListener("scroll",f,{capture:!0})}},[i.trigger,l]),d.jsx(W.DismissableLayer,{asChild:!0,disableOutsidePointerEvents:!1,onEscapeKeyDown:c,onPointerDownOutside:a,onFocusOutside:f=>f.preventDefault(),onDismiss:l,children:d.jsxs(w.Content,{"data-state":i.stateAttribute,...p,...v,ref:o,style:{...v.style,"--radix-tooltip-content-transform-origin":"var(--radix-popper-transform-origin)","--radix-tooltip-content-available-width":"var(--radix-popper-available-width)","--radix-tooltip-content-available-height":"var(--radix-popper-available-height)","--radix-tooltip-trigger-width":"var(--radix-popper-anchor-width)","--radix-tooltip-trigger-height":"var(--radix-popper-anchor-height)"},children:[d.jsx(ue,{children:r}),d.jsx(ce,{scope:t,isInside:!0,children:d.jsx(ee.Root,{id:i.contentId,role:"tooltip",children:n||r})})]})})});G.displayName=b;var z="TooltipArrow",de=s.forwardRef((e,o)=>{const{__scopeTooltip:t,...r}=e,n=O(t);return le(z,t).isInside?null:d.jsx(w.Arrow,{...n,...r,ref:o})});de.displayName=z;function pe(e,o){const t=Math.abs(o.top-e.y),r=Math.abs(o.bottom-e.y),n=Math.abs(o.right-e.x),c=Math.abs(o.left-e.x);switch(Math.min(t,r,n,c)){case c:return"left";case n:return"right";case t:return"top";case r:return"bottom";default:throw new Error("unreachable")}}function fe(e,o,t=5){const r=[];switch(o){case"top":r.push({x:e.x-t,y:e.y+t},{x:e.x+t,y:e.y+t});break;case"bottom":r.push({x:e.x-t,y:e.y-t},{x:e.x+t,y:e.y-t});break;case"left":r.push({x:e.x+t,y:e.y-t},{x:e.x+t,y:e.y+t});break;case"right":r.push({x:e.x-t,y:e.y-t},{x:e.x-t,y:e.y+t});break}return r}function ve(e){const{top:o,right:t,bottom:r,left:n}=e;return[{x:n,y:o},{x:t,y:o},{x:t,y:r},{x:n,y:r}]}function xe(e,o){const{x:t,y:r}=e;let n=!1;for(let c=0,a=o.length-1;c<o.length;a=c++){const v=o[c].x,i=o[c].y,p=o[a].x,l=o[a].y;i>r!=l>r&&t<(p-v)*(r-i)/(l-i)+v&&(n=!n)}return n}function Te(e){const o=e.slice();return o.sort((t,r)=>t.x<r.x?-1:t.x>r.x?1:t.y<r.y?-1:t.y>r.y?1:0),he(o)}function he(e){if(e.length<=1)return e.slice();const o=[];for(let r=0;r<e.length;r++){const n=e[r];for(;o.length>=2;){const c=o[o.length-1],a=o[o.length-2];if((c.x-a.x)*(n.y-a.y)>=(c.y-a.y)*(n.x-a.x))o.pop();else break}o.push(n)}o.pop();const t=[];for(let r=e.length-1;r>=0;r--){const n=e[r];for(;t.length>=2;){const c=t[t.length-1],a=t[t.length-2];if((c.x-a.x)*(n.y-a.y)>=(c.y-a.y)*(n.x-a.x))t.pop();else break}t.push(n)}return t.pop(),o.length===1&&t.length===1&&o[0].x===t[0].x&&o[0].y===t[0].y?o:o.concat(t)}var me=N,ge=q,ye=$,Ce=G;const B=me,U=ge,V=ye,Y=({className:e,sideOffset:o=4,...t})=>d.jsx(Ce,{sideOffset:o,className:X.cn("animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 bg-popover text-foreground z-50 w-max overflow-hidden rounded-sm border px-2 py-0.5",e),...t}),be=({children:e,tooltip:o,className:t,sideOffset:r,side:n,delayDuration:c=0,...a})=>d.jsx(B,{children:d.jsxs(U,{...a,delayDuration:c,children:[e&&d.jsx(V,{asChild:!0,children:e}),d.jsx(Y,{side:n,sideOffset:r,className:t,children:o})]})});exports.Tooltip=be;exports.TooltipContent=Y;exports.TooltipProvider=B;exports.TooltipRoot=U;exports.TooltipTrigger=V;