@progress/kendo-react-tooltip/popover/Popover.js

React Tooltips library represents popups with information that is related to a UI element. KendoReact Tooltips package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Q=require("react"),e=require("prop-types"),g=require("@progress/kendo-react-common"),W=require("@progress/kendo-react-popup"),z=require("./PopoverActionsBar.js"),A=require("./utils.js");function Y(n){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const c in n)if(c!=="default"){const i=Object.getOwnPropertyDescriptor(n,c);Object.defineProperty(r,c,i.get?i:{enumerable:!0,get:()=>n[c]})}}return r.default=n,Object.freeze(r)}const t=Y(Q),$=12e3,ee=2e3,w=15,oe={top:"k-callout-s",left:"k-callout-e",bottom:"k-callout-n",right:"k-callout-w"},te={top:"k-callout-n",left:"k-callout-w",bottom:"k-callout-s",right:"k-callout-e"},ne={top:{vertical:"bottom",horizontal:"center"},left:{vertical:"center",horizontal:"right"},bottom:{vertical:"top",horizontal:"center"},right:{vertical:"center",horizontal:"left"}},re={top:{vertical:"top",horizontal:"center"},left:{vertical:"center",horizontal:"left"},bottom:{vertical:"bottom",horizontal:"center"},right:{vertical:"center",horizontal:"right"}},le=n=>t.Children.toArray(n).filter(r=>r&&r.type===z.PopoverActionsBar),ae=n=>t.Children.toArray(n).filter(r=>r&&r.type!==z.PopoverActionsBar),P=t.forwardRef((n,r)=>{const{autoFocus:c=!0,callout:i=y.callout,position:l=y.position,collision:R=y.collision,title:f,children:d,show:N,anchor:j,appendTo:D,offset:x,animate:F,positionMode:I,scale:S,popoverClass:a,className:_,id:q,style:B,contentStyle:O,onPosition:m,onClose:v,onOpen:h,onKeyDown:b}=n,[K,k]=t.useState(!1),C=l==="top"||l==="bottom",Z=n.margin||{vertical:i&&C?w:0,horizontal:i&&!C?w:0},M=ne[l],V=re[l],E=t.useContext(g.ZIndexContext),L=E?E+ee:$,s=t.useRef(null);t.useImperativeHandle(s,()=>({props:n})),t.useImperativeHandle(r,()=>s.current);const H=t.useCallback(o=>{if(setTimeout(()=>k(o.flipped)),m){const p={target:s.current,flipped:o.flipped,fitted:o.fitted};m.call(void 0,p)}},[m,k]),U=t.useCallback(()=>{if(c){const o=A.getFirstFocusableElement(document.querySelector(".k-popover-inner"));o&&o.focus()}if(h){const o={target:s.current};h.call(void 0,o)}},[h]),X=t.useCallback(o=>{if(b&&o.key==="Escape"){const p={target:s.current,show:!1};b.call(void 0,p)}o.key==="Tab"&&A.handleFocusTrap(o)},[b]),G=t.useCallback(o=>{if(v){const p={target:s.current};v.call(void 0,p)}o&&o.target&&o.target.props&&o.target.props.anchor&&o.target.props.anchor.focus()},[v]),u={"k-popover":!0};Array.isArray(a)?a.forEach(o=>u[o]=!0):typeof a=="object"?Object.keys(a).forEach(o=>{u[o]=a[o]}):a&&(u[a]=!0);const J=K?te[l]:oe[l],T=t.useMemo(()=>t.createElement(t.Fragment,null,f&&t.createElement("div",{className:"k-popover-header"},f),t.createElement("div",{className:"k-popover-body",style:O},ae(d)),le(d)),[d,O,f]);return t.createElement(g.ZIndexContext.Provider,{value:L},t.createElement(W.Popup,{id:q,role:"tooltip",animate:F,collision:R,anchor:j,offset:x,margin:Z,popupAlign:M,anchorAlign:V,appendTo:D,show:N,scale:S,positionMode:I,style:B,className:_,popupClass:u,onOpen:U,onClose:G,onPosition:H,onKeyDown:X},i&&l?t.createElement(t.Fragment,null,t.createElement("div",{className:g.classNames("k-popover-callout",J)}),t.createElement("div",{className:"k-popover-inner"},T)):T))}),y={callout:!0,position:"top",collision:{horizontal:"none",vertical:"none"}};P.propTypes={callout:e.bool,title:e.node,position:e.oneOf(["top","left","bottom","right"]),show:e.bool,animate:e.oneOfType([e.bool,e.shape({openDuration:e.number,closeDuration:e.number})]),anchor:function(n){const r=n.anchor;return r&&typeof r.nodeType!="number"?new Error("Invalid prop `anchor` supplied to `Kendo React Popover`. Validation failed."):null},appendTo:function(n){const r=n.appendTo;return r&&typeof r.nodeType!="number"?new Error("Invalid prop `appendTo` supplied to `Kendo React Popover`. Validation failed."):null},positionMode:e.oneOf(["fixed","absolute"]),scale:e.number,offset:e.shape({left:e.number,top:e.number}),children:e.oneOfType([e.element,e.node]),className:e.oneOfType([e.string,e.arrayOf(e.string),e.object]),id:e.string,popoverClass:e.oneOfType([e.string,e.arrayOf(e.string),e.object]),style:e.object,onClose:e.func,onPosition:e.func,onOpen:e.func};P.displayName="KendoReactPopover";exports.Popover=P;