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

Comparing version 0.4.3 to 0.5.0

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

 import { computePosition, arrow as arrow$1 } from '@floating-ui/dom';
-export { autoPlacement, detectOverflow, flip, getScrollParents, hide, inline, limitShift, offset, shift, size } from '@floating-ui/dom';
+export { autoPlacement, autoUpdate, detectOverflow, flip, getOverflowAncestors, hide, inline, limitShift, offset, shift, size } from '@floating-ui/dom';
 import { useLayoutEffect, useEffect, useRef, useState, useCallback, useMemo } from 'react';
@@ -72,4 +72,4 @@
     middleware,
-    placement,
-    strategy
+    placement = 'bottom',
+    strategy = 'absolute'
   } = _temp === void 0 ? {} : _temp;
@@ -83,4 +83,4 @@ const reference = useRef(null);
     y: null,
-    strategy: strategy != null ? strategy : 'absolute',
-    placement: 'bottom',
+    strategy,
+    placement,
     middlewareData: {}
@@ -135,11 +135,12 @@ });
   }, [update]);
+  const refs = useMemo(() => ({
+    reference,
+    floating
+  }), []);
   return useMemo(() => ({ ...data,
     update,
+    refs,
     reference: setReference,
-    floating: setFloating,
-    refs: {
-      reference,
-      floating
-    }
-  }), [data, update, setReference, setFloating]);
+    floating: setFloating
+  }), [data, update, refs, setReference, setFloating]);
 }
@@ -146,0 +147,0 @@ const arrow = options => {

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

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

dist/floating-ui.react-dom.js

@@ -74,4 +74,4 @@ (function (global, factory) {
       middleware,
-      placement,
-      strategy
+      placement = 'bottom',
+      strategy = 'absolute'
     } = _temp === void 0 ? {} : _temp;
@@ -85,4 +85,4 @@ const reference = react.useRef(null);
       y: null,
-      strategy: strategy != null ? strategy : 'absolute',
-      placement: 'bottom',
+      strategy,
+      placement,
       middlewareData: {}
@@ -137,11 +137,12 @@ });
     }, [update]);
+    const refs = react.useMemo(() => ({
+      reference,
+      floating
+    }), []);
     return react.useMemo(() => ({ ...data,
       update,
+      refs,
       reference: setReference,
-      floating: setFloating,
-      refs: {
-        reference,
-        floating
-      }
-    }), [data, update, setReference, setFloating]);
+      floating: setFloating
+    }), [data, update, refs, setReference, setFloating]);
   }
@@ -189,2 +190,6 @@ const arrow = options => {
   });
+  Object.defineProperty(exports, 'autoUpdate', {
+    enumerable: true,
+    get: function () { return dom.autoUpdate; }
+  });
   Object.defineProperty(exports, 'detectOverflow', {
@@ -198,5 +203,5 @@ enumerable: true,
   });
