@elliemae/ds-floating-context 3.57.6 → 3.57.7

package/dist/cjs/utils/computePosition.js

@@ -34,78 +34,61 @@ module.exports = __toCommonJS(computePosition_exports);
 var React = __toESM(require("react"));
 var import_getExpandedFallbackPlacements = require("./getExpandedFallbackPlacements.js");
 var import_getArrowOffset = require("./getArrowOffset.js");
-var import_getOppositePlacement = __toESM(require("./getOppositePlacement.js"));
 var import_detectOverflow = require("./detectOverflow.js");
-const findFixedParent = (el) => {
-  let element = el;
-  while (element && element !== document.body) {
-    const style = getComputedStyle(element);
-    if (style.position === "fixed" || style.position === "absolute") {
-      return element;
-    }
-    element = element.parentElement;
-  }
-  return null;
-};
-const adjustForFixedParent = (child) => {
-  const fixedParent = findFixedParent(child);
-  if (fixedParent) {
-    const rect = fixedParent.getBoundingClientRect();
-    return { top: rect.top, left: rect.left };
-  }
-  return {
-    top: 0,
-    left: 0
-  };
-};
+var import_floatingPositioning = require("./floatingPositioning.js");
 const computePosition = (props) => {
   const { reference, floating, placement, placementOrderPreference, customOffset, withoutPortal } = props;
-  const scrollBarY = window.innerHeight - document.documentElement.clientHeight;
-  const parentOffsets = withoutPortal ? adjustForFixedParent(reference) : {
-    top: 0,
-    left: 0
-  };
+  const parentOffsets = withoutPortal ? (0, import_floatingPositioning.adjustForFixedParent)(reference) : { top: 0, left: 0 };
   const referenceRect = reference.getBoundingClientRect();
   const floatingRect = floating.getBoundingClientRect();
-  const variationPlacement = placement.split("-")[1];
   const fallbackPlacements = placementOrderPreference || (0, import_getExpandedFallbackPlacements.getExpandedFallbackPlacements)(placement);
-  const coords = {};
+  const placements = (0, import_floatingPositioning.expandWithVariations)(
+    [placement].concat(fallbackPlacements)
+  );
+  const clippingParent = withoutPortal ? (0, import_floatingPositioning.getClippingParent)(reference) : null;
+  const clippingRect = clippingParent ? clippingParent.getBoundingClientRect() : (0, import_floatingPositioning.getViewportRect)();
   let isVertical = false;
-  const placements = [placement].concat(fallbackPlacements);
-  let finalPlacement = "";
+  let bestPlacement = placement;
+  let bestOverflows = null;
+  let bestScore = { total: Number.POSITIVE_INFINITY, maxSide: Number.POSITIVE_INFINITY };
+  let bestIsVertical = false;
   for (let i = 0; i < placements.length; i += 1) {
     const currentPlacement = placements[i];
-    const currentBasePlacement = currentPlacement.split("-")[0];
-    isVertical = ["top", "bottom"].indexOf(currentBasePlacement) >= 0;
-    const overflows = (0, import_detectOverflow.detectOverflow)(referenceRect, floatingRect, currentPlacement, customOffset);
-    const checks = [];
-    const isStartVariation = variationPlacement === "start";
-    let mainVariationSide = isVertical ? isStartVariation ? "right" : "left" : isStartVariation ? "bottom" : "top";
-    const len = isVertical ? "width" : "height";
-    if (referenceRect[len] > floatingRect[len]) {
-      mainVariationSide = (0, import_getOppositePlacement.default)(mainVariationSide);
-    }
-    const altVariationSide = (0, import_getOppositePlacement.default)(mainVariationSide);
-    checks.push(overflows[currentBasePlacement] <= 0);
-    checks.push(overflows[mainVariationSide] <= 0, overflows[altVariationSide] <= 0);
-    if (checks.every((check) => {
-      return check;
-    })) {
-      coords.top = -overflows.top + window.scrollY - parentOffsets.top + scrollBarY;
-      coords.left = -overflows.left + window.scrollX - parentOffsets.left;
-      finalPlacement = currentPlacement;
+    const base = currentPlacement.split("-")[0];
+    const currentIsVertical = base === "top" || base === "bottom";
+    const overflows2 = (0, import_detectOverflow.detectOverflow)(referenceRect, floatingRect, currentPlacement, customOffset, clippingRect);
+    if ((0, import_floatingPositioning.fits)(overflows2)) {
+      bestPlacement = currentPlacement;
+      bestOverflows = overflows2;
+      bestIsVertical = currentIsVertical;
       break;
     }
+    const score = (0, import_floatingPositioning.getOverflowScore)(overflows2);
+    const isBetter = score.maxSide < bestScore.maxSide || score.maxSide === bestScore.maxSide && score.total < bestScore.total;
+    if (isBetter) {
+      bestPlacement = currentPlacement;
+      bestOverflows = overflows2;
+      bestScore = score;
+      bestIsVertical = currentIsVertical;
+    }
   }
-  if (!finalPlacement) {
-    finalPlacement = placement;
-    const overflows = (0, import_detectOverflow.detectOverflow)(referenceRect, floatingRect, placement, customOffset);
-    coords.top = -overflows.top + window.scrollY - parentOffsets.top;
-    coords.left = -overflows.left + window.scrollX - parentOffsets.left;
+  const finalPlacement = bestPlacement;
+  isVertical = bestIsVertical;
+  const overflows = bestOverflows ?? (0, import_detectOverflow.detectOverflow)(referenceRect, floatingRect, finalPlacement, customOffset, clippingRect);
+  let x = -overflows.left - parentOffsets.left;
+  let y = -overflows.top - parentOffsets.top;
+  if (!withoutPortal) {
+    x += window.scrollX;
+    y += window.scrollY;
+  } else {
+    const op = (0, import_floatingPositioning.getOffsetParentData)(floating);
+    x = x - op.left + op.scrollLeft;
+    y = y - op.top + op.scrollTop;
   }
+  ({ x, y } = (0, import_floatingPositioning.applyShift)(x, y, overflows));
   return {
     coordsStyle: {
-      transform: `translate3d(${Math.round(coords.left ?? 0)}px, ${Math.round(coords.top ?? 0)}px, 0)`,
+      transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,
       top: 0,
       left: 0
     },

package/dist/cjs/utils/computePosition.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/utils/computePosition.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable no-nested-ternary */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable @typescript-eslint/no-use-before-define */\n/* eslint-disable max-params */\n/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable arrow-body-style */\nimport type { DSHookFloatingContextT } from '../react-desc-prop-types.js';\nimport { getExpandedFallbackPlacements } from './getExpandedFallbackPlacements.js';\nimport { getArrowOffset } from './getArrowOffset.js';\nimport getOppositePlacement from './getOppositePlacement.js';\nimport { detectOverflow } from './detectOverflow.js';\n\ninterface ComputePositionProps {\n  reference: Element;\n  floating: HTMLElement;\n  placement: DSHookFloatingContextT.PopperPlacementsT;\n  placementOrderPreference?: DSHookFloatingContextT.PopperPlacementsT[];\n  customOffset: [number, number];\n  withoutPortal: boolean;\n}\n\nconst findFixedParent = (el: Element | null) => {\n  let element = el;\n  while (element && element !== document.body) {\n    const style = getComputedStyle(element);\n    if (style.position === 'fixed' || style.position === 'absolute') {\n      return element;\n    }\n    element = element.parentElement;\n  }\n  return null;\n};\n\nconst adjustForFixedParent = (child: Element) => {\n  const fixedParent = findFixedParent(child);\n  if (fixedParent) {\n    const rect = fixedParent.getBoundingClientRect();\n    return { top: rect.top, left: rect.left };\n  }\n  return {\n    top: 0,\n    left: 0,\n  };\n};\n\nexport const computePosition = (props: ComputePositionProps) => {\n  const { reference, floating, placement, placementOrderPreference, customOffset, withoutPortal } = props;\n\n  const scrollBarY = window.innerHeight - document.documentElement.clientHeight;\n\n  const parentOffsets = withoutPortal\n    ? adjustForFixedParent(reference)\n    : {\n        top: 0,\n        left: 0,\n      };\n  const referenceRect = reference.getBoundingClientRect();\n  const floatingRect = floating.getBoundingClientRect();\n\n  const variationPlacement = placement.split('-')[1];\n  const fallbackPlacements = placementOrderPreference || getExpandedFallbackPlacements(placement);\n\n  const coords: { top?: number; left?: number; bottom?: number; right?: number } = {};\n\n  let isVertical = false;\n  const placements = [placement].concat(fallbackPlacements as DSHookFloatingContextT.PopperPlacementsT[]);\n  let finalPlacement = '';\n\n  for (let i = 0; i < placements.length; i += 1) {\n    const currentPlacement = placements[i];\n\n    const currentBasePlacement = currentPlacement.split('-')[0] as keyof typeof coords;\n    isVertical = ['top', 'bottom'].indexOf(currentBasePlacement) >= 0;\n\n    const overflows = detectOverflow(referenceRect, floatingRect, currentPlacement, customOffset);\n\n    const checks: boolean[] = [];\n\n    const isStartVariation = variationPlacement === 'start';\n\n    let mainVariationSide: keyof typeof coords = isVertical\n      ? isStartVariation\n        ? 'right'\n        : 'left'\n      : isStartVariation\n        ? 'bottom'\n        : 'top';\n\n    const len = isVertical ? 'width' : 'height';\n\n    if (referenceRect[len] > floatingRect[len]) {\n      mainVariationSide = getOppositePlacement(mainVariationSide) as keyof typeof coords;\n    }\n\n    const altVariationSide = getOppositePlacement(mainVariationSide) as keyof typeof coords;\n\n    checks.push(overflows[currentBasePlacement] <= 0);\n    checks.push(overflows[mainVariationSide] <= 0, overflows[altVariationSide] <= 0);\n    if (\n      checks.every((check) => {\n        return check;\n      })\n    ) {\n      coords.top = -overflows.top + window.scrollY - parentOffsets.top + scrollBarY;\n      coords.left = -overflows.left + window.scrollX - parentOffsets.left;\n      finalPlacement = currentPlacement;\n\n      break;\n    }\n  }\n\n  if (!finalPlacement) {\n    // if we don't find a placement that fits, we use the original one\n    finalPlacement = placement;\n    const overflows = detectOverflow(referenceRect, floatingRect, placement, customOffset);\n    coords.top = -overflows.top + window.scrollY - parentOffsets.top;\n    coords.left = -overflows.left + window.scrollX - parentOffsets.left;\n  }\n\n  return {\n    coordsStyle: {\n      transform: `translate3d(${Math.round(coords.left ?? 0)}px, ${Math.round(coords.top ?? 0)}px, 0)`,\n      top: 0,\n      left: 0,\n    },\n    finalPlacement,\n    coordsArrow: getArrowOffset(finalPlacement, isVertical),\n  };\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": ["getOppositePlacement"]
+  "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable no-nested-ternary */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable @typescript-eslint/no-use-before-define */\n/* eslint-disable max-params */\n/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable arrow-body-style */\nimport type { DSHookFloatingContextT } from '../react-desc-prop-types.js';\nimport { getExpandedFallbackPlacements } from './getExpandedFallbackPlacements.js';\nimport { getArrowOffset } from './getArrowOffset.js';\nimport { detectOverflow } from './detectOverflow.js';\nimport {\n  applyShift,\n  adjustForFixedParent,\n  expandWithVariations,\n  fits,\n  getClippingParent,\n  getOverflowScore,\n  getOffsetParentData,\n  getViewportRect,\n  type RectLike,\n  type OverflowOffsets,\n} from './floatingPositioning.js';\n\ninterface ComputePositionProps {\n  reference: Element;\n  floating: HTMLElement;\n  placement: DSHookFloatingContextT.PopperPlacementsT;\n  placementOrderPreference?: DSHookFloatingContextT.PopperPlacementsT[];\n  customOffset: [number, number];\n  withoutPortal: boolean;\n}\n\nexport const computePosition = (props: ComputePositionProps) => {\n  const { reference, floating, placement, placementOrderPreference, customOffset, withoutPortal } = props;\n\n  // When WITHOUT portal: only apply fixed-parent offsets (absolute parents scroll and must NOT be treated as fixed)\n  const parentOffsets = withoutPortal ? adjustForFixedParent(reference) : { top: 0, left: 0 };\n\n  const referenceRect = reference.getBoundingClientRect();\n  const floatingRect = floating.getBoundingClientRect();\n\n  const fallbackPlacements = placementOrderPreference || getExpandedFallbackPlacements(placement);\n\n  const placements = expandWithVariations(\n    [placement].concat(fallbackPlacements as DSHookFloatingContextT.PopperPlacementsT[]),\n  );\n\n  // Boundary selection:\n  // - Portal => viewport (inset by body padding for Storybook)\n  // - No portal => nearest clipping/scroll container (fallback viewport rect)\n  const clippingParent = withoutPortal ? getClippingParent(reference) : null;\n  const clippingRect: RectLike = clippingParent ? clippingParent.getBoundingClientRect() : getViewportRect();\n\n  let isVertical = false;\n\n  // Best-fit selection:\n  // 1) choose first placement that fully fits\n  // 2) otherwise choose placement with smallest max overflow, tie-break by total overflow\n  let bestPlacement = placement;\n  let bestOverflows: OverflowOffsets | null = null;\n  let bestScore = { total: Number.POSITIVE_INFINITY, maxSide: Number.POSITIVE_INFINITY };\n  let bestIsVertical = false;\n\n  for (let i = 0; i < placements.length; i += 1) {\n    const currentPlacement = placements[i];\n    const base = currentPlacement.split('-')[0];\n    const currentIsVertical = base === 'top' || base === 'bottom';\n\n    const overflows = detectOverflow(referenceRect, floatingRect, currentPlacement, customOffset, clippingRect);\n\n    if (fits(overflows)) {\n      bestPlacement = currentPlacement;\n      bestOverflows = overflows;\n      bestIsVertical = currentIsVertical;\n      break;\n    }\n\n    const score = getOverflowScore(overflows);\n\n    const isBetter =\n      score.maxSide < bestScore.maxSide || (score.maxSide === bestScore.maxSide && score.total < bestScore.total);\n\n    if (isBetter) {\n      bestPlacement = currentPlacement;\n      bestOverflows = overflows;\n      bestScore = score;\n      bestIsVertical = currentIsVertical;\n    }\n  }\n\n  const finalPlacement = bestPlacement;\n  isVertical = bestIsVertical;\n\n  const overflows =\n    bestOverflows ?? detectOverflow(referenceRect, floatingRect, finalPlacement, customOffset, clippingRect);\n\n  // Convert overflow -> coordinates.\n  // detectOverflow uses viewport/clipping-rect coordinates.\n  //\n  // - If tooltip is rendered IN A PORTAL (withoutPortal === false) and is positioned with `position: absolute`,\n  //   convert viewport coords to page coords by adding window.scrollX/Y.\n  //\n  // - If tooltip is rendered WITHOUT portal, convert viewport coords to offsetParent coords\n  //   (subtract offsetParent rect, add its scroll).\n  let x = -overflows.left - parentOffsets.left;\n  let y = -overflows.top - parentOffsets.top;\n\n  if (!withoutPortal) {\n    x += window.scrollX;\n    y += window.scrollY;\n  } else {\n    const op = getOffsetParentData(floating);\n    x = x - op.left + op.scrollLeft;\n    y = y - op.top + op.scrollTop;\n  }\n\n  // Always shift back inside boundary\n  ({ x, y } = applyShift(x, y, overflows));\n\n  return {\n    coordsStyle: {\n      transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n      top: 0,\n      left: 0,\n    },\n    finalPlacement,\n    coordsArrow: getArrowOffset(finalPlacement, isVertical),\n  };\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADSvB,2CAA8C;AAC9C,4BAA+B;AAC/B,4BAA+B;AAC/B,iCAWO;AAWA,MAAM,kBAAkB,CAAC,UAAgC;AAC9D,QAAM,EAAE,WAAW,UAAU,WAAW,0BAA0B,cAAc,cAAc,IAAI;AAGlG,QAAM,gBAAgB,oBAAgB,iDAAqB,SAAS,IAAI,EAAE,KAAK,GAAG,MAAM,EAAE;AAE1F,QAAM,gBAAgB,UAAU,sBAAsB;AACtD,QAAM,eAAe,SAAS,sBAAsB;AAEpD,QAAM,qBAAqB,gCAA4B,oEAA8B,SAAS;AAE9F,QAAM,iBAAa;AAAA,IACjB,CAAC,SAAS,EAAE,OAAO,kBAAgE;AAAA,EACrF;AAKA,QAAM,iBAAiB,oBAAgB,8CAAkB,SAAS,IAAI;AACtE,QAAM,eAAyB,iBAAiB,eAAe,sBAAsB,QAAI,4CAAgB;AAEzG,MAAI,aAAa;AAKjB,MAAI,gBAAgB;AACpB,MAAI,gBAAwC;AAC5C,MAAI,YAAY,EAAE,OAAO,OAAO,mBAAmB,SAAS,OAAO,kBAAkB;AACrF,MAAI,iBAAiB;AAErB,WAAS,IAAI,GAAG,IAAI,WAAW,QAAQ,KAAK,GAAG;AAC7C,UAAM,mBAAmB,WAAW,CAAC;AACrC,UAAM,OAAO,iBAAiB,MAAM,GAAG,EAAE,CAAC;AAC1C,UAAM,oBAAoB,SAAS,SAAS,SAAS;AAErD,UAAMA,iBAAY,sCAAe,eAAe,cAAc,kBAAkB,cAAc,YAAY;AAE1G,YAAI,iCAAKA,UAAS,GAAG;AACnB,sBAAgB;AAChB,sBAAgBA;AAChB,uBAAiB;AACjB;AAAA,IACF;AAEA,UAAM,YAAQ,6CAAiBA,UAAS;AAExC,UAAM,WACJ,MAAM,UAAU,UAAU,WAAY,MAAM,YAAY,UAAU,WAAW,MAAM,QAAQ,UAAU;AAEvG,QAAI,UAAU;AACZ,sBAAgB;AAChB,sBAAgBA;AAChB,kBAAY;AACZ,uBAAiB;AAAA,IACnB;AAAA,EACF;AAEA,QAAM,iBAAiB;AACvB,eAAa;AAEb,QAAM,YACJ,qBAAiB,sCAAe,eAAe,cAAc,gBAAgB,cAAc,YAAY;AAUzG,MAAI,IAAI,CAAC,UAAU,OAAO,cAAc;AACxC,MAAI,IAAI,CAAC,UAAU,MAAM,cAAc;AAEvC,MAAI,CAAC,eAAe;AAClB,SAAK,OAAO;AACZ,SAAK,OAAO;AAAA,EACd,OAAO;AACL,UAAM,SAAK,gDAAoB,QAAQ;AACvC,QAAI,IAAI,GAAG,OAAO,GAAG;AACrB,QAAI,IAAI,GAAG,MAAM,GAAG;AAAA,EACtB;AAGA,GAAC,EAAE,GAAG,EAAE,QAAI,uCAAW,GAAG,GAAG,SAAS;AAEtC,SAAO;AAAA,IACL,aAAa;AAAA,MACX,WAAW,eAAe,KAAK,MAAM,CAAC,CAAC,OAAO,KAAK,MAAM,CAAC,CAAC;AAAA,MAC3D,KAAK;AAAA,MACL,MAAM;AAAA,IACR;AAAA,IACA;AAAA,IACA,iBAAa,sCAAe,gBAAgB,UAAU;AAAA,EACxD;AACF;",
+  "names": ["overflows"]
 }

package/dist/cjs/utils/detectOverflow.js

@@ -51,28 +51,27 @@ function domRectToObject(rect) {
     }
   };
 }
-const detectOverflow = (referenceRect, floatingRect, placement, customOffset) => {
+const detectOverflow = (referenceRect, floatingRect, placement, customOffset, clippingClientRect) => {
   const basePlacement = placement.split("-")[0];
   const isVertical = ["top", "bottom"].indexOf(basePlacement) >= 0;
-  const scrollBarX = window.innerWidth - document.documentElement.clientWidth;
-  const scrollBarY = window.innerHeight - document.documentElement.clientHeight;
-  const clippingClientRect = {
+  const clipping = clippingClientRect ?? {
     top: 0,
     left: 0,
-    right: document.documentElement.clientWidth + scrollBarX,
-    bottom: document.documentElement.clientHeight + scrollBarY
+    right: window.innerWidth,
+    bottom: window.innerHeight
   };
   const popperOffsets = (0, import_computeOffsets.default)(placement, referenceRect, floatingRect);
   const popperClientRect = rectToClientRect({ ...domRectToObject(floatingRect), ...popperOffsets });
   const overflowOffsets = {
-    top: clippingClientRect.top - popperClientRect.top + paddingObject.top,
-    bottom: popperClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
-    left: clippingClientRect.left - popperClientRect.left + paddingObject.left,
-    right: popperClientRect.right - clippingClientRect.right + paddingObject.right
+    top: clipping.top - popperClientRect.top + paddingObject.top,
+    bottom: popperClientRect.bottom - clipping.bottom + paddingObject.bottom,
+    left: clipping.left - popperClientRect.left + paddingObject.left,
+    right: popperClientRect.right - clipping.right + paddingObject.right
   };
   const offset = {
     x: basePlacement === "left" ? -(customOffset?.[0] ?? 12) : customOffset?.[0] ?? 12,
-    y: basePlacement === "top" ? -(customOffset?.[1] ?? -12) : customOffset?.[1] ?? 12
+    // FIX: default must be 12, not -12 (otherwise 'top' flips)
+    y: basePlacement === "top" ? -(customOffset?.[1] ?? 12) : customOffset?.[1] ?? 12
   };
   if (!isVertical) {
     const temp = offset.x;
@@ -80,8 +79,8 @@ const detectOverflow = (referenceRect, floatingRect, placement, customOffset) =>
     offset.y = temp;
   }
   Object.keys(overflowOffsets).forEach((key) => {
-    const multiply = ["right", "bottom"].indexOf(key) >= 0 ? 1 : -1;
-    const axis = ["top", "bottom"].indexOf(key) >= 0 ? "y" : "x";
+    const multiply = key === "right" || key === "bottom" ? 1 : -1;
+    const axis = key === "top" || key === "bottom" ? "y" : "x";
     overflowOffsets[key] += offset[axis] * multiply;
   });
   return overflowOffsets;

package/dist/cjs/utils/detectOverflow.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/utils/detectOverflow.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable no-nested-ternary */\n/* eslint-disable max-params */\nimport { type DSHookFloatingContextT } from '../react-desc-prop-types.js';\nimport computeOffsets from './computeOffsets.js';\n\nconst paddingObject = { top: 0, right: 0, bottom: 0, left: 0 };\n\nfunction rectToClientRect(rect: DOMRect) {\n  return { ...rect, left: rect.x, top: rect.y, right: rect.x + rect.width, bottom: rect.y + rect.height };\n}\n\nfunction domRectToObject(rect: {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n}): DOMRect {\n  return {\n    x: rect.x,\n    y: rect.y,\n    width: rect.width,\n    height: rect.height,\n    top: rect.top,\n    right: rect.right,\n    bottom: rect.bottom,\n    left: rect.left,\n    toJSON: () => {},\n  };\n}\n\nexport const detectOverflow = (\n  referenceRect: DOMRect,\n  floatingRect: DOMRect,\n  placement: DSHookFloatingContextT.PopperPlacementsT,\n  customOffset: [number, number],\n) => {\n  const basePlacement = placement.split('-')[0];\n  const isVertical = ['top', 'bottom'].indexOf(basePlacement) >= 0;\n\n  const scrollBarX = window.innerWidth - document.documentElement.clientWidth;\n  const scrollBarY = window.innerHeight - document.documentElement.clientHeight;\n\n  const clippingClientRect = {\n    top: 0,\n    left: 0,\n    right: document.documentElement.clientWidth + scrollBarX,\n    bottom: document.documentElement.clientHeight + scrollBarY,\n  };\n\n  const popperOffsets = computeOffsets(placement, referenceRect, floatingRect);\n  const popperClientRect = rectToClientRect({ ...domRectToObject(floatingRect), ...popperOffsets });\n\n  const overflowOffsets = {\n    top: clippingClientRect.top - popperClientRect.top + paddingObject.top,\n    bottom: popperClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,\n    left: clippingClientRect.left - popperClientRect.left + paddingObject.left,\n    right: popperClientRect.right - clippingClientRect.right + paddingObject.right,\n  };\n\n  const offset = {\n    x: basePlacement === 'left' ? -(customOffset?.[0] ?? 12) : (customOffset?.[0] ?? 12),\n    y: basePlacement === 'top' ? -(customOffset?.[1] ?? -12) : (customOffset?.[1] ?? 12),\n  };\n\n  // if vertical switch x for y and vice versa\n  if (!isVertical) {\n    const temp = offset.x;\n    offset.x = offset.y * (basePlacement === 'right' ? 1 : -1);\n    offset.y = temp;\n  }\n\n  Object.keys(overflowOffsets).forEach((key) => {\n    const multiply = ['right', 'bottom'].indexOf(key) >= 0 ? 1 : -1;\n    const axis = ['top', 'bottom'].indexOf(key) >= 0 ? 'y' : 'x';\n    overflowOffsets[key as keyof typeof overflowOffsets] += offset[axis] * multiply;\n  });\n  return overflowOffsets;\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,4BAA2B;AAE3B,MAAM,gBAAgB,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;AAE7D,SAAS,iBAAiB,MAAe;AACvC,SAAO,EAAE,GAAG,MAAM,MAAM,KAAK,GAAG,KAAK,KAAK,GAAG,OAAO,KAAK,IAAI,KAAK,OAAO,QAAQ,KAAK,IAAI,KAAK,OAAO;AACxG;AAEA,SAAS,gBAAgB,MASb;AACV,SAAO;AAAA,IACL,GAAG,KAAK;AAAA,IACR,GAAG,KAAK;AAAA,IACR,OAAO,KAAK;AAAA,IACZ,QAAQ,KAAK;AAAA,IACb,KAAK,KAAK;AAAA,IACV,OAAO,KAAK;AAAA,IACZ,QAAQ,KAAK;AAAA,IACb,MAAM,KAAK;AAAA,IACX,QAAQ,MAAM;AAAA,IAAC;AAAA,EACjB;AACF;AAEO,MAAM,iBAAiB,CAC5B,eACA,cACA,WACA,iBACG;AACH,QAAM,gBAAgB,UAAU,MAAM,GAAG,EAAE,CAAC;AAC5C,QAAM,aAAa,CAAC,OAAO,QAAQ,EAAE,QAAQ,aAAa,KAAK;AAE/D,QAAM,aAAa,OAAO,aAAa,SAAS,gBAAgB;AAChE,QAAM,aAAa,OAAO,cAAc,SAAS,gBAAgB;AAEjE,QAAM,qBAAqB;AAAA,IACzB,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO,SAAS,gBAAgB,cAAc;AAAA,IAC9C,QAAQ,SAAS,gBAAgB,eAAe;AAAA,EAClD;AAEA,QAAM,oBAAgB,sBAAAA,SAAe,WAAW,eAAe,YAAY;AAC3E,QAAM,mBAAmB,iBAAiB,EAAE,GAAG,gBAAgB,YAAY,GAAG,GAAG,cAAc,CAAC;AAEhG,QAAM,kBAAkB;AAAA,IACtB,KAAK,mBAAmB,MAAM,iBAAiB,MAAM,cAAc;AAAA,IACnE,QAAQ,iBAAiB,SAAS,mBAAmB,SAAS,cAAc;AAAA,IAC5E,MAAM,mBAAmB,OAAO,iBAAiB,OAAO,cAAc;AAAA,IACtE,OAAO,iBAAiB,QAAQ,mBAAmB,QAAQ,cAAc;AAAA,EAC3E;AAEA,QAAM,SAAS;AAAA,IACb,GAAG,kBAAkB,SAAS,EAAE,eAAe,CAAC,KAAK,MAAO,eAAe,CAAC,KAAK;AAAA,IACjF,GAAG,kBAAkB,QAAQ,EAAE,eAAe,CAAC,KAAK,OAAQ,eAAe,CAAC,KAAK;AAAA,EACnF;AAGA,MAAI,CAAC,YAAY;AACf,UAAM,OAAO,OAAO;AACpB,WAAO,IAAI,OAAO,KAAK,kBAAkB,UAAU,IAAI;AACvD,WAAO,IAAI;AAAA,EACb;AAEA,SAAO,KAAK,eAAe,EAAE,QAAQ,CAAC,QAAQ;AAC5C,UAAM,WAAW,CAAC,SAAS,QAAQ,EAAE,QAAQ,GAAG,KAAK,IAAI,IAAI;AAC7D,UAAM,OAAO,CAAC,OAAO,QAAQ,EAAE,QAAQ,GAAG,KAAK,IAAI,MAAM;AACzD,oBAAgB,GAAmC,KAAK,OAAO,IAAI,IAAI;AAAA,EACzE,CAAC;AACD,SAAO;AACT;",
+  "sourcesContent": ["/* eslint-disable no-nested-ternary */\n/* eslint-disable max-params */\nimport { type DSHookFloatingContextT } from '../react-desc-prop-types.js';\nimport computeOffsets from './computeOffsets.js';\n\nconst paddingObject = { top: 0, right: 0, bottom: 0, left: 0 };\n\ntype RectLike = { top: number; left: number; right: number; bottom: number };\n\nfunction rectToClientRect(rect: DOMRect) {\n  return { ...rect, left: rect.x, top: rect.y, right: rect.x + rect.width, bottom: rect.y + rect.height };\n}\n\nfunction domRectToObject(rect: {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n}): DOMRect {\n  return {\n    x: rect.x,\n    y: rect.y,\n    width: rect.width,\n    height: rect.height,\n    top: rect.top,\n    right: rect.right,\n    bottom: rect.bottom,\n    left: rect.left,\n    toJSON: () => {},\n  };\n}\n\nexport const detectOverflow = (\n  referenceRect: DOMRect,\n  floatingRect: DOMRect,\n  placement: DSHookFloatingContextT.PopperPlacementsT,\n  customOffset: [number, number],\n  clippingClientRect?: RectLike,\n) => {\n  const basePlacement = placement.split('-')[0];\n  const isVertical = ['top', 'bottom'].indexOf(basePlacement) >= 0;\n\n  const clipping: RectLike = clippingClientRect ?? {\n    top: 0,\n    left: 0,\n    right: window.innerWidth,\n    bottom: window.innerHeight,\n  };\n\n  const popperOffsets = computeOffsets(placement, referenceRect, floatingRect);\n  const popperClientRect = rectToClientRect({ ...domRectToObject(floatingRect), ...popperOffsets });\n\n  const overflowOffsets = {\n    top: clipping.top - popperClientRect.top + paddingObject.top,\n    bottom: popperClientRect.bottom - clipping.bottom + paddingObject.bottom,\n    left: clipping.left - popperClientRect.left + paddingObject.left,\n    right: popperClientRect.right - clipping.right + paddingObject.right,\n  };\n\n  const offset = {\n    x: basePlacement === 'left' ? -(customOffset?.[0] ?? 12) : (customOffset?.[0] ?? 12),\n    // FIX: default must be 12, not -12 (otherwise 'top' flips)\n    y: basePlacement === 'top' ? -(customOffset?.[1] ?? 12) : (customOffset?.[1] ?? 12),\n  };\n\n  // if NOT vertical, switch x for y and vice versa\n  if (!isVertical) {\n    const temp = offset.x;\n    offset.x = offset.y * (basePlacement === 'right' ? 1 : -1);\n    offset.y = temp;\n  }\n\n  (Object.keys(overflowOffsets) as Array<keyof typeof overflowOffsets>).forEach((key) => {\n    const multiply = key === 'right' || key === 'bottom' ? 1 : -1;\n    const axis = key === 'top' || key === 'bottom' ? 'y' : 'x';\n    overflowOffsets[key] += offset[axis] * multiply;\n  });\n\n  return overflowOffsets;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,4BAA2B;AAE3B,MAAM,gBAAgB,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;AAI7D,SAAS,iBAAiB,MAAe;AACvC,SAAO,EAAE,GAAG,MAAM,MAAM,KAAK,GAAG,KAAK,KAAK,GAAG,OAAO,KAAK,IAAI,KAAK,OAAO,QAAQ,KAAK,IAAI,KAAK,OAAO;AACxG;AAEA,SAAS,gBAAgB,MASb;AACV,SAAO;AAAA,IACL,GAAG,KAAK;AAAA,IACR,GAAG,KAAK;AAAA,IACR,OAAO,KAAK;AAAA,IACZ,QAAQ,KAAK;AAAA,IACb,KAAK,KAAK;AAAA,IACV,OAAO,KAAK;AAAA,IACZ,QAAQ,KAAK;AAAA,IACb,MAAM,KAAK;AAAA,IACX,QAAQ,MAAM;AAAA,IAAC;AAAA,EACjB;AACF;AAEO,MAAM,iBAAiB,CAC5B,eACA,cACA,WACA,cACA,uBACG;AACH,QAAM,gBAAgB,UAAU,MAAM,GAAG,EAAE,CAAC;AAC5C,QAAM,aAAa,CAAC,OAAO,QAAQ,EAAE,QAAQ,aAAa,KAAK;AAE/D,QAAM,WAAqB,sBAAsB;AAAA,IAC/C,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO,OAAO;AAAA,IACd,QAAQ,OAAO;AAAA,EACjB;AAEA,QAAM,oBAAgB,sBAAAA,SAAe,WAAW,eAAe,YAAY;AAC3E,QAAM,mBAAmB,iBAAiB,EAAE,GAAG,gBAAgB,YAAY,GAAG,GAAG,cAAc,CAAC;AAEhG,QAAM,kBAAkB;AAAA,IACtB,KAAK,SAAS,MAAM,iBAAiB,MAAM,cAAc;AAAA,IACzD,QAAQ,iBAAiB,SAAS,SAAS,SAAS,cAAc;AAAA,IAClE,MAAM,SAAS,OAAO,iBAAiB,OAAO,cAAc;AAAA,IAC5D,OAAO,iBAAiB,QAAQ,SAAS,QAAQ,cAAc;AAAA,EACjE;AAEA,QAAM,SAAS;AAAA,IACb,GAAG,kBAAkB,SAAS,EAAE,eAAe,CAAC,KAAK,MAAO,eAAe,CAAC,KAAK;AAAA;AAAA,IAEjF,GAAG,kBAAkB,QAAQ,EAAE,eAAe,CAAC,KAAK,MAAO,eAAe,CAAC,KAAK;AAAA,EAClF;AAGA,MAAI,CAAC,YAAY;AACf,UAAM,OAAO,OAAO;AACpB,WAAO,IAAI,OAAO,KAAK,kBAAkB,UAAU,IAAI;AACvD,WAAO,IAAI;AAAA,EACb;AAEA,EAAC,OAAO,KAAK,eAAe,EAA0C,QAAQ,CAAC,QAAQ;AACrF,UAAM,WAAW,QAAQ,WAAW,QAAQ,WAAW,IAAI;AAC3D,UAAM,OAAO,QAAQ,SAAS,QAAQ,WAAW,MAAM;AACvD,oBAAgB,GAAG,KAAK,OAAO,IAAI,IAAI;AAAA,EACzC,CAAC;AAED,SAAO;AACT;",
   "names": ["computeOffsets"]
 }

package/dist/cjs/utils/floatingPositioning.js

@@ -0,0 +1,131 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var floatingPositioning_exports = {};
+__export(floatingPositioning_exports, {
+  adjustForFixedParent: () => adjustForFixedParent,
+  applyShift: () => applyShift,
+  expandWithVariations: () => expandWithVariations,
+  fits: () => fits,
+  getClippingParent: () => getClippingParent,
+  getOffsetParentData: () => getOffsetParentData,
+  getOverflowScore: () => getOverflowScore,
+  getViewportRect: () => getViewportRect
+});
+module.exports = __toCommonJS(floatingPositioning_exports);
+var React = __toESM(require("react"));
+const findFixedParent = (el) => {
+  let element = el;
+  while (element && element !== document.body) {
+    const style = getComputedStyle(element);
+    if (style.position === "fixed") {
+      return element;
+    }
+    element = element.parentElement;
+  }
+  return null;
+};
+const adjustForFixedParent = (child) => {
+  const fixedParent = findFixedParent(child);
+  if (fixedParent) {
+    const rect = fixedParent.getBoundingClientRect();
+    return { top: rect.top, left: rect.left };
+  }
+  return { top: 0, left: 0 };
+};
+const getClippingParent = (el) => {
+  let node = el?.parentElement ?? null;
+  while (node && node !== document.body) {
+    const style = getComputedStyle(node);
+    const overflowX = style.overflowX || style.overflow;
+    const overflowY = style.overflowY || style.overflow;
+    const clipsX = /(auto|scroll|hidden|clip)/.test(overflowX);
+    const clipsY = /(auto|scroll|hidden|clip)/.test(overflowY);
+    if (clipsX || clipsY) return node;
+    node = node.parentElement;
+  }
+  return null;
+};
+const getViewportRect = () => ({
+  top: 0,
+  left: 0,
+  right: window.innerWidth,
+  bottom: window.innerHeight
+});
+const applyShift = (x, y, overflow) => {
+  let nextX = x;
+  let nextY = y;
+  if (overflow.left > 0) nextX += overflow.left;
+  if (overflow.right > 0) nextX -= overflow.right;
+  if (overflow.top > 0) nextY += overflow.top;
+  if (overflow.bottom > 0) nextY -= overflow.bottom;
+  return { x: nextX, y: nextY };
+};
+const fits = (o) => o.top <= 0 && o.bottom <= 0 && o.left <= 0 && o.right <= 0;
+const getOverflowScore = (o) => {
+  const top = Math.max(0, o.top);
+  const bottom = Math.max(0, o.bottom);
+  const left = Math.max(0, o.left);
+  const right = Math.max(0, o.right);
+  const total = top + bottom + left + right;
+  const maxSide = Math.max(top, bottom, left, right);
+  return { total, maxSide };
+};
+const expandWithVariations = (pls) => {
+  const out = [];
+  const seen = /* @__PURE__ */ new Set();
+  const add = (p) => {
+    if (!seen.has(p)) {
+      seen.add(p);
+      out.push(p);
+    }
+  };
+  pls.forEach((p) => {
+    add(p);
+    const [base, variation] = p.split("-");
+    if (!variation) {
+      add(`${base}-start`);
+      add(`${base}-end`);
+    }
+  });
+  return out;
+};
+const getOffsetParentData = (floating) => {
+  const op = floating.offsetParent;
+  if (!op) {
+    return { left: 0, top: 0, scrollLeft: 0, scrollTop: 0 };
+  }
+  const opRect = op.getBoundingClientRect();
+  return {
+    left: opRect.left,
+    top: opRect.top,
+    scrollLeft: op.scrollLeft ?? 0,
+    scrollTop: op.scrollTop ?? 0
+  };
+};
+//# sourceMappingURL=floatingPositioning.js.map

package/dist/cjs/utils/floatingPositioning.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/utils/floatingPositioning.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import type { DSHookFloatingContextT } from '../react-desc-prop-types.js';\n\ntype RectLike = { top: number; left: number; right: number; bottom: number };\ntype OverflowOffsets = { top: number; bottom: number; left: number; right: number };\n\nconst findFixedParent = (el: Element | null) => {\n  let element = el;\n  while (element && element !== document.body) {\n    const style = getComputedStyle(element);\n    // IMPORTANT: only treat FIXED as special. Absolute parents are common and scroll,\n    // and using their rect as an offset breaks positioning on scroll.\n    if (style.position === 'fixed') {\n      return element;\n    }\n    element = element.parentElement;\n  }\n  return null;\n};\n\nconst adjustForFixedParent = (child: Element) => {\n  const fixedParent = findFixedParent(child);\n  if (fixedParent) {\n    const rect = fixedParent.getBoundingClientRect();\n    return { top: rect.top, left: rect.left };\n  }\n  return { top: 0, left: 0 };\n};\n\n/**\n * Finds nearest ancestor that can CLIP the floating element.\n * This is typically the correct boundary when rendering without portal.\n */\nconst getClippingParent = (el: Element | null): Element | null => {\n  let node = el?.parentElement ?? null;\n\n  while (node && node !== document.body) {\n    const style = getComputedStyle(node);\n\n    const overflowX = style.overflowX || style.overflow;\n    const overflowY = style.overflowY || style.overflow;\n\n    const clipsX = /(auto|scroll|hidden|clip)/.test(overflowX);\n    const clipsY = /(auto|scroll|hidden|clip)/.test(overflowY);\n\n    if (clipsX || clipsY) return node;\n\n    node = node.parentElement;\n  }\n\n  return null;\n};\n\nconst getViewportRect = (): RectLike => ({\n  top: 0,\n  left: 0,\n  right: window.innerWidth,\n  bottom: window.innerHeight,\n});\n\n/**\n * Shift behavior: if any overflow side is positive, push the popper back inside.\n * Similar to Floating UI \"shift\" middleware.\n */\nconst applyShift = (x: number, y: number, overflow: OverflowOffsets) => {\n  let nextX = x;\n  let nextY = y;\n\n  if (overflow.left > 0) nextX += overflow.left;\n  if (overflow.right > 0) nextX -= overflow.right;\n\n  if (overflow.top > 0) nextY += overflow.top;\n  if (overflow.bottom > 0) nextY -= overflow.bottom;\n\n  return { x: nextX, y: nextY };\n};\n\nconst fits = (o: OverflowOffsets) => o.top <= 0 && o.bottom <= 0 && o.left <= 0 && o.right <= 0;\n\nconst getOverflowScore = (o: OverflowOffsets) => {\n  const top = Math.max(0, o.top);\n  const bottom = Math.max(0, o.bottom);\n  const left = Math.max(0, o.left);\n  const right = Math.max(0, o.right);\n\n  const total = top + bottom + left + right;\n  const maxSide = Math.max(top, bottom, left, right);\n\n  return { total, maxSide };\n};\n\n/**\n * Ensure we actually TRY variations (start/end) for each base placement.\n * Fixes cases where only e.g. \"bottom-end\" fits but would never be tried.\n */\nconst expandWithVariations = (pls: DSHookFloatingContextT.PopperPlacementsT[]) => {\n  const out: DSHookFloatingContextT.PopperPlacementsT[] = [];\n  const seen = new Set<string>();\n\n  const add = (p: string) => {\n    if (!seen.has(p)) {\n      seen.add(p);\n      out.push(p as DSHookFloatingContextT.PopperPlacementsT);\n    }\n  };\n\n  pls.forEach((p) => {\n    add(p);\n\n    const [base, variation] = p.split('-');\n    if (!variation) {\n      add(`${base}-start`);\n      add(`${base}-end`);\n    }\n  });\n\n  return out;\n};\n\n/**\n * When rendering WITHOUT portal, the floating element is positioned relative to its offsetParent.\n * But referenceRect/floatingRect are in viewport coordinates, so we must convert x/y from viewport\n * space into the offsetParent's coordinate space (including its scroll offsets).\n */\nconst getOffsetParentData = (floating: HTMLElement) => {\n  const op = floating.offsetParent as HTMLElement | null;\n\n  // If there's no offsetParent (rare), assume viewport.\n  if (!op) {\n    return { left: 0, top: 0, scrollLeft: 0, scrollTop: 0 };\n  }\n\n  const opRect = op.getBoundingClientRect();\n\n  return {\n    left: opRect.left,\n    top: opRect.top,\n    scrollLeft: op.scrollLeft ?? 0,\n    scrollTop: op.scrollTop ?? 0,\n  };\n};\n\nexport {\n  applyShift,\n  adjustForFixedParent,\n  expandWithVariations,\n  fits,\n  getClippingParent,\n  getOverflowScore,\n  getOffsetParentData,\n  getViewportRect,\n  type RectLike,\n  type OverflowOffsets,\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/utils/computePosition.js

@@ -1,78 +1,70 @@
 import * as React from "react";
 import { getExpandedFallbackPlacements } from "./getExpandedFallbackPlacements.js";
 import { getArrowOffset } from "./getArrowOffset.js";
-import getOppositePlacement from "./getOppositePlacement.js";
 import { detectOverflow } from "./detectOverflow.js";
-const findFixedParent = (el) => {
-  let element = el;
-  while (element && element !== document.body) {
-    const style = getComputedStyle(element);
-    if (style.position === "fixed" || style.position === "absolute") {
-      return element;
-    }
-    element = element.parentElement;
-  }
-  return null;
-};
-const adjustForFixedParent = (child) => {
-  const fixedParent = findFixedParent(child);
-  if (fixedParent) {
-    const rect = fixedParent.getBoundingClientRect();
-    return { top: rect.top, left: rect.left };
-  }
-  return {
-    top: 0,
-    left: 0
-  };
-};
+import {
+  applyShift,
+  adjustForFixedParent,
+  expandWithVariations,
+  fits,
+  getClippingParent,
+  getOverflowScore,
+  getOffsetParentData,
+  getViewportRect
+} from "./floatingPositioning.js";
 const computePosition = (props) => {
   const { reference, floating, placement, placementOrderPreference, customOffset, withoutPortal } = props;
-  const scrollBarY = window.innerHeight - document.documentElement.clientHeight;
-  const parentOffsets = withoutPortal ? adjustForFixedParent(reference) : {
-    top: 0,
-    left: 0
-  };
+  const parentOffsets = withoutPortal ? adjustForFixedParent(reference) : { top: 0, left: 0 };
   const referenceRect = reference.getBoundingClientRect();
   const floatingRect = floating.getBoundingClientRect();
-  const variationPlacement = placement.split("-")[1];
   const fallbackPlacements = placementOrderPreference || getExpandedFallbackPlacements(placement);
-  const coords = {};
+  const placements = expandWithVariations(
+    [placement].concat(fallbackPlacements)
+  );
+  const clippingParent = withoutPortal ? getClippingParent(reference) : null;
+  const clippingRect = clippingParent ? clippingParent.getBoundingClientRect() : getViewportRect();
   let isVertical = false;
-  const placements = [placement].concat(fallbackPlacements);
-  let finalPlacement = "";
+  let bestPlacement = placement;
+  let bestOverflows = null;
+  let bestScore = { total: Number.POSITIVE_INFINITY, maxSide: Number.POSITIVE_INFINITY };
+  let bestIsVertical = false;
   for (let i = 0; i < placements.length; i += 1) {
     const currentPlacement = placements[i];
-    const currentBasePlacement = currentPlacement.split("-")[0];
-    isVertical = ["top", "bottom"].indexOf(currentBasePlacement) >= 0;
-    const overflows = detectOverflow(referenceRect, floatingRect, currentPlacement, customOffset);
-    const checks = [];
-    const isStartVariation = variationPlacement === "start";
-    let mainVariationSide = isVertical ? isStartVariation ? "right" : "left" : isStartVariation ? "bottom" : "top";
-    const len = isVertical ? "width" : "height";
-    if (referenceRect[len] > floatingRect[len]) {
-      mainVariationSide = getOppositePlacement(mainVariationSide);
-    }
-    const altVariationSide = getOppositePlacement(mainVariationSide);
-    checks.push(overflows[currentBasePlacement] <= 0);
-    checks.push(overflows[mainVariationSide] <= 0, overflows[altVariationSide] <= 0);
-    if (checks.every((check) => {
-      return check;
-    })) {
-      coords.top = -overflows.top + window.scrollY - parentOffsets.top + scrollBarY;
-      coords.left = -overflows.left + window.scrollX - parentOffsets.left;
-      finalPlacement = currentPlacement;
+    const base = currentPlacement.split("-")[0];
+    const currentIsVertical = base === "top" || base === "bottom";
+    const overflows2 = detectOverflow(referenceRect, floatingRect, currentPlacement, customOffset, clippingRect);
+    if (fits(overflows2)) {
+      bestPlacement = currentPlacement;
+      bestOverflows = overflows2;
+      bestIsVertical = currentIsVertical;
       break;
     }
+    const score = getOverflowScore(overflows2);
+    const isBetter = score.maxSide < bestScore.maxSide || score.maxSide === bestScore.maxSide && score.total < bestScore.total;
+    if (isBetter) {
+      bestPlacement = currentPlacement;
+      bestOverflows = overflows2;
+      bestScore = score;
+      bestIsVertical = currentIsVertical;
+    }
   }
-  if (!finalPlacement) {
-    finalPlacement = placement;
-    const overflows = detectOverflow(referenceRect, floatingRect, placement, customOffset);
-    coords.top = -overflows.top + window.scrollY - parentOffsets.top;
-    coords.left = -overflows.left + window.scrollX - parentOffsets.left;
+  const finalPlacement = bestPlacement;
+  isVertical = bestIsVertical;
+  const overflows = bestOverflows ?? detectOverflow(referenceRect, floatingRect, finalPlacement, customOffset, clippingRect);
+  let x = -overflows.left - parentOffsets.left;
+  let y = -overflows.top - parentOffsets.top;
+  if (!withoutPortal) {
+    x += window.scrollX;
+    y += window.scrollY;
+  } else {
+    const op = getOffsetParentData(floating);
+    x = x - op.left + op.scrollLeft;
+    y = y - op.top + op.scrollTop;
   }
+  ({ x, y } = applyShift(x, y, overflows));
   return {
     coordsStyle: {
-      transform: `translate3d(${Math.round(coords.left ?? 0)}px, ${Math.round(coords.top ?? 0)}px, 0)`,
+      transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,
       top: 0,
       left: 0
     },

package/dist/esm/utils/computePosition.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/computePosition.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-nested-ternary */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable @typescript-eslint/no-use-before-define */\n/* eslint-disable max-params */\n/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable arrow-body-style */\nimport type { DSHookFloatingContextT } from '../react-desc-prop-types.js';\nimport { getExpandedFallbackPlacements } from './getExpandedFallbackPlacements.js';\nimport { getArrowOffset } from './getArrowOffset.js';\nimport getOppositePlacement from './getOppositePlacement.js';\nimport { detectOverflow } from './detectOverflow.js';\n\ninterface ComputePositionProps {\n  reference: Element;\n  floating: HTMLElement;\n  placement: DSHookFloatingContextT.PopperPlacementsT;\n  placementOrderPreference?: DSHookFloatingContextT.PopperPlacementsT[];\n  customOffset: [number, number];\n  withoutPortal: boolean;\n}\n\nconst findFixedParent = (el: Element | null) => {\n  let element = el;\n  while (element && element !== document.body) {\n    const style = getComputedStyle(element);\n    if (style.position === 'fixed' || style.position === 'absolute') {\n      return element;\n    }\n    element = element.parentElement;\n  }\n  return null;\n};\n\nconst adjustForFixedParent = (child: Element) => {\n  const fixedParent = findFixedParent(child);\n  if (fixedParent) {\n    const rect = fixedParent.getBoundingClientRect();\n    return { top: rect.top, left: rect.left };\n  }\n  return {\n    top: 0,\n    left: 0,\n  };\n};\n\nexport const computePosition = (props: ComputePositionProps) => {\n  const { reference, floating, placement, placementOrderPreference, customOffset, withoutPortal } = props;\n\n  const scrollBarY = window.innerHeight - document.documentElement.clientHeight;\n\n  const parentOffsets = withoutPortal\n    ? adjustForFixedParent(reference)\n    : {\n        top: 0,\n        left: 0,\n      };\n  const referenceRect = reference.getBoundingClientRect();\n  const floatingRect = floating.getBoundingClientRect();\n\n  const variationPlacement = placement.split('-')[1];\n  const fallbackPlacements = placementOrderPreference || getExpandedFallbackPlacements(placement);\n\n  const coords: { top?: number; left?: number; bottom?: number; right?: number } = {};\n\n  let isVertical = false;\n  const placements = [placement].concat(fallbackPlacements as DSHookFloatingContextT.PopperPlacementsT[]);\n  let finalPlacement = '';\n\n  for (let i = 0; i < placements.length; i += 1) {\n    const currentPlacement = placements[i];\n\n    const currentBasePlacement = currentPlacement.split('-')[0] as keyof typeof coords;\n    isVertical = ['top', 'bottom'].indexOf(currentBasePlacement) >= 0;\n\n    const overflows = detectOverflow(referenceRect, floatingRect, currentPlacement, customOffset);\n\n    const checks: boolean[] = [];\n\n    const isStartVariation = variationPlacement === 'start';\n\n    let mainVariationSide: keyof typeof coords = isVertical\n      ? isStartVariation\n        ? 'right'\n        : 'left'\n      : isStartVariation\n        ? 'bottom'\n        : 'top';\n\n    const len = isVertical ? 'width' : 'height';\n\n    if (referenceRect[len] > floatingRect[len]) {\n      mainVariationSide = getOppositePlacement(mainVariationSide) as keyof typeof coords;\n    }\n\n    const altVariationSide = getOppositePlacement(mainVariationSide) as keyof typeof coords;\n\n    checks.push(overflows[currentBasePlacement] <= 0);\n    checks.push(overflows[mainVariationSide] <= 0, overflows[altVariationSide] <= 0);\n    if (\n      checks.every((check) => {\n        return check;\n      })\n    ) {\n      coords.top = -overflows.top + window.scrollY - parentOffsets.top + scrollBarY;\n      coords.left = -overflows.left + window.scrollX - parentOffsets.left;\n      finalPlacement = currentPlacement;\n\n      break;\n    }\n  }\n\n  if (!finalPlacement) {\n    // if we don't find a placement that fits, we use the original one\n    finalPlacement = placement;\n    const overflows = detectOverflow(referenceRect, floatingRect, placement, customOffset);\n    coords.top = -overflows.top + window.scrollY - parentOffsets.top;\n    coords.left = -overflows.left + window.scrollX - parentOffsets.left;\n  }\n\n  return {\n    coordsStyle: {\n      transform: `translate3d(${Math.round(coords.left ?? 0)}px, ${Math.round(coords.top ?? 0)}px, 0)`,\n      top: 0,\n      left: 0,\n    },\n    finalPlacement,\n    coordsArrow: getArrowOffset(finalPlacement, isVertical),\n  };\n};\n"],
-  "mappings": "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",
-  "names": []
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable no-nested-ternary */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable @typescript-eslint/no-use-before-define */\n/* eslint-disable max-params */\n/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable arrow-body-style */\nimport type { DSHookFloatingContextT } from '../react-desc-prop-types.js';\nimport { getExpandedFallbackPlacements } from './getExpandedFallbackPlacements.js';\nimport { getArrowOffset } from './getArrowOffset.js';\nimport { detectOverflow } from './detectOverflow.js';\nimport {\n  applyShift,\n  adjustForFixedParent,\n  expandWithVariations,\n  fits,\n  getClippingParent,\n  getOverflowScore,\n  getOffsetParentData,\n  getViewportRect,\n  type RectLike,\n  type OverflowOffsets,\n} from './floatingPositioning.js';\n\ninterface ComputePositionProps {\n  reference: Element;\n  floating: HTMLElement;\n  placement: DSHookFloatingContextT.PopperPlacementsT;\n  placementOrderPreference?: DSHookFloatingContextT.PopperPlacementsT[];\n  customOffset: [number, number];\n  withoutPortal: boolean;\n}\n\nexport const computePosition = (props: ComputePositionProps) => {\n  const { reference, floating, placement, placementOrderPreference, customOffset, withoutPortal } = props;\n\n  // When WITHOUT portal: only apply fixed-parent offsets (absolute parents scroll and must NOT be treated as fixed)\n  const parentOffsets = withoutPortal ? adjustForFixedParent(reference) : { top: 0, left: 0 };\n\n  const referenceRect = reference.getBoundingClientRect();\n  const floatingRect = floating.getBoundingClientRect();\n\n  const fallbackPlacements = placementOrderPreference || getExpandedFallbackPlacements(placement);\n\n  const placements = expandWithVariations(\n    [placement].concat(fallbackPlacements as DSHookFloatingContextT.PopperPlacementsT[]),\n  );\n\n  // Boundary selection:\n  // - Portal => viewport (inset by body padding for Storybook)\n  // - No portal => nearest clipping/scroll container (fallback viewport rect)\n  const clippingParent = withoutPortal ? getClippingParent(reference) : null;\n  const clippingRect: RectLike = clippingParent ? clippingParent.getBoundingClientRect() : getViewportRect();\n\n  let isVertical = false;\n\n  // Best-fit selection:\n  // 1) choose first placement that fully fits\n  // 2) otherwise choose placement with smallest max overflow, tie-break by total overflow\n  let bestPlacement = placement;\n  let bestOverflows: OverflowOffsets | null = null;\n  let bestScore = { total: Number.POSITIVE_INFINITY, maxSide: Number.POSITIVE_INFINITY };\n  let bestIsVertical = false;\n\n  for (let i = 0; i < placements.length; i += 1) {\n    const currentPlacement = placements[i];\n    const base = currentPlacement.split('-')[0];\n    const currentIsVertical = base === 'top' || base === 'bottom';\n\n    const overflows = detectOverflow(referenceRect, floatingRect, currentPlacement, customOffset, clippingRect);\n\n    if (fits(overflows)) {\n      bestPlacement = currentPlacement;\n      bestOverflows = overflows;\n      bestIsVertical = currentIsVertical;\n      break;\n    }\n\n    const score = getOverflowScore(overflows);\n\n    const isBetter =\n      score.maxSide < bestScore.maxSide || (score.maxSide === bestScore.maxSide && score.total < bestScore.total);\n\n    if (isBetter) {\n      bestPlacement = currentPlacement;\n      bestOverflows = overflows;\n      bestScore = score;\n      bestIsVertical = currentIsVertical;\n    }\n  }\n\n  const finalPlacement = bestPlacement;\n  isVertical = bestIsVertical;\n\n  const overflows =\n    bestOverflows ?? detectOverflow(referenceRect, floatingRect, finalPlacement, customOffset, clippingRect);\n\n  // Convert overflow -> coordinates.\n  // detectOverflow uses viewport/clipping-rect coordinates.\n  //\n  // - If tooltip is rendered IN A PORTAL (withoutPortal === false) and is positioned with `position: absolute`,\n  //   convert viewport coords to page coords by adding window.scrollX/Y.\n  //\n  // - If tooltip is rendered WITHOUT portal, convert viewport coords to offsetParent coords\n  //   (subtract offsetParent rect, add its scroll).\n  let x = -overflows.left - parentOffsets.left;\n  let y = -overflows.top - parentOffsets.top;\n\n  if (!withoutPortal) {\n    x += window.scrollX;\n    y += window.scrollY;\n  } else {\n    const op = getOffsetParentData(floating);\n    x = x - op.left + op.scrollLeft;\n    y = y - op.top + op.scrollTop;\n  }\n\n  // Always shift back inside boundary\n  ({ x, y } = applyShift(x, y, overflows));\n\n  return {\n    coordsStyle: {\n      transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n      top: 0,\n      left: 0,\n    },\n    finalPlacement,\n    coordsArrow: getArrowOffset(finalPlacement, isVertical),\n  };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACSvB,SAAS,qCAAqC;AAC9C,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AAWA,MAAM,kBAAkB,CAAC,UAAgC;AAC9D,QAAM,EAAE,WAAW,UAAU,WAAW,0BAA0B,cAAc,cAAc,IAAI;AAGlG,QAAM,gBAAgB,gBAAgB,qBAAqB,SAAS,IAAI,EAAE,KAAK,GAAG,MAAM,EAAE;AAE1F,QAAM,gBAAgB,UAAU,sBAAsB;AACtD,QAAM,eAAe,SAAS,sBAAsB;AAEpD,QAAM,qBAAqB,4BAA4B,8BAA8B,SAAS;AAE9F,QAAM,aAAa;AAAA,IACjB,CAAC,SAAS,EAAE,OAAO,kBAAgE;AAAA,EACrF;AAKA,QAAM,iBAAiB,gBAAgB,kBAAkB,SAAS,IAAI;AACtE,QAAM,eAAyB,iBAAiB,eAAe,sBAAsB,IAAI,gBAAgB;AAEzG,MAAI,aAAa;AAKjB,MAAI,gBAAgB;AACpB,MAAI,gBAAwC;AAC5C,MAAI,YAAY,EAAE,OAAO,OAAO,mBAAmB,SAAS,OAAO,kBAAkB;AACrF,MAAI,iBAAiB;AAErB,WAAS,IAAI,GAAG,IAAI,WAAW,QAAQ,KAAK,GAAG;AAC7C,UAAM,mBAAmB,WAAW,CAAC;AACrC,UAAM,OAAO,iBAAiB,MAAM,GAAG,EAAE,CAAC;AAC1C,UAAM,oBAAoB,SAAS,SAAS,SAAS;AAErD,UAAMA,aAAY,eAAe,eAAe,cAAc,kBAAkB,cAAc,YAAY;AAE1G,QAAI,KAAKA,UAAS,GAAG;AACnB,sBAAgB;AAChB,sBAAgBA;AAChB,uBAAiB;AACjB;AAAA,IACF;AAEA,UAAM,QAAQ,iBAAiBA,UAAS;AAExC,UAAM,WACJ,MAAM,UAAU,UAAU,WAAY,MAAM,YAAY,UAAU,WAAW,MAAM,QAAQ,UAAU;AAEvG,QAAI,UAAU;AACZ,sBAAgB;AAChB,sBAAgBA;AAChB,kBAAY;AACZ,uBAAiB;AAAA,IACnB;AAAA,EACF;AAEA,QAAM,iBAAiB;AACvB,eAAa;AAEb,QAAM,YACJ,iBAAiB,eAAe,eAAe,cAAc,gBAAgB,cAAc,YAAY;AAUzG,MAAI,IAAI,CAAC,UAAU,OAAO,cAAc;AACxC,MAAI,IAAI,CAAC,UAAU,MAAM,cAAc;AAEvC,MAAI,CAAC,eAAe;AAClB,SAAK,OAAO;AACZ,SAAK,OAAO;AAAA,EACd,OAAO;AACL,UAAM,KAAK,oBAAoB,QAAQ;AACvC,QAAI,IAAI,GAAG,OAAO,GAAG;AACrB,QAAI,IAAI,GAAG,MAAM,GAAG;AAAA,EACtB;AAGA,GAAC,EAAE,GAAG,EAAE,IAAI,WAAW,GAAG,GAAG,SAAS;AAEtC,SAAO;AAAA,IACL,aAAa;AAAA,MACX,WAAW,eAAe,KAAK,MAAM,CAAC,CAAC,OAAO,KAAK,MAAM,CAAC,CAAC;AAAA,MAC3D,KAAK;AAAA,MACL,MAAM;AAAA,IACR;AAAA,IACA;AAAA,IACA,aAAa,eAAe,gBAAgB,UAAU;AAAA,EACxD;AACF;",
+  "names": ["overflows"]
 }

package/dist/esm/utils/detectOverflow.js

@@ -18,28 +18,27 @@ function domRectToObject(rect) {
     }
   };
 }
-const detectOverflow = (referenceRect, floatingRect, placement, customOffset) => {
+const detectOverflow = (referenceRect, floatingRect, placement, customOffset, clippingClientRect) => {
   const basePlacement = placement.split("-")[0];
   const isVertical = ["top", "bottom"].indexOf(basePlacement) >= 0;
-  const scrollBarX = window.innerWidth - document.documentElement.clientWidth;
-  const scrollBarY = window.innerHeight - document.documentElement.clientHeight;
-  const clippingClientRect = {
+  const clipping = clippingClientRect ?? {
     top: 0,
     left: 0,
-    right: document.documentElement.clientWidth + scrollBarX,
-    bottom: document.documentElement.clientHeight + scrollBarY
+    right: window.innerWidth,
+    bottom: window.innerHeight
   };
   const popperOffsets = computeOffsets(placement, referenceRect, floatingRect);
   const popperClientRect = rectToClientRect({ ...domRectToObject(floatingRect), ...popperOffsets });
   const overflowOffsets = {
-    top: clippingClientRect.top - popperClientRect.top + paddingObject.top,
-    bottom: popperClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
-    left: clippingClientRect.left - popperClientRect.left + paddingObject.left,
-    right: popperClientRect.right - clippingClientRect.right + paddingObject.right
+    top: clipping.top - popperClientRect.top + paddingObject.top,
+    bottom: popperClientRect.bottom - clipping.bottom + paddingObject.bottom,
+    left: clipping.left - popperClientRect.left + paddingObject.left,
+    right: popperClientRect.right - clipping.right + paddingObject.right
   };
   const offset = {
     x: basePlacement === "left" ? -(customOffset?.[0] ?? 12) : customOffset?.[0] ?? 12,
-    y: basePlacement === "top" ? -(customOffset?.[1] ?? -12) : customOffset?.[1] ?? 12
+    // FIX: default must be 12, not -12 (otherwise 'top' flips)
+    y: basePlacement === "top" ? -(customOffset?.[1] ?? 12) : customOffset?.[1] ?? 12
   };
   if (!isVertical) {
     const temp = offset.x;
@@ -47,8 +46,8 @@ const detectOverflow = (referenceRect, floatingRect, placement, customOffset) =>
     offset.y = temp;
   }
   Object.keys(overflowOffsets).forEach((key) => {
-    const multiply = ["right", "bottom"].indexOf(key) >= 0 ? 1 : -1;
-    const axis = ["top", "bottom"].indexOf(key) >= 0 ? "y" : "x";
+    const multiply = key === "right" || key === "bottom" ? 1 : -1;
+    const axis = key === "top" || key === "bottom" ? "y" : "x";
     overflowOffsets[key] += offset[axis] * multiply;
   });
   return overflowOffsets;

package/dist/esm/utils/detectOverflow.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/detectOverflow.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-nested-ternary */\n/* eslint-disable max-params */\nimport { type DSHookFloatingContextT } from '../react-desc-prop-types.js';\nimport computeOffsets from './computeOffsets.js';\n\nconst paddingObject = { top: 0, right: 0, bottom: 0, left: 0 };\n\nfunction rectToClientRect(rect: DOMRect) {\n  return { ...rect, left: rect.x, top: rect.y, right: rect.x + rect.width, bottom: rect.y + rect.height };\n}\n\nfunction domRectToObject(rect: {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n}): DOMRect {\n  return {\n    x: rect.x,\n    y: rect.y,\n    width: rect.width,\n    height: rect.height,\n    top: rect.top,\n    right: rect.right,\n    bottom: rect.bottom,\n    left: rect.left,\n    toJSON: () => {},\n  };\n}\n\nexport const detectOverflow = (\n  referenceRect: DOMRect,\n  floatingRect: DOMRect,\n  placement: DSHookFloatingContextT.PopperPlacementsT,\n  customOffset: [number, number],\n) => {\n  const basePlacement = placement.split('-')[0];\n  const isVertical = ['top', 'bottom'].indexOf(basePlacement) >= 0;\n\n  const scrollBarX = window.innerWidth - document.documentElement.clientWidth;\n  const scrollBarY = window.innerHeight - document.documentElement.clientHeight;\n\n  const clippingClientRect = {\n    top: 0,\n    left: 0,\n    right: document.documentElement.clientWidth + scrollBarX,\n    bottom: document.documentElement.clientHeight + scrollBarY,\n  };\n\n  const popperOffsets = computeOffsets(placement, referenceRect, floatingRect);\n  const popperClientRect = rectToClientRect({ ...domRectToObject(floatingRect), ...popperOffsets });\n\n  const overflowOffsets = {\n    top: clippingClientRect.top - popperClientRect.top + paddingObject.top,\n    bottom: popperClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,\n    left: clippingClientRect.left - popperClientRect.left + paddingObject.left,\n    right: popperClientRect.right - clippingClientRect.right + paddingObject.right,\n  };\n\n  const offset = {\n    x: basePlacement === 'left' ? -(customOffset?.[0] ?? 12) : (customOffset?.[0] ?? 12),\n    y: basePlacement === 'top' ? -(customOffset?.[1] ?? -12) : (customOffset?.[1] ?? 12),\n  };\n\n  // if vertical switch x for y and vice versa\n  if (!isVertical) {\n    const temp = offset.x;\n    offset.x = offset.y * (basePlacement === 'right' ? 1 : -1);\n    offset.y = temp;\n  }\n\n  Object.keys(overflowOffsets).forEach((key) => {\n    const multiply = ['right', 'bottom'].indexOf(key) >= 0 ? 1 : -1;\n    const axis = ['top', 'bottom'].indexOf(key) >= 0 ? 'y' : 'x';\n    overflowOffsets[key as keyof typeof overflowOffsets] += offset[axis] * multiply;\n  });\n  return overflowOffsets;\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACGvB,OAAO,oBAAoB;AAE3B,MAAM,gBAAgB,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;AAE7D,SAAS,iBAAiB,MAAe;AACvC,SAAO,EAAE,GAAG,MAAM,MAAM,KAAK,GAAG,KAAK,KAAK,GAAG,OAAO,KAAK,IAAI,KAAK,OAAO,QAAQ,KAAK,IAAI,KAAK,OAAO;AACxG;AAEA,SAAS,gBAAgB,MASb;AACV,SAAO;AAAA,IACL,GAAG,KAAK;AAAA,IACR,GAAG,KAAK;AAAA,IACR,OAAO,KAAK;AAAA,IACZ,QAAQ,KAAK;AAAA,IACb,KAAK,KAAK;AAAA,IACV,OAAO,KAAK;AAAA,IACZ,QAAQ,KAAK;AAAA,IACb,MAAM,KAAK;AAAA,IACX,QAAQ,MAAM;AAAA,IAAC;AAAA,EACjB;AACF;AAEO,MAAM,iBAAiB,CAC5B,eACA,cACA,WACA,iBACG;AACH,QAAM,gBAAgB,UAAU,MAAM,GAAG,EAAE,CAAC;AAC5C,QAAM,aAAa,CAAC,OAAO,QAAQ,EAAE,QAAQ,aAAa,KAAK;AAE/D,QAAM,aAAa,OAAO,aAAa,SAAS,gBAAgB;AAChE,QAAM,aAAa,OAAO,cAAc,SAAS,gBAAgB;AAEjE,QAAM,qBAAqB;AAAA,IACzB,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO,SAAS,gBAAgB,cAAc;AAAA,IAC9C,QAAQ,SAAS,gBAAgB,eAAe;AAAA,EAClD;AAEA,QAAM,gBAAgB,eAAe,WAAW,eAAe,YAAY;AAC3E,QAAM,mBAAmB,iBAAiB,EAAE,GAAG,gBAAgB,YAAY,GAAG,GAAG,cAAc,CAAC;AAEhG,QAAM,kBAAkB;AAAA,IACtB,KAAK,mBAAmB,MAAM,iBAAiB,MAAM,cAAc;AAAA,IACnE,QAAQ,iBAAiB,SAAS,mBAAmB,SAAS,cAAc;AAAA,IAC5E,MAAM,mBAAmB,OAAO,iBAAiB,OAAO,cAAc;AAAA,IACtE,OAAO,iBAAiB,QAAQ,mBAAmB,QAAQ,cAAc;AAAA,EAC3E;AAEA,QAAM,SAAS;AAAA,IACb,GAAG,kBAAkB,SAAS,EAAE,eAAe,CAAC,KAAK,MAAO,eAAe,CAAC,KAAK;AAAA,IACjF,GAAG,kBAAkB,QAAQ,EAAE,eAAe,CAAC,KAAK,OAAQ,eAAe,CAAC,KAAK;AAAA,EACnF;AAGA,MAAI,CAAC,YAAY;AACf,UAAM,OAAO,OAAO;AACpB,WAAO,IAAI,OAAO,KAAK,kBAAkB,UAAU,IAAI;AACvD,WAAO,IAAI;AAAA,EACb;AAEA,SAAO,KAAK,eAAe,EAAE,QAAQ,CAAC,QAAQ;AAC5C,UAAM,WAAW,CAAC,SAAS,QAAQ,EAAE,QAAQ,GAAG,KAAK,IAAI,IAAI;AAC7D,UAAM,OAAO,CAAC,OAAO,QAAQ,EAAE,QAAQ,GAAG,KAAK,IAAI,MAAM;AACzD,oBAAgB,GAAmC,KAAK,OAAO,IAAI,IAAI;AAAA,EACzE,CAAC;AACD,SAAO;AACT;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-nested-ternary */\n/* eslint-disable max-params */\nimport { type DSHookFloatingContextT } from '../react-desc-prop-types.js';\nimport computeOffsets from './computeOffsets.js';\n\nconst paddingObject = { top: 0, right: 0, bottom: 0, left: 0 };\n\ntype RectLike = { top: number; left: number; right: number; bottom: number };\n\nfunction rectToClientRect(rect: DOMRect) {\n  return { ...rect, left: rect.x, top: rect.y, right: rect.x + rect.width, bottom: rect.y + rect.height };\n}\n\nfunction domRectToObject(rect: {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n}): DOMRect {\n  return {\n    x: rect.x,\n    y: rect.y,\n    width: rect.width,\n    height: rect.height,\n    top: rect.top,\n    right: rect.right,\n    bottom: rect.bottom,\n    left: rect.left,\n    toJSON: () => {},\n  };\n}\n\nexport const detectOverflow = (\n  referenceRect: DOMRect,\n  floatingRect: DOMRect,\n  placement: DSHookFloatingContextT.PopperPlacementsT,\n  customOffset: [number, number],\n  clippingClientRect?: RectLike,\n) => {\n  const basePlacement = placement.split('-')[0];\n  const isVertical = ['top', 'bottom'].indexOf(basePlacement) >= 0;\n\n  const clipping: RectLike = clippingClientRect ?? {\n    top: 0,\n    left: 0,\n    right: window.innerWidth,\n    bottom: window.innerHeight,\n  };\n\n  const popperOffsets = computeOffsets(placement, referenceRect, floatingRect);\n  const popperClientRect = rectToClientRect({ ...domRectToObject(floatingRect), ...popperOffsets });\n\n  const overflowOffsets = {\n    top: clipping.top - popperClientRect.top + paddingObject.top,\n    bottom: popperClientRect.bottom - clipping.bottom + paddingObject.bottom,\n    left: clipping.left - popperClientRect.left + paddingObject.left,\n    right: popperClientRect.right - clipping.right + paddingObject.right,\n  };\n\n  const offset = {\n    x: basePlacement === 'left' ? -(customOffset?.[0] ?? 12) : (customOffset?.[0] ?? 12),\n    // FIX: default must be 12, not -12 (otherwise 'top' flips)\n    y: basePlacement === 'top' ? -(customOffset?.[1] ?? 12) : (customOffset?.[1] ?? 12),\n  };\n\n  // if NOT vertical, switch x for y and vice versa\n  if (!isVertical) {\n    const temp = offset.x;\n    offset.x = offset.y * (basePlacement === 'right' ? 1 : -1);\n    offset.y = temp;\n  }\n\n  (Object.keys(overflowOffsets) as Array<keyof typeof overflowOffsets>).forEach((key) => {\n    const multiply = key === 'right' || key === 'bottom' ? 1 : -1;\n    const axis = key === 'top' || key === 'bottom' ? 'y' : 'x';\n    overflowOffsets[key] += offset[axis] * multiply;\n  });\n\n  return overflowOffsets;\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACGvB,OAAO,oBAAoB;AAE3B,MAAM,gBAAgB,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,EAAE;AAI7D,SAAS,iBAAiB,MAAe;AACvC,SAAO,EAAE,GAAG,MAAM,MAAM,KAAK,GAAG,KAAK,KAAK,GAAG,OAAO,KAAK,IAAI,KAAK,OAAO,QAAQ,KAAK,IAAI,KAAK,OAAO;AACxG;AAEA,SAAS,gBAAgB,MASb;AACV,SAAO;AAAA,IACL,GAAG,KAAK;AAAA,IACR,GAAG,KAAK;AAAA,IACR,OAAO,KAAK;AAAA,IACZ,QAAQ,KAAK;AAAA,IACb,KAAK,KAAK;AAAA,IACV,OAAO,KAAK;AAAA,IACZ,QAAQ,KAAK;AAAA,IACb,MAAM,KAAK;AAAA,IACX,QAAQ,MAAM;AAAA,IAAC;AAAA,EACjB;AACF;AAEO,MAAM,iBAAiB,CAC5B,eACA,cACA,WACA,cACA,uBACG;AACH,QAAM,gBAAgB,UAAU,MAAM,GAAG,EAAE,CAAC;AAC5C,QAAM,aAAa,CAAC,OAAO,QAAQ,EAAE,QAAQ,aAAa,KAAK;AAE/D,QAAM,WAAqB,sBAAsB;AAAA,IAC/C,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO,OAAO;AAAA,IACd,QAAQ,OAAO;AAAA,EACjB;AAEA,QAAM,gBAAgB,eAAe,WAAW,eAAe,YAAY;AAC3E,QAAM,mBAAmB,iBAAiB,EAAE,GAAG,gBAAgB,YAAY,GAAG,GAAG,cAAc,CAAC;AAEhG,QAAM,kBAAkB;AAAA,IACtB,KAAK,SAAS,MAAM,iBAAiB,MAAM,cAAc;AAAA,IACzD,QAAQ,iBAAiB,SAAS,SAAS,SAAS,cAAc;AAAA,IAClE,MAAM,SAAS,OAAO,iBAAiB,OAAO,cAAc;AAAA,IAC5D,OAAO,iBAAiB,QAAQ,SAAS,QAAQ,cAAc;AAAA,EACjE;AAEA,QAAM,SAAS;AAAA,IACb,GAAG,kBAAkB,SAAS,EAAE,eAAe,CAAC,KAAK,MAAO,eAAe,CAAC,KAAK;AAAA;AAAA,IAEjF,GAAG,kBAAkB,QAAQ,EAAE,eAAe,CAAC,KAAK,MAAO,eAAe,CAAC,KAAK;AAAA,EAClF;AAGA,MAAI,CAAC,YAAY;AACf,UAAM,OAAO,OAAO;AACpB,WAAO,IAAI,OAAO,KAAK,kBAAkB,UAAU,IAAI;AACvD,WAAO,IAAI;AAAA,EACb;AAEA,EAAC,OAAO,KAAK,eAAe,EAA0C,QAAQ,CAAC,QAAQ;AACrF,UAAM,WAAW,QAAQ,WAAW,QAAQ,WAAW,IAAI;AAC3D,UAAM,OAAO,QAAQ,SAAS,QAAQ,WAAW,MAAM;AACvD,oBAAgB,GAAG,KAAK,OAAO,IAAI,IAAI;AAAA,EACzC,CAAC;AAED,SAAO;AACT;",
   "names": []
 }

package/dist/esm/utils/floatingPositioning.js

@@ -0,0 +1,101 @@
+import * as React from "react";
+const findFixedParent = (el) => {
+  let element = el;
+  while (element && element !== document.body) {
+    const style = getComputedStyle(element);
+    if (style.position === "fixed") {
+      return element;
+    }
+    element = element.parentElement;
+  }
+  return null;
+};
+const adjustForFixedParent = (child) => {
+  const fixedParent = findFixedParent(child);
+  if (fixedParent) {
+    const rect = fixedParent.getBoundingClientRect();
+    return { top: rect.top, left: rect.left };
+  }
+  return { top: 0, left: 0 };
+};
+const getClippingParent = (el) => {
+  let node = el?.parentElement ?? null;
+  while (node && node !== document.body) {
+    const style = getComputedStyle(node);
+    const overflowX = style.overflowX || style.overflow;
+    const overflowY = style.overflowY || style.overflow;
+    const clipsX = /(auto|scroll|hidden|clip)/.test(overflowX);
+    const clipsY = /(auto|scroll|hidden|clip)/.test(overflowY);
+    if (clipsX || clipsY) return node;
+    node = node.parentElement;
+  }
+  return null;
+};
+const getViewportRect = () => ({
+  top: 0,
+  left: 0,
+  right: window.innerWidth,
+  bottom: window.innerHeight
+});
+const applyShift = (x, y, overflow) => {
+  let nextX = x;
+  let nextY = y;
+  if (overflow.left > 0) nextX += overflow.left;
+  if (overflow.right > 0) nextX -= overflow.right;
+  if (overflow.top > 0) nextY += overflow.top;
+  if (overflow.bottom > 0) nextY -= overflow.bottom;
+  return { x: nextX, y: nextY };
+};
+const fits = (o) => o.top <= 0 && o.bottom <= 0 && o.left <= 0 && o.right <= 0;
+const getOverflowScore = (o) => {
+  const top = Math.max(0, o.top);
+  const bottom = Math.max(0, o.bottom);
+  const left = Math.max(0, o.left);
+  const right = Math.max(0, o.right);
+  const total = top + bottom + left + right;
+  const maxSide = Math.max(top, bottom, left, right);
+  return { total, maxSide };
+};
+const expandWithVariations = (pls) => {
+  const out = [];
+  const seen = /* @__PURE__ */ new Set();
+  const add = (p) => {
+    if (!seen.has(p)) {
+      seen.add(p);
+      out.push(p);
+    }
+  };
+  pls.forEach((p) => {
+    add(p);
+    const [base, variation] = p.split("-");
+    if (!variation) {
+      add(`${base}-start`);
+      add(`${base}-end`);
+    }
+  });
+  return out;
+};
+const getOffsetParentData = (floating) => {
+  const op = floating.offsetParent;
+  if (!op) {
+    return { left: 0, top: 0, scrollLeft: 0, scrollTop: 0 };
+  }
+  const opRect = op.getBoundingClientRect();
+  return {
+    left: opRect.left,
+    top: opRect.top,
+    scrollLeft: op.scrollLeft ?? 0,
+    scrollTop: op.scrollTop ?? 0
+  };
+};
+export {
+  adjustForFixedParent,
+  applyShift,
+  expandWithVariations,
+  fits,
+  getClippingParent,
+  getOffsetParentData,
+  getOverflowScore,
+  getViewportRect
+};
+//# sourceMappingURL=floatingPositioning.js.map

package/dist/esm/utils/floatingPositioning.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/floatingPositioning.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSHookFloatingContextT } from '../react-desc-prop-types.js';\n\ntype RectLike = { top: number; left: number; right: number; bottom: number };\ntype OverflowOffsets = { top: number; bottom: number; left: number; right: number };\n\nconst findFixedParent = (el: Element | null) => {\n  let element = el;\n  while (element && element !== document.body) {\n    const style = getComputedStyle(element);\n    // IMPORTANT: only treat FIXED as special. Absolute parents are common and scroll,\n    // and using their rect as an offset breaks positioning on scroll.\n    if (style.position === 'fixed') {\n      return element;\n    }\n    element = element.parentElement;\n  }\n  return null;\n};\n\nconst adjustForFixedParent = (child: Element) => {\n  const fixedParent = findFixedParent(child);\n  if (fixedParent) {\n    const rect = fixedParent.getBoundingClientRect();\n    return { top: rect.top, left: rect.left };\n  }\n  return { top: 0, left: 0 };\n};\n\n/**\n * Finds nearest ancestor that can CLIP the floating element.\n * This is typically the correct boundary when rendering without portal.\n */\nconst getClippingParent = (el: Element | null): Element | null => {\n  let node = el?.parentElement ?? null;\n\n  while (node && node !== document.body) {\n    const style = getComputedStyle(node);\n\n    const overflowX = style.overflowX || style.overflow;\n    const overflowY = style.overflowY || style.overflow;\n\n    const clipsX = /(auto|scroll|hidden|clip)/.test(overflowX);\n    const clipsY = /(auto|scroll|hidden|clip)/.test(overflowY);\n\n    if (clipsX || clipsY) return node;\n\n    node = node.parentElement;\n  }\n\n  return null;\n};\n\nconst getViewportRect = (): RectLike => ({\n  top: 0,\n  left: 0,\n  right: window.innerWidth,\n  bottom: window.innerHeight,\n});\n\n/**\n * Shift behavior: if any overflow side is positive, push the popper back inside.\n * Similar to Floating UI \"shift\" middleware.\n */\nconst applyShift = (x: number, y: number, overflow: OverflowOffsets) => {\n  let nextX = x;\n  let nextY = y;\n\n  if (overflow.left > 0) nextX += overflow.left;\n  if (overflow.right > 0) nextX -= overflow.right;\n\n  if (overflow.top > 0) nextY += overflow.top;\n  if (overflow.bottom > 0) nextY -= overflow.bottom;\n\n  return { x: nextX, y: nextY };\n};\n\nconst fits = (o: OverflowOffsets) => o.top <= 0 && o.bottom <= 0 && o.left <= 0 && o.right <= 0;\n\nconst getOverflowScore = (o: OverflowOffsets) => {\n  const top = Math.max(0, o.top);\n  const bottom = Math.max(0, o.bottom);\n  const left = Math.max(0, o.left);\n  const right = Math.max(0, o.right);\n\n  const total = top + bottom + left + right;\n  const maxSide = Math.max(top, bottom, left, right);\n\n  return { total, maxSide };\n};\n\n/**\n * Ensure we actually TRY variations (start/end) for each base placement.\n * Fixes cases where only e.g. \"bottom-end\" fits but would never be tried.\n */\nconst expandWithVariations = (pls: DSHookFloatingContextT.PopperPlacementsT[]) => {\n  const out: DSHookFloatingContextT.PopperPlacementsT[] = [];\n  const seen = new Set<string>();\n\n  const add = (p: string) => {\n    if (!seen.has(p)) {\n      seen.add(p);\n      out.push(p as DSHookFloatingContextT.PopperPlacementsT);\n    }\n  };\n\n  pls.forEach((p) => {\n    add(p);\n\n    const [base, variation] = p.split('-');\n    if (!variation) {\n      add(`${base}-start`);\n      add(`${base}-end`);\n    }\n  });\n\n  return out;\n};\n\n/**\n * When rendering WITHOUT portal, the floating element is positioned relative to its offsetParent.\n * But referenceRect/floatingRect are in viewport coordinates, so we must convert x/y from viewport\n * space into the offsetParent's coordinate space (including its scroll offsets).\n */\nconst getOffsetParentData = (floating: HTMLElement) => {\n  const op = floating.offsetParent as HTMLElement | null;\n\n  // If there's no offsetParent (rare), assume viewport.\n  if (!op) {\n    return { left: 0, top: 0, scrollLeft: 0, scrollTop: 0 };\n  }\n\n  const opRect = op.getBoundingClientRect();\n\n  return {\n    left: opRect.left,\n    top: opRect.top,\n    scrollLeft: op.scrollLeft ?? 0,\n    scrollTop: op.scrollTop ?? 0,\n  };\n};\n\nexport {\n  applyShift,\n  adjustForFixedParent,\n  expandWithVariations,\n  fits,\n  getClippingParent,\n  getOverflowScore,\n  getOffsetParentData,\n  getViewportRect,\n  type RectLike,\n  type OverflowOffsets,\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/types/tests/FloatingContext.utils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/utils/computePosition.d.ts

@@ -13,7 +13,7 @@ export declare const computePosition: (props: ComputePositionProps) => {
         top: number;
         left: number;
     };
-    finalPlacement: string;
+    finalPlacement: DSHookFloatingContextT.PopperPlacementsT;
     coordsArrow: {
         left: string;
         top?: undefined;

package/dist/types/utils/detectOverflow.d.ts

@@ -1,7 +1,14 @@
 import { type DSHookFloatingContextT } from '../react-desc-prop-types.js';
-export declare const detectOverflow: (referenceRect: DOMRect, floatingRect: DOMRect, placement: DSHookFloatingContextT.PopperPlacementsT, customOffset: [number, number]) => {
+type RectLike = {
+    top: number;
+    left: number;
+    right: number;
+    bottom: number;
+};
+export declare const detectOverflow: (referenceRect: DOMRect, floatingRect: DOMRect, placement: DSHookFloatingContextT.PopperPlacementsT, customOffset: [number, number], clippingClientRect?: RectLike) => {
     top: number;
     bottom: number;
     left: number;
     right: number;
 };
+export {};

package/dist/types/utils/floatingPositioning.d.ts

@@ -0,0 +1,53 @@
+import type { DSHookFloatingContextT } from '../react-desc-prop-types.js';
+type RectLike = {
+    top: number;
+    left: number;
+    right: number;
+    bottom: number;
+};
+type OverflowOffsets = {
+    top: number;
+    bottom: number;
+    left: number;
+    right: number;
+};
+declare const adjustForFixedParent: (child: Element) => {
+    top: number;
+    left: number;
+};
+/**
+ * Finds nearest ancestor that can CLIP the floating element.
+ * This is typically the correct boundary when rendering without portal.
+ */
+declare const getClippingParent: (el: Element | null) => Element | null;
+declare const getViewportRect: () => RectLike;
+/**
+ * Shift behavior: if any overflow side is positive, push the popper back inside.
+ * Similar to Floating UI "shift" middleware.
+ */
+declare const applyShift: (x: number, y: number, overflow: OverflowOffsets) => {
+    x: number;
+    y: number;
+};
+declare const fits: (o: OverflowOffsets) => boolean;
+declare const getOverflowScore: (o: OverflowOffsets) => {
+    total: number;
+    maxSide: number;
+};
+/**
+ * Ensure we actually TRY variations (start/end) for each base placement.
+ * Fixes cases where only e.g. "bottom-end" fits but would never be tried.
+ */
+declare const expandWithVariations: (pls: DSHookFloatingContextT.PopperPlacementsT[]) => DSHookFloatingContextT.PopperPlacementsT[];
+/**
+ * When rendering WITHOUT portal, the floating element is positioned relative to its offsetParent.
+ * But referenceRect/floatingRect are in viewport coordinates, so we must convert x/y from viewport
+ * space into the offsetParent's coordinate space (including its scroll offsets).
+ */
+declare const getOffsetParentData: (floating: HTMLElement) => {
+    left: number;
+    top: number;
+    scrollLeft: number;
+    scrollTop: number;
+};
+export { applyShift, adjustForFixedParent, expandWithVariations, fits, getClippingParent, getOverflowScore, getOffsetParentData, getViewportRect, type RectLike, type OverflowOffsets, };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-floating-context",
-  "version": "3.57.6",
+  "version": "3.57.7",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Popper Hook",
   "files": [
@@ -36,15 +36,15 @@
     "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-hooks-headless-tooltip": "3.57.6",
-    "@elliemae/ds-props-helpers": "3.57.6",
-    "@elliemae/ds-system": "3.57.6",
-    "@elliemae/ds-typescript-helpers": "3.57.6"
+    "@elliemae/ds-hooks-headless-tooltip": "3.57.7",
+    "@elliemae/ds-props-helpers": "3.57.7",
+    "@elliemae/ds-system": "3.57.7",
+    "@elliemae/ds-typescript-helpers": "3.57.7"
   },
   "devDependencies": {
     "@elliemae/pui-cli": "9.0.0-next.65",
     "jest": "~29.7.0",
-    "@elliemae/ds-monorepo-devops": "3.57.6"
+    "@elliemae/ds-monorepo-devops": "3.57.7"
   },
   "peerDependencies": {
     "lodash-es": "^4.17.21",