@leafygreen-ui/popover
Advanced tools
Comparing version 8.0.0 to 8.0.1
# @leafygreen-ui/popover | ||
## 8.0.1 | ||
### Patch Changes | ||
- 3e7c00db: Adds back transition to popover open. Uses `getComputedStyle` to get content width instead of `getBoundingClientRect` and `offsetWidth`. | ||
## 8.0.0 | ||
@@ -4,0 +10,0 @@ |
@@ -1,2 +0,2 @@ | ||
import t,{useState as e,useMemo as n,Fragment as o}from"react";import r from"prop-types";import{Transition as i}from"react-transition-group";import{css as a,cx as c}from"@leafygreen-ui/emotion";import l from"@leafygreen-ui/portal";import{usePopoverContext as s,usePopoverPortalContainer as u}from"@leafygreen-ui/leafygreen-provider";import{useViewportSize as f,useMutationObserver as p,useObjectDependency as d,usePrevious as h,useIsomorphicLayoutEffect as g}from"@leafygreen-ui/hooks";import{consoleOnce as m}from"@leafygreen-ui/lib";import{jsx as w}from"@emotion/react";function y(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);e&&(o=o.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,o)}return n}function v(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?y(Object(n),!0).forEach((function(e){b(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):y(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function b(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function P(){return P=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},P.apply(this,arguments)}function E(t,e){if(null==t)return{};var n,o,r=function(t,e){if(null==t)return{};var n,o,r={},i=Object.keys(t);for(o=0;o<i.length;o++)n=i[o],e.indexOf(n)>=0||(r[n]=t[n]);return r}(t,e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);for(o=0;o<i.length;o++)n=i[o],e.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(t,n)&&(r[n]=t[n])}return r}function j(t,e){return e||(e=t.slice(0)),Object.freeze(Object.defineProperties(t,{raw:{value:Object.freeze(e)}}))}function O(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var o,r,i=[],a=!0,c=!1;try{for(n=n.call(t);!(a=(o=n.next()).done)&&(i.push(o.value),!e||i.length!==e);a=!0);}catch(t){c=!0,r=t}finally{try{a||null==n.return||n.return()}finally{if(c)throw r}}return i}(t,e)||S(t,e)||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 C(t){return function(t){if(Array.isArray(t))return x(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||S(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function S(t,e){if(t){if("string"==typeof t)return x(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?x(t,e):void 0}}function x(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,o=new Array(e);n<e;n++)o[n]=t[n];return o}var D,H,R,V,T,B,M,W,F={Top:"top",Bottom:"bottom",Left:"left",Right:"right",CenterVertical:"center-vertical",CenterHorizontal:"center-horizontal"},L={Start:"start",Middle:"middle",End:"end",Fit:"fit"};function z(t){var e=t.useRelativePositioning,n=t.spacing,o=t.align,r=t.justify,i=t.referenceElViewportPos,a=void 0===i?N:i,c=t.referenceElDocumentPos,l=void 0===c?N:c,s=t.contentElViewportPos,u=void 0===s?N:s,f=t.contentElDocumentPos,p=void 0===f?N:f,d=t.scrollContainer,h=t.windowHeight,g=void 0===h?window.innerHeight:h,m=t.windowWidth,w=void 0===m?window.innerWidth:m,y=d?d.offsetWidth:w,b=d?d.offsetHeight:g,P={windowWidth:y,windowHeight:b,referenceElViewportPos:a,contentElViewportPos:u,spacing:n};if(0===u.width&&r!==L.Fit)return{align:o,justify:r,positionCSS:{left:0,top:0}};var E=function(t,e){var n=e.spacing,o=e.windowWidth,r=e.windowHeight,i=e.contentElViewportPos,a=e.referenceElViewportPos;return[t].concat(C(et[t])).find((function(t){return[F.Top,F.Bottom,F.CenterVertical].includes(t)?tt({top:K({align:t,contentElPos:i,referenceElPos:a,spacing:n}),windowHeight:r,contentHeight:i.height}):!![F.Left,F.Right,F.CenterHorizontal].includes(t)&&_({left:Q({align:t,contentElPos:i,referenceElPos:a,spacing:n}),windowWidth:o,contentWidth:i.width})}))||t}(o,P),j=function(t,e,n){var o,r,i=n.spacing,a=n.windowWidth,c=n.windowHeight,l=n.contentElViewportPos,s=n.referenceElViewportPos,u=[t].concat(C(nt[t]));switch(e){case F.Top:case F.Bottom:case F.CenterVertical:return null!==(o=u.find((function(t){return _({contentWidth:t===L.Fit?s.width:l.width,windowWidth:a,left:Q({contentElPos:l,referenceElPos:s,spacing:i,align:e,justify:t})})})))&&void 0!==o?o:nt[t][0];case F.Left:case F.Right:case F.CenterHorizontal:return null!==(r=u.find((function(t){return tt({contentHeight:t===L.Fit?s.height:l.height,windowHeight:c,top:K({contentElPos:l,referenceElPos:s,spacing:i,align:e,justify:t})})})))&&void 0!==r?r:nt[t][0]}}(r,E,P),O=function(t){var e,n,o=t.align,r=t.justify,i=X[o],a=null!==(e=i.x)&&void 0!==e?e:U[r],c=null!==(n=i.y)&&void 0!==n?n:Z[r];return"".concat(a," ").concat(c)}({align:E,justify:j}),S=function(t,e){var n=.8;switch(t){case F.Top:return"translate3d(0, ".concat(e,"px, 0) scale(").concat(n,")");case F.Bottom:return"translate3d(0, -".concat(e,"px, 0) scale(").concat(n,")");case F.Left:return"translate3d(".concat(e,"px, 0, 0) scale(").concat(n,")");case F.Right:return"translate3d(-".concat(e,"px, 0, 0) scale(").concat(n,")");case F.CenterHorizontal:case F.CenterVertical:return"scale(".concat(n,")")}}(E,n);return e?{align:E,justify:j,positionCSS:v(v({},G({align:E,justify:j,referenceElDocumentPos:l,contentElDocumentPos:p,spacing:n})),{},{transformOrigin:O,transform:S})}:{align:E,justify:j,positionCSS:v(v({},J({align:E,justify:j,referenceElDocumentPos:l,contentElDocumentPos:p,spacing:n,windowHeight:b,windowWidth:y})),{},{transformOrigin:O,transform:S})}}var N={top:0,bottom:0,left:0,right:0,height:0,width:0},A=function(t,e){return Math.abs(t-e)<1?t:e};function I(t,e){if(!t)return N;var n=t.getBoundingClientRect(),o=n.top,r=n.bottom,i=n.left,a=n.right,c=n.width,l=t.offsetHeight,s=t.offsetWidth,u=A(c,s);if(e){var f=e.scrollTop,p=e.scrollLeft,d=e.getBoundingClientRect();return{top:o+f-d.top,bottom:r+f-d.bottom,left:i+p-d.left,right:a+p-d.right,height:l,width:u}}var h=window,g=h.scrollX,m=h.scrollY;return{top:o+m,bottom:r+m,left:i+g,right:a+g,height:l,width:u}}function k(t,e){if(!t)return N;var n=t.getBoundingClientRect(),o=n.top,r=n.bottom,i=n.left,a=n.right,c=n.width,l=t.offsetHeight,s=t.offsetWidth,u=A(c,s);if(e){var f=e.getBoundingClientRect();return{top:o-f.top,bottom:r-f.bottom,left:i-f.left,right:a-f.right,height:l,width:u}}return{top:o,bottom:r,left:i,right:a,height:l,width:u}}var Z=(b(D={},L.Start,"top"),b(D,L.Middle,"center"),b(D,L.End,"bottom"),b(D,L.Fit,"center"),D),U=(b(H={},L.Start,"left"),b(H,L.Middle,"center"),b(H,L.End,"right"),b(H,L.Fit,"center"),H),X=(b(R={},F.Left,{x:"right"}),b(R,F.Right,{x:"left"}),b(R,F.Top,{y:"bottom"}),b(R,F.Bottom,{y:"top"}),b(R,F.CenterHorizontal,{x:"center"}),b(R,F.CenterVertical,{y:"center"}),R);var Y=(b(V={},L.Start,{top:0}),b(V,L.End,{bottom:0}),b(V,L.Middle,(function(t){var e=t.contentElDocumentPos,n=t.referenceElDocumentPos;return{top:"".concat(n.height/2-e.height/2,"px")}})),b(V,L.Fit,{top:0,bottom:0}),V),$=(b(T={},L.Start,{left:0}),b(T,L.End,{right:0}),b(T,L.Middle,(function(t){var e=t.contentElDocumentPos,n=t.referenceElDocumentPos;return{left:"".concat(n.width/2-e.width/2,"px")}})),b(T,L.Fit,{left:0,right:0}),T),q=(b(B={},F.Top,{constant:function(t){var e=t.spacing;return{bottom:"calc(100% + ".concat(e,"px)")}},justifyPositions:$}),b(B,F.Bottom,{constant:function(t){var e=t.spacing;return{top:"calc(100% + ".concat(e,"px)")}},justifyPositions:$}),b(B,F.CenterVertical,{constant:function(t){var e=t.referenceElDocumentPos;return{top:"calc(".concat(e.height/2,"px - 50%)")}},justifyPositions:$}),b(B,F.Left,{constant:function(t){var e=t.spacing;return{right:"calc(100% + ".concat(e,"px)")}},justifyPositions:Y}),b(B,F.Right,{constant:function(t){var e=t.spacing;return{left:"calc(100% + ".concat(e,"px)")}},justifyPositions:Y}),b(B,F.CenterHorizontal,{constant:function(t){var e=t.referenceElDocumentPos;return{left:"calc(".concat(e.width/2,"px - 50%)")}},justifyPositions:Y}),B);function G(t){var e,n=t.align,o=t.justify,r=t.referenceElDocumentPos,i=t.contentElDocumentPos,a=t.spacing,c=q[n],l=c.justifyPositions[o],s={contentElDocumentPos:i,referenceElDocumentPos:r,spacing:a};return v(v({},null===(e=c.constant)||void 0===e?void 0:e.call(c,s)),"function"==typeof l?l(s):l)}function J(t){var e=t.align,n=t.justify,o=t.referenceElDocumentPos,r=t.contentElDocumentPos,i=t.spacing,a=t.windowWidth,c=t.windowHeight,l=Q({align:e,justify:n,referenceElPos:o,contentElPos:r,spacing:i}),s="".concat(l,"px"),u="".concat(K({align:e,justify:n,referenceElPos:o,contentElPos:r,spacing:i}),"px");return n!==L.Fit?{left:s,top:u}:[F.Left,F.Right,F.CenterHorizontal].includes(e)?{left:s,top:u,bottom:"".concat(c-o.bottom,"px")}:{left:s,top:u,right:"".concat(a-(l+o.width),"px")}}function K(t){var e=t.align,n=t.justify,o=t.contentElPos,r=t.referenceElPos,i=t.spacing;switch(e){case F.Left:case F.Right:case F.CenterHorizontal:switch(n){case L.Start:case L.Fit:return r.top;case L.End:return r.top+r.height-o.height;default:return r.top-(o.height-r.height)/2}case F.CenterVertical:return r.top-(o.height-r.height)/2;case F.Top:return r.top-o.height-i;case F.Bottom:default:return r.top+r.height+i}}function Q(t){var e=t.align,n=t.justify,o=t.contentElPos,r=t.referenceElPos,i=t.spacing;switch(e){case F.Top:case F.Bottom:case F.CenterVertical:switch(n){case L.End:return r.left+r.width-o.width;case L.Middle:return r.left-(o.width-r.width)/2;default:return r.left}case F.Left:return r.left-o.width-i;case F.Right:return r.left+r.width+i;case F.CenterHorizontal:default:return r.left-(o.width-r.width)/2}}function _(t){var e=t.left,n=t.windowWidth,o=t.contentWidth;return e>=0&&!(e+o>n)}function tt(t){var e=t.top,n=t.windowHeight,o=t.contentHeight;return e>=0&&!(e+o>n)}var et=(b(M={},F.Top,[F.Bottom]),b(M,F.Bottom,[F.Top]),b(M,F.Left,[F.Right]),b(M,F.Right,[F.Left]),b(M,F.CenterHorizontal,[F.Left,F.Right]),b(M,F.CenterVertical,[F.Top,F.Bottom]),M);var nt=(b(W={},L.Start,[L.End,L.Middle]),b(W,L.Middle,[L.End,L.Start]),b(W,L.End,[L.Start,L.Middle]),b(W,L.Fit,[L.Middle,L.Start,L.End]),W);var ot,rt,it,at,ct=["active","spacing","align","justify","adjustOnMutation","children","className","popoverZIndex","refEl","usePortal","portalClassName","portalContainer","scrollContainer"],lt=["transform"],st=a(ot||(ot=j(["\n position: absolute;\n transition: transform 150ms ease-in-out, opacity 150ms ease-in-out;\n opacity: 0;\n"]))),ut={attributes:!0,characterData:!0,childList:!0,subtree:!0};function ft(r){var y=r.active,v=void 0!==y&&y,C=r.spacing,S=void 0===C?10:C,x=r.align,D=void 0===x?F.Bottom:x,H=r.justify,R=void 0===H?L.Start:H,V=r.adjustOnMutation,T=void 0!==V&&V,B=r.children,M=r.className,W=r.popoverZIndex,N=r.refEl,A=r.usePortal,Z=void 0===A||A,U=r.portalClassName,X=r.portalContainer,Y=r.scrollContainer,$=E(r,ct),q=O(e(null),2),G=q[0],J=q[1],K=O(e(null),2),Q=K[0],_=K[1],tt=O(e(0),2),et=tt[0],nt=tt[1],ot=s().setIsPopoverOpen,ft=u(),pt=ft.portalContainer,dt=ft.scrollContainer;pt=X||pt,dt=Y||dt,Z&&dt&&(dt.contains(pt)||m.warn("To ensure correct positioning make sure that the portalContainer element is inside of the scrollContainer"));var ht=t.useRef(Q);ht.current=Q;var gt=null;if(N&&N.current)gt=N.current;else if(G){var mt=G.parentNode;mt&&mt instanceof HTMLElement&&(gt=mt)}var wt=f(),yt=T&&v,vt=p(gt,ut,Date.now,yt),bt=p(Q,ut,Date.now,yt),Pt=d(k(gt,dt)),Et=d(k(Q,dt)),jt=d(n((function(){return I(gt,dt)}),[gt,dt,wt,vt,v,D,R,et])),Ot=d(n((function(){return I(Q)}),[Q,wt,bt,v,D,R,et])),Ct=h(R),St=h(D),xt=Ct!==R&&(R===L.Fit||Ct===L.Fit)||St!==D&&R===L.Fit;g((function(){xt&&nt((function(t){return t+1}))}),[xt]);var Dt=O(e(!1),2),Ht=Dt[0],Rt=Dt[1];if(g((function(){return Rt(!0)}),[]),!Ht)return null;var Vt,Tt=z({useRelativePositioning:!Z,spacing:S,align:D,justify:R,referenceElViewportPos:Pt,referenceElDocumentPos:jt,contentElViewportPos:Et,contentElDocumentPos:Ot,scrollContainer:dt}),Bt=Tt.align,Mt=Tt.justify,Wt=Tt.positionCSS,Ft=Wt.transform,Lt=E(Wt,lt),zt=a(rt||(rt=j(["\n opacity: 1;\n position: ",";\n pointer-events: initial;\n "])),Z?"":"absolute"),Nt=Z?l:o,At=Z?pt?{container:pt}:{className:null!=U?U:void 0}:{};return Vt=null==B?null:"function"==typeof B?B({align:Bt,justify:Mt,referenceElPos:jt}):B,w(i,{nodeRef:ht,in:v,timeout:150,mountOnEnter:!0,unmountOnExit:!0,appear:!0,onEntered:function(){return ot(!0)},onExit:function(){return ot(!1)}},(function(e){var n;return w(t.Fragment,null,w("div",{ref:J,className:a(it||(it=j(["\n display: none;\n "])))}),w(Nt,At,w("div",P({},$,{className:c(st,a(Lt),(n={},b(n,a({transform:Ft}),"entering"===e||"exiting"===e),b(n,zt,"entered"===e),b(n,a(at||(at=j(["\n z-index: ",";\n "])),W),"number"==typeof W),n),M)}),w("div",{ref:_},Vt))))}))}ft.displayName="Popover",ft.propTypes={children:r.oneOfType([r.node,r.func]),active:r.bool,className:r.string,align:r.oneOf(Object.values(F)),justify:r.oneOf(Object.values(L)),refEl:r.shape({current:"undefined"!=typeof window?r.instanceOf(Element):r.any}),usePortal:r.bool,portalClassName:r.string,spacing:r.number,adjustOnMutation:r.bool};export{F as Align,L as Justify,ft as default}; | ||
import t,{useState as e,useMemo as n,Fragment as o}from"react";import r from"prop-types";import{Transition as i}from"react-transition-group";import{css as a,cx as c}from"@leafygreen-ui/emotion";import l from"@leafygreen-ui/portal";import{usePopoverContext as s,usePopoverPortalContainer as u}from"@leafygreen-ui/leafygreen-provider";import{useViewportSize as f,useMutationObserver as p,useObjectDependency as d,usePrevious as h,useIsomorphicLayoutEffect as g}from"@leafygreen-ui/hooks";import{consoleOnce as m}from"@leafygreen-ui/lib";import{jsx as w}from"@emotion/react";function v(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);e&&(o=o.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,o)}return n}function y(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?v(Object(n),!0).forEach((function(e){b(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):v(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function b(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function P(){return P=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},P.apply(this,arguments)}function E(t,e){if(null==t)return{};var n,o,r=function(t,e){if(null==t)return{};var n,o,r={},i=Object.keys(t);for(o=0;o<i.length;o++)n=i[o],e.indexOf(n)>=0||(r[n]=t[n]);return r}(t,e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);for(o=0;o<i.length;o++)n=i[o],e.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(t,n)&&(r[n]=t[n])}return r}function j(t,e){return e||(e=t.slice(0)),Object.freeze(Object.defineProperties(t,{raw:{value:Object.freeze(e)}}))}function O(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var o,r,i=[],a=!0,c=!1;try{for(n=n.call(t);!(a=(o=n.next()).done)&&(i.push(o.value),!e||i.length!==e);a=!0);}catch(t){c=!0,r=t}finally{try{a||null==n.return||n.return()}finally{if(c)throw r}}return i}(t,e)||S(t,e)||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 C(t){return function(t){if(Array.isArray(t))return x(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||S(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function S(t,e){if(t){if("string"==typeof t)return x(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?x(t,e):void 0}}function x(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,o=new Array(e);n<e;n++)o[n]=t[n];return o}var D,H,R,V,T,F,M,B,L={Top:"top",Bottom:"bottom",Left:"left",Right:"right",CenterVertical:"center-vertical",CenterHorizontal:"center-horizontal"},z={Start:"start",Middle:"middle",End:"end",Fit:"fit"};function N(t){var e=t.useRelativePositioning,n=t.spacing,o=t.align,r=t.justify,i=t.referenceElViewportPos,a=void 0===i?W:i,c=t.referenceElDocumentPos,l=void 0===c?W:c,s=t.contentElViewportPos,u=void 0===s?W:s,f=t.contentElDocumentPos,p=void 0===f?W:f,d=t.scrollContainer,h=t.windowHeight,g=void 0===h?window.innerHeight:h,m=t.windowWidth,w=void 0===m?window.innerWidth:m,v=d?d.offsetWidth:w,b=d?d.offsetHeight:g,P={windowWidth:v,windowHeight:b,referenceElViewportPos:a,contentElViewportPos:u,spacing:n},E=function(t,e){var n=e.spacing,o=e.windowWidth,r=e.windowHeight,i=e.contentElViewportPos,a=e.referenceElViewportPos;return[t].concat(C(et[t])).find((function(t){return[L.Top,L.Bottom,L.CenterVertical].includes(t)?tt({top:K({align:t,contentElPos:i,referenceElPos:a,spacing:n}),windowHeight:r,contentHeight:i.height}):!![L.Left,L.Right,L.CenterHorizontal].includes(t)&&_({left:Q({align:t,contentElPos:i,referenceElPos:a,spacing:n}),windowWidth:o,contentWidth:i.width})}))||t}(o,P),j=function(t,e,n){var o,r,i=n.spacing,a=n.windowWidth,c=n.windowHeight,l=n.contentElViewportPos,s=n.referenceElViewportPos,u=[t].concat(C(nt[t]));switch(e){case L.Top:case L.Bottom:case L.CenterVertical:return null!==(o=u.find((function(t){return _({contentWidth:t===z.Fit?s.width:l.width,windowWidth:a,left:Q({contentElPos:l,referenceElPos:s,spacing:i,align:e,justify:t})})})))&&void 0!==o?o:nt[t][0];case L.Left:case L.Right:case L.CenterHorizontal:return null!==(r=u.find((function(t){return tt({contentHeight:t===z.Fit?s.height:l.height,windowHeight:c,top:K({contentElPos:l,referenceElPos:s,spacing:i,align:e,justify:t})})})))&&void 0!==r?r:nt[t][0]}}(r,E,P),O=function(t){var e,n,o=t.align,r=t.justify,i=X[o],a=null!==(e=i.x)&&void 0!==e?e:U[r],c=null!==(n=i.y)&&void 0!==n?n:Z[r];return"".concat(a," ").concat(c)}({align:E,justify:j}),S=function(t,e){var n=.8;switch(t){case L.Top:return"translate3d(0, ".concat(e,"px, 0) scale(").concat(n,")");case L.Bottom:return"translate3d(0, -".concat(e,"px, 0) scale(").concat(n,")");case L.Left:return"translate3d(".concat(e,"px, 0, 0) scale(").concat(n,")");case L.Right:return"translate3d(-".concat(e,"px, 0, 0) scale(").concat(n,")");case L.CenterHorizontal:case L.CenterVertical:return"scale(".concat(n,")")}}(E,n);return 0===Math.floor(u.width)&&r!==z.Fit?{align:o,justify:r,positionCSS:{left:0,top:0,transform:S,transformOrigin:O}}:e?{align:E,justify:j,positionCSS:y(y({},G({align:E,justify:j,referenceElDocumentPos:l,contentElDocumentPos:p,spacing:n})),{},{transformOrigin:O,transform:S})}:{align:E,justify:j,positionCSS:y(y({},J({align:E,justify:j,referenceElDocumentPos:l,contentElDocumentPos:p,spacing:n,windowHeight:b,windowWidth:v})),{},{transformOrigin:O,transform:S})}}var W={top:0,bottom:0,left:0,right:0,height:0,width:0},A=function(t){var e=t.getBoundingClientRect();return{top:e.top,bottom:e.bottom,left:e.left,right:e.right,height:t.offsetHeight,width:parseFloat(getComputedStyle(t).width)}};function I(t,e){if(!t)return W;var n=A(t),o=n.top,r=n.bottom,i=n.left,a=n.right,c=n.height,l=n.width;if(e){var s=e.scrollTop,u=e.scrollLeft,f=e.getBoundingClientRect();return{top:o+s-f.top,bottom:r+s-f.bottom,left:i+u-f.left,right:a+u-f.right,height:c,width:l}}var p=window,d=p.scrollX,h=p.scrollY;return{top:o+h,bottom:r+h,left:i+d,right:a+d,height:c,width:l}}function k(t,e){if(!t)return W;var n=A(t),o=n.top,r=n.bottom,i=n.left,a=n.right,c=n.height,l=n.width;if(e){var s=e.getBoundingClientRect();return{top:o-s.top,bottom:r-s.bottom,left:i-s.left,right:a-s.right,height:c,width:l}}return{top:o,bottom:r,left:i,right:a,height:c,width:l}}var Z=(b(D={},z.Start,"top"),b(D,z.Middle,"center"),b(D,z.End,"bottom"),b(D,z.Fit,"center"),D),U=(b(H={},z.Start,"left"),b(H,z.Middle,"center"),b(H,z.End,"right"),b(H,z.Fit,"center"),H),X=(b(R={},L.Left,{x:"right"}),b(R,L.Right,{x:"left"}),b(R,L.Top,{y:"bottom"}),b(R,L.Bottom,{y:"top"}),b(R,L.CenterHorizontal,{x:"center"}),b(R,L.CenterVertical,{y:"center"}),R);var Y=(b(V={},z.Start,{top:0}),b(V,z.End,{bottom:0}),b(V,z.Middle,(function(t){var e=t.contentElDocumentPos,n=t.referenceElDocumentPos;return{top:"".concat(n.height/2-e.height/2,"px")}})),b(V,z.Fit,{top:0,bottom:0}),V),$=(b(T={},z.Start,{left:0}),b(T,z.End,{right:0}),b(T,z.Middle,(function(t){var e=t.contentElDocumentPos,n=t.referenceElDocumentPos;return{left:"".concat(n.width/2-e.width/2,"px")}})),b(T,z.Fit,{left:0,right:0}),T),q=(b(F={},L.Top,{constant:function(t){var e=t.spacing;return{bottom:"calc(100% + ".concat(e,"px)")}},justifyPositions:$}),b(F,L.Bottom,{constant:function(t){var e=t.spacing;return{top:"calc(100% + ".concat(e,"px)")}},justifyPositions:$}),b(F,L.CenterVertical,{constant:function(t){var e=t.referenceElDocumentPos;return{top:"calc(".concat(e.height/2,"px - 50%)")}},justifyPositions:$}),b(F,L.Left,{constant:function(t){var e=t.spacing;return{right:"calc(100% + ".concat(e,"px)")}},justifyPositions:Y}),b(F,L.Right,{constant:function(t){var e=t.spacing;return{left:"calc(100% + ".concat(e,"px)")}},justifyPositions:Y}),b(F,L.CenterHorizontal,{constant:function(t){var e=t.referenceElDocumentPos;return{left:"calc(".concat(e.width/2,"px - 50%)")}},justifyPositions:Y}),F);function G(t){var e,n=t.align,o=t.justify,r=t.referenceElDocumentPos,i=t.contentElDocumentPos,a=t.spacing,c=q[n],l=c.justifyPositions[o],s={contentElDocumentPos:i,referenceElDocumentPos:r,spacing:a};return y(y({},null===(e=c.constant)||void 0===e?void 0:e.call(c,s)),"function"==typeof l?l(s):l)}function J(t){var e=t.align,n=t.justify,o=t.referenceElDocumentPos,r=t.contentElDocumentPos,i=t.spacing,a=t.windowWidth,c=t.windowHeight,l=Q({align:e,justify:n,referenceElPos:o,contentElPos:r,spacing:i}),s="".concat(l,"px"),u="".concat(K({align:e,justify:n,referenceElPos:o,contentElPos:r,spacing:i}),"px");return n!==z.Fit?{left:s,top:u}:[L.Left,L.Right,L.CenterHorizontal].includes(e)?{left:s,top:u,bottom:"".concat(c-o.bottom,"px")}:{left:s,top:u,right:"".concat(a-(l+o.width),"px")}}function K(t){var e=t.align,n=t.justify,o=t.contentElPos,r=t.referenceElPos,i=t.spacing;switch(e){case L.Left:case L.Right:case L.CenterHorizontal:switch(n){case z.Start:case z.Fit:return r.top;case z.End:return r.top+r.height-o.height;default:return r.top-(o.height-r.height)/2}case L.CenterVertical:return r.top-(o.height-r.height)/2;case L.Top:return r.top-o.height-i;case L.Bottom:default:return r.top+r.height+i}}function Q(t){var e=t.align,n=t.justify,o=t.contentElPos,r=t.referenceElPos,i=t.spacing;switch(e){case L.Top:case L.Bottom:case L.CenterVertical:switch(n){case z.End:return r.left+r.width-o.width;case z.Middle:return r.left-(o.width-r.width)/2;default:return r.left}case L.Left:return r.left-o.width-i;case L.Right:return r.left+r.width+i;case L.CenterHorizontal:default:return r.left-(o.width-r.width)/2}}function _(t){var e=t.left,n=t.windowWidth,o=t.contentWidth;return e>=0&&!(e+o>n)}function tt(t){var e=t.top,n=t.windowHeight,o=t.contentHeight;return e>=0&&!(e+o>n)}var et=(b(M={},L.Top,[L.Bottom]),b(M,L.Bottom,[L.Top]),b(M,L.Left,[L.Right]),b(M,L.Right,[L.Left]),b(M,L.CenterHorizontal,[L.Left,L.Right]),b(M,L.CenterVertical,[L.Top,L.Bottom]),M);var nt=(b(B={},z.Start,[z.End,z.Middle]),b(B,z.Middle,[z.End,z.Start]),b(B,z.End,[z.Start,z.Middle]),b(B,z.Fit,[z.Middle,z.Start,z.End]),B);var ot,rt,it,at,ct=["active","spacing","align","justify","adjustOnMutation","children","className","popoverZIndex","refEl","usePortal","portalClassName","portalContainer","scrollContainer"],lt=["transform"],st=a(ot||(ot=j(["\n position: absolute;\n transition: transform 150ms ease-in-out, opacity 150ms ease-in-out;\n opacity: 0;\n"]))),ut={attributes:!0,characterData:!0,childList:!0,subtree:!0};function ft(r){var v=r.active,y=void 0!==v&&v,C=r.spacing,S=void 0===C?10:C,x=r.align,D=void 0===x?L.Bottom:x,H=r.justify,R=void 0===H?z.Start:H,V=r.adjustOnMutation,T=void 0!==V&&V,F=r.children,M=r.className,B=r.popoverZIndex,W=r.refEl,A=r.usePortal,Z=void 0===A||A,U=r.portalClassName,X=r.portalContainer,Y=r.scrollContainer,$=E(r,ct),q=O(e(null),2),G=q[0],J=q[1],K=O(e(null),2),Q=K[0],_=K[1],tt=O(e(0),2),et=tt[0],nt=tt[1],ot=s().setIsPopoverOpen,ft=u(),pt=ft.portalContainer,dt=ft.scrollContainer;pt=X||pt,dt=Y||dt,Z&&dt&&(dt.contains(pt)||m.warn("To ensure correct positioning make sure that the portalContainer element is inside of the scrollContainer"));var ht=t.useRef(Q);ht.current=Q;var gt=null;if(W&&W.current)gt=W.current;else if(G){var mt=G.parentNode;mt&&mt instanceof HTMLElement&&(gt=mt)}var wt=f(),vt=T&&y,yt=p(gt,ut,Date.now,vt),bt=p(null==Q?void 0:Q.parentNode,ut,Date.now,vt),Pt=d(k(gt,dt)),Et=d(k(null==Q?void 0:Q.parentNode,dt)),jt=d(n((function(){return I(gt,dt)}),[gt,dt,wt,yt,y,D,R,et])),Ot=d(n((function(){return I(Q)}),[null==Q?void 0:Q.parentNode,wt,bt,y,D,R,et])),Ct=h(R),St=h(D),xt=Ct!==R&&(R===z.Fit||Ct===z.Fit)||St!==D&&R===z.Fit;g((function(){xt&&nt((function(t){return t+1}))}),[xt]);var Dt=O(e(!1),2),Ht=Dt[0],Rt=Dt[1];if(g((function(){return Rt(!0)}),[]),!Ht)return null;var Vt,Tt=N({useRelativePositioning:!Z,spacing:S,align:D,justify:R,referenceElViewportPos:Pt,referenceElDocumentPos:jt,contentElViewportPos:Et,contentElDocumentPos:Ot,scrollContainer:dt}),Ft=Tt.align,Mt=Tt.justify,Bt=Tt.positionCSS,Lt=Bt.transform,zt=E(Bt,lt),Nt=a(rt||(rt=j(["\n opacity: 1;\n position: ",";\n pointer-events: initial;\n "])),Z?"":"absolute"),Wt=Z?l:o,At=Z?pt?{container:pt}:{className:null!=U?U:void 0}:{};return Vt=null==F?null:"function"==typeof F?F({align:Ft,justify:Mt,referenceElPos:jt}):F,w(i,{nodeRef:ht,in:y,timeout:150,mountOnEnter:!0,unmountOnExit:!0,appear:!0,onEntered:function(){return ot(!0)},onExit:function(){return ot(!1)}},(function(e){var n;return w(t.Fragment,null,w("div",{ref:J,className:a(it||(it=j(["\n display: none;\n "])))}),w(Wt,At,w("div",P({},$,{className:c(st,a(zt),(n={},b(n,a({transform:Lt}),"entering"===e||"exiting"===e),b(n,Nt,"entered"===e),b(n,a(at||(at=j(["\n z-index: ",";\n "])),B),"number"==typeof B),n),M)}),w("div",{ref:_},Vt))))}))}ft.displayName="Popover",ft.propTypes={children:r.oneOfType([r.node,r.func]),active:r.bool,className:r.string,align:r.oneOf(Object.values(L)),justify:r.oneOf(Object.values(z)),refEl:r.shape({current:"undefined"!=typeof window?r.instanceOf(Element):r.any}),usePortal:r.bool,portalClassName:r.string,spacing:r.number,adjustOnMutation:r.bool};export{L as Align,z as Justify,ft as default}; | ||
//# sourceMappingURL=index.js.map |
@@ -1,2 +0,2 @@ | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("prop-types"),require("react-transition-group"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/portal"),require("@leafygreen-ui/leafygreen-provider"),require("@leafygreen-ui/hooks"),require("@leafygreen-ui/lib"),require("@emotion/react")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","react-transition-group","@leafygreen-ui/emotion","@leafygreen-ui/portal","@leafygreen-ui/leafygreen-provider","@leafygreen-ui/hooks","@leafygreen-ui/lib","@emotion/react"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self)["@leafygreen-ui/popover"]={},t.React,t.PropTypes,t.reactTransitionGroup,t["@leafygreen-ui/emotion"],t["@leafygreen-ui/portal"],t["@leafygreen-ui/leafygreen-provider"],t["@leafygreen-ui/hooks"],t["@leafygreen-ui/lib"],t.react)}(this,(function(t,e,n,r,o,i,a,c,l,s){"use strict";function u(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var f=u(e),d=u(n),p=u(i);function g(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}function h(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?g(Object(n),!0).forEach((function(e){y(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):g(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function y(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function m(){return m=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},m.apply(this,arguments)}function v(t,e){if(null==t)return{};var n,r,o=function(t,e){if(null==t)return{};var n,r,o={},i=Object.keys(t);for(r=0;r<i.length;r++)n=i[r],e.indexOf(n)>=0||(o[n]=t[n]);return o}(t,e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);for(r=0;r<i.length;r++)n=i[r],e.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(t,n)&&(o[n]=t[n])}return o}function w(t,e){return e||(e=t.slice(0)),Object.freeze(Object.defineProperties(t,{raw:{value:Object.freeze(e)}}))}function b(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var r,o,i=[],a=!0,c=!1;try{for(n=n.call(t);!(a=(r=n.next()).done)&&(i.push(r.value),!e||i.length!==e);a=!0);}catch(t){c=!0,o=t}finally{try{a||null==n.return||n.return()}finally{if(c)throw o}}return i}(t,e)||E(t,e)||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 P(t){return function(t){if(Array.isArray(t))return j(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||E(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function E(t,e){if(t){if("string"==typeof t)return j(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?j(t,e):void 0}}function j(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}var O,C,x,S,D,H,T,M,R={Top:"top",Bottom:"bottom",Left:"left",Right:"right",CenterVertical:"center-vertical",CenterHorizontal:"center-horizontal"},V={Start:"start",Middle:"middle",End:"end",Fit:"fit"};function L(t){var e=t.useRelativePositioning,n=t.spacing,r=t.align,o=t.justify,i=t.referenceElViewportPos,a=void 0===i?B:i,c=t.referenceElDocumentPos,l=void 0===c?B:c,s=t.contentElViewportPos,u=void 0===s?B:s,f=t.contentElDocumentPos,d=void 0===f?B:f,p=t.scrollContainer,g=t.windowHeight,y=void 0===g?window.innerHeight:g,m=t.windowWidth,v=void 0===m?window.innerWidth:m,w=p?p.offsetWidth:v,b=p?p.offsetHeight:y,E={windowWidth:w,windowHeight:b,referenceElViewportPos:a,contentElViewportPos:u,spacing:n};if(0===u.width&&o!==V.Fit)return{align:r,justify:o,positionCSS:{left:0,top:0}};var j=function(t,e){var n=e.spacing,r=e.windowWidth,o=e.windowHeight,i=e.contentElViewportPos,a=e.referenceElViewportPos;return[t].concat(P($[t])).find((function(t){return[R.Top,R.Bottom,R.CenterVertical].includes(t)?Y({top:J({align:t,contentElPos:i,referenceElPos:a,spacing:n}),windowHeight:o,contentHeight:i.height}):!![R.Left,R.Right,R.CenterHorizontal].includes(t)&&X({left:U({align:t,contentElPos:i,referenceElPos:a,spacing:n}),windowWidth:r,contentWidth:i.width})}))||t}(r,E),O=function(t,e,n){var r,o,i=n.spacing,a=n.windowWidth,c=n.windowHeight,l=n.contentElViewportPos,s=n.referenceElViewportPos,u=[t].concat(P(K[t]));switch(e){case R.Top:case R.Bottom:case R.CenterVertical:return null!==(r=u.find((function(t){return X({contentWidth:t===V.Fit?s.width:l.width,windowWidth:a,left:U({contentElPos:l,referenceElPos:s,spacing:i,align:e,justify:t})})})))&&void 0!==r?r:K[t][0];case R.Left:case R.Right:case R.CenterHorizontal:return null!==(o=u.find((function(t){return Y({contentHeight:t===V.Fit?s.height:l.height,windowHeight:c,top:J({contentElPos:l,referenceElPos:s,spacing:i,align:e,justify:t})})})))&&void 0!==o?o:K[t][0]}}(o,j,E),C=function(t){var e,n,r=t.align,o=t.justify,i=A[r],a=null!==(e=i.x)&&void 0!==e?e:N[o],c=null!==(n=i.y)&&void 0!==n?n:I[o];return"".concat(a," ").concat(c)}({align:j,justify:O}),x=function(t,e){var n=.8;switch(t){case R.Top:return"translate3d(0, ".concat(e,"px, 0) scale(").concat(n,")");case R.Bottom:return"translate3d(0, -".concat(e,"px, 0) scale(").concat(n,")");case R.Left:return"translate3d(".concat(e,"px, 0, 0) scale(").concat(n,")");case R.Right:return"translate3d(-".concat(e,"px, 0, 0) scale(").concat(n,")");case R.CenterHorizontal:case R.CenterVertical:return"scale(".concat(n,")")}}(j,n);return e?{align:j,justify:O,positionCSS:h(h({},_({align:j,justify:O,referenceElDocumentPos:l,contentElDocumentPos:d,spacing:n})),{},{transformOrigin:C,transform:x})}:{align:j,justify:O,positionCSS:h(h({},G({align:j,justify:O,referenceElDocumentPos:l,contentElDocumentPos:d,spacing:n,windowHeight:b,windowWidth:w})),{},{transformOrigin:C,transform:x})}}var B={top:0,bottom:0,left:0,right:0,height:0,width:0},F=function(t,e){return Math.abs(t-e)<1?t:e};function W(t,e){if(!t)return B;var n=t.getBoundingClientRect(),r=n.top,o=n.bottom,i=n.left,a=n.right,c=n.width,l=t.offsetHeight,s=t.offsetWidth,u=F(c,s);if(e){var f=e.scrollTop,d=e.scrollLeft,p=e.getBoundingClientRect();return{top:r+f-p.top,bottom:o+f-p.bottom,left:i+d-p.left,right:a+d-p.right,height:l,width:u}}var g=window,h=g.scrollX,y=g.scrollY;return{top:r+y,bottom:o+y,left:i+h,right:a+h,height:l,width:u}}function z(t,e){if(!t)return B;var n=t.getBoundingClientRect(),r=n.top,o=n.bottom,i=n.left,a=n.right,c=n.width,l=t.offsetHeight,s=t.offsetWidth,u=F(c,s);if(e){var f=e.getBoundingClientRect();return{top:r-f.top,bottom:o-f.bottom,left:i-f.left,right:a-f.right,height:l,width:u}}return{top:r,bottom:o,left:i,right:a,height:l,width:u}}var I=(y(O={},V.Start,"top"),y(O,V.Middle,"center"),y(O,V.End,"bottom"),y(O,V.Fit,"center"),O),N=(y(C={},V.Start,"left"),y(C,V.Middle,"center"),y(C,V.End,"right"),y(C,V.Fit,"center"),C),A=(y(x={},R.Left,{x:"right"}),y(x,R.Right,{x:"left"}),y(x,R.Top,{y:"bottom"}),y(x,R.Bottom,{y:"top"}),y(x,R.CenterHorizontal,{x:"center"}),y(x,R.CenterVertical,{y:"center"}),x);var q=(y(S={},V.Start,{top:0}),y(S,V.End,{bottom:0}),y(S,V.Middle,(function(t){var e=t.contentElDocumentPos,n=t.referenceElDocumentPos;return{top:"".concat(n.height/2-e.height/2,"px")}})),y(S,V.Fit,{top:0,bottom:0}),S),k=(y(D={},V.Start,{left:0}),y(D,V.End,{right:0}),y(D,V.Middle,(function(t){var e=t.contentElDocumentPos,n=t.referenceElDocumentPos;return{left:"".concat(n.width/2-e.width/2,"px")}})),y(D,V.Fit,{left:0,right:0}),D),Z=(y(H={},R.Top,{constant:function(t){var e=t.spacing;return{bottom:"calc(100% + ".concat(e,"px)")}},justifyPositions:k}),y(H,R.Bottom,{constant:function(t){var e=t.spacing;return{top:"calc(100% + ".concat(e,"px)")}},justifyPositions:k}),y(H,R.CenterVertical,{constant:function(t){var e=t.referenceElDocumentPos;return{top:"calc(".concat(e.height/2,"px - 50%)")}},justifyPositions:k}),y(H,R.Left,{constant:function(t){var e=t.spacing;return{right:"calc(100% + ".concat(e,"px)")}},justifyPositions:q}),y(H,R.Right,{constant:function(t){var e=t.spacing;return{left:"calc(100% + ".concat(e,"px)")}},justifyPositions:q}),y(H,R.CenterHorizontal,{constant:function(t){var e=t.referenceElDocumentPos;return{left:"calc(".concat(e.width/2,"px - 50%)")}},justifyPositions:q}),H);function _(t){var e,n=t.align,r=t.justify,o=t.referenceElDocumentPos,i=t.contentElDocumentPos,a=t.spacing,c=Z[n],l=c.justifyPositions[r],s={contentElDocumentPos:i,referenceElDocumentPos:o,spacing:a};return h(h({},null===(e=c.constant)||void 0===e?void 0:e.call(c,s)),"function"==typeof l?l(s):l)}function G(t){var e=t.align,n=t.justify,r=t.referenceElDocumentPos,o=t.contentElDocumentPos,i=t.spacing,a=t.windowWidth,c=t.windowHeight,l=U({align:e,justify:n,referenceElPos:r,contentElPos:o,spacing:i}),s="".concat(l,"px"),u="".concat(J({align:e,justify:n,referenceElPos:r,contentElPos:o,spacing:i}),"px");return n!==V.Fit?{left:s,top:u}:[R.Left,R.Right,R.CenterHorizontal].includes(e)?{left:s,top:u,bottom:"".concat(c-r.bottom,"px")}:{left:s,top:u,right:"".concat(a-(l+r.width),"px")}}function J(t){var e=t.align,n=t.justify,r=t.contentElPos,o=t.referenceElPos,i=t.spacing;switch(e){case R.Left:case R.Right:case R.CenterHorizontal:switch(n){case V.Start:case V.Fit:return o.top;case V.End:return o.top+o.height-r.height;default:return o.top-(r.height-o.height)/2}case R.CenterVertical:return o.top-(r.height-o.height)/2;case R.Top:return o.top-r.height-i;case R.Bottom:default:return o.top+o.height+i}}function U(t){var e=t.align,n=t.justify,r=t.contentElPos,o=t.referenceElPos,i=t.spacing;switch(e){case R.Top:case R.Bottom:case R.CenterVertical:switch(n){case V.End:return o.left+o.width-r.width;case V.Middle:return o.left-(r.width-o.width)/2;default:return o.left}case R.Left:return o.left-r.width-i;case R.Right:return o.left+o.width+i;case R.CenterHorizontal:default:return o.left-(r.width-o.width)/2}}function X(t){var e=t.left,n=t.windowWidth,r=t.contentWidth;return e>=0&&!(e+r>n)}function Y(t){var e=t.top,n=t.windowHeight,r=t.contentHeight;return e>=0&&!(e+r>n)}var $=(y(T={},R.Top,[R.Bottom]),y(T,R.Bottom,[R.Top]),y(T,R.Left,[R.Right]),y(T,R.Right,[R.Left]),y(T,R.CenterHorizontal,[R.Left,R.Right]),y(T,R.CenterVertical,[R.Top,R.Bottom]),T);var K=(y(M={},V.Start,[V.End,V.Middle]),y(M,V.Middle,[V.End,V.Start]),y(M,V.End,[V.Start,V.Middle]),y(M,V.Fit,[V.Middle,V.Start,V.End]),M);var Q,tt,et,nt,rt=["active","spacing","align","justify","adjustOnMutation","children","className","popoverZIndex","refEl","usePortal","portalClassName","portalContainer","scrollContainer"],ot=["transform"],it=o.css(Q||(Q=w(["\n position: absolute;\n transition: transform 150ms ease-in-out, opacity 150ms ease-in-out;\n opacity: 0;\n"]))),at={attributes:!0,characterData:!0,childList:!0,subtree:!0};function ct(t){var n=t.active,i=void 0!==n&&n,u=t.spacing,d=void 0===u?10:u,g=t.align,h=void 0===g?R.Bottom:g,P=t.justify,E=void 0===P?V.Start:P,j=t.adjustOnMutation,O=void 0!==j&&j,C=t.children,x=t.className,S=t.popoverZIndex,D=t.refEl,H=t.usePortal,T=void 0===H||H,M=t.portalClassName,B=t.portalContainer,F=t.scrollContainer,I=v(t,rt),N=b(e.useState(null),2),A=N[0],q=N[1],k=b(e.useState(null),2),Z=k[0],_=k[1],G=b(e.useState(0),2),J=G[0],U=G[1],X=a.usePopoverContext().setIsPopoverOpen,Y=a.usePopoverPortalContainer(),$=Y.portalContainer,K=Y.scrollContainer;$=B||$,K=F||K,T&&K&&(K.contains($)||l.consoleOnce.warn("To ensure correct positioning make sure that the portalContainer element is inside of the scrollContainer"));var Q=f.default.useRef(Z);Q.current=Z;var ct=null;if(D&&D.current)ct=D.current;else if(A){var lt=A.parentNode;lt&< instanceof HTMLElement&&(ct=lt)}var st=c.useViewportSize(),ut=O&&i,ft=c.useMutationObserver(ct,at,Date.now,ut),dt=c.useMutationObserver(Z,at,Date.now,ut),pt=c.useObjectDependency(z(ct,K)),gt=c.useObjectDependency(z(Z,K)),ht=c.useObjectDependency(e.useMemo((function(){return W(ct,K)}),[ct,K,st,ft,i,h,E,J])),yt=c.useObjectDependency(e.useMemo((function(){return W(Z)}),[Z,st,dt,i,h,E,J])),mt=c.usePrevious(E),vt=c.usePrevious(h),wt=mt!==E&&(E===V.Fit||mt===V.Fit)||vt!==h&&E===V.Fit;c.useIsomorphicLayoutEffect((function(){wt&&U((function(t){return t+1}))}),[wt]);var bt=b(e.useState(!1),2),Pt=bt[0],Et=bt[1];if(c.useIsomorphicLayoutEffect((function(){return Et(!0)}),[]),!Pt)return null;var jt,Ot=L({useRelativePositioning:!T,spacing:d,align:h,justify:E,referenceElViewportPos:pt,referenceElDocumentPos:ht,contentElViewportPos:gt,contentElDocumentPos:yt,scrollContainer:K}),Ct=Ot.align,xt=Ot.justify,St=Ot.positionCSS,Dt=St.transform,Ht=v(St,ot),Tt=o.css(tt||(tt=w(["\n opacity: 1;\n position: ",";\n pointer-events: initial;\n "])),T?"":"absolute"),Mt=T?p.default:e.Fragment,Rt=T?$?{container:$}:{className:null!=M?M:void 0}:{};return jt=null==C?null:"function"==typeof C?C({align:Ct,justify:xt,referenceElPos:ht}):C,s.jsx(r.Transition,{nodeRef:Q,in:i,timeout:150,mountOnEnter:!0,unmountOnExit:!0,appear:!0,onEntered:function(){return X(!0)},onExit:function(){return X(!1)}},(function(t){var e;return s.jsx(f.default.Fragment,null,s.jsx("div",{ref:q,className:o.css(et||(et=w(["\n display: none;\n "])))}),s.jsx(Mt,Rt,s.jsx("div",m({},I,{className:o.cx(it,o.css(Ht),(e={},y(e,o.css({transform:Dt}),"entering"===t||"exiting"===t),y(e,Tt,"entered"===t),y(e,o.css(nt||(nt=w(["\n z-index: ",";\n "])),S),"number"==typeof S),e),x)}),s.jsx("div",{ref:_},jt))))}))}ct.displayName="Popover",ct.propTypes={children:d.default.oneOfType([d.default.node,d.default.func]),active:d.default.bool,className:d.default.string,align:d.default.oneOf(Object.values(R)),justify:d.default.oneOf(Object.values(V)),refEl:d.default.shape({current:"undefined"!=typeof window?d.default.instanceOf(Element):d.default.any}),usePortal:d.default.bool,portalClassName:d.default.string,spacing:d.default.number,adjustOnMutation:d.default.bool},t.Align=R,t.Justify=V,t.default=ct,Object.defineProperty(t,"__esModule",{value:!0})})); | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("prop-types"),require("react-transition-group"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/portal"),require("@leafygreen-ui/leafygreen-provider"),require("@leafygreen-ui/hooks"),require("@leafygreen-ui/lib"),require("@emotion/react")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","react-transition-group","@leafygreen-ui/emotion","@leafygreen-ui/portal","@leafygreen-ui/leafygreen-provider","@leafygreen-ui/hooks","@leafygreen-ui/lib","@emotion/react"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self)["@leafygreen-ui/popover"]={},t.React,t.PropTypes,t.reactTransitionGroup,t["@leafygreen-ui/emotion"],t["@leafygreen-ui/portal"],t["@leafygreen-ui/leafygreen-provider"],t["@leafygreen-ui/hooks"],t["@leafygreen-ui/lib"],t.react)}(this,(function(t,e,n,r,o,i,a,c,l,s){"use strict";function u(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var f=u(e),d=u(n),p=u(i);function g(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}function h(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?g(Object(n),!0).forEach((function(e){y(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):g(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function y(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function m(){return m=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},m.apply(this,arguments)}function v(t,e){if(null==t)return{};var n,r,o=function(t,e){if(null==t)return{};var n,r,o={},i=Object.keys(t);for(r=0;r<i.length;r++)n=i[r],e.indexOf(n)>=0||(o[n]=t[n]);return o}(t,e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);for(r=0;r<i.length;r++)n=i[r],e.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(t,n)&&(o[n]=t[n])}return o}function w(t,e){return e||(e=t.slice(0)),Object.freeze(Object.defineProperties(t,{raw:{value:Object.freeze(e)}}))}function b(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var r,o,i=[],a=!0,c=!1;try{for(n=n.call(t);!(a=(r=n.next()).done)&&(i.push(r.value),!e||i.length!==e);a=!0);}catch(t){c=!0,o=t}finally{try{a||null==n.return||n.return()}finally{if(c)throw o}}return i}(t,e)||E(t,e)||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 P(t){return function(t){if(Array.isArray(t))return j(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||E(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function E(t,e){if(t){if("string"==typeof t)return j(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?j(t,e):void 0}}function j(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}var O,C,x,S,D,H,T,M,R={Top:"top",Bottom:"bottom",Left:"left",Right:"right",CenterVertical:"center-vertical",CenterHorizontal:"center-horizontal"},V={Start:"start",Middle:"middle",End:"end",Fit:"fit"};function F(t){var e=t.useRelativePositioning,n=t.spacing,r=t.align,o=t.justify,i=t.referenceElViewportPos,a=void 0===i?L:i,c=t.referenceElDocumentPos,l=void 0===c?L:c,s=t.contentElViewportPos,u=void 0===s?L:s,f=t.contentElDocumentPos,d=void 0===f?L:f,p=t.scrollContainer,g=t.windowHeight,y=void 0===g?window.innerHeight:g,m=t.windowWidth,v=void 0===m?window.innerWidth:m,w=p?p.offsetWidth:v,b=p?p.offsetHeight:y,E={windowWidth:w,windowHeight:b,referenceElViewportPos:a,contentElViewportPos:u,spacing:n},j=function(t,e){var n=e.spacing,r=e.windowWidth,o=e.windowHeight,i=e.contentElViewportPos,a=e.referenceElViewportPos;return[t].concat(P($[t])).find((function(t){return[R.Top,R.Bottom,R.CenterVertical].includes(t)?Y({top:J({align:t,contentElPos:i,referenceElPos:a,spacing:n}),windowHeight:o,contentHeight:i.height}):!![R.Left,R.Right,R.CenterHorizontal].includes(t)&&X({left:U({align:t,contentElPos:i,referenceElPos:a,spacing:n}),windowWidth:r,contentWidth:i.width})}))||t}(r,E),O=function(t,e,n){var r,o,i=n.spacing,a=n.windowWidth,c=n.windowHeight,l=n.contentElViewportPos,s=n.referenceElViewportPos,u=[t].concat(P(K[t]));switch(e){case R.Top:case R.Bottom:case R.CenterVertical:return null!==(r=u.find((function(t){return X({contentWidth:t===V.Fit?s.width:l.width,windowWidth:a,left:U({contentElPos:l,referenceElPos:s,spacing:i,align:e,justify:t})})})))&&void 0!==r?r:K[t][0];case R.Left:case R.Right:case R.CenterHorizontal:return null!==(o=u.find((function(t){return Y({contentHeight:t===V.Fit?s.height:l.height,windowHeight:c,top:J({contentElPos:l,referenceElPos:s,spacing:i,align:e,justify:t})})})))&&void 0!==o?o:K[t][0]}}(o,j,E),C=function(t){var e,n,r=t.align,o=t.justify,i=A[r],a=null!==(e=i.x)&&void 0!==e?e:I[o],c=null!==(n=i.y)&&void 0!==n?n:W[o];return"".concat(a," ").concat(c)}({align:j,justify:O}),x=function(t,e){var n=.8;switch(t){case R.Top:return"translate3d(0, ".concat(e,"px, 0) scale(").concat(n,")");case R.Bottom:return"translate3d(0, -".concat(e,"px, 0) scale(").concat(n,")");case R.Left:return"translate3d(".concat(e,"px, 0, 0) scale(").concat(n,")");case R.Right:return"translate3d(-".concat(e,"px, 0, 0) scale(").concat(n,")");case R.CenterHorizontal:case R.CenterVertical:return"scale(".concat(n,")")}}(j,n);return 0===Math.floor(u.width)&&o!==V.Fit?{align:r,justify:o,positionCSS:{left:0,top:0,transform:x,transformOrigin:C}}:e?{align:j,justify:O,positionCSS:h(h({},_({align:j,justify:O,referenceElDocumentPos:l,contentElDocumentPos:d,spacing:n})),{},{transformOrigin:C,transform:x})}:{align:j,justify:O,positionCSS:h(h({},G({align:j,justify:O,referenceElDocumentPos:l,contentElDocumentPos:d,spacing:n,windowHeight:b,windowWidth:w})),{},{transformOrigin:C,transform:x})}}var L={top:0,bottom:0,left:0,right:0,height:0,width:0},z=function(t){var e=t.getBoundingClientRect();return{top:e.top,bottom:e.bottom,left:e.left,right:e.right,height:t.offsetHeight,width:parseFloat(getComputedStyle(t).width)}};function B(t,e){if(!t)return L;var n=z(t),r=n.top,o=n.bottom,i=n.left,a=n.right,c=n.height,l=n.width;if(e){var s=e.scrollTop,u=e.scrollLeft,f=e.getBoundingClientRect();return{top:r+s-f.top,bottom:o+s-f.bottom,left:i+u-f.left,right:a+u-f.right,height:c,width:l}}var d=window,p=d.scrollX,g=d.scrollY;return{top:r+g,bottom:o+g,left:i+p,right:a+p,height:c,width:l}}function N(t,e){if(!t)return L;var n=z(t),r=n.top,o=n.bottom,i=n.left,a=n.right,c=n.height,l=n.width;if(e){var s=e.getBoundingClientRect();return{top:r-s.top,bottom:o-s.bottom,left:i-s.left,right:a-s.right,height:c,width:l}}return{top:r,bottom:o,left:i,right:a,height:c,width:l}}var W=(y(O={},V.Start,"top"),y(O,V.Middle,"center"),y(O,V.End,"bottom"),y(O,V.Fit,"center"),O),I=(y(C={},V.Start,"left"),y(C,V.Middle,"center"),y(C,V.End,"right"),y(C,V.Fit,"center"),C),A=(y(x={},R.Left,{x:"right"}),y(x,R.Right,{x:"left"}),y(x,R.Top,{y:"bottom"}),y(x,R.Bottom,{y:"top"}),y(x,R.CenterHorizontal,{x:"center"}),y(x,R.CenterVertical,{y:"center"}),x);var q=(y(S={},V.Start,{top:0}),y(S,V.End,{bottom:0}),y(S,V.Middle,(function(t){var e=t.contentElDocumentPos,n=t.referenceElDocumentPos;return{top:"".concat(n.height/2-e.height/2,"px")}})),y(S,V.Fit,{top:0,bottom:0}),S),k=(y(D={},V.Start,{left:0}),y(D,V.End,{right:0}),y(D,V.Middle,(function(t){var e=t.contentElDocumentPos,n=t.referenceElDocumentPos;return{left:"".concat(n.width/2-e.width/2,"px")}})),y(D,V.Fit,{left:0,right:0}),D),Z=(y(H={},R.Top,{constant:function(t){var e=t.spacing;return{bottom:"calc(100% + ".concat(e,"px)")}},justifyPositions:k}),y(H,R.Bottom,{constant:function(t){var e=t.spacing;return{top:"calc(100% + ".concat(e,"px)")}},justifyPositions:k}),y(H,R.CenterVertical,{constant:function(t){var e=t.referenceElDocumentPos;return{top:"calc(".concat(e.height/2,"px - 50%)")}},justifyPositions:k}),y(H,R.Left,{constant:function(t){var e=t.spacing;return{right:"calc(100% + ".concat(e,"px)")}},justifyPositions:q}),y(H,R.Right,{constant:function(t){var e=t.spacing;return{left:"calc(100% + ".concat(e,"px)")}},justifyPositions:q}),y(H,R.CenterHorizontal,{constant:function(t){var e=t.referenceElDocumentPos;return{left:"calc(".concat(e.width/2,"px - 50%)")}},justifyPositions:q}),H);function _(t){var e,n=t.align,r=t.justify,o=t.referenceElDocumentPos,i=t.contentElDocumentPos,a=t.spacing,c=Z[n],l=c.justifyPositions[r],s={contentElDocumentPos:i,referenceElDocumentPos:o,spacing:a};return h(h({},null===(e=c.constant)||void 0===e?void 0:e.call(c,s)),"function"==typeof l?l(s):l)}function G(t){var e=t.align,n=t.justify,r=t.referenceElDocumentPos,o=t.contentElDocumentPos,i=t.spacing,a=t.windowWidth,c=t.windowHeight,l=U({align:e,justify:n,referenceElPos:r,contentElPos:o,spacing:i}),s="".concat(l,"px"),u="".concat(J({align:e,justify:n,referenceElPos:r,contentElPos:o,spacing:i}),"px");return n!==V.Fit?{left:s,top:u}:[R.Left,R.Right,R.CenterHorizontal].includes(e)?{left:s,top:u,bottom:"".concat(c-r.bottom,"px")}:{left:s,top:u,right:"".concat(a-(l+r.width),"px")}}function J(t){var e=t.align,n=t.justify,r=t.contentElPos,o=t.referenceElPos,i=t.spacing;switch(e){case R.Left:case R.Right:case R.CenterHorizontal:switch(n){case V.Start:case V.Fit:return o.top;case V.End:return o.top+o.height-r.height;default:return o.top-(r.height-o.height)/2}case R.CenterVertical:return o.top-(r.height-o.height)/2;case R.Top:return o.top-r.height-i;case R.Bottom:default:return o.top+o.height+i}}function U(t){var e=t.align,n=t.justify,r=t.contentElPos,o=t.referenceElPos,i=t.spacing;switch(e){case R.Top:case R.Bottom:case R.CenterVertical:switch(n){case V.End:return o.left+o.width-r.width;case V.Middle:return o.left-(r.width-o.width)/2;default:return o.left}case R.Left:return o.left-r.width-i;case R.Right:return o.left+o.width+i;case R.CenterHorizontal:default:return o.left-(r.width-o.width)/2}}function X(t){var e=t.left,n=t.windowWidth,r=t.contentWidth;return e>=0&&!(e+r>n)}function Y(t){var e=t.top,n=t.windowHeight,r=t.contentHeight;return e>=0&&!(e+r>n)}var $=(y(T={},R.Top,[R.Bottom]),y(T,R.Bottom,[R.Top]),y(T,R.Left,[R.Right]),y(T,R.Right,[R.Left]),y(T,R.CenterHorizontal,[R.Left,R.Right]),y(T,R.CenterVertical,[R.Top,R.Bottom]),T);var K=(y(M={},V.Start,[V.End,V.Middle]),y(M,V.Middle,[V.End,V.Start]),y(M,V.End,[V.Start,V.Middle]),y(M,V.Fit,[V.Middle,V.Start,V.End]),M);var Q,tt,et,nt,rt=["active","spacing","align","justify","adjustOnMutation","children","className","popoverZIndex","refEl","usePortal","portalClassName","portalContainer","scrollContainer"],ot=["transform"],it=o.css(Q||(Q=w(["\n position: absolute;\n transition: transform 150ms ease-in-out, opacity 150ms ease-in-out;\n opacity: 0;\n"]))),at={attributes:!0,characterData:!0,childList:!0,subtree:!0};function ct(t){var n=t.active,i=void 0!==n&&n,u=t.spacing,d=void 0===u?10:u,g=t.align,h=void 0===g?R.Bottom:g,P=t.justify,E=void 0===P?V.Start:P,j=t.adjustOnMutation,O=void 0!==j&&j,C=t.children,x=t.className,S=t.popoverZIndex,D=t.refEl,H=t.usePortal,T=void 0===H||H,M=t.portalClassName,L=t.portalContainer,z=t.scrollContainer,W=v(t,rt),I=b(e.useState(null),2),A=I[0],q=I[1],k=b(e.useState(null),2),Z=k[0],_=k[1],G=b(e.useState(0),2),J=G[0],U=G[1],X=a.usePopoverContext().setIsPopoverOpen,Y=a.usePopoverPortalContainer(),$=Y.portalContainer,K=Y.scrollContainer;$=L||$,K=z||K,T&&K&&(K.contains($)||l.consoleOnce.warn("To ensure correct positioning make sure that the portalContainer element is inside of the scrollContainer"));var Q=f.default.useRef(Z);Q.current=Z;var ct=null;if(D&&D.current)ct=D.current;else if(A){var lt=A.parentNode;lt&< instanceof HTMLElement&&(ct=lt)}var st=c.useViewportSize(),ut=O&&i,ft=c.useMutationObserver(ct,at,Date.now,ut),dt=c.useMutationObserver(null==Z?void 0:Z.parentNode,at,Date.now,ut),pt=c.useObjectDependency(N(ct,K)),gt=c.useObjectDependency(N(null==Z?void 0:Z.parentNode,K)),ht=c.useObjectDependency(e.useMemo((function(){return B(ct,K)}),[ct,K,st,ft,i,h,E,J])),yt=c.useObjectDependency(e.useMemo((function(){return B(Z)}),[null==Z?void 0:Z.parentNode,st,dt,i,h,E,J])),mt=c.usePrevious(E),vt=c.usePrevious(h),wt=mt!==E&&(E===V.Fit||mt===V.Fit)||vt!==h&&E===V.Fit;c.useIsomorphicLayoutEffect((function(){wt&&U((function(t){return t+1}))}),[wt]);var bt=b(e.useState(!1),2),Pt=bt[0],Et=bt[1];if(c.useIsomorphicLayoutEffect((function(){return Et(!0)}),[]),!Pt)return null;var jt,Ot=F({useRelativePositioning:!T,spacing:d,align:h,justify:E,referenceElViewportPos:pt,referenceElDocumentPos:ht,contentElViewportPos:gt,contentElDocumentPos:yt,scrollContainer:K}),Ct=Ot.align,xt=Ot.justify,St=Ot.positionCSS,Dt=St.transform,Ht=v(St,ot),Tt=o.css(tt||(tt=w(["\n opacity: 1;\n position: ",";\n pointer-events: initial;\n "])),T?"":"absolute"),Mt=T?p.default:e.Fragment,Rt=T?$?{container:$}:{className:null!=M?M:void 0}:{};return jt=null==C?null:"function"==typeof C?C({align:Ct,justify:xt,referenceElPos:ht}):C,s.jsx(r.Transition,{nodeRef:Q,in:i,timeout:150,mountOnEnter:!0,unmountOnExit:!0,appear:!0,onEntered:function(){return X(!0)},onExit:function(){return X(!1)}},(function(t){var e;return s.jsx(f.default.Fragment,null,s.jsx("div",{ref:q,className:o.css(et||(et=w(["\n display: none;\n "])))}),s.jsx(Mt,Rt,s.jsx("div",m({},W,{className:o.cx(it,o.css(Ht),(e={},y(e,o.css({transform:Dt}),"entering"===t||"exiting"===t),y(e,Tt,"entered"===t),y(e,o.css(nt||(nt=w(["\n z-index: ",";\n "])),S),"number"==typeof S),e),x)}),s.jsx("div",{ref:_},jt))))}))}ct.displayName="Popover",ct.propTypes={children:d.default.oneOfType([d.default.node,d.default.func]),active:d.default.bool,className:d.default.string,align:d.default.oneOf(Object.values(R)),justify:d.default.oneOf(Object.values(V)),refEl:d.default.shape({current:"undefined"!=typeof window?d.default.instanceOf(Element):d.default.any}),usePortal:d.default.bool,portalClassName:d.default.string,spacing:d.default.number,adjustOnMutation:d.default.bool},t.Align=R,t.Justify=V,t.default=ct,Object.defineProperty(t,"__esModule",{value:!0})})); | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "@leafygreen-ui/popover", | ||
"version": "8.0.0", | ||
"version": "8.0.1", | ||
"description": "LeafyGreen UI Kit Popover", | ||
@@ -35,3 +35,11 @@ "main": "./dist/index.js", | ||
}, | ||
"gitHead": "dd71a2d404218ccec2e657df9c0263dc1c15b9e0" | ||
} | ||
"gitHead": "dd71a2d404218ccec2e657df9c0263dc1c15b9e0", | ||
"homepage": "https://github.com/mongodb/leafygreen-ui/tree/main/packages/popover", | ||
"repository": { | ||
"type": "git", | ||
"url": "https://github.com/mongodb/leafygreen-ui" | ||
}, | ||
"bugs": { | ||
"url": "https://jira.mongodb.org/projects/PD/summary" | ||
} | ||
} |
@@ -68,15 +68,2 @@ import { Align, Justify, ElementPosition } from './types'; | ||
// calculatePosition will run and return CSS even if getBoundingClientRect() returns 0 for all properties, which then causes the content to have incorrect CSS. To avoid this we only want to return CSS if something is returned. | ||
// Justify fit does not position itself properly in this case so we continue to return the CSS | ||
if (contentElViewportPos.width === 0 && justify !== Justify.Fit) { | ||
return { | ||
align, | ||
justify, | ||
positionCSS: { | ||
left: 0, | ||
top: 0, | ||
}, | ||
}; | ||
} | ||
const windowSafeAlign = getWindowSafeAlign(align, windowSafeCommonArgs); | ||
@@ -96,2 +83,17 @@ const windowSafeJustify = getWindowSafeJustify( | ||
// calculatePosition will run and return CSS even if getBoundingClientRect() returns 0 for all properties, which then causes the content to have incorrect CSS. To avoid this we only want to return CSS if something is returned. | ||
// Justify fit does not position itself properly in this case so we continue to return the CSS | ||
if (Math.floor(contentElViewportPos.width) === 0 && justify !== Justify.Fit) { | ||
return { | ||
align, | ||
justify, | ||
positionCSS: { | ||
left: 0, | ||
top: 0, | ||
transform, | ||
transformOrigin, | ||
}, | ||
}; | ||
} | ||
if (useRelativePositioning) { | ||
@@ -144,15 +146,19 @@ return { | ||
/** | ||
* Returns the boundingWidth if the difference between the boundingWidth and offsetWidth is less than one else the offsetWidth is returned. | ||
* Returns the width and height as well as the top, bottom, left, and right positions of an element. | ||
*/ | ||
const getClosestToExactWidth = ( | ||
boundingWidth: number, | ||
offsetWidth: number, | ||
): number => { | ||
// offsetWidth returns a rounded number of the element's layout width and height. | ||
// boundingWidth returns an exact number with the rendered width and height which can include transformations. | ||
// Using the boundingWidth (exact number) is a better indicator of determining if an element will fit in the window, e.g. calcLeft() uses the width to determine the left position and then that number is used to check if it is safetly within the window bounds. In some cases the offsetWidth is rounded up which means that it might not fit in the window bounds when it really can. | ||
// With this we check if the difference between the boundingWidth and offsetWidth is less than one, if thats the case then the number was rounded to a whole number and we should use the exact number instead. However if the number is greater than one then that means that the boundingWidth is returning a width that has a transformation applied to it and we don't want that number. We want the untransformed width. | ||
const wasRounded = Math.abs(boundingWidth - offsetWidth) < 1; | ||
const getElementPosition = (element: HTMLElement) => { | ||
const { top, bottom, left, right } = element.getBoundingClientRect(); | ||
const { offsetHeight: height } = element; | ||
// Returns the unrounded, floating point width of the element which does not include transformations. | ||
// `offsetWidth` would not work because this returns a rounded number of the element's layout width and `getBoundingClientRect.width` would also not work because it returns an exact number of the rendered width which can include transformations. | ||
const width = parseFloat(getComputedStyle(element).width); | ||
return wasRounded ? boundingWidth : offsetWidth; | ||
return { | ||
top, | ||
bottom, | ||
left, | ||
right, | ||
height, | ||
width, | ||
}; | ||
}; | ||
@@ -168,13 +174,5 @@ | ||
const { | ||
top, | ||
bottom, | ||
left, | ||
right, | ||
width: boundingWidth, | ||
} = element.getBoundingClientRect(); | ||
const { offsetHeight: height, offsetWidth } = element; | ||
const { top, bottom, left, right, height, width } = | ||
getElementPosition(element); | ||
const width = getClosestToExactWidth(boundingWidth, offsetWidth); | ||
if (scrollContainer) { | ||
@@ -220,13 +218,5 @@ const { scrollTop, scrollLeft } = scrollContainer; | ||
const { | ||
top, | ||
bottom, | ||
left, | ||
right, | ||
width: boundingWidth, | ||
} = element.getBoundingClientRect(); | ||
const { offsetHeight: height, offsetWidth } = element; | ||
const { top, bottom, left, right, height, width } = | ||
getElementPosition(element); | ||
const width = getClosestToExactWidth(boundingWidth, offsetWidth); | ||
if (scrollContainer) { | ||
@@ -233,0 +223,0 @@ const { |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
No bug tracker
MaintenancePackage does not have a linked bug tracker in package.json.
Found 1 instance in 1 package
No repository
Supply chain riskPackage does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.
Found 1 instance in 1 package
No website
QualityPackage does not have a website.
Found 1 instance in 1 package
1
1
0
367387
4508