@infinityfx/fluid/dist/components/layout/popover/root.js

React UI library, using zero-runtime CSS-in-JS.

"use client";
import{jsx as e}from"react/jsx-runtime";import{createContext as t,useId as n,useRef as r,useState as o,useLayoutEffect as i,useImperativeHandle as c,useEffect as s,use as l}from"react";import d from"../../../hooks/use-fluid.js";import a from"../../../hooks/use-media-query.js";const u=t(null);function w(e){const t=l(u);if(!e&&!t)throw new Error("Unable to access PopoverRoot context");return t}function m({children:t,ref:l,position:m="auto",mobileContainer:p="popover",stretch:f,onClose:h}){const g=n(),v=d(),x=r([]),b=r(null),y=r(null),[E,L]=o(!1),[j,k]=o(!1),$=w(!0),C=a(`(max-width: ${v.breakpoints.mob}px)`)&&"modal"===p;function R(){if(C||!j||!b.current||!y.current)return;const{w:e,style:t,centered:n,overflow:r}=function(e,t,n="0px"){const{x:r,y:o,width:i,bottom:c}=e.getBoundingClientRect(),s=r+i/2,l=o>window.innerHeight-c,d=s>window.innerWidth/2,a=d?window.innerWidth-i-r:r;return{w:i+"px",style:{left:(d?r+i:a)+"px",top:l?"auto":`calc(${c}px + ${n})`,bottom:l?`calc(${window.innerHeight-o}px + ${n})`:"auto",transform:d?"translateX(-100%)":""},centered:{left:s+"px",right:"auto",transform:"translateX(-50%)"},overflow:a<(t.getBoundingClientRect().width-i)/2}}(b.current,y.current,"var(--f-spacing-xsm)"),o="center"===m&&!r;Object.assign(y.current.style,t),o&&Object.assign(y.current.style,n),f&&(y.current.style.minWidth=e)}return i(R,[j,f,C]),c(l,(()=>({open:k.bind({},!0),close:k.bind({},!1)})),[]),s((()=>(L(!0),window.addEventListener("resize",R),window.addEventListener("scroll",R),E&&!j&&h?.(),!E&&$&&$.children.current.push(y),()=>{window.removeEventListener("resize",R),window.removeEventListener("scroll",R)})),[j,$]),s((()=>{function e(e){C||y.current?.contains(e.target)||b.current?.contains(e.target)||x.current.some((t=>t.current?.contains(e.target)))||k(!1)}return window.addEventListener("click",e),()=>window.removeEventListener("click",e)}),[C]),e(u,{value:{id:g,mounted:E,isModal:C,trigger:b,content:y,opened:j,toggle:k,children:x},children:t})}m.displayName="Popover.Root";export{u as PopoverContext,m as default,w as usePopover};
//# sourceMappingURL=root.js.map