UNPKG

@progress/kendo-react-tooltip

Version:

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

9 lines (8 loc) 4.59 kB
/** * @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 J=require("react"),e=require("prop-types"),b=require("@progress/kendo-react-common"),Q=require("@progress/kendo-react-popup"),w=require("./PopoverActionsBar.js"),T=require("./utils.js");function W(n){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const a in n)if(a!=="default"){const l=Object.getOwnPropertyDescriptor(n,a);Object.defineProperty(r,a,l.get?l:{enumerable:!0,get:()=>n[a]})}}return r.default=n,Object.freeze(r)}const o=W(J),Y=12e3,$=2e3,A=15,ee={top:"k-callout-s",left:"k-callout-e",bottom:"k-callout-n",right:"k-callout-w"},oe={top:"k-callout-n",left:"k-callout-w",bottom:"k-callout-s",right:"k-callout-e"},te={top:{vertical:"bottom",horizontal:"center"},left:{vertical:"center",horizontal:"right"},bottom:{vertical:"top",horizontal:"center"},right:{vertical:"center",horizontal:"left"}},ne={top:{vertical:"top",horizontal:"center"},left:{vertical:"center",horizontal:"left"},bottom:{vertical:"bottom",horizontal:"center"},right:{vertical:"center",horizontal:"right"}},re=n=>o.Children.toArray(n).filter(r=>r&&r.type===w.PopoverActionsBar),le=n=>o.Children.toArray(n).filter(r=>r&&r.type!==w.PopoverActionsBar),y=o.forwardRef((n,r)=>{const{callout:a=g.callout,position:l=g.position,collision:z=g.collision,title:u,children:f,show:R,anchor:N,appendTo:j,offset:D,animate:x,positionMode:I,scale:S,popoverClass:c,className:F,id:_,style:q,contentStyle:P,onPosition:d,onClose:m,onOpen:v,onKeyDown:h}=n,[B,O]=o.useState(!1),k=l==="top"||l==="bottom",K=n.margin||{vertical:a&&k?A:0,horizontal:a&&!k?A:0},Z=te[l],M=ne[l],C=o.useContext(b.ZIndexContext),V=C?C+$:Y,s=o.useRef(null);o.useImperativeHandle(s,()=>({props:n})),o.useImperativeHandle(r,()=>s.current);const L=o.useCallback(t=>{if(setTimeout(()=>O(t.flipped)),d){const i={target:s.current,flipped:t.flipped,fitted:t.fitted};d.call(void 0,i)}},[d,O]),H=o.useCallback(()=>{const t=T.getFirstFocusableElement(document.querySelector(".k-popover-inner"));if(t&&t.focus(),v){const i={target:s.current};v.call(void 0,i)}},[v]),U=o.useCallback(t=>{if(h&&t.key==="Escape"){const i={target:s.current,show:!1};h.call(void 0,i)}t.key==="Tab"&&T.handleFocusTrap(t)},[h]),X=o.useCallback(t=>{if(m){const i={target:s.current};m.call(void 0,i)}t&&t.target&&t.target.props&&t.target.props.anchor&&t.target.props.anchor.focus()},[m]),p={"k-popover":!0};Array.isArray(c)?c.forEach(t=>p[t]=!0):typeof c=="object"?Object.keys(c).forEach(t=>{p[t]=c[t]}):c&&(p[c]=!0);const G=B?oe[l]:ee[l],E=o.useMemo(()=>o.createElement(o.Fragment,null,u&&o.createElement("div",{className:"k-popover-header"},u),o.createElement("div",{className:"k-popover-body",style:P},le(f)),re(f)),[f,P,u]);return o.createElement(b.ZIndexContext.Provider,{value:V},o.createElement(Q.Popup,{id:_,role:"tooltip",animate:x,collision:z,anchor:N,offset:D,margin:K,popupAlign:Z,anchorAlign:M,appendTo:j,show:R,scale:S,positionMode:I,style:q,className:F,popupClass:p,onOpen:H,onClose:X,onPosition:L,onKeyDown:U},a&&l?o.createElement(o.Fragment,null,o.createElement("div",{className:b.classNames("k-popover-callout",G)}),o.createElement("div",{className:"k-popover-inner"},E)):E))}),g={callout:!0,position:"top",collision:{horizontal:"none",vertical:"none"}};y.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};y.displayName="KendoReactPopover";exports.Popover=y;