@transkripid/flowbite-react/lib/components/Floating/Floating.js

Official React components built for Flowbite and Tailwind CSS - Transkrip.id fork

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),d=require("@floating-ui/react"),s=require("react"),f=require("tailwind-merge"),g=require("../../hooks/use-floating.js"),O=require("./helpers.js"),A=({animation:n="duration-300",arrow:p=!0,children:w,className:x,content:F,placement:b="top",style:o="dark",theme:e,trigger:y="hover",minWidth:j,...q})=>{const i=s.useRef(null),[a,v]=s.useState(!1),l=g.useBaseFLoating({open:a,placement:b,arrowRef:i,setOpen:v}),{context:c,middlewareData:{arrow:{x:P,y:R}={}},refs:t,strategy:M,update:u,x:N,y:k}=l,m=d.useFocus(c),{getFloatingProps:S,getReferenceProps:$}=g.useFloatingInteractions({context:c,role:"tooltip",trigger:y,interactions:[m]});return s.useEffect(()=>{if(t.reference.current&&t.floating.current&&a)return d.autoUpdate(t.reference.current,t.floating.current,u)},[a,t.floating,t.reference,u]),r.jsxs(r.Fragment,{children:[r.jsx("div",{ref:t.setReference,className:e.target,"data-testid":"flowbite-tooltip-target",...$(),children:w}),r.jsxs("div",{ref:t.setFloating,"data-testid":"flowbite-tooltip",...S({className:f.twMerge(e.base,n&&`${e.animation} ${n}`,!a&&e.hidden,e.style[o],x),style:{position:M,top:k??" ",left:N??" ",minWidth:j},...q}),children:[r.jsx("div",{className:e.content,children:F}),p&&r.jsx("div",{className:f.twMerge(e.arrow.base,o==="dark"&&e.arrow.style.dark,o==="light"&&e.arrow.style.light,o==="auto"&&e.arrow.style.auto),"data-testid":"flowbite-tooltip-arrow",ref:i,style:{top:R??" ",left:P??" ",right:" ",bottom:" ",[O.getArrowPlacement({placement:l.placement})]:e.arrow.placement},children:" "})]})]})};exports.Floating=A;
//# sourceMappingURL=Floating.js.map