-  Object.defineProperty(exports, 'getScrollParents', {
+  Object.defineProperty(exports, 'getOverflowAncestors', {
     enumerable: true,
-    get: function () { return dom.getScrollParents; }
+    get: function () { return dom.getOverflowAncestors; }
   });
@@ -203,0 +208,0 @@ Object.defineProperty(exports, 'hide', {

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

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@floating-ui/dom"),require("react")):"function"==typeof define&&define.amd?define(["exports","@floating-ui/dom","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).FloatingUIReactDOM={},e.FloatingUIDOM,e.React)}(this,(function(e,t,r){"use strict";var n="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;function o(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 r,n,u;if(e&&t&&"object"==typeof e){if(Array.isArray(e)){if(r=e.length,r!=t.length)return!1;for(n=r;0!=n--;)if(!o(e[n],t[n]))return!1;return!0}if(u=Object.keys(e),r=u.length,r!==Object.keys(t).length)return!1;for(n=r;0!=n--;)if(!Object.prototype.hasOwnProperty.call(t,u[n]))return!1;for(n=r;0!=n--;){const r=u[n];if(("_owner"!==r||!e.$$typeof)&&!o(e[r],t[r]))return!1}return!0}return e!=e&&t!=t}Object.defineProperty(e,"autoPlacement",{enumerable:!0,get:function(){return t.autoPlacement}}),Object.defineProperty(e,"detectOverflow",{enumerable:!0,get:function(){return t.detectOverflow}}),Object.defineProperty(e,"flip",{enumerable:!0,get:function(){return t.flip}}),Object.defineProperty(e,"getScrollParents",{enumerable:!0,get:function(){return t.getScrollParents}}),Object.defineProperty(e,"hide",{enumerable:!0,get:function(){return t.hide}}),Object.defineProperty(e,"inline",{enumerable:!0,get:function(){return t.inline}}),Object.defineProperty(e,"limitShift",{enumerable:!0,get:function(){return t.limitShift}}),Object.defineProperty(e,"offset",{enumerable:!0,get:function(){return t.offset}}),Object.defineProperty(e,"shift",{enumerable:!0,get:function(){return t.shift}}),Object.defineProperty(e,"size",{enumerable:!0,get:function(){return t.size}}),e.arrow=e=>{const{element:r,padding:n}=e;return{name:"arrow",options:e,fn(e){return o=r,Object.prototype.hasOwnProperty.call(o,"current")?null!=r.current?t.arrow({element:r.current,padding:n}).fn(e):{}:r?t.arrow({element:r,padding:n}).fn(e):{};var o}}},e.useFloating=function(e){let{middleware:u,placement:i,strategy:f}=void 0===e?{}:e;const l=r.useRef(null),c=r.useRef(null),[a,s]=r.useState({x:null,y:null,strategy:null!=f?f:"absolute",placement:"bottom",middlewareData:{}}),[d,p]=r.useState(u);o(null==d?void 0:d.map((e=>{let{options:t}=e;return t})),null==u?void 0:u.map((e=>{let{options:t}=e;return t})))||p(u);const b=r.useRef(!0);n((()=>(b.current=!0,()=>{b.current=!1})),[]);const m=r.useCallback((()=>{l.current&&c.current&&t.computePosition(l.current,c.current,{middleware:d,placement:i,strategy:f}).then((e=>{b.current&&s(e)}))}),[d,i,f]);n(m,[m]);const y=r.useCallback((e=>{l.current=e,m()}),[m]),g=r.useCallback((e=>{c.current=e,m()}),[m]);return r.useMemo((()=>({...a,update:m,reference:y,floating:g,refs:{reference:l,floating:c}})),[a,m,y,g])},Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@floating-ui/dom"),require("react")):"function"==typeof define&&define.amd?define(["exports","@floating-ui/dom","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).FloatingUIReactDOM={},e.FloatingUIDOM,e.React)}(this,(function(e,t,r){"use strict";var n="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;function o(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 r,n,u;if(e&&t&&"object"==typeof e){if(Array.isArray(e)){if(r=e.length,r!=t.length)return!1;for(n=r;0!=n--;)if(!o(e[n],t[n]))return!1;return!0}if(u=Object.keys(e),r=u.length,r!==Object.keys(t).length)return!1;for(n=r;0!=n--;)if(!Object.prototype.hasOwnProperty.call(t,u[n]))return!1;for(n=r;0!=n--;){const r=u[n];if(("_owner"!==r||!e.$$typeof)&&!o(e[r],t[r]))return!1}return!0}return e!=e&&t!=t}Object.defineProperty(e,"autoPlacement",{enumerable:!0,get:function(){return t.autoPlacement}}),Object.defineProperty(e,"autoUpdate",{enumerable:!0,get:function(){return t.autoUpdate}}),Object.defineProperty(e,"detectOverflow",{enumerable:!0,get:function(){return t.detectOverflow}}),Object.defineProperty(e,"flip",{enumerable:!0,get:function(){return t.flip}}),Object.defineProperty(e,"getOverflowAncestors",{enumerable:!0,get:function(){return t.getOverflowAncestors}}),Object.defineProperty(e,"hide",{enumerable:!0,get:function(){return t.hide}}),Object.defineProperty(e,"inline",{enumerable:!0,get:function(){return t.inline}}),Object.defineProperty(e,"limitShift",{enumerable:!0,get:function(){return t.limitShift}}),Object.defineProperty(e,"offset",{enumerable:!0,get:function(){return t.offset}}),Object.defineProperty(e,"shift",{enumerable:!0,get:function(){return t.shift}}),Object.defineProperty(e,"size",{enumerable:!0,get:function(){return t.size}}),e.arrow=e=>{const{element:r,padding:n}=e;return{name:"arrow",options:e,fn(e){return o=r,Object.prototype.hasOwnProperty.call(o,"current")?null!=r.current?t.arrow({element:r.current,padding:n}).fn(e):{}:r?t.arrow({element:r,padding:n}).fn(e):{};var o}}},e.useFloating=function(e){let{middleware:u,placement:i="bottom",strategy:f="absolute"}=void 0===e?{}:e;const l=r.useRef(null),c=r.useRef(null),[a,s]=r.useState({x:null,y:null,strategy:f,placement:i,middlewareData:{}}),[d,p]=r.useState(u);o(null==d?void 0:d.map((e=>{let{options:t}=e;return t})),null==u?void 0:u.map((e=>{let{options:t}=e;return t})))||p(u);const b=r.useRef(!0);n((()=>(b.current=!0,()=>{b.current=!1})),[]);const m=r.useCallback((()=>{l.current&&c.current&&t.computePosition(l.current,c.current,{middleware:d,placement:i,strategy:f}).then((e=>{b.current&&s(e)}))}),[d,i,f]);n(m,[m]);const y=r.useCallback((e=>{l.current=e,m()}),[m]),g=r.useCallback((e=>{c.current=e,m()}),[m]),O=r.useMemo((()=>({reference:l,floating:c})),[]);return r.useMemo((()=>({...a,update:m,refs:O,reference:y,floating:g})),[a,m,O,y,g])},Object.defineProperty(e,"__esModule",{value:!0})}));

package.json

 {
   "name": "@floating-ui/react-dom",
-  "version": "0.4.3",
+  "version": "0.5.0",
   "@rollingversions": {
@@ -15,3 +15,3 @@ "baseVersion": [
   },
-  "main": "dist/floating-ui.react-dom.cjs",
+  "main": "dist/floating-ui.react-dom.js",
   "module": "dist/floating-ui.react-dom.esm.js",
@@ -63,3 +63,3 @@ "unpkg": "dist/floating-ui.react-dom.min.js",
   "dependencies": {
-    "@floating-ui/dom": "^0.1.10",
+    "@floating-ui/dom": "^0.3.0",
     "use-isomorphic-layout-effect": "^1.1.1"
@@ -66,0 +66,0 @@ },

src/index.d.ts

 import type { ComputePositionConfig, ComputePositionReturn, Middleware, SideObject, VirtualElement } from '@floating-ui/core';
 import { MutableRefObject } from 'react';
-export { autoPlacement, flip, hide, offset, shift, limitShift, size, inline, getScrollParents, detectOverflow, } from '@floating-ui/dom';
+export { autoPlacement, flip, hide, offset, shift, limitShift, size, inline, getOverflowAncestors, detectOverflow, autoUpdate, } from '@floating-ui/dom';
 declare type Data = Omit<ComputePositionReturn, 'x' | 'y'> & {
@@ -13,3 +13,3 @@ x: number | null;
     refs: {
-        reference: MutableRefObject<Element | null>;
+        reference: MutableRefObject<Element | VirtualElement | null>;
         floating: MutableRefObject<HTMLElement | null>;
@@ -16,0 +16,0 @@ };

src/types.d.ts

 export { useFloating } from './';
-export { autoPlacement, flip, hide, offset, shift, limitShift, size, inline, detectOverflow, getScrollParents, } from '@floating-ui/dom';
-export type { Platform, Placement, Strategy, Middleware } from '@floating-ui/dom';
+export { autoPlacement, flip, hide, offset, shift, limitShift, size, inline, detectOverflow, getOverflowAncestors, autoUpdate, } from '@floating-ui/dom';
+export type { Platform, Placement, Strategy, Middleware, Alignment, Side, AlignedPlacement, Axis, Length, Coords, SideObject, Dimensions, Rect, ElementRects, ElementContext, ClientRectObject, Padding, RootBoundary, MiddlewareArguments, MiddlewareReturn, MiddlewareData, ComputePositionConfig, ComputePositionReturn, } from '@floating-ui/dom';
 export { arrow } from './';

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

24078

increased by3.29%

Lines of code

605

increased by2.2%

Dependency changes

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

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

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

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

• Updated@floating-ui/dom@^0.3.0