🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more →
@floating-ui/dom
Advanced tools
@floating-ui/dom - npm Package Compare versions
Comparing version 1.3.0 to 1.4.0
@@ -17,3 +17,9 @@ import { rectToClientRect, computePosition as computePosition$1 } from '@floating-ui/core'; | ||
| function getNodeName(node) { | ||
| return isNode(node) ? (node.nodeName || '').toLowerCase() : ''; | ||
| if (isNode(node)) { | ||
| return (node.nodeName || '').toLowerCase(); | ||
| } | ||
| // Mocked nodes in testing environments may not be instances of Node. By | ||
| // returning `#document` an infinite loop won't occur. | ||
| // https://github.com/floating-ui/floating-ui/issues/2317 | ||
| return '#document'; | ||
| } | ||
@@ -32,4 +38,3 @@ | ||
| } | ||
| const OwnElement = getWindow(node).ShadowRoot; | ||
| return node instanceof OwnElement || node instanceof ShadowRoot; | ||
| return node instanceof getWindow(node).ShadowRoot || node instanceof ShadowRoot; | ||
| } | ||
@@ -66,2 +71,7 @@ function isOverflowElement(element) { | ||
| const round = Math.round; | ||
| const floor = Math.floor; | ||
| const createEmptyCoords = v => ({ | ||
| x: v, | ||
| y: v | ||
| }); | ||
@@ -85,3 +95,3 @@ function getCssDimensions(element) { | ||
| height, | ||
| fallback: shouldFallback | ||
| $: shouldFallback | ||
| }; | ||
@@ -94,10 +104,6 @@ } | ||
| const FALLBACK_SCALE = { | ||
| x: 1, | ||
| y: 1 | ||
| }; | ||
| function getScale(element) { | ||
| const domElement = unwrapElement(element); | ||
| if (!isHTMLElement(domElement)) { | ||
| return FALLBACK_SCALE; | ||
| return createEmptyCoords(1); | ||
| } | ||
@@ -108,6 +114,6 @@ const rect = domElement.getBoundingClientRect(); | ||
| height, | ||
| fallback | ||
| $ | ||
| } = getCssDimensions(domElement); | ||
| let x = (fallback ? round(rect.width) : rect.width) / width; | ||
| let y = (fallback ? round(rect.height) : rect.height) / height; | ||
| let x = ($ ? round(rect.width) : rect.width) / width; | ||
| let y = ($ ? round(rect.height) : rect.height) / height; | ||
@@ -128,6 +134,3 @@ // 0, NaN, or Infinity should always fallback to 1. | ||
| const noOffsets = { | ||
| x: 0, | ||
| y: 0 | ||
| }; | ||
| const noOffsets = /*#__PURE__*/createEmptyCoords(0); | ||
| function getVisualOffsets(element, isFixed, floatingOffsetParent) { | ||
@@ -160,3 +163,3 @@ var _win$visualViewport, _win$visualViewport2; | ||
| const domElement = unwrapElement(element); | ||
| let scale = FALLBACK_SCALE; | ||
| let scale = createEmptyCoords(1); | ||
| if (includeScale) { | ||
@@ -184,4 +187,4 @@ if (offsetParent) { | ||
| const css = getComputedStyle(currentIFrame); | ||
| iframeRect.x += (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x; | ||
| iframeRect.y += (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y; | ||
| const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x; | ||
| const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y; | ||
| x *= iframeScale.x; | ||
@@ -191,4 +194,4 @@ y *= iframeScale.y; | ||
| height *= iframeScale.y; | ||
| x += iframeRect.x; | ||
| y += iframeRect.y; | ||
| x += left; | ||
| y += top; | ||
| currentIFrame = getWindow(currentIFrame).frameElement; | ||
@@ -237,10 +240,4 @@ } | ||
| }; | ||
| let scale = { | ||
| x: 1, | ||
| y: 1 | ||
| }; | ||
| const offsets = { | ||
| x: 0, | ||
| y: 0 | ||
| }; | ||
| let scale = createEmptyCoords(1); | ||
| const offsets = createEmptyCoords(0); | ||
| if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') { | ||
@@ -311,5 +308,3 @@ if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) { | ||
| if (isLastTraversableNode(parentNode)) { | ||
| // `getParentNode` will never return a `Document` due to the fallback | ||
| // check, so it's either the <html> or <body> element. | ||
| return parentNode.ownerDocument.body; | ||
| return node.ownerDocument ? node.ownerDocument.body : node.body; | ||
| } | ||
@@ -366,6 +361,3 @@ if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) { | ||
| const left = clientRect.left + element.clientLeft; | ||
| const scale = isHTMLElement(element) ? getScale(element) : { | ||
| x: 1, | ||
| y: 1 | ||
| }; | ||
| const scale = isHTMLElement(element) ? getScale(element) : createEmptyCoords(1); | ||
| const width = element.clientWidth * scale.x; | ||
@@ -521,6 +513,3 @@ const height = element.clientHeight * scale.y; | ||
| }; | ||
| const offsets = { | ||
| x: 0, | ||
| y: 0 | ||
| }; | ||
| const offsets = createEmptyCoords(0); | ||
| if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) { | ||
@@ -575,2 +564,48 @@ if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) { | ||
| // https://samthor.au/2021/observing-dom/ | ||
| function observeMove(element, onMove) { | ||
| let io = null; | ||
| const root = getDocumentElement(element); | ||
| function cleanup() { | ||
| io && io.disconnect(); | ||
| io = null; | ||
| } | ||
| function refresh(skip) { | ||
| if (skip === void 0) { | ||
| skip = false; | ||
| } | ||
| cleanup(); | ||
| const { | ||
| left, | ||
| top, | ||
| width, | ||
| height | ||
| } = element.getBoundingClientRect(); | ||
| if (!skip) { | ||
| onMove(); | ||
| } | ||
| if (!width || !height) { | ||
| return; | ||
| } | ||
| const insetTop = floor(top); | ||
| const insetRight = floor(root.clientWidth - (left + width)); | ||
| const insetBottom = floor(root.clientHeight - (top + height)); | ||
| const insetLeft = floor(left); | ||
| const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px"; | ||
| let isFirstUpdate = true; | ||
| io = new IntersectionObserver(entries => { | ||
| if (entries[0].intersectionRatio !== 1 && !isFirstUpdate) { | ||
| refresh(); | ||
| } | ||
| isFirstUpdate = false; | ||
| }, { | ||
| rootMargin, | ||
| threshold: 1 | ||
| }); | ||
| io.observe(element); | ||
| } | ||
| refresh(true); | ||
| return cleanup; | ||
| } | ||
| /** | ||
@@ -592,25 +627,21 @@ * Automatically updates the position of the floating element when necessary. | ||
| elementResize = true, | ||
| layoutShift = typeof IntersectionObserver === 'function', | ||
| animationFrame = false | ||
| } = options; | ||
| const ancestors = ancestorScroll || ancestorResize ? [...(isElement(reference) ? getOverflowAncestors(reference) : reference.contextElement ? getOverflowAncestors(reference.contextElement) : []), ...getOverflowAncestors(floating)] : []; | ||
| const referenceEl = unwrapElement(reference); | ||
| const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : []; | ||
| ancestors.forEach(ancestor => { | ||
| // ignores Window, checks for [object VisualViewport] | ||
| const isVisualViewport = !isElement(ancestor) && ancestor.toString().includes('V'); | ||
| if (ancestorScroll && (animationFrame ? isVisualViewport : true)) { | ||
| ancestor.addEventListener('scroll', update, { | ||
| passive: true | ||
| }); | ||
| } | ||
| ancestorScroll && ancestor.addEventListener('scroll', update, { | ||
| passive: true | ||
| }); | ||
| ancestorResize && ancestor.addEventListener('resize', update); | ||
| }); | ||
| let observer = null; | ||
| const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null; | ||
| let resizeObserver = null; | ||
| if (elementResize) { | ||
| observer = new ResizeObserver(() => { | ||
| update(); | ||
| }); | ||
| isElement(reference) && !animationFrame && observer.observe(reference); | ||
| if (!isElement(reference) && reference.contextElement && !animationFrame) { | ||
| observer.observe(reference.contextElement); | ||
| resizeObserver = new ResizeObserver(update); | ||
| if (referenceEl && !animationFrame) { | ||
| resizeObserver.observe(referenceEl); | ||
| } | ||
| observer.observe(floating); | ||
| resizeObserver.observe(floating); | ||
| } | ||
@@ -632,3 +663,2 @@ let frameId; | ||
| return () => { | ||
| var _observer; | ||
| ancestors.forEach(ancestor => { | ||
@@ -638,4 +668,5 @@ ancestorScroll && ancestor.removeEventListener('scroll', update); | ||
| }); | ||
| (_observer = observer) == null ? void 0 : _observer.disconnect(); | ||
| observer = null; | ||
| cleanupIo && cleanupIo(); | ||
| resizeObserver && resizeObserver.disconnect(); | ||
| resizeObserver = null; | ||
| if (animationFrame) { | ||
@@ -642,0 +673,0 @@ cancelAnimationFrame(frameId); |
@@ -20,3 +20,9 @@ (function (global, factory) { | ||
| function getNodeName(node) { | ||
| return isNode(node) ? (node.nodeName || '').toLowerCase() : ''; | ||
| if (isNode(node)) { | ||
| return (node.nodeName || '').toLowerCase(); | ||
| } | ||
| // Mocked nodes in testing environments may not be instances of Node. By | ||
| // returning `#document` an infinite loop won't occur. | ||
| // https://github.com/floating-ui/floating-ui/issues/2317 | ||
| return '#document'; | ||
| } | ||
@@ -35,4 +41,3 @@ | ||
| } | ||
| const OwnElement = getWindow(node).ShadowRoot; | ||
| return node instanceof OwnElement || node instanceof ShadowRoot; | ||
| return node instanceof getWindow(node).ShadowRoot || node instanceof ShadowRoot; | ||
| } | ||
@@ -69,2 +74,7 @@ function isOverflowElement(element) { | ||
| const round = Math.round; | ||
| const floor = Math.floor; | ||
| const createEmptyCoords = v => ({ | ||
| x: v, | ||
| y: v | ||
| }); | ||
@@ -88,3 +98,3 @@ function getCssDimensions(element) { | ||
| height, | ||
| fallback: shouldFallback | ||
| $: shouldFallback | ||
| }; | ||
@@ -97,10 +107,6 @@ } | ||
| const FALLBACK_SCALE = { | ||
| x: 1, | ||
| y: 1 | ||
| }; | ||
| function getScale(element) { | ||
| const domElement = unwrapElement(element); | ||
| if (!isHTMLElement(domElement)) { | ||
| return FALLBACK_SCALE; | ||
| return createEmptyCoords(1); | ||
| } | ||
@@ -111,6 +117,6 @@ const rect = domElement.getBoundingClientRect(); | ||
| height, | ||
| fallback | ||
| $ | ||
| } = getCssDimensions(domElement); | ||
| let x = (fallback ? round(rect.width) : rect.width) / width; | ||
| let y = (fallback ? round(rect.height) : rect.height) / height; | ||
| let x = ($ ? round(rect.width) : rect.width) / width; | ||
| let y = ($ ? round(rect.height) : rect.height) / height; | ||
@@ -131,6 +137,3 @@ // 0, NaN, or Infinity should always fallback to 1. | ||
| const noOffsets = { | ||
| x: 0, | ||
| y: 0 | ||
| }; | ||
| const noOffsets = /*#__PURE__*/createEmptyCoords(0); | ||
| function getVisualOffsets(element, isFixed, floatingOffsetParent) { | ||
@@ -163,3 +166,3 @@ var _win$visualViewport, _win$visualViewport2; | ||
| const domElement = unwrapElement(element); | ||
| let scale = FALLBACK_SCALE; | ||
| let scale = createEmptyCoords(1); | ||
| if (includeScale) { | ||
@@ -187,4 +190,4 @@ if (offsetParent) { | ||
| const css = getComputedStyle(currentIFrame); | ||
| iframeRect.x += (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x; | ||
| iframeRect.y += (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y; | ||
| const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x; | ||
| const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y; | ||
| x *= iframeScale.x; | ||
@@ -194,4 +197,4 @@ y *= iframeScale.y; | ||
| height *= iframeScale.y; | ||
| x += iframeRect.x; | ||
| y += iframeRect.y; | ||
| x += left; | ||
| y += top; | ||
| currentIFrame = getWindow(currentIFrame).frameElement; | ||
@@ -240,10 +243,4 @@ } | ||
| }; | ||
| let scale = { | ||
| x: 1, | ||
| y: 1 | ||
| }; | ||
| const offsets = { | ||
| x: 0, | ||
| y: 0 | ||
| }; | ||
| let scale = createEmptyCoords(1); | ||
| const offsets = createEmptyCoords(0); | ||
| if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') { | ||
@@ -314,5 +311,3 @@ if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) { | ||
| if (isLastTraversableNode(parentNode)) { | ||
| // `getParentNode` will never return a `Document` due to the fallback | ||
| // check, so it's either the <html> or <body> element. | ||
| return parentNode.ownerDocument.body; | ||
| return node.ownerDocument ? node.ownerDocument.body : node.body; | ||
| } | ||
@@ -369,6 +364,3 @@ if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) { | ||
| const left = clientRect.left + element.clientLeft; | ||
| const scale = isHTMLElement(element) ? getScale(element) : { | ||
| x: 1, | ||
| y: 1 | ||
| }; | ||
| const scale = isHTMLElement(element) ? getScale(element) : createEmptyCoords(1); | ||
| const width = element.clientWidth * scale.x; | ||
@@ -524,6 +516,3 @@ const height = element.clientHeight * scale.y; | ||
| }; | ||
| const offsets = { | ||
| x: 0, | ||
| y: 0 | ||
| }; | ||
| const offsets = createEmptyCoords(0); | ||
| if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) { | ||
@@ -578,2 +567,48 @@ if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) { | ||
| // https://samthor.au/2021/observing-dom/ | ||
| function observeMove(element, onMove) { | ||
| let io = null; | ||
| const root = getDocumentElement(element); | ||
| function cleanup() { | ||
| io && io.disconnect(); | ||
| io = null; | ||
| } | ||
| function refresh(skip) { | ||
| if (skip === void 0) { | ||
| skip = false; | ||
| } | ||
| cleanup(); | ||
| const { | ||
| left, | ||
| top, | ||
| width, | ||
| height | ||
| } = element.getBoundingClientRect(); | ||
| if (!skip) { | ||
| onMove(); | ||
| } | ||
| if (!width || !height) { | ||
| return; | ||
| } | ||
| const insetTop = floor(top); | ||
| const insetRight = floor(root.clientWidth - (left + width)); | ||
| const insetBottom = floor(root.clientHeight - (top + height)); | ||
| const insetLeft = floor(left); | ||
| const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px"; | ||
| let isFirstUpdate = true; | ||
| io = new IntersectionObserver(entries => { | ||
| if (entries[0].intersectionRatio !== 1 && !isFirstUpdate) { | ||
| refresh(); | ||
| } | ||
| isFirstUpdate = false; | ||
| }, { | ||
| rootMargin, | ||
| threshold: 1 | ||
| }); | ||
| io.observe(element); | ||
| } | ||
| refresh(true); | ||
| return cleanup; | ||
| } | ||
| /** | ||
@@ -595,25 +630,21 @@ * Automatically updates the position of the floating element when necessary. | ||
| elementResize = true, | ||
| layoutShift = typeof IntersectionObserver === 'function', | ||
| animationFrame = false | ||
| } = options; | ||
| const ancestors = ancestorScroll || ancestorResize ? [...(isElement(reference) ? getOverflowAncestors(reference) : reference.contextElement ? getOverflowAncestors(reference.contextElement) : []), ...getOverflowAncestors(floating)] : []; | ||
| const referenceEl = unwrapElement(reference); | ||
| const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : []; | ||
| ancestors.forEach(ancestor => { | ||
| // ignores Window, checks for [object VisualViewport] | ||
| const isVisualViewport = !isElement(ancestor) && ancestor.toString().includes('V'); | ||
| if (ancestorScroll && (animationFrame ? isVisualViewport : true)) { | ||
| ancestor.addEventListener('scroll', update, { | ||
| passive: true | ||
| }); | ||
| } | ||
| ancestorScroll && ancestor.addEventListener('scroll', update, { | ||
| passive: true | ||
| }); | ||
| ancestorResize && ancestor.addEventListener('resize', update); | ||
| }); | ||
| let observer = null; | ||
| const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null; | ||
| let resizeObserver = null; | ||
| if (elementResize) { | ||
| observer = new ResizeObserver(() => { | ||
| update(); | ||
| }); | ||
| isElement(reference) && !animationFrame && observer.observe(reference); | ||
| if (!isElement(reference) && reference.contextElement && !animationFrame) { | ||
| observer.observe(reference.contextElement); | ||
| resizeObserver = new ResizeObserver(update); | ||
| if (referenceEl && !animationFrame) { | ||
| resizeObserver.observe(referenceEl); | ||
| } | ||
| observer.observe(floating); | ||
| resizeObserver.observe(floating); | ||
| } | ||
@@ -635,3 +666,2 @@ let frameId; | ||
| return () => { | ||
| var _observer; | ||
| ancestors.forEach(ancestor => { | ||
@@ -641,4 +671,5 @@ ancestorScroll && ancestor.removeEventListener('scroll', update); | ||
| }); | ||
| (_observer = observer) == null ? void 0 : _observer.disconnect(); | ||
| observer = null; | ||
| cleanupIo && cleanupIo(); | ||
| resizeObserver && resizeObserver.disconnect(); | ||
| resizeObserver = null; | ||
| if (animationFrame) { | ||
@@ -645,0 +676,0 @@ cancelAnimationFrame(frameId); |
@@ -1,1 +0,1 @@ | ||
| !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@floating-ui/core")):"function"==typeof define&&define.amd?define(["exports","@floating-ui/core"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).FloatingUIDOM={},t.FloatingUICore)}(this,(function(t,e){"use strict";function n(t){var e;return(null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function o(t){return n(t).getComputedStyle(t)}function i(t){return t instanceof n(t).Node}function r(t){return i(t)?(t.nodeName||"").toLowerCase():""}function c(t){return t instanceof n(t).HTMLElement}function l(t){return t instanceof n(t).Element}function f(t){if("undefined"==typeof ShadowRoot)return!1;return t instanceof n(t).ShadowRoot||t instanceof ShadowRoot}function s(t){const{overflow:e,overflowX:n,overflowY:i,display:r}=o(t);return/auto|scroll|overlay|hidden|clip/.test(e+i+n)&&!["inline","contents"].includes(r)}function u(t){return["table","td","th"].includes(r(t))}function d(t){const e=a(),n=o(t);return"none"!==n.transform||"none"!==n.perspective||!e&&!!n.backdropFilter&&"none"!==n.backdropFilter||!e&&!!n.filter&&"none"!==n.filter||["transform","perspective","filter"].some((t=>(n.willChange||"").includes(t)))||["paint","layout","strict","content"].some((t=>(n.contain||"").includes(t)))}function a(){return!("undefined"==typeof CSS||!CSS.supports)&&CSS.supports("-webkit-backdrop-filter","none")}function h(t){return["html","body","#document"].includes(r(t))}const p=Math.min,g=Math.max,m=Math.round;function y(t){const e=o(t);let n=parseFloat(e.width)||0,i=parseFloat(e.height)||0;const r=c(t),l=r?t.offsetWidth:n,f=r?t.offsetHeight:i,s=m(n)!==l||m(i)!==f;return s&&(n=l,i=f),{width:n,height:i,fallback:s}}function x(t){return l(t)?t:t.contextElement}const w={x:1,y:1};function b(t){const e=x(t);if(!c(e))return w;const n=e.getBoundingClientRect(),{width:o,height:i,fallback:r}=y(e);let l=(r?m(n.width):n.width)/o,f=(r?m(n.height):n.height)/i;return l&&Number.isFinite(l)||(l=1),f&&Number.isFinite(f)||(f=1),{x:l,y:f}}const v={x:0,y:0};function L(t,e,o){var i,r;if(void 0===e&&(e=!0),!a())return v;const c=t?n(t):window;return!o||e&&o!==c?v:{x:(null==(i=c.visualViewport)?void 0:i.offsetLeft)||0,y:(null==(r=c.visualViewport)?void 0:r.offsetTop)||0}}function T(t,o,i,r){void 0===o&&(o=!1),void 0===i&&(i=!1);const c=t.getBoundingClientRect(),f=x(t);let s=w;o&&(r?l(r)&&(s=b(r)):s=b(t));const u=L(f,i,r);let d=(c.left+u.x)/s.x,a=(c.top+u.y)/s.y,h=c.width/s.x,p=c.height/s.y;if(f){const t=n(f),e=r&&l(r)?n(r):r;let o=t.frameElement;for(;o&&r&&e!==t;){const t=b(o),e=o.getBoundingClientRect(),i=getComputedStyle(o);e.x+=(o.clientLeft+parseFloat(i.paddingLeft))*t.x,e.y+=(o.clientTop+parseFloat(i.paddingTop))*t.y,d*=t.x,a*=t.y,h*=t.x,p*=t.y,d+=e.x,a+=e.y,o=n(o).frameElement}}return e.rectToClientRect({width:h,height:p,x:d,y:a})}function O(t){return((i(t)?t.ownerDocument:t.document)||window.document).documentElement}function P(t){return l(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function R(t){return T(O(t)).left+P(t).scrollLeft}function E(t){if("html"===r(t))return t;const e=t.assignedSlot||t.parentNode||f(t)&&t.host||O(t);return f(e)?e.host:e}function S(t){const e=E(t);return h(e)?e.ownerDocument.body:c(e)&&s(e)?e:S(e)}function C(t,e){var o;void 0===e&&(e=[]);const i=S(t),r=i===(null==(o=t.ownerDocument)?void 0:o.body),c=n(i);return r?e.concat(c,c.visualViewport||[],s(i)?i:[]):e.concat(i,C(i))}function F(t,i,r){let f;if("viewport"===i)f=function(t,e){const o=n(t),i=O(t),r=o.visualViewport;let c=i.clientWidth,l=i.clientHeight,f=0,s=0;if(r){c=r.width,l=r.height;const t=a();(!t||t&&"fixed"===e)&&(f=r.offsetLeft,s=r.offsetTop)}return{width:c,height:l,x:f,y:s}}(t,r);else if("document"===i)f=function(t){const e=O(t),n=P(t),i=t.ownerDocument.body,r=g(e.scrollWidth,e.clientWidth,i.scrollWidth,i.clientWidth),c=g(e.scrollHeight,e.clientHeight,i.scrollHeight,i.clientHeight);let l=-n.scrollLeft+R(t);const f=-n.scrollTop;return"rtl"===o(i).direction&&(l+=g(e.clientWidth,i.clientWidth)-r),{width:r,height:c,x:l,y:f}}(O(t));else if(l(i))f=function(t,e){const n=T(t,!0,"fixed"===e),o=n.top+t.clientTop,i=n.left+t.clientLeft,r=c(t)?b(t):{x:1,y:1};return{width:t.clientWidth*r.x,height:t.clientHeight*r.y,x:i*r.x,y:o*r.y}}(i,r);else{const e=L(t);f={...i,x:i.x-e.x,y:i.y-e.y}}return e.rectToClientRect(f)}function j(t,e){const n=E(t);return!(n===e||!l(n)||h(n))&&("fixed"===o(n).position||j(n,e))}function D(t,e){return c(t)&&"fixed"!==o(t).position?e?e(t):t.offsetParent:null}function W(t,e){const i=n(t);if(!c(t))return i;let l=D(t,e);for(;l&&u(l)&&"static"===o(l).position;)l=D(l,e);return l&&("html"===r(l)||"body"===r(l)&&"static"===o(l).position&&!d(l))?i:l||function(t){let e=E(t);for(;c(e)&&!h(e);){if(d(e))return e;e=E(e)}return null}(t)||i}function H(t,e,n){const o=c(e),i=O(e),l="fixed"===n,f=T(t,!0,l,e);let u={scrollLeft:0,scrollTop:0};const d={x:0,y:0};if(o||!o&&!l)if(("body"!==r(e)||s(i))&&(u=P(e)),c(e)){const t=T(e,!0,l,e);d.x=t.x+e.clientLeft,d.y=t.y+e.clientTop}else i&&(d.x=R(i));return{x:f.left+u.scrollLeft-d.x,y:f.top+u.scrollTop-d.y,width:f.width,height:f.height}}const z={getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:i,strategy:c}=t;const f="clippingAncestors"===n?function(t,e){const n=e.get(t);if(n)return n;let i=C(t).filter((t=>l(t)&&"body"!==r(t))),c=null;const f="fixed"===o(t).position;let u=f?E(t):t;for(;l(u)&&!h(u);){const e=o(u),n=d(u);n||"fixed"!==e.position||(c=null),(f?!n&&!c:!n&&"static"===e.position&&c&&["absolute","fixed"].includes(c.position)||s(u)&&!n&&j(t,u))?i=i.filter((t=>t!==u)):c=e,u=E(u)}return e.set(t,i),i}(e,this._c):[].concat(n),u=[...f,i],a=u[0],m=u.reduce(((t,n)=>{const o=F(e,n,c);return t.top=g(o.top,t.top),t.right=p(o.right,t.right),t.bottom=p(o.bottom,t.bottom),t.left=g(o.left,t.left),t}),F(e,a,c));return{width:m.right-m.left,height:m.bottom-m.top,x:m.left,y:m.top}},convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{rect:e,offsetParent:n,strategy:o}=t;const i=c(n),l=O(n);if(n===l)return e;let f={scrollLeft:0,scrollTop:0},u={x:1,y:1};const d={x:0,y:0};if((i||!i&&"fixed"!==o)&&(("body"!==r(n)||s(l))&&(f=P(n)),c(n))){const t=T(n);u=b(n),d.x=t.x+n.clientLeft,d.y=t.y+n.clientTop}return{width:e.width*u.x,height:e.height*u.y,x:e.x*u.x-f.scrollLeft*u.x+d.x,y:e.y*u.y-f.scrollTop*u.y+d.y}},isElement:l,getDimensions:function(t){return y(t)},getOffsetParent:W,getDocumentElement:O,getScale:b,async getElementRects(t){let{reference:e,floating:n,strategy:o}=t;const i=this.getOffsetParent||W,r=this.getDimensions;return{reference:H(e,await i(n),o),floating:{x:0,y:0,...await r(n)}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>"rtl"===o(t).direction};Object.defineProperty(t,"arrow",{enumerable:!0,get:function(){return e.arrow}}),Object.defineProperty(t,"autoPlacement",{enumerable:!0,get:function(){return e.autoPlacement}}),Object.defineProperty(t,"detectOverflow",{enumerable:!0,get:function(){return e.detectOverflow}}),Object.defineProperty(t,"flip",{enumerable:!0,get:function(){return e.flip}}),Object.defineProperty(t,"hide",{enumerable:!0,get:function(){return e.hide}}),Object.defineProperty(t,"inline",{enumerable:!0,get:function(){return e.inline}}),Object.defineProperty(t,"limitShift",{enumerable:!0,get:function(){return e.limitShift}}),Object.defineProperty(t,"offset",{enumerable:!0,get:function(){return e.offset}}),Object.defineProperty(t,"shift",{enumerable:!0,get:function(){return e.shift}}),Object.defineProperty(t,"size",{enumerable:!0,get:function(){return e.size}}),t.autoUpdate=function(t,e,n,o){void 0===o&&(o={});const{ancestorScroll:i=!0,ancestorResize:r=!0,elementResize:c=!0,animationFrame:f=!1}=o,s=i||r?[...l(t)?C(t):t.contextElement?C(t.contextElement):[],...C(e)]:[];s.forEach((t=>{const e=!l(t)&&t.toString().includes("V");!i||f&&!e||t.addEventListener("scroll",n,{passive:!0}),r&&t.addEventListener("resize",n)}));let u,d=null;c&&(d=new ResizeObserver((()=>{n()})),l(t)&&!f&&d.observe(t),l(t)||!t.contextElement||f||d.observe(t.contextElement),d.observe(e));let a=f?T(t):null;return f&&function e(){const o=T(t);!a||o.x===a.x&&o.y===a.y&&o.width===a.width&&o.height===a.height||n();a=o,u=requestAnimationFrame(e)}(),n(),()=>{var t;s.forEach((t=>{i&&t.removeEventListener("scroll",n),r&&t.removeEventListener("resize",n)})),null==(t=d)||t.disconnect(),d=null,f&&cancelAnimationFrame(u)}},t.computePosition=(t,n,o)=>{const i=new Map,r={platform:z,...o},c={...r.platform,_c:i};return e.computePosition(t,n,{...r,platform:c})},t.getOverflowAncestors=C,t.platform=z,Object.defineProperty(t,"__esModule",{value:!0})})); | ||
| !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@floating-ui/core")):"function"==typeof define&&define.amd?define(["exports","@floating-ui/core"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).FloatingUIDOM={},t.FloatingUICore)}(this,(function(t,e){"use strict";function n(t){var e;return(null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function o(t){return n(t).getComputedStyle(t)}function i(t){return t instanceof n(t).Node}function r(t){return i(t)?(t.nodeName||"").toLowerCase():"#document"}function c(t){return t instanceof n(t).HTMLElement}function l(t){return t instanceof n(t).Element}function f(t){return"undefined"!=typeof ShadowRoot&&(t instanceof n(t).ShadowRoot||t instanceof ShadowRoot)}function s(t){const{overflow:e,overflowX:n,overflowY:i,display:r}=o(t);return/auto|scroll|overlay|hidden|clip/.test(e+i+n)&&!["inline","contents"].includes(r)}function u(t){return["table","td","th"].includes(r(t))}function d(t){const e=a(),n=o(t);return"none"!==n.transform||"none"!==n.perspective||!e&&!!n.backdropFilter&&"none"!==n.backdropFilter||!e&&!!n.filter&&"none"!==n.filter||["transform","perspective","filter"].some((t=>(n.willChange||"").includes(t)))||["paint","layout","strict","content"].some((t=>(n.contain||"").includes(t)))}function a(){return!("undefined"==typeof CSS||!CSS.supports)&&CSS.supports("-webkit-backdrop-filter","none")}function h(t){return["html","body","#document"].includes(r(t))}const p=Math.min,g=Math.max,m=Math.round,y=Math.floor,w=t=>({x:t,y:t});function x(t){const e=o(t);let n=parseFloat(e.width)||0,i=parseFloat(e.height)||0;const r=c(t),l=r?t.offsetWidth:n,f=r?t.offsetHeight:i,s=m(n)!==l||m(i)!==f;return s&&(n=l,i=f),{width:n,height:i,$:s}}function b(t){return l(t)?t:t.contextElement}function v(t){const e=b(t);if(!c(e))return w(1);const n=e.getBoundingClientRect(),{width:o,height:i,$:r}=x(e);let l=(r?m(n.width):n.width)/o,f=(r?m(n.height):n.height)/i;return l&&Number.isFinite(l)||(l=1),f&&Number.isFinite(f)||(f=1),{x:l,y:f}}const L=w(0);function O(t,e,o){var i,r;if(void 0===e&&(e=!0),!a())return L;const c=t?n(t):window;return!o||e&&o!==c?L:{x:(null==(i=c.visualViewport)?void 0:i.offsetLeft)||0,y:(null==(r=c.visualViewport)?void 0:r.offsetTop)||0}}function R(t,o,i,r){void 0===o&&(o=!1),void 0===i&&(i=!1);const c=t.getBoundingClientRect(),f=b(t);let s=w(1);o&&(r?l(r)&&(s=v(r)):s=v(t));const u=O(f,i,r);let d=(c.left+u.x)/s.x,a=(c.top+u.y)/s.y,h=c.width/s.x,p=c.height/s.y;if(f){const t=n(f),e=r&&l(r)?n(r):r;let o=t.frameElement;for(;o&&r&&e!==t;){const t=v(o),e=o.getBoundingClientRect(),i=getComputedStyle(o),r=e.left+(o.clientLeft+parseFloat(i.paddingLeft))*t.x,c=e.top+(o.clientTop+parseFloat(i.paddingTop))*t.y;d*=t.x,a*=t.y,h*=t.x,p*=t.y,d+=r,a+=c,o=n(o).frameElement}}return e.rectToClientRect({width:h,height:p,x:d,y:a})}function T(t){return((i(t)?t.ownerDocument:t.document)||window.document).documentElement}function P(t){return l(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function C(t){return R(T(t)).left+P(t).scrollLeft}function S(t){if("html"===r(t))return t;const e=t.assignedSlot||t.parentNode||f(t)&&t.host||T(t);return f(e)?e.host:e}function E(t){const e=S(t);return h(e)?t.ownerDocument?t.ownerDocument.body:t.body:c(e)&&s(e)?e:E(e)}function F(t,e){var o;void 0===e&&(e=[]);const i=E(t),r=i===(null==(o=t.ownerDocument)?void 0:o.body),c=n(i);return r?e.concat(c,c.visualViewport||[],s(i)?i:[]):e.concat(i,F(i))}function j(t,i,r){let f;if("viewport"===i)f=function(t,e){const o=n(t),i=T(t),r=o.visualViewport;let c=i.clientWidth,l=i.clientHeight,f=0,s=0;if(r){c=r.width,l=r.height;const t=a();(!t||t&&"fixed"===e)&&(f=r.offsetLeft,s=r.offsetTop)}return{width:c,height:l,x:f,y:s}}(t,r);else if("document"===i)f=function(t){const e=T(t),n=P(t),i=t.ownerDocument.body,r=g(e.scrollWidth,e.clientWidth,i.scrollWidth,i.clientWidth),c=g(e.scrollHeight,e.clientHeight,i.scrollHeight,i.clientHeight);let l=-n.scrollLeft+C(t);const f=-n.scrollTop;return"rtl"===o(i).direction&&(l+=g(e.clientWidth,i.clientWidth)-r),{width:r,height:c,x:l,y:f}}(T(t));else if(l(i))f=function(t,e){const n=R(t,!0,"fixed"===e),o=n.top+t.clientTop,i=n.left+t.clientLeft,r=c(t)?v(t):w(1);return{width:t.clientWidth*r.x,height:t.clientHeight*r.y,x:i*r.x,y:o*r.y}}(i,r);else{const e=O(t);f={...i,x:i.x-e.x,y:i.y-e.y}}return e.rectToClientRect(f)}function D(t,e){const n=S(t);return!(n===e||!l(n)||h(n))&&("fixed"===o(n).position||D(n,e))}function W(t,e){return c(t)&&"fixed"!==o(t).position?e?e(t):t.offsetParent:null}function H(t,e){const i=n(t);if(!c(t))return i;let l=W(t,e);for(;l&&u(l)&&"static"===o(l).position;)l=W(l,e);return l&&("html"===r(l)||"body"===r(l)&&"static"===o(l).position&&!d(l))?i:l||function(t){let e=S(t);for(;c(e)&&!h(e);){if(d(e))return e;e=S(e)}return null}(t)||i}function M(t,e,n){const o=c(e),i=T(e),l="fixed"===n,f=R(t,!0,l,e);let u={scrollLeft:0,scrollTop:0};const d=w(0);if(o||!o&&!l)if(("body"!==r(e)||s(i))&&(u=P(e)),c(e)){const t=R(e,!0,l,e);d.x=t.x+e.clientLeft,d.y=t.y+e.clientTop}else i&&(d.x=C(i));return{x:f.left+u.scrollLeft-d.x,y:f.top+u.scrollTop-d.y,width:f.width,height:f.height}}const z={getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:i,strategy:c}=t;const f="clippingAncestors"===n?function(t,e){const n=e.get(t);if(n)return n;let i=F(t).filter((t=>l(t)&&"body"!==r(t))),c=null;const f="fixed"===o(t).position;let u=f?S(t):t;for(;l(u)&&!h(u);){const e=o(u),n=d(u);n||"fixed"!==e.position||(c=null),(f?!n&&!c:!n&&"static"===e.position&&c&&["absolute","fixed"].includes(c.position)||s(u)&&!n&&D(t,u))?i=i.filter((t=>t!==u)):c=e,u=S(u)}return e.set(t,i),i}(e,this._c):[].concat(n),u=[...f,i],a=u[0],m=u.reduce(((t,n)=>{const o=j(e,n,c);return t.top=g(o.top,t.top),t.right=p(o.right,t.right),t.bottom=p(o.bottom,t.bottom),t.left=g(o.left,t.left),t}),j(e,a,c));return{width:m.right-m.left,height:m.bottom-m.top,x:m.left,y:m.top}},convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{rect:e,offsetParent:n,strategy:o}=t;const i=c(n),l=T(n);if(n===l)return e;let f={scrollLeft:0,scrollTop:0},u=w(1);const d=w(0);if((i||!i&&"fixed"!==o)&&(("body"!==r(n)||s(l))&&(f=P(n)),c(n))){const t=R(n);u=v(n),d.x=t.x+n.clientLeft,d.y=t.y+n.clientTop}return{width:e.width*u.x,height:e.height*u.y,x:e.x*u.x-f.scrollLeft*u.x+d.x,y:e.y*u.y-f.scrollTop*u.y+d.y}},isElement:l,getDimensions:function(t){return x(t)},getOffsetParent:H,getDocumentElement:T,getScale:v,async getElementRects(t){let{reference:e,floating:n,strategy:o}=t;const i=this.getOffsetParent||H,r=this.getDimensions;return{reference:M(e,await i(n),o),floating:{x:0,y:0,...await r(n)}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>"rtl"===o(t).direction};Object.defineProperty(t,"arrow",{enumerable:!0,get:function(){return e.arrow}}),Object.defineProperty(t,"autoPlacement",{enumerable:!0,get:function(){return e.autoPlacement}}),Object.defineProperty(t,"detectOverflow",{enumerable:!0,get:function(){return e.detectOverflow}}),Object.defineProperty(t,"flip",{enumerable:!0,get:function(){return e.flip}}),Object.defineProperty(t,"hide",{enumerable:!0,get:function(){return e.hide}}),Object.defineProperty(t,"inline",{enumerable:!0,get:function(){return e.inline}}),Object.defineProperty(t,"limitShift",{enumerable:!0,get:function(){return e.limitShift}}),Object.defineProperty(t,"offset",{enumerable:!0,get:function(){return e.offset}}),Object.defineProperty(t,"shift",{enumerable:!0,get:function(){return e.shift}}),Object.defineProperty(t,"size",{enumerable:!0,get:function(){return e.size}}),t.autoUpdate=function(t,e,n,o){void 0===o&&(o={});const{ancestorScroll:i=!0,ancestorResize:r=!0,elementResize:c=!0,layoutShift:l="function"==typeof IntersectionObserver,animationFrame:f=!1}=o,s=b(t),u=i||r?[...s?F(s):[],...F(e)]:[];u.forEach((t=>{i&&t.addEventListener("scroll",n,{passive:!0}),r&&t.addEventListener("resize",n)}));const d=s&&l?function(t,e){let n=null;const o=T(t);function i(){n&&n.disconnect(),n=null}return function r(c){void 0===c&&(c=!1),i();const{left:l,top:f,width:s,height:u}=t.getBoundingClientRect();if(c||e(),!s||!u)return;const d=y(f),a=y(o.clientWidth-(l+s)),h=y(o.clientHeight-(f+u)),p=y(l);let g=!0;n=new IntersectionObserver((t=>{1===t[0].intersectionRatio||g||r(),g=!1}),{rootMargin:-d+"px "+-a+"px "+-h+"px "+-p+"px",threshold:1}),n.observe(t)}(!0),i}(s,n):null;let a,h=null;c&&(h=new ResizeObserver(n),s&&!f&&h.observe(s),h.observe(e));let p=f?R(t):null;return f&&function e(){const o=R(t);!p||o.x===p.x&&o.y===p.y&&o.width===p.width&&o.height===p.height||n();p=o,a=requestAnimationFrame(e)}(),n(),()=>{u.forEach((t=>{i&&t.removeEventListener("scroll",n),r&&t.removeEventListener("resize",n)})),d&&d(),h&&h.disconnect(),h=null,f&&cancelAnimationFrame(a)}},t.computePosition=(t,n,o)=>{const i=new Map,r={platform:z,...o},c={...r.platform,_c:i};return e.computePosition(t,n,{...r,platform:c})},t.getOverflowAncestors=F,t.platform=z,Object.defineProperty(t,"__esModule",{value:!0})})); |
| { | ||
| "name": "@floating-ui/dom", | ||
| "version": "1.3.0", | ||
| "version": "1.4.0", | ||
| "@rollingversions": { | ||
@@ -63,3 +63,3 @@ "baseVersion": [ | ||
| "dependencies": { | ||
| "@floating-ui/core": "^1.3.0" | ||
| "@floating-ui/core": "^1.3.1" | ||
| }, | ||
@@ -66,0 +66,0 @@ "devDependencies": { |
@@ -21,4 +21,10 @@ import type { FloatingElement, ReferenceElement } from './types'; | ||
| /** | ||
| * Whether to update on every animation frame if necessary. Optimized for | ||
| * performance so updates are only called when necessary, but use sparingly. | ||
| * Whether to update the position when the reference relocated on the screen | ||
| * due to layout shift. | ||
| * @default true | ||
| */ | ||
| layoutShift: boolean; | ||
| /** | ||
| * Whether to update on every animation frame if necessary. Only use if you | ||
| * need to update the position in response to an animation using transforms. | ||
| * @default false | ||
@@ -25,0 +31,0 @@ */ |
| import type { Dimensions } from '@floating-ui/core'; | ||
| export declare function getCssDimensions(element: Element): Dimensions & { | ||
| fallback: boolean; | ||
| $: boolean; | ||
| }; |
| import type { Coords } from '@floating-ui/core'; | ||
| import type { VirtualElement } from '../types'; | ||
| export declare const FALLBACK_SCALE: { | ||
| x: number; | ||
| y: number; | ||
| }; | ||
| export declare function getScale(element: Element | VirtualElement): Coords; |
| export declare const min: (...values: number[]) => number; | ||
| export declare const max: (...values: number[]) => number; | ||
| export declare const round: (x: number) => number; | ||
| export declare const floor: (x: number) => number; | ||
| export declare const createEmptyCoords: (v: number) => { | ||
| x: number; | ||
| y: number; | ||
| }; |
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
No alert changes
Improved metrics
- Total package byte prevSize
129639
4.08%- Lines of code
3023
4.46%Dependency changes
Updated
@floating-ui/core@^1.3.1