@frontify/fondue
Version:
Design system of Frontify
54 lines (53 loc) • 1.67 kB
JavaScript
import { useOverlayPosition as L } from "@react-aria/overlays";
import { useState as O, useLayoutEffect as d } from "react";
import { getTotalOverlayHeight as v } from "../helpers/getTotalOverlayHeight.es.js";
import { getVerticalPositioning as y } from "../helpers/getVerticalPositioning.es.js";
import { FlyoutPlacement as e } from "../Flyout.es.js";
const g = 5, p = 12, b = 70, H = {
top: "bottom",
bottom: "top",
left: "right",
right: "left",
"top left": "bottom left",
"top right": "bottom right",
"bottom left": "top left",
"bottom right": "top right"
}, I = ({
triggerRef: n,
overlayRef: o,
scrollRef: i,
isOpen: c,
placement: t,
offset: l,
updatePositionOnContentChange: f
}) => {
var m;
const [u, P] = O(!1), T = t && H[t], a = u ? T : t, { overlayProps: r, updatePosition: h } = L({
targetRef: n,
overlayRef: o,
shouldFlip: t === e.Left || t === e.Right,
placement: t && (t === e.Left || t === e.Right) ? t : a,
containerPadding: p,
offset: l ?? g,
scrollRef: i,
isOpen: c
});
if (d(() => {
const s = new ResizeObserver(h);
if (c) {
const F = v(o, i), E = y(n.current, F, g, b).position === "top";
P(E), i.current && f && s.observe(i.current), o.current && f && s.observe(o.current);
}
return () => {
s.disconnect();
};
}, [c, f, h, i, o, n]), typeof ((m = r == null ? void 0 : r.style) == null ? void 0 : m.maxHeight) == "number" && !u) {
const s = b - p;
r.style.maxHeight -= s;
}
return { positionProps: r };
};
export {
I as useOverlayPositionWithBottomMargin
};
//# sourceMappingURL=useOverlayPositionWithBottomMargin.es.js.map