@floating-ui/react-dom - npm Package Compare versions

Comparing version 2.1.1 to 2.1.2

dist/floating-ui.react-dom.esm.js

@@ -135,2 +135,3 @@ import { computePosition, arrow as arrow$2, offset as offset$1, shift as shift$1, limitShift as limitShift$1, flip as flip$1, size as size$1, autoPlacement as autoPlacement$1, hide as hide$1, inline as inline$1 } from '@floating-ui/dom';
   const platformRef = useLatestRef(platform);
+  const openRef = useLatestRef(open);
   const update = React.useCallback(() => {
@@ -151,3 +152,7 @@ if (!referenceRef.current || !floatingRef.current) {
         ...data,
-        isPositioned: true
+        // The floating element's position may be recomputed while it's closed
+        // but still mounted (such as when transitioning out). To ensure
+        // `isPositioned` will be `false` initially on the next open, avoid
+        // setting it to `true` when `open === false` (must be specified).
+        isPositioned: openRef.current !== false
       };
@@ -161,3 +166,3 @@ if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
     });
-  }, [latestMiddleware, placement, strategy, platformRef]);
+  }, [latestMiddleware, placement, strategy, platformRef, openRef]);
   index(() => {
@@ -164,0 +169,0 @@ if (open === false && dataRef.current.isPositioned) {

dist/floating-ui.react-dom.umd.js

@@ -155,2 +155,3 @@ (function (global, factory) {
     const platformRef = useLatestRef(platform);
+    const openRef = useLatestRef(open);
     const update = React__namespace.useCallback(() => {
@@ -171,3 +172,7 @@ if (!referenceRef.current || !floatingRef.current) {
           ...data,
-          isPositioned: true
+          // The floating element's position may be recomputed while it's closed
+          // but still mounted (such as when transitioning out). To ensure
+          // `isPositioned` will be `false` initially on the next open, avoid
+          // setting it to `true` when `open === false` (must be specified).
+          isPositioned: openRef.current !== false
         };
@@ -181,3 +186,3 @@ if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
       });
-    }, [latestMiddleware, placement, strategy, platformRef]);
+    }, [latestMiddleware, placement, strategy, platformRef, openRef]);
     index(() => {
@@ -184,0 +189,0 @@ if (open === false && dataRef.current.isPositioned) {

dist/floating-ui.react-dom.umd.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@floating-ui/dom"),require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","@floating-ui/dom","react","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).FloatingUIReactDOM={},e.FloatingUIDOM,e.React,e.ReactDOM)}(this,(function(e,t,n,r){"use strict";function o(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 i=o(n),u=o(r),f="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;function c(e,t){if(e===t)return!0;if(typeof e!=typeof t)return!1;if("function"==typeof e&&e.toString()===t.toString())return!0;let n,r,o;if(e&&t&&"object"==typeof e){if(Array.isArray(e)){if(n=e.length,n!==t.length)return!1;for(r=n;0!=r--;)if(!c(e[r],t[r]))return!1;return!0}if(o=Object.keys(e),n=o.length,n!==Object.keys(t).length)return!1;for(r=n;0!=r--;)if(!{}.hasOwnProperty.call(t,o[r]))return!1;for(r=n;0!=r--;){const n=o[r];if(("_owner"!==n||!e.$$typeof)&&!c(e[n],t[n]))return!1}return!0}return e!=e&&t!=t}function s(e){if("undefined"==typeof window)return 1;return(e.ownerDocument.defaultView||window).devicePixelRatio||1}function a(e,t){const n=s(e);return Math.round(t*n)/n}function l(e){const t=i.useRef(e);return f((()=>{t.current=e})),t}const p=e=>({name:"arrow",options:e,fn(n){const{element:r,padding:o}="function"==typeof e?e(n):e;return r&&(i=r,{}.hasOwnProperty.call(i,"current"))?null!=r.current?t.arrow({element:r.current,padding:o}).fn(n):{}:r?t.arrow({element:r,padding:o}).fn(n):{};var i}});Object.defineProperty(e,"autoUpdate",{enumerable:!0,get:function(){return t.autoUpdate}}),Object.defineProperty(e,"computePosition",{enumerable:!0,get:function(){return t.computePosition}}),Object.defineProperty(e,"detectOverflow",{enumerable:!0,get:function(){return t.detectOverflow}}),Object.defineProperty(e,"getOverflowAncestors",{enumerable:!0,get:function(){return t.getOverflowAncestors}}),Object.defineProperty(e,"platform",{enumerable:!0,get:function(){return t.platform}}),e.arrow=(e,t)=>({...p(e),options:[e,t]}),e.autoPlacement=(e,n)=>({...t.autoPlacement(e),options:[e,n]}),e.flip=(e,n)=>({...t.flip(e),options:[e,n]}),e.hide=(e,n)=>({...t.hide(e),options:[e,n]}),e.inline=(e,n)=>({...t.inline(e),options:[e,n]}),e.limitShift=(e,n)=>({...t.limitShift(e),options:[e,n]}),e.offset=(e,n)=>({...t.offset(e),options:[e,n]}),e.shift=(e,n)=>({...t.shift(e),options:[e,n]}),e.size=(e,n)=>({...t.size(e),options:[e,n]}),e.useFloating=function(e){void 0===e&&(e={});const{placement:n="bottom",strategy:r="absolute",middleware:o=[],platform:p,elements:{reference:d,floating:m}={},transform:g=!0,whileElementsMounted:y,open:b}=e,[w,O]=i.useState({x:0,y:0,strategy:r,placement:n,middlewareData:{},isPositioned:!1}),[h,P]=i.useState(o);c(h,o)||P(o);const[j,v]=i.useState(null),[R,S]=i.useState(null),x=i.useCallback((e=>{e!==A.current&&(A.current=e,v(e))}),[]),M=i.useCallback((e=>{e!==C.current&&(C.current=e,S(e))}),[]),k=d||j,D=m||R,A=i.useRef(null),C=i.useRef(null),E=i.useRef(w),F=null!=y,U=l(y),q=l(p),z=i.useCallback((()=>{if(!A.current||!C.current)return;const e={placement:n,strategy:r,middleware:h};q.current&&(e.platform=q.current),t.computePosition(A.current,C.current,e).then((e=>{const t={...e,isPositioned:!0};I.current&&!c(E.current,t)&&(E.current=t,u.flushSync((()=>{O(t)})))}))}),[h,n,r,q]);f((()=>{!1===b&&E.current.isPositioned&&(E.current.isPositioned=!1,O((e=>({...e,isPositioned:!1}))))}),[b]);const I=i.useRef(!1);f((()=>(I.current=!0,()=>{I.current=!1})),[]),f((()=>{if(k&&(A.current=k),D&&(C.current=D),k&&D){if(U.current)return U.current(k,D,z);z()}}),[k,D,z,U,F]);const T=i.useMemo((()=>({reference:A,floating:C,setReference:x,setFloating:M})),[x,M]),$=i.useMemo((()=>({reference:k,floating:D})),[k,D]),L=i.useMemo((()=>{const e={position:r,left:0,top:0};if(!$.floating)return e;const t=a($.floating,w.x),n=a($.floating,w.y);return g?{...e,transform:"translate("+t+"px, "+n+"px)",...s($.floating)>=1.5&&{willChange:"transform"}}:{position:r,left:t,top:n}}),[r,g,$.floating,w.x,w.y]);return i.useMemo((()=>({...w,update:z,refs:T,elements:$,floatingStyles:L})),[w,z,T,$,L])}}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@floating-ui/dom"),require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","@floating-ui/dom","react","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).FloatingUIReactDOM={},e.FloatingUIDOM,e.React,e.ReactDOM)}(this,(function(e,t,n,r){"use strict";function o(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 i=o(n),u=o(r),f="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;function c(e,t){if(e===t)return!0;if(typeof e!=typeof t)return!1;if("function"==typeof e&&e.toString()===t.toString())return!0;let n,r,o;if(e&&t&&"object"==typeof e){if(Array.isArray(e)){if(n=e.length,n!==t.length)return!1;for(r=n;0!=r--;)if(!c(e[r],t[r]))return!1;return!0}if(o=Object.keys(e),n=o.length,n!==Object.keys(t).length)return!1;for(r=n;0!=r--;)if(!{}.hasOwnProperty.call(t,o[r]))return!1;for(r=n;0!=r--;){const n=o[r];if(("_owner"!==n||!e.$$typeof)&&!c(e[n],t[n]))return!1}return!0}return e!=e&&t!=t}function s(e){if("undefined"==typeof window)return 1;return(e.ownerDocument.defaultView||window).devicePixelRatio||1}function a(e,t){const n=s(e);return Math.round(t*n)/n}function l(e){const t=i.useRef(e);return f((()=>{t.current=e})),t}const p=e=>({name:"arrow",options:e,fn(n){const{element:r,padding:o}="function"==typeof e?e(n):e;return r&&(i=r,{}.hasOwnProperty.call(i,"current"))?null!=r.current?t.arrow({element:r.current,padding:o}).fn(n):{}:r?t.arrow({element:r,padding:o}).fn(n):{};var i}});Object.defineProperty(e,"autoUpdate",{enumerable:!0,get:function(){return t.autoUpdate}}),Object.defineProperty(e,"computePosition",{enumerable:!0,get:function(){return t.computePosition}}),Object.defineProperty(e,"detectOverflow",{enumerable:!0,get:function(){return t.detectOverflow}}),Object.defineProperty(e,"getOverflowAncestors",{enumerable:!0,get:function(){return t.getOverflowAncestors}}),Object.defineProperty(e,"platform",{enumerable:!0,get:function(){return t.platform}}),e.arrow=(e,t)=>({...p(e),options:[e,t]}),e.autoPlacement=(e,n)=>({...t.autoPlacement(e),options:[e,n]}),e.flip=(e,n)=>({...t.flip(e),options:[e,n]}),e.hide=(e,n)=>({...t.hide(e),options:[e,n]}),e.inline=(e,n)=>({...t.inline(e),options:[e,n]}),e.limitShift=(e,n)=>({...t.limitShift(e),options:[e,n]}),e.offset=(e,n)=>({...t.offset(e),options:[e,n]}),e.shift=(e,n)=>({...t.shift(e),options:[e,n]}),e.size=(e,n)=>({...t.size(e),options:[e,n]}),e.useFloating=function(e){void 0===e&&(e={});const{placement:n="bottom",strategy:r="absolute",middleware:o=[],platform:p,elements:{reference:d,floating:m}={},transform:g=!0,whileElementsMounted:y,open:b}=e,[w,O]=i.useState({x:0,y:0,strategy:r,placement:n,middlewareData:{},isPositioned:!1}),[h,P]=i.useState(o);c(h,o)||P(o);const[j,v]=i.useState(null),[R,S]=i.useState(null),x=i.useCallback((e=>{e!==A.current&&(A.current=e,v(e))}),[]),M=i.useCallback((e=>{e!==C.current&&(C.current=e,S(e))}),[]),k=d||j,D=m||R,A=i.useRef(null),C=i.useRef(null),E=i.useRef(w),F=null!=y,U=l(y),q=l(p),z=l(b),I=i.useCallback((()=>{if(!A.current||!C.current)return;const e={placement:n,strategy:r,middleware:h};q.current&&(e.platform=q.current),t.computePosition(A.current,C.current,e).then((e=>{const t={...e,isPositioned:!1!==z.current};T.current&&!c(E.current,t)&&(E.current=t,u.flushSync((()=>{O(t)})))}))}),[h,n,r,q,z]);f((()=>{!1===b&&E.current.isPositioned&&(E.current.isPositioned=!1,O((e=>({...e,isPositioned:!1}))))}),[b]);const T=i.useRef(!1);f((()=>(T.current=!0,()=>{T.current=!1})),[]),f((()=>{if(k&&(A.current=k),D&&(C.current=D),k&&D){if(U.current)return U.current(k,D,I);I()}}),[k,D,I,U,F]);const $=i.useMemo((()=>({reference:A,floating:C,setReference:x,setFloating:M})),[x,M]),L=i.useMemo((()=>({reference:k,floating:D})),[k,D]),V=i.useMemo((()=>{const e={position:r,left:0,top:0};if(!L.floating)return e;const t=a(L.floating,w.x),n=a(L.floating,w.y);return g?{...e,transform:"translate("+t+"px, "+n+"px)",...s(L.floating)>=1.5&&{willChange:"transform"}}:{position:r,left:t,top:n}}),[r,g,L.floating,w.x,w.y]);return i.useMemo((()=>({...w,update:I,refs:$,elements:L,floatingStyles:V})),[w,I,$,L,V])}}));

package.json

 {
   "name": "@floating-ui/react-dom",
-  "version": "2.1.1",
+  "version": "2.1.2",
   "description": "Floating UI for React DOM",
@@ -5,0 +5,0 @@ "publishConfig": {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

61480

increased by1.9%

Lines of code

1363

increased by1.11%

No dependency changes