@transkripid/flowbite-react
Version:
Official React components built for Flowbite and Tailwind CSS - Transkrip.id fork
3 lines (2 loc) • 1.62 kB
JavaScript
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("react"),i=require("@floating-ui/react"),E=require("../../helpers/merge-deep.js"),B=require("../../theme-store/index.js"),p=require("../../hooks/use-floating.js"),I=require("../Floating/helpers.js");function T({children:e,content:u,theme:g={},arrow:m=!0,trigger:f="click",initialOpen:d,open:v,onOpenChange:w,placement:x="bottom",...b}){const[j,F]=o.useState(!!d),n=o.useRef(null),r=E.mergeDeep(B.getTheme().popover,g),a=v??j,q=w??F,P=p.useBaseFLoating({open:a,placement:x,arrowRef:n,setOpen:q}),{floatingStyles:R,context:s,placement:h,middlewareData:{arrow:{x:y,y:O}={}},refs:M}=P,{getFloatingProps:N,getReferenceProps:l}=p.useFloatingInteractions({context:s,role:"dialog",trigger:f}),S=e.ref,c=i.useMergeRefs([s.refs.setReference,S]);if(!o.isValidElement(e))throw Error("Invalid target element");const D=o.useMemo(()=>o.cloneElement(e,l({ref:c,"data-testid":"flowbite-popover-target",...e==null?void 0:e.props})),[e,c,l]);return t.jsxs(t.Fragment,{children:[D,a&&t.jsx(i.FloatingFocusManager,{context:s,modal:!0,children:t.jsx("div",{className:r.base,ref:M.setFloating,"data-testid":"flowbite-popover",...b,style:R,...N(),children:t.jsxs("div",{className:"relative",children:[m&&t.jsx("div",{className:r.arrow.base,"data-testid":"flowbite-popover-arrow",ref:n,style:{top:O??" ",left:y??" ",right:" ",bottom:" ",[I.getArrowPlacement({placement:h})]:r.arrow.placement},children:" "}),t.jsx("div",{className:r.content,children:u})]})})})]})}exports.Popover=T;
//# sourceMappingURL=Popover.js.map