Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@leafygreen-ui/tooltip

Package Overview
Dependencies
Maintainers
4
Versions
97
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@leafygreen-ui/tooltip - npm Package Compare versions

Comparing version 9.0.1 to 9.0.2

6

CHANGELOG.md
# @leafygreen-ui/tooltip
## 9.0.2
### Patch Changes
- 0020689d0: Fixes failing tests. Console warning will appear if an Icon is passed as a trigger
## 9.0.1

@@ -4,0 +10,0 @@

2

dist/esm/index.js

@@ -1,2 +0,2 @@

import*as e from"react";import t,{useState as n,useEffect as r,useCallback as o}from"react";import i from"prop-types";import{transparentize as a}from"polished";import l from"lodash/debounce";import c,{Justify as s,Align as p}from"@leafygreen-ui/popover";export{Justify}from"@leafygreen-ui/popover";import{useIdAllocator as f,useEscapeKey as u,useEventListener as h}from"@leafygreen-ui/hooks";import{css as d,cx as g}from"@leafygreen-ui/emotion";import{palette as m}from"@leafygreen-ui/palette";import{fontFamilies as b}from"@leafygreen-ui/tokens";import{Theme as y,isComponentType as v}from"@leafygreen-ui/lib";import{useUpdatedBaseFontSize as x,bodyTypeScaleStyles as w}from"@leafygreen-ui/typography";import{isComponentGlyph as O}from"@leafygreen-ui/icon";import j from"lodash/clamp";import k,{useDarkMode as E}from"@leafygreen-ui/leafygreen-provider";function C(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function P(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?C(Object(n),!0).forEach((function(t){N(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):C(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function N(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function M(){return M=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},M.apply(this,arguments)}function I(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function S(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function F(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,o,i=[],a=!0,l=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){l=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(l)throw o}}return i}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return T(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return T(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function T(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var A,L,z;function B(t){return e.createElement("svg",M({width:26,height:8,fill:"#001E2B",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 26 8"},t),e.createElement("path",{d:"M27 0H-1v1h.699a10 10 0 017.26 3.123l1.685 1.78a6 6 0 008.712 0l1.686-1.78A10 10 0 0126.302 1H27V0z"}))}var H,R,D,U,X,Y,Z,G,q,J,K=["open","setOpen","className","children","trigger","triggerEvent","darkMode","enabled","align","justify","spacing","id","shouldClose","usePortal","portalClassName","portalContainer","scrollContainer","popoverZIndex","refEl","onClose"],V={Hover:"hover",Click:"click"},$={Top:p.Top,Bottom:p.Bottom,Left:p.Left,Right:p.Right},Q=d(H||(H=S(["\n margin: unset;\n font-family: ",";\n color: ",";\n font-weight: 400;\n width: 100%;\n overflow-wrap: anywhere;\n"])),b.default,m.gray.light1),W=d(R||(R=S(["\n display: flex;\n align-items: center;\n border-radius: ","px;\n padding: 12px ","px;\n box-shadow: 0px 2px 4px -1px ",";\n cursor: default;\n width: fit-content;\n max-width: 256px;\n"])),16,16,a(.85,m.black)),_=d(D||(D=S(["\n position: relative;\n"]))),ee=(N(G={},y.Light,{tooltip:d(U||(U=S(["\n background-color: ",";\n color: ",";\n "])),m.black,m.gray.light1),children:d(X||(X=S(["\n color: inherit;\n "]))),notchFill:m.black}),N(G,y.Dark,{tooltip:d(Y||(Y=S(["\n background-color: ",";\n color: ",";\n "])),m.gray.light2,m.black),children:d(Z||(Z=S(["\n color: inherit;\n "]))),notchFill:m.gray.light2}),G),te=d(q||(q=S(["\n min-height: ","px;\n"])),58),ne=function(e){e.stopPropagation()};function re(e){var i=e.open,a=e.setOpen,p=e.className,m=e.children,b=e.trigger,y=e.triggerEvent,C=void 0===y?V.Hover:y,T=e.darkMode,H=e.enabled,R=void 0===H||H,D=e.align,U=void 0===D?"top":D,X=e.justify,Y=void 0===X?"start":X,Z=e.spacing,G=void 0===Z?12:Z,q=e.id,re=e.shouldClose,oe=e.usePortal,ie=void 0===oe||oe,ae=e.portalClassName,le=e.portalContainer,ce=e.scrollContainer,se=e.popoverZIndex,pe=e.refEl,fe=e.onClose,ue=void 0===fe?function(){}:fe,he=I(e,K),de="boolean"==typeof i,ge=F(n(!1),2),me=ge[0],be=ge[1],ye=x(),ve=de?i:me,xe=de&&a?a:be,we=F(n(null),2),Oe=we[0],je=we[1],ke=null!=q?q:null==Oe?void 0:Oe.id,Ee=f({prefix:"tooltip",id:ke}),Ce=E(T),Pe=Ce.darkMode,Ne=Ce.theme;r((function(){(b&&v(b,"Icon")||O(b))&&console.warn("Using a LeafyGreenUI Icon or Glyph component as a trigger will not render a Tooltip, as these components do not render their children. To use, please wrap your trigger element in another HTML tag.")}),[b]);var Me=o((function(){("function"!=typeof re||re())&&(ue(),xe(!1))}),[xe,re,ue]),Ie=o((function(e,t){return e===V.Hover?{onMouseEnter:l((function(e){n("onMouseEnter",e),xe(!0)}),35),onMouseLeave:l((function(e){n("onMouseLeave",e),Me()}),35),onFocus:function(e){n("onFocus",e),xe(!0)},onBlur:function(e){n("onBlur",e),Me()}}:{onClick:function(e){e.target!==Oe&&(n("onClick",e),xe((function(e){return!e})))}};function n(e,n){t&&t[e]&&"function"==typeof t[e]&&t[e](n)}}),[Me,xe,Oe]);u(Me,{enabled:ve});var Se=o((function(e){Oe&&!Oe.contains(e.target)&&Me()}),[Me,Oe]);h("click",Se,{enabled:ve&&"click"===C});var Fe=P({refEl:pe,popoverZIndex:se},ie?{spacing:G,usePortal:ie,portalClassName:ae,portalContainer:le,scrollContainer:ce}:{spacing:G,usePortal:ie}),Te=R&&ve,Ae=["left","right"].includes(U),Le=t.createElement(c,M({key:"tooltip",active:Te,align:U,justify:Y,adjustOnMutation:!0,onClick:ne,className:g(N({},d(J||(J=S(["\n // Try to fit all the content on one line (until it hits max-width)\n // Overrides default behavior, which is to set width to size of the trigger.\n // Except when justify is set to fit because the width should be the size of the trigger.\n // Another exception is when justify is set to fit and the alignment is either left or right. In this case only the height should be the size of the trigger so we still want the width to fit the max content.\n width: max-content;\n "]))),Y!==s.Fit||Y===s.Fit&&(U===$.Left||U===$.Right)))},Fe),(function(e){var n=function(e){var t=e.align,n=e.justify,r=e.triggerRect;if(!t||!n||!r)return{notchContainer:"",notch:"",tooltip:""};var o,i,a=26,l={},c={},p=16,f=32,u=0,h="";switch(t){case"top":case"bottom":switch(f=48,o=r.width/2-13,u=j(o,p,f),i=o<=p,l.left="0px",l.right="0px","top"===t?(c.top="calc(100% - 1px)",l.top="".concat(-9,"px")):(c.bottom="calc(100% - 1px)",l.bottom="".concat(-9,"px"),l.transform="rotate(180deg)"),n){case s.Start:c.left="".concat(u,"px"),i&&(h="translateX(-".concat(p-o,"px)"));break;case s.Middle:c.left="0px",c.right="0px";break;case s.Fit:c.left="".concat(u,"px"),i&&(h="translateX(-".concat(p-o,"px)"));break;case s.End:c.right="".concat(u,"px"),i&&(h="translateX(".concat(p-o,"px)"))}break;case"left":case"right":switch(f=32,o=r.height/2-13,u=j(o,p,f),i=o<=p,l.top="0px",l.bottom="0px","left"===t?(c.left="calc(100% - 1px)",l.left="".concat(-9,"px"),l.transform="rotate(-90deg)"):(c.right="calc(100% - 1px)",l.right="".concat(-9,"px"),l.transform="rotate(90deg)"),n){case s.Start:c.top="".concat(u,"px"),i&&(h="translateY(-".concat(p-o,"px)"));break;case s.Middle:c.top="0px",c.bottom="0px";break;case s.Fit:c.top="".concat(u,"px"),i&&(h="translateY(-".concat(p-o,"px)"));break;case s.End:c.bottom="".concat(u,"px"),i&&(h="translateY(".concat(p-o,"px)"))}}return{notchContainer:d(A||(A=S(["\n position: absolute;\n width: ","px;\n height: ","px;\n overflow: hidden;\n margin: auto;\n pointer-events: none;\n ",";\n "])),a,a,d(c)),notch:d(L||(L=S(["\n ",";\n position: absolute;\n width: ","px;\n height: ","px; // Keep it square. Rotating is simpler\n margin: 0;\n "])),d(l),26,26),tooltip:d(z||(z=S(["\n min-width: ","px;\n transform: ",";\n "])),2*u+a,h)}}({align:e.align,justify:e.justify,triggerRect:e.referenceElPos}),r=n.notchContainer,o=n.notch,i=n.tooltip;return t.createElement(k,{darkMode:!Pe},t.createElement("div",M({role:"tooltip"},he,{id:Ee,className:g(W,i,ee[Ne].tooltip,N({},te,Ae),p),ref:je}),t.createElement("div",{className:g(Q,w[ye],ee[Ne].children)},m),t.createElement("div",{className:r},t.createElement(B,{className:g(o),fill:ee[Ne].notchFill}))))}));return b?"function"==typeof b?b(P(P({},Ie(C)),{},{className:_,"aria-describedby":Te?Ee:void 0,children:Le})):t.cloneElement(b,P(P({},Ie(C,b.props)),{},{"aria-describedby":Te?Ee:void 0,children:t.createElement(t.Fragment,null,b.props.children,Le),className:g(_,b.props.className)})):Le}re.displayName="Tooltip",re.propTypes={children:i.node,className:i.string,align:i.oneOf(Object.values($)),justify:i.oneOf(Object.values(s)),trigger:i.oneOfType([i.node,i.func]),triggerEvent:i.oneOf(Object.values(V)),darkMode:i.bool,enabled:i.bool,open:i.bool,setOpen:i.func,id:i.string,shouldClose:i.func,usePortal:i.bool,portalClassName:i.string};export{$ as Align,V as TriggerEvent,re as default};
import*as e from"react";import t,{useState as n,useEffect as r,useCallback as o}from"react";import i from"prop-types";import{transparentize as a}from"polished";import l from"lodash/debounce";import c,{Justify as s,Align as p}from"@leafygreen-ui/popover";export{Justify}from"@leafygreen-ui/popover";import{useIdAllocator as f,useEscapeKey as u,useEventListener as h}from"@leafygreen-ui/hooks";import{css as d,cx as g}from"@leafygreen-ui/emotion";import{palette as m}from"@leafygreen-ui/palette";import{fontFamilies as b}from"@leafygreen-ui/tokens";import{Theme as y}from"@leafygreen-ui/lib";import{useUpdatedBaseFontSize as v,bodyTypeScaleStyles as x}from"@leafygreen-ui/typography";import{isComponentGlyph as w}from"@leafygreen-ui/icon";import O from"lodash/clamp";import j,{useDarkMode as k}from"@leafygreen-ui/leafygreen-provider";function E(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function C(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?E(Object(n),!0).forEach((function(t){P(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):E(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function P(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function N(){return N=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},N.apply(this,arguments)}function M(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function S(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function F(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,o,i=[],a=!0,l=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){l=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(l)throw o}}return i}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return I(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return I(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function I(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var T,A,L;function z(t){return e.createElement("svg",N({width:26,height:8,fill:"#001E2B",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 26 8"},t),e.createElement("path",{d:"M27 0H-1v1h.699a10 10 0 017.26 3.123l1.685 1.78a6 6 0 008.712 0l1.686-1.78A10 10 0 0126.302 1H27V0z"}))}var B,H,R,D,U,X,Y,Z,G,q,J=["open","setOpen","className","children","trigger","triggerEvent","darkMode","enabled","align","justify","spacing","id","shouldClose","usePortal","portalClassName","portalContainer","scrollContainer","popoverZIndex","refEl","onClose"],K={Hover:"hover",Click:"click"},V={Top:p.Top,Bottom:p.Bottom,Left:p.Left,Right:p.Right},$=d(B||(B=S(["\n margin: unset;\n font-family: ",";\n color: ",";\n font-weight: 400;\n width: 100%;\n overflow-wrap: anywhere;\n"])),b.default,m.gray.light1),Q=d(H||(H=S(["\n display: flex;\n align-items: center;\n border-radius: ","px;\n padding: 12px ","px;\n box-shadow: 0px 2px 4px -1px ",";\n cursor: default;\n width: fit-content;\n max-width: 256px;\n"])),16,16,a(.85,m.black)),W=d(R||(R=S(["\n position: relative;\n"]))),_=(P(Z={},y.Light,{tooltip:d(D||(D=S(["\n background-color: ",";\n color: ",";\n "])),m.black,m.gray.light1),children:d(U||(U=S(["\n color: inherit;\n "]))),notchFill:m.black}),P(Z,y.Dark,{tooltip:d(X||(X=S(["\n background-color: ",";\n color: ",";\n "])),m.gray.light2,m.black),children:d(Y||(Y=S(["\n color: inherit;\n "]))),notchFill:m.gray.light2}),Z),ee=d(G||(G=S(["\n min-height: ","px;\n"])),58),te=function(e){e.stopPropagation()};function ne(e){var i=e.open,a=e.setOpen,p=e.className,m=e.children,b=e.trigger,y=e.triggerEvent,E=void 0===y?K.Hover:y,I=e.darkMode,B=e.enabled,H=void 0===B||B,R=e.align,D=void 0===R?"top":R,U=e.justify,X=void 0===U?"start":U,Y=e.spacing,Z=void 0===Y?12:Y,G=e.id,ne=e.shouldClose,re=e.usePortal,oe=void 0===re||re,ie=e.portalClassName,ae=e.portalContainer,le=e.scrollContainer,ce=e.popoverZIndex,se=e.refEl,pe=e.onClose,fe=void 0===pe?function(){}:pe,ue=M(e,J),he="boolean"==typeof i,de=F(n(!1),2),ge=de[0],me=de[1],be=v(),ye=he?i:ge,ve=he&&a?a:me,xe=F(n(null),2),we=xe[0],Oe=xe[1],je=null!=G?G:null==we?void 0:we.id,ke=f({prefix:"tooltip",id:je}),Ee=k(I),Ce=Ee.darkMode,Pe=Ee.theme;r((function(){b&&w(b)&&console.warn("Using a LeafyGreenUI Icon or Glyph component as a trigger will not render a Tooltip, as these components do not render their children. To use, please wrap your trigger element in another HTML tag.")}),[b]);var Ne=o((function(){("function"!=typeof ne||ne())&&(fe(),ve(!1))}),[ve,ne,fe]),Me=o((function(e,t){return e===K.Hover?{onMouseEnter:l((function(e){n("onMouseEnter",e),ve(!0)}),35),onMouseLeave:l((function(e){n("onMouseLeave",e),Ne()}),35),onFocus:function(e){n("onFocus",e),ve(!0)},onBlur:function(e){n("onBlur",e),Ne()}}:{onClick:function(e){e.target!==we&&(n("onClick",e),ve((function(e){return!e})))}};function n(e,n){t&&t[e]&&"function"==typeof t[e]&&t[e](n)}}),[Ne,ve,we]);u(Ne,{enabled:ye});var Se=o((function(e){we&&!we.contains(e.target)&&Ne()}),[Ne,we]);h("click",Se,{enabled:ye&&"click"===E});var Fe=C({refEl:se,popoverZIndex:ce},oe?{spacing:Z,usePortal:oe,portalClassName:ie,portalContainer:ae,scrollContainer:le}:{spacing:Z,usePortal:oe}),Ie=H&&ye,Te=["left","right"].includes(D),Ae=t.createElement(c,N({key:"tooltip",active:Ie,align:D,justify:X,adjustOnMutation:!0,onClick:te,className:g(P({},d(q||(q=S(["\n // Try to fit all the content on one line (until it hits max-width)\n // Overrides default behavior, which is to set width to size of the trigger.\n // Except when justify is set to fit because the width should be the size of the trigger.\n // Another exception is when justify is set to fit and the alignment is either left or right. In this case only the height should be the size of the trigger so we still want the width to fit the max content.\n width: max-content;\n "]))),X!==s.Fit||X===s.Fit&&(D===V.Left||D===V.Right)))},Fe),(function(e){var n=function(e){var t=e.align,n=e.justify,r=e.triggerRect;if(!t||!n||!r)return{notchContainer:"",notch:"",tooltip:""};var o,i,a=26,l={},c={},p=16,f=32,u=0,h="";switch(t){case"top":case"bottom":switch(f=48,o=r.width/2-13,u=O(o,p,f),i=o<=p,l.left="0px",l.right="0px","top"===t?(c.top="calc(100% - 1px)",l.top="".concat(-9,"px")):(c.bottom="calc(100% - 1px)",l.bottom="".concat(-9,"px"),l.transform="rotate(180deg)"),n){case s.Start:c.left="".concat(u,"px"),i&&(h="translateX(-".concat(p-o,"px)"));break;case s.Middle:c.left="0px",c.right="0px";break;case s.Fit:c.left="".concat(u,"px"),i&&(h="translateX(-".concat(p-o,"px)"));break;case s.End:c.right="".concat(u,"px"),i&&(h="translateX(".concat(p-o,"px)"))}break;case"left":case"right":switch(f=32,o=r.height/2-13,u=O(o,p,f),i=o<=p,l.top="0px",l.bottom="0px","left"===t?(c.left="calc(100% - 1px)",l.left="".concat(-9,"px"),l.transform="rotate(-90deg)"):(c.right="calc(100% - 1px)",l.right="".concat(-9,"px"),l.transform="rotate(90deg)"),n){case s.Start:c.top="".concat(u,"px"),i&&(h="translateY(-".concat(p-o,"px)"));break;case s.Middle:c.top="0px",c.bottom="0px";break;case s.Fit:c.top="".concat(u,"px"),i&&(h="translateY(-".concat(p-o,"px)"));break;case s.End:c.bottom="".concat(u,"px"),i&&(h="translateY(".concat(p-o,"px)"))}}return{notchContainer:d(T||(T=S(["\n position: absolute;\n width: ","px;\n height: ","px;\n overflow: hidden;\n margin: auto;\n pointer-events: none;\n ",";\n "])),a,a,d(c)),notch:d(A||(A=S(["\n ",";\n position: absolute;\n width: ","px;\n height: ","px; // Keep it square. Rotating is simpler\n margin: 0;\n "])),d(l),26,26),tooltip:d(L||(L=S(["\n min-width: ","px;\n transform: ",";\n "])),2*u+a,h)}}({align:e.align,justify:e.justify,triggerRect:e.referenceElPos}),r=n.notchContainer,o=n.notch,i=n.tooltip;return t.createElement(j,{darkMode:!Ce},t.createElement("div",N({role:"tooltip"},ue,{id:ke,className:g(Q,i,_[Pe].tooltip,P({},ee,Te),p),ref:Oe}),t.createElement("div",{className:g($,x[be],_[Pe].children)},m),t.createElement("div",{className:r},t.createElement(z,{className:g(o),fill:_[Pe].notchFill}))))}));return b?"function"==typeof b?b(C(C({},Me(E)),{},{className:W,"aria-describedby":Ie?ke:void 0,children:Ae})):t.cloneElement(b,C(C({},Me(E,b.props)),{},{"aria-describedby":Ie?ke:void 0,children:t.createElement(t.Fragment,null,b.props.children,Ae),className:g(W,b.props.className)})):Ae}ne.displayName="Tooltip",ne.propTypes={children:i.node,className:i.string,align:i.oneOf(Object.values(V)),justify:i.oneOf(Object.values(s)),trigger:i.oneOfType([i.node,i.func]),triggerEvent:i.oneOf(Object.values(K)),darkMode:i.bool,enabled:i.bool,open:i.bool,setOpen:i.func,id:i.string,shouldClose:i.func,usePortal:i.bool,portalClassName:i.string};export{V as Align,K as TriggerEvent,ne as default};
//# sourceMappingURL=index.js.map

2

dist/index.js

@@ -1,2 +0,2 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("polished"),require("lodash/debounce"),require("@leafygreen-ui/popover"),require("@leafygreen-ui/hooks"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/palette"),require("@leafygreen-ui/tokens"),require("@leafygreen-ui/lib"),require("@leafygreen-ui/typography"),require("@leafygreen-ui/icon"),require("lodash/clamp"),require("@leafygreen-ui/leafygreen-provider")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","polished","lodash/debounce","@leafygreen-ui/popover","@leafygreen-ui/hooks","@leafygreen-ui/emotion","@leafygreen-ui/palette","@leafygreen-ui/tokens","@leafygreen-ui/lib","@leafygreen-ui/typography","@leafygreen-ui/icon","lodash/clamp","@leafygreen-ui/leafygreen-provider"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/tooltip"]={},e.React,e.PropTypes,e.polished,e.debounce,e["@leafygreen-ui/popover"],e["@leafygreen-ui/hooks"],e["@leafygreen-ui/emotion"],e["@leafygreen-ui/palette"],e["@leafygreen-ui/tokens"],e["@leafygreen-ui/lib"],e["@leafygreen-ui/typography"],e["@leafygreen-ui/icon"],e.clamp,e["@leafygreen-ui/leafygreen-provider"])}(this,(function(e,t,n,r,o,a,i,l,c,s,u,f,p,d,g){"use strict";function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function y(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var b=y(t),m=h(t),v=h(n),x=h(o),O=h(a),w=h(d),j=h(g);function k(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function E(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?k(Object(n),!0).forEach((function(t){C(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):k(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function C(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function P(){return P=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},P.apply(this,arguments)}function M(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function T(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function N(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,o,a=[],i=!0,l=!1;try{for(n=n.call(e);!(i=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);i=!0);}catch(e){l=!0,o=e}finally{try{i||null==n.return||n.return()}finally{if(l)throw o}}return a}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return S(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return S(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function S(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var q,A,J;function F(e){return b.createElement("svg",P({width:26,height:8,fill:"#001E2B",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 26 8"},e),b.createElement("path",{d:"M27 0H-1v1h.699a10 10 0 017.26 3.123l1.685 1.78a6 6 0 008.712 0l1.686-1.78A10 10 0 0126.302 1H27V0z"}))}var I,z,L,B,D,R,H,U,_,G,X=["open","setOpen","className","children","trigger","triggerEvent","darkMode","enabled","align","justify","spacing","id","shouldClose","usePortal","portalClassName","portalContainer","scrollContainer","popoverZIndex","refEl","onClose"],Y={Hover:"hover",Click:"click"},Z={Top:a.Align.Top,Bottom:a.Align.Bottom,Left:a.Align.Left,Right:a.Align.Right},K=l.css(I||(I=T(["\n margin: unset;\n font-family: ",";\n color: ",";\n font-weight: 400;\n width: 100%;\n overflow-wrap: anywhere;\n"])),s.fontFamilies.default,c.palette.gray.light1),V=l.css(z||(z=T(["\n display: flex;\n align-items: center;\n border-radius: ","px;\n padding: 12px ","px;\n box-shadow: 0px 2px 4px -1px ",";\n cursor: default;\n width: fit-content;\n max-width: 256px;\n"])),16,16,r.transparentize(.85,c.palette.black)),$=l.css(L||(L=T(["\n position: relative;\n"]))),Q=(C(U={},u.Theme.Light,{tooltip:l.css(B||(B=T(["\n background-color: ",";\n color: ",";\n "])),c.palette.black,c.palette.gray.light1),children:l.css(D||(D=T(["\n color: inherit;\n "]))),notchFill:c.palette.black}),C(U,u.Theme.Dark,{tooltip:l.css(R||(R=T(["\n background-color: ",";\n color: ",";\n "])),c.palette.gray.light2,c.palette.black),children:l.css(H||(H=T(["\n color: inherit;\n "]))),notchFill:c.palette.gray.light2}),U),W=l.css(_||(_=T(["\n min-height: ","px;\n"])),58),ee=function(e){e.stopPropagation()};function te(e){var n=e.open,r=e.setOpen,o=e.className,c=e.children,s=e.trigger,d=e.triggerEvent,h=void 0===d?Y.Hover:d,y=e.darkMode,b=e.enabled,v=void 0===b||b,k=e.align,S=void 0===k?"top":k,I=e.justify,z=void 0===I?"start":I,L=e.spacing,B=void 0===L?12:L,D=e.id,R=e.shouldClose,H=e.usePortal,U=void 0===H||H,_=e.portalClassName,te=e.portalContainer,ne=e.scrollContainer,re=e.popoverZIndex,oe=e.refEl,ae=e.onClose,ie=void 0===ae?function(){}:ae,le=M(e,X),ce="boolean"==typeof n,se=N(t.useState(!1),2),ue=se[0],fe=se[1],pe=f.useUpdatedBaseFontSize(),de=ce?n:ue,ge=ce&&r?r:fe,he=N(t.useState(null),2),ye=he[0],be=he[1],me=null!=D?D:null==ye?void 0:ye.id,ve=i.useIdAllocator({prefix:"tooltip",id:me}),xe=g.useDarkMode(y),Oe=xe.darkMode,we=xe.theme;t.useEffect((function(){(s&&u.isComponentType(s,"Icon")||p.isComponentGlyph(s))&&console.warn("Using a LeafyGreenUI Icon or Glyph component as a trigger will not render a Tooltip, as these components do not render their children. To use, please wrap your trigger element in another HTML tag.")}),[s]);var je=t.useCallback((function(){("function"!=typeof R||R())&&(ie(),ge(!1))}),[ge,R,ie]),ke=t.useCallback((function(e,t){return e===Y.Hover?{onMouseEnter:x.default((function(e){n("onMouseEnter",e),ge(!0)}),35),onMouseLeave:x.default((function(e){n("onMouseLeave",e),je()}),35),onFocus:function(e){n("onFocus",e),ge(!0)},onBlur:function(e){n("onBlur",e),je()}}:{onClick:function(e){e.target!==ye&&(n("onClick",e),ge((function(e){return!e})))}};function n(e,n){t&&t[e]&&"function"==typeof t[e]&&t[e](n)}}),[je,ge,ye]);i.useEscapeKey(je,{enabled:de});var Ee=t.useCallback((function(e){ye&&!ye.contains(e.target)&&je()}),[je,ye]);i.useEventListener("click",Ee,{enabled:de&&"click"===h});var Ce=E({refEl:oe,popoverZIndex:re},U?{spacing:B,usePortal:U,portalClassName:_,portalContainer:te,scrollContainer:ne}:{spacing:B,usePortal:U}),Pe=v&&de,Me=["left","right"].includes(S),Te=m.default.createElement(O.default,P({key:"tooltip",active:Pe,align:S,justify:z,adjustOnMutation:!0,onClick:ee,className:l.cx(C({},l.css(G||(G=T(["\n // Try to fit all the content on one line (until it hits max-width)\n // Overrides default behavior, which is to set width to size of the trigger.\n // Except when justify is set to fit because the width should be the size of the trigger.\n // Another exception is when justify is set to fit and the alignment is either left or right. In this case only the height should be the size of the trigger so we still want the width to fit the max content.\n width: max-content;\n "]))),z!==a.Justify.Fit||z===a.Justify.Fit&&(S===Z.Left||S===Z.Right)))},Ce),(function(e){var t=function(e){var t=e.align,n=e.justify,r=e.triggerRect;if(!t||!n||!r)return{notchContainer:"",notch:"",tooltip:""};var o,i,c=26,s={},u={},f=16,p=32,d=0,g="";switch(t){case"top":case"bottom":switch(p=48,o=r.width/2-13,d=w.default(o,f,p),i=o<=f,s.left="0px",s.right="0px","top"===t?(u.top="calc(100% - 1px)",s.top="".concat(-9,"px")):(u.bottom="calc(100% - 1px)",s.bottom="".concat(-9,"px"),s.transform="rotate(180deg)"),n){case a.Justify.Start:u.left="".concat(d,"px"),i&&(g="translateX(-".concat(f-o,"px)"));break;case a.Justify.Middle:u.left="0px",u.right="0px";break;case a.Justify.Fit:u.left="".concat(d,"px"),i&&(g="translateX(-".concat(f-o,"px)"));break;case a.Justify.End:u.right="".concat(d,"px"),i&&(g="translateX(".concat(f-o,"px)"))}break;case"left":case"right":switch(p=32,o=r.height/2-13,d=w.default(o,f,p),i=o<=f,s.top="0px",s.bottom="0px","left"===t?(u.left="calc(100% - 1px)",s.left="".concat(-9,"px"),s.transform="rotate(-90deg)"):(u.right="calc(100% - 1px)",s.right="".concat(-9,"px"),s.transform="rotate(90deg)"),n){case a.Justify.Start:u.top="".concat(d,"px"),i&&(g="translateY(-".concat(f-o,"px)"));break;case a.Justify.Middle:u.top="0px",u.bottom="0px";break;case a.Justify.Fit:u.top="".concat(d,"px"),i&&(g="translateY(-".concat(f-o,"px)"));break;case a.Justify.End:u.bottom="".concat(d,"px"),i&&(g="translateY(".concat(f-o,"px)"))}}return{notchContainer:l.css(q||(q=T(["\n position: absolute;\n width: ","px;\n height: ","px;\n overflow: hidden;\n margin: auto;\n pointer-events: none;\n ",";\n "])),c,c,l.css(u)),notch:l.css(A||(A=T(["\n ",";\n position: absolute;\n width: ","px;\n height: ","px; // Keep it square. Rotating is simpler\n margin: 0;\n "])),l.css(s),26,26),tooltip:l.css(J||(J=T(["\n min-width: ","px;\n transform: ",";\n "])),2*d+c,g)}}({align:e.align,justify:e.justify,triggerRect:e.referenceElPos}),n=t.notchContainer,r=t.notch,i=t.tooltip;return m.default.createElement(j.default,{darkMode:!Oe},m.default.createElement("div",P({role:"tooltip"},le,{id:ve,className:l.cx(V,i,Q[we].tooltip,C({},W,Me),o),ref:be}),m.default.createElement("div",{className:l.cx(K,f.bodyTypeScaleStyles[pe],Q[we].children)},c),m.default.createElement("div",{className:n},m.default.createElement(F,{className:l.cx(r),fill:Q[we].notchFill}))))}));return s?"function"==typeof s?s(E(E({},ke(h)),{},{className:$,"aria-describedby":Pe?ve:void 0,children:Te})):m.default.cloneElement(s,E(E({},ke(h,s.props)),{},{"aria-describedby":Pe?ve:void 0,children:m.default.createElement(m.default.Fragment,null,s.props.children,Te),className:l.cx($,s.props.className)})):Te}te.displayName="Tooltip",te.propTypes={children:v.default.node,className:v.default.string,align:v.default.oneOf(Object.values(Z)),justify:v.default.oneOf(Object.values(a.Justify)),trigger:v.default.oneOfType([v.default.node,v.default.func]),triggerEvent:v.default.oneOf(Object.values(Y)),darkMode:v.default.bool,enabled:v.default.bool,open:v.default.bool,setOpen:v.default.func,id:v.default.string,shouldClose:v.default.func,usePortal:v.default.bool,portalClassName:v.default.string},Object.defineProperty(e,"Justify",{enumerable:!0,get:function(){return a.Justify}}),e.Align=Z,e.TriggerEvent=Y,e.default=te,Object.defineProperty(e,"__esModule",{value:!0})}));
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("polished"),require("lodash/debounce"),require("@leafygreen-ui/popover"),require("@leafygreen-ui/hooks"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/palette"),require("@leafygreen-ui/tokens"),require("@leafygreen-ui/lib"),require("@leafygreen-ui/typography"),require("@leafygreen-ui/icon"),require("lodash/clamp"),require("@leafygreen-ui/leafygreen-provider")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","polished","lodash/debounce","@leafygreen-ui/popover","@leafygreen-ui/hooks","@leafygreen-ui/emotion","@leafygreen-ui/palette","@leafygreen-ui/tokens","@leafygreen-ui/lib","@leafygreen-ui/typography","@leafygreen-ui/icon","lodash/clamp","@leafygreen-ui/leafygreen-provider"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/tooltip"]={},e.React,e.PropTypes,e.polished,e.debounce,e["@leafygreen-ui/popover"],e["@leafygreen-ui/hooks"],e["@leafygreen-ui/emotion"],e["@leafygreen-ui/palette"],e["@leafygreen-ui/tokens"],e["@leafygreen-ui/lib"],e["@leafygreen-ui/typography"],e["@leafygreen-ui/icon"],e.clamp,e["@leafygreen-ui/leafygreen-provider"])}(this,(function(e,t,n,r,o,a,i,l,c,s,u,f,p,d,g){"use strict";function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function y(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var b=y(t),m=h(t),v=h(n),x=h(o),O=h(a),w=h(d),j=h(g);function k(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function E(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?k(Object(n),!0).forEach((function(t){C(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):k(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function C(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function P(){return P=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},P.apply(this,arguments)}function M(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function T(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function N(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,o,a=[],i=!0,l=!1;try{for(n=n.call(e);!(i=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);i=!0);}catch(e){l=!0,o=e}finally{try{i||null==n.return||n.return()}finally{if(l)throw o}}return a}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return S(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return S(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function S(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var q,A,J;function F(e){return b.createElement("svg",P({width:26,height:8,fill:"#001E2B",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 26 8"},e),b.createElement("path",{d:"M27 0H-1v1h.699a10 10 0 017.26 3.123l1.685 1.78a6 6 0 008.712 0l1.686-1.78A10 10 0 0126.302 1H27V0z"}))}var I,z,L,B,D,R,H,U,_,G,X=["open","setOpen","className","children","trigger","triggerEvent","darkMode","enabled","align","justify","spacing","id","shouldClose","usePortal","portalClassName","portalContainer","scrollContainer","popoverZIndex","refEl","onClose"],Y={Hover:"hover",Click:"click"},Z={Top:a.Align.Top,Bottom:a.Align.Bottom,Left:a.Align.Left,Right:a.Align.Right},K=l.css(I||(I=T(["\n margin: unset;\n font-family: ",";\n color: ",";\n font-weight: 400;\n width: 100%;\n overflow-wrap: anywhere;\n"])),s.fontFamilies.default,c.palette.gray.light1),V=l.css(z||(z=T(["\n display: flex;\n align-items: center;\n border-radius: ","px;\n padding: 12px ","px;\n box-shadow: 0px 2px 4px -1px ",";\n cursor: default;\n width: fit-content;\n max-width: 256px;\n"])),16,16,r.transparentize(.85,c.palette.black)),$=l.css(L||(L=T(["\n position: relative;\n"]))),Q=(C(U={},u.Theme.Light,{tooltip:l.css(B||(B=T(["\n background-color: ",";\n color: ",";\n "])),c.palette.black,c.palette.gray.light1),children:l.css(D||(D=T(["\n color: inherit;\n "]))),notchFill:c.palette.black}),C(U,u.Theme.Dark,{tooltip:l.css(R||(R=T(["\n background-color: ",";\n color: ",";\n "])),c.palette.gray.light2,c.palette.black),children:l.css(H||(H=T(["\n color: inherit;\n "]))),notchFill:c.palette.gray.light2}),U),W=l.css(_||(_=T(["\n min-height: ","px;\n"])),58),ee=function(e){e.stopPropagation()};function te(e){var n=e.open,r=e.setOpen,o=e.className,c=e.children,s=e.trigger,u=e.triggerEvent,d=void 0===u?Y.Hover:u,h=e.darkMode,y=e.enabled,b=void 0===y||y,v=e.align,k=void 0===v?"top":v,S=e.justify,I=void 0===S?"start":S,z=e.spacing,L=void 0===z?12:z,B=e.id,D=e.shouldClose,R=e.usePortal,H=void 0===R||R,U=e.portalClassName,_=e.portalContainer,te=e.scrollContainer,ne=e.popoverZIndex,re=e.refEl,oe=e.onClose,ae=void 0===oe?function(){}:oe,ie=M(e,X),le="boolean"==typeof n,ce=N(t.useState(!1),2),se=ce[0],ue=ce[1],fe=f.useUpdatedBaseFontSize(),pe=le?n:se,de=le&&r?r:ue,ge=N(t.useState(null),2),he=ge[0],ye=ge[1],be=null!=B?B:null==he?void 0:he.id,me=i.useIdAllocator({prefix:"tooltip",id:be}),ve=g.useDarkMode(h),xe=ve.darkMode,Oe=ve.theme;t.useEffect((function(){s&&p.isComponentGlyph(s)&&console.warn("Using a LeafyGreenUI Icon or Glyph component as a trigger will not render a Tooltip, as these components do not render their children. To use, please wrap your trigger element in another HTML tag.")}),[s]);var we=t.useCallback((function(){("function"!=typeof D||D())&&(ae(),de(!1))}),[de,D,ae]),je=t.useCallback((function(e,t){return e===Y.Hover?{onMouseEnter:x.default((function(e){n("onMouseEnter",e),de(!0)}),35),onMouseLeave:x.default((function(e){n("onMouseLeave",e),we()}),35),onFocus:function(e){n("onFocus",e),de(!0)},onBlur:function(e){n("onBlur",e),we()}}:{onClick:function(e){e.target!==he&&(n("onClick",e),de((function(e){return!e})))}};function n(e,n){t&&t[e]&&"function"==typeof t[e]&&t[e](n)}}),[we,de,he]);i.useEscapeKey(we,{enabled:pe});var ke=t.useCallback((function(e){he&&!he.contains(e.target)&&we()}),[we,he]);i.useEventListener("click",ke,{enabled:pe&&"click"===d});var Ee=E({refEl:re,popoverZIndex:ne},H?{spacing:L,usePortal:H,portalClassName:U,portalContainer:_,scrollContainer:te}:{spacing:L,usePortal:H}),Ce=b&&pe,Pe=["left","right"].includes(k),Me=m.default.createElement(O.default,P({key:"tooltip",active:Ce,align:k,justify:I,adjustOnMutation:!0,onClick:ee,className:l.cx(C({},l.css(G||(G=T(["\n // Try to fit all the content on one line (until it hits max-width)\n // Overrides default behavior, which is to set width to size of the trigger.\n // Except when justify is set to fit because the width should be the size of the trigger.\n // Another exception is when justify is set to fit and the alignment is either left or right. In this case only the height should be the size of the trigger so we still want the width to fit the max content.\n width: max-content;\n "]))),I!==a.Justify.Fit||I===a.Justify.Fit&&(k===Z.Left||k===Z.Right)))},Ee),(function(e){var t=function(e){var t=e.align,n=e.justify,r=e.triggerRect;if(!t||!n||!r)return{notchContainer:"",notch:"",tooltip:""};var o,i,c=26,s={},u={},f=16,p=32,d=0,g="";switch(t){case"top":case"bottom":switch(p=48,o=r.width/2-13,d=w.default(o,f,p),i=o<=f,s.left="0px",s.right="0px","top"===t?(u.top="calc(100% - 1px)",s.top="".concat(-9,"px")):(u.bottom="calc(100% - 1px)",s.bottom="".concat(-9,"px"),s.transform="rotate(180deg)"),n){case a.Justify.Start:u.left="".concat(d,"px"),i&&(g="translateX(-".concat(f-o,"px)"));break;case a.Justify.Middle:u.left="0px",u.right="0px";break;case a.Justify.Fit:u.left="".concat(d,"px"),i&&(g="translateX(-".concat(f-o,"px)"));break;case a.Justify.End:u.right="".concat(d,"px"),i&&(g="translateX(".concat(f-o,"px)"))}break;case"left":case"right":switch(p=32,o=r.height/2-13,d=w.default(o,f,p),i=o<=f,s.top="0px",s.bottom="0px","left"===t?(u.left="calc(100% - 1px)",s.left="".concat(-9,"px"),s.transform="rotate(-90deg)"):(u.right="calc(100% - 1px)",s.right="".concat(-9,"px"),s.transform="rotate(90deg)"),n){case a.Justify.Start:u.top="".concat(d,"px"),i&&(g="translateY(-".concat(f-o,"px)"));break;case a.Justify.Middle:u.top="0px",u.bottom="0px";break;case a.Justify.Fit:u.top="".concat(d,"px"),i&&(g="translateY(-".concat(f-o,"px)"));break;case a.Justify.End:u.bottom="".concat(d,"px"),i&&(g="translateY(".concat(f-o,"px)"))}}return{notchContainer:l.css(q||(q=T(["\n position: absolute;\n width: ","px;\n height: ","px;\n overflow: hidden;\n margin: auto;\n pointer-events: none;\n ",";\n "])),c,c,l.css(u)),notch:l.css(A||(A=T(["\n ",";\n position: absolute;\n width: ","px;\n height: ","px; // Keep it square. Rotating is simpler\n margin: 0;\n "])),l.css(s),26,26),tooltip:l.css(J||(J=T(["\n min-width: ","px;\n transform: ",";\n "])),2*d+c,g)}}({align:e.align,justify:e.justify,triggerRect:e.referenceElPos}),n=t.notchContainer,r=t.notch,i=t.tooltip;return m.default.createElement(j.default,{darkMode:!xe},m.default.createElement("div",P({role:"tooltip"},ie,{id:me,className:l.cx(V,i,Q[Oe].tooltip,C({},W,Pe),o),ref:ye}),m.default.createElement("div",{className:l.cx(K,f.bodyTypeScaleStyles[fe],Q[Oe].children)},c),m.default.createElement("div",{className:n},m.default.createElement(F,{className:l.cx(r),fill:Q[Oe].notchFill}))))}));return s?"function"==typeof s?s(E(E({},je(d)),{},{className:$,"aria-describedby":Ce?me:void 0,children:Me})):m.default.cloneElement(s,E(E({},je(d,s.props)),{},{"aria-describedby":Ce?me:void 0,children:m.default.createElement(m.default.Fragment,null,s.props.children,Me),className:l.cx($,s.props.className)})):Me}te.displayName="Tooltip",te.propTypes={children:v.default.node,className:v.default.string,align:v.default.oneOf(Object.values(Z)),justify:v.default.oneOf(Object.values(a.Justify)),trigger:v.default.oneOfType([v.default.node,v.default.func]),triggerEvent:v.default.oneOf(Object.values(Y)),darkMode:v.default.bool,enabled:v.default.bool,open:v.default.bool,setOpen:v.default.func,id:v.default.string,shouldClose:v.default.func,usePortal:v.default.bool,portalClassName:v.default.string},Object.defineProperty(e,"Justify",{enumerable:!0,get:function(){return a.Justify}}),e.Align=Z,e.TriggerEvent=Y,e.default=te,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=index.js.map

2

package.json
{
"name": "@leafygreen-ui/tooltip",
"version": "9.0.1",
"version": "9.0.2",
"description": "LeafyGreen UI Kit Tooltip",

@@ -5,0 +5,0 @@ "main": "./dist/index.js",

dist/esm/index.js.map

Sorry, the diff of this file is not supported yet

dist/index.js.map

Sorry, the diff of this file is not supported yet

dist/Tooltip.d.ts.map

Sorry, the diff of this file is not supported yet

src/Tooltip.spec.tsx

Sorry, the diff of this file is not supported yet

src/Tooltip.tsx

Sorry, the diff of this file is not supported yet

tsconfig.tsbuildinfo

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc