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

Comparing version 0.7.2 to 1.0.0

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

@@ -86,6 +86,2 @@ import { computePosition, arrow as arrow$1 } from '@floating-ui/dom';
   } = _temp === void 0 ? {} : _temp;
-  const reference = React.useRef(null);
-  const floating = React.useRef(null);
-  const whileElementsMountedRef = useLatestRef(whileElementsMounted);
-  const cleanupRef = React.useRef(null);
   const [data, setData] = React.useState({
@@ -104,10 +100,18 @@ // Setting these to `null` will allow the consumer to determine if
     let {
+      name,
       options
     } = _ref;
-    return options;
+    return {
+      name,
+      options
+    };
   }), middleware == null ? void 0 : middleware.map(_ref2 => {
     let {
+      name,
       options
     } = _ref2;
-    return options;
+    return {
+      name,
+      options
+    };
   }))) {
@@ -117,2 +121,7 @@ setLatestMiddleware(middleware);
 
+  const reference = React.useRef(null);
+  const floating = React.useRef(null);
+  const cleanupRef = React.useRef(null);
+  const dataRef = React.useRef(data);
+  const whileElementsMountedRef = useLatestRef(whileElementsMounted);
   const update = React.useCallback(() => {
@@ -128,3 +137,4 @@ if (!reference.current || !floating.current) {
     }).then(data => {
-      if (isMountedRef.current) {
+      if (isMountedRef.current && !deepEqual(dataRef.current, data)) {
+        dataRef.current = data;
         ReactDOM.flushSync(() => {
@@ -131,0 +141,0 @@ setData(data);

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

@@ -1,1 +0,1 @@
-import{computePosition as e,arrow as r}from"@floating-ui/dom";export*from"@floating-ui/dom";import*as t from"react";import{useLayoutEffect as n,useEffect as u}from"react";import*as o from"react-dom";var c="undefined"!=typeof document?n:u;function l(e,r){if(e===r)return!0;if(typeof e!=typeof r)return!1;if("function"==typeof e&&e.toString()===r.toString())return!0;let t,n,u;if(e&&r&&"object"==typeof e){if(Array.isArray(e)){if(t=e.length,t!=r.length)return!1;for(n=t;0!=n--;)if(!l(e[n],r[n]))return!1;return!0}if(u=Object.keys(e),t=u.length,t!==Object.keys(r).length)return!1;for(n=t;0!=n--;)if(!Object.prototype.hasOwnProperty.call(r,u[n]))return!1;for(n=t;0!=n--;){const t=u[n];if(("_owner"!==t||!e.$$typeof)&&!l(e[t],r[t]))return!1}return!0}return e!=e&&r!=r}function a(r){let{middleware:n,placement:u="bottom",strategy:a="absolute",whileElementsMounted:f}=void 0===r?{}:r;const i=t.useRef(null),s=t.useRef(null),p=function(e){const r=t.useRef(e);return c((()=>{r.current=e})),r}(f),m=t.useRef(null),[d,y]=t.useState({x:null,y:null,strategy:a,placement:u,middlewareData:{}}),[g,b]=t.useState(n);l(null==g?void 0:g.map((e=>{let{options:r}=e;return r})),null==n?void 0:n.map((e=>{let{options:r}=e;return r})))||b(n);const h=t.useCallback((()=>{i.current&&s.current&&e(i.current,s.current,{middleware:g,placement:u,strategy:a}).then((e=>{w.current&&o.flushSync((()=>{y(e)}))}))}),[g,u,a]);c((()=>{w.current&&h()}),[h]);const w=t.useRef(!1);c((()=>(w.current=!0,()=>{w.current=!1})),[]);const k=t.useCallback((()=>{if("function"==typeof m.current&&(m.current(),m.current=null),i.current&&s.current)if(p.current){const e=p.current(i.current,s.current,h);m.current=e}else h()}),[h,p]),O=t.useCallback((e=>{i.current=e,k()}),[k]),j=t.useCallback((e=>{s.current=e,k()}),[k]),v=t.useMemo((()=>({reference:i,floating:s})),[]);return t.useMemo((()=>({...d,update:h,refs:v,reference:O,floating:j})),[d,h,v,O,j])}const f=e=>{const{element:t,padding:n}=e;return{name:"arrow",options:e,fn(e){return u=t,Object.prototype.hasOwnProperty.call(u,"current")?null!=t.current?r({element:t.current,padding:n}).fn(e):{}:t?r({element:t,padding:n}).fn(e):{};var u}}};export{f as arrow,a as useFloating};
+import{computePosition as e,arrow as r}from"@floating-ui/dom";export*from"@floating-ui/dom";import*as t from"react";import{useLayoutEffect as n,useEffect as u}from"react";import*as o from"react-dom";var c="undefined"!=typeof document?n:u;function l(e,r){if(e===r)return!0;if(typeof e!=typeof r)return!1;if("function"==typeof e&&e.toString()===r.toString())return!0;let t,n,u;if(e&&r&&"object"==typeof e){if(Array.isArray(e)){if(t=e.length,t!=r.length)return!1;for(n=t;0!=n--;)if(!l(e[n],r[n]))return!1;return!0}if(u=Object.keys(e),t=u.length,t!==Object.keys(r).length)return!1;for(n=t;0!=n--;)if(!Object.prototype.hasOwnProperty.call(r,u[n]))return!1;for(n=t;0!=n--;){const t=u[n];if(("_owner"!==t||!e.$$typeof)&&!l(e[t],r[t]))return!1}return!0}return e!=e&&r!=r}function a(r){let{middleware:n,placement:u="bottom",strategy:a="absolute",whileElementsMounted:f}=void 0===r?{}:r;const[i,s]=t.useState({x:null,y:null,strategy:a,placement:u,middlewareData:{}}),[m,p]=t.useState(n);l(null==m?void 0:m.map((e=>{let{name:r,options:t}=e;return{name:r,options:t}})),null==n?void 0:n.map((e=>{let{name:r,options:t}=e;return{name:r,options:t}})))||p(n);const d=t.useRef(null),y=t.useRef(null),g=t.useRef(null),b=t.useRef(i),h=function(e){const r=t.useRef(e);return c((()=>{r.current=e})),r}(f),w=t.useCallback((()=>{d.current&&y.current&&e(d.current,y.current,{middleware:m,placement:u,strategy:a}).then((e=>{k.current&&!l(b.current,e)&&(b.current=e,o.flushSync((()=>{s(e)})))}))}),[m,u,a]);c((()=>{k.current&&w()}),[w]);const k=t.useRef(!1);c((()=>(k.current=!0,()=>{k.current=!1})),[]);const O=t.useCallback((()=>{if("function"==typeof g.current&&(g.current(),g.current=null),d.current&&y.current)if(h.current){const e=h.current(d.current,y.current,w);g.current=e}else w()}),[w,h]),R=t.useCallback((e=>{d.current=e,O()}),[O]),j=t.useCallback((e=>{y.current=e,O()}),[O]),v=t.useMemo((()=>({reference:d,floating:y})),[]);return t.useMemo((()=>({...i,update:w,refs:v,reference:R,floating:j})),[i,w,v,R,j])}const f=e=>{const{element:t,padding:n}=e;return{name:"arrow",options:e,fn(e){return u=t,Object.prototype.hasOwnProperty.call(u,"current")?null!=t.current?r({element:t.current,padding:n}).fn(e):{}:t?r({element:t,padding:n}).fn(e):{};var u}}};export{f as arrow,a as useFloating};

package.json

 {
   "name": "@floating-ui/react-dom",
-  "version": "0.7.2",
+  "version": "1.0.0",
   "@rollingversions": {
@@ -15,5 +15,5 @@ "baseVersion": [
   },
-  "main": "./dist/floating-ui.react-dom.js",
+  "main": "./dist/floating-ui.react-dom.umd.js",
   "module": "./dist/floating-ui.react-dom.esm.js",
-  "unpkg": "./dist/floating-ui.react-dom.min.js",
+  "unpkg": "./dist/floating-ui.react-dom.umd.min.js",
   "types": "./index.d.ts",
@@ -25,3 +25,3 @@ "exports": {
       "import": "./dist/floating-ui.react-dom.mjs",
-      "default": "./dist/floating-ui.react-dom.js"
+      "default": "./dist/floating-ui.react-dom.umd.js"
     },
@@ -65,4 +65,3 @@ "./package.json": "./package.json"
   "dependencies": {
-    "@floating-ui/dom": "^0.5.3",
-    "use-isomorphic-layout-effect": "^1.1.1"
+    "@floating-ui/dom": "^1.0.0"
   },
@@ -86,4 +85,5 @@ "devDependencies": {
     "rollup-plugin-terser": "^7.0.2",
-    "ts-jest": "^27.0.7"
+    "ts-jest": "^27.0.7",
+    "use-isomorphic-layout-effect": "^1.1.1"
   }
 }

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

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

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

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

28585

increased by2.78%

Dependency count

3

decreased by-25%

Lines of code

701

increased by4.47%

Number of low quality alerts

1

decreased by-50%

Worsened metrics

Dev dependency count

18

increased by5.88%

Dependency changes

• + Added@floating-ui/core@1.6.8(transitive)

• + Added@floating-ui/dom@1.6.11(transitive)

• + Added@floating-ui/utils@0.2.8(transitive)

• - Removeduse-isomorphic-layout-effect@^1.1.1

• - Removed@floating-ui/core@0.7.3(transitive)

• - Removed@floating-ui/dom@0.5.4(transitive)

• - Removeduse-isomorphic-layout-effect@1.1.2(transitive)

• Updated@floating-ui/dom@^1.0.0