UNPKG

koval-ui

Version:

React components collection with minimalistic design. Supports theming, layout, and input validation.

3 lines (2 loc) 1.58 kB
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),i=require("classnames"),r=require("@floating-ui/react-dom"),m=require("css-vars-hook"),F=require("../../internal/Portal/Portal.cjs"),v=require("../../internal/hooks/useDismiss.cjs"),O=require("../../internal/hooks/useFocusTrap.cjs"),S=require("./Arrow.cjs"),l=require("./Tooltip.module.css.cjs"),p=s.forwardRef(({children:h,className:q,isOpen:c=!1,content:w,referenceClassName:x,onToggle:n=()=>{},interactive:u=!0,placement:j="bottom",...T},R)=>{const[t,o]=s.useState(c);s.useEffect(()=>{o(c)},[c,o]),s.useEffect(()=>{n(t)},[t,n]);const f=s.useRef(null),{refs:a,floatingStyles:g,middlewareData:d,placement:y}=r.useFloating({strategy:"fixed",placement:j,whileElementsMounted:r.autoUpdate,middleware:[r.offset(18),r.flip(),r.arrow({element:f})]}),{LocalRoot:N}=m.useLocalTheme(),{getTheme:b}=m.useRootTheme(),D=s.useCallback(()=>{o(!1)},[o]);return v.useDismiss(D,a.reference,t),O.useFocusTrap(a.floating.current,t,u),e.jsxs(s.Fragment,{children:[e.jsx("div",{ref:a.setReference,className:i(l.default.reference,x),children:h}),t&&e.jsx(F.Portal,{children:e.jsx("div",{ref:a.setFloating,style:g,className:i({[l.default.unfocusable]:!u}),children:e.jsx(N,{className:l.default.provider,theme:b(),children:e.jsxs("div",{...T,ref:R,className:i(l.default.tooltip,q),children:[e.jsx(S.Arrow,{ref:f,placement:y,left:d.arrow?.x,top:d.arrow?.y}),w]})})})})]})});p.displayName="Tooltip";exports.Tooltip=p; //# sourceMappingURL=Tooltip.cjs.map