Socket
Socket
Sign inDemoInstall

@zag-js/popper

Package Overview
Dependencies
Maintainers
1
Versions
883
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@zag-js/popper - npm Package Compare versions

Comparing version 0.0.0-dev-20220413175519 to 0.0.0-dev-20220415160434

1137

dist/index.js
var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropNames = Object.getOwnPropertyNames;

@@ -21,15 +19,2 @@ var __getOwnPropSymbols = Object.getOwnPropertySymbols;

};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
var target = {};
for (var prop in source)
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
target[prop] = source[prop];
if (source != null && __getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(source)) {
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
target[prop] = source[prop];
}
return target;
};
var __export = (target, all) => {

@@ -48,22 +33,2 @@ for (var name in all)

var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var __async = (__this, __arguments, generator) => {
return new Promise((resolve, reject) => {
var fulfilled = (value) => {
try {
step(generator.next(value));
} catch (e) {
reject(e);
}
};
var rejected = (value) => {
try {
step(generator.throw(value));
} catch (e) {
reject(e);
}
};
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
step((generator = generator.apply(__this, __arguments)).next());
});
};

@@ -78,1015 +43,18 @@ // src/index.ts

// ../../../node_modules/@floating-ui/core/dist/floating-ui.core.esm.js
function getSide(placement) {
return placement.split("-")[0];
}
function getAlignment(placement) {
return placement.split("-")[1];
}
function getMainAxisFromPlacement(placement) {
return ["top", "bottom"].includes(getSide(placement)) ? "x" : "y";
}
function getLengthFromAxis(axis) {
return axis === "y" ? "height" : "width";
}
function computeCoordsFromPlacement(_ref, placement, rtl) {
let {
reference,
floating
} = _ref;
const commonX = reference.x + reference.width / 2 - floating.width / 2;
const commonY = reference.y + reference.height / 2 - floating.height / 2;
const mainAxis = getMainAxisFromPlacement(placement);
const length = getLengthFromAxis(mainAxis);
const commonAlign = reference[length] / 2 - floating[length] / 2;
const side = getSide(placement);
const isVertical = mainAxis === "x";
let coords;
switch (side) {
case "top":
coords = {
x: commonX,
y: reference.y - floating.height
};
break;
case "bottom":
coords = {
x: commonX,
y: reference.y + reference.height
};
break;
case "right":
coords = {
x: reference.x + reference.width,
y: commonY
};
break;
case "left":
coords = {
x: reference.x - floating.width,
y: commonY
};
break;
default:
coords = {
x: reference.x,
y: reference.y
};
}
switch (getAlignment(placement)) {
case "start":
coords[mainAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
break;
case "end":
coords[mainAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
break;
}
return coords;
}
var computePosition = (reference, floating, config) => __async(void 0, null, function* () {
const {
placement = "bottom",
strategy = "absolute",
middleware = [],
platform: platform2
} = config;
const rtl = yield platform2.isRTL == null ? void 0 : platform2.isRTL(floating);
if (void 0 !== "production") {
if (platform2 == null) {
console.error(["Floating UI: `platform` property was not passed to config. If you", "want to use Floating UI on the web, install @floating-ui/dom", "instead of the /core package. Otherwise, you can create your own", "`platform`: https://floating-ui.com/docs/platform"].join(" "));
}
if (middleware.filter((_ref) => {
let {
name
} = _ref;
return name === "autoPlacement" || name === "flip";
}).length > 1) {
throw new Error(["Floating UI: duplicate `flip` and/or `autoPlacement`", "middleware detected. This will lead to an infinite loop. Ensure only", "one of either has been passed to the `middleware` array."].join(" "));
}
}
let rects = yield platform2.getElementRects({
reference,
floating,
strategy
});
let {
x,
y
} = computeCoordsFromPlacement(rects, placement, rtl);
let statefulPlacement = placement;
let middlewareData = {};
let _debug_loop_count_ = 0;
for (let i = 0; i < middleware.length; i++) {
if (void 0 !== "production") {
_debug_loop_count_++;
if (_debug_loop_count_ > 100) {
throw new Error(["Floating UI: The middleware lifecycle appears to be", "running in an infinite loop. This is usually caused by a `reset`", "continually being returned without a break condition."].join(" "));
}
}
const {
name,
fn
} = middleware[i];
const {
x: nextX,
y: nextY,
data,
reset
} = yield fn({
x,
y,
initialPlacement: placement,
placement: statefulPlacement,
strategy,
middlewareData,
rects,
platform: platform2,
elements: {
reference,
floating
}
});
x = nextX != null ? nextX : x;
y = nextY != null ? nextY : y;
middlewareData = __spreadProps(__spreadValues({}, middlewareData), {
[name]: __spreadValues(__spreadValues({}, middlewareData[name]), data)
});
if (reset) {
if (typeof reset === "object") {
if (reset.placement) {
statefulPlacement = reset.placement;
}
if (reset.rects) {
rects = reset.rects === true ? yield platform2.getElementRects({
reference,
floating,
strategy
}) : reset.rects;
}
({
x,
y
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
}
i = -1;
continue;
}
}
return {
x,
y,
placement: statefulPlacement,
strategy,
middlewareData
};
});
function expandPaddingObject(padding) {
return __spreadValues({
top: 0,
right: 0,
bottom: 0,
left: 0
}, padding);
}
function getSideObjectFromPadding(padding) {
return typeof padding !== "number" ? expandPaddingObject(padding) : {
top: padding,
right: padding,
bottom: padding,
left: padding
};
}
function rectToClientRect(rect) {
return __spreadProps(__spreadValues({}, rect), {
top: rect.y,
left: rect.x,
right: rect.x + rect.width,
bottom: rect.y + rect.height
});
}
function detectOverflow(middlewareArguments, options) {
return __async(this, null, function* () {
var _await$platform$isEle;
if (options === void 0) {
options = {};
}
const {
x,
y,
platform: platform2,
rects,
elements,
strategy
} = middlewareArguments;
const {
boundary = "clippingAncestors",
rootBoundary = "viewport",
elementContext = "floating",
altBoundary = false,
padding = 0
} = options;
const paddingObject = getSideObjectFromPadding(padding);
const altContext = elementContext === "floating" ? "reference" : "floating";
const element = elements[altBoundary ? altContext : elementContext];
const clippingClientRect = rectToClientRect(yield platform2.getClippingRect({
element: ((_await$platform$isEle = yield platform2.isElement == null ? void 0 : platform2.isElement(element)) != null ? _await$platform$isEle : true) ? element : element.contextElement || (yield platform2.getDocumentElement == null ? void 0 : platform2.getDocumentElement(elements.floating)),
boundary,
rootBoundary,
strategy
}));
const elementClientRect = rectToClientRect(platform2.convertOffsetParentRelativeRectToViewportRelativeRect ? yield platform2.convertOffsetParentRelativeRectToViewportRelativeRect({
rect: elementContext === "floating" ? __spreadProps(__spreadValues({}, rects.floating), {
x,
y
}) : rects.reference,
offsetParent: yield platform2.getOffsetParent == null ? void 0 : platform2.getOffsetParent(elements.floating),
strategy
}) : rects[elementContext]);
return {
top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
right: elementClientRect.right - clippingClientRect.right + paddingObject.right
};
});
}
var min = Math.min;
var max = Math.max;
function within(min$1, value, max$1) {
return max(min$1, min(value, max$1));
}
var arrow = (options) => ({
name: "arrow",
options,
fn(middlewareArguments) {
return __async(this, null, function* () {
const {
element,
padding = 0
} = options != null ? options : {};
const {
x,
y,
placement,
rects,
platform: platform2
} = middlewareArguments;
if (element == null) {
if (void 0 !== "production") {
console.warn("Floating UI: No `element` was passed to the `arrow` middleware.");
}
return {};
}
const paddingObject = getSideObjectFromPadding(padding);
const coords = {
x,
y
};
const axis = getMainAxisFromPlacement(placement);
const length = getLengthFromAxis(axis);
const arrowDimensions = yield platform2.getDimensions(element);
const minProp = axis === "y" ? "top" : "left";
const maxProp = axis === "y" ? "bottom" : "right";
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
const startDiff = coords[axis] - rects.reference[axis];
const arrowOffsetParent = yield platform2.getOffsetParent == null ? void 0 : platform2.getOffsetParent(element);
const clientSize = arrowOffsetParent ? axis === "y" ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
const centerToReference = endDiff / 2 - startDiff / 2;
const min3 = paddingObject[minProp];
const max3 = clientSize - arrowDimensions[length] - paddingObject[maxProp];
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
const offset2 = within(min3, center, max3);
return {
data: {
[axis]: offset2,
centerOffset: center - offset2
}
};
});
}
});
var hash$1 = {
left: "right",
right: "left",
bottom: "top",
top: "bottom"
// src/get-placement.ts
var import_dom2 = require("@floating-ui/dom");
// ../dom/dist/index.mjs
var noop = () => {
};
function getOppositePlacement(placement) {
return placement.replace(/left|right|bottom|top/g, (matched) => hash$1[matched]);
function getListenerElements() {
;
globalThis.__listenerElements__ = globalThis.__listenerElements__ || /* @__PURE__ */ new Map();
return globalThis.__listenerElements__;
}
function getAlignmentSides(placement, rects, rtl) {
if (rtl === void 0) {
rtl = false;
}
const alignment = getAlignment(placement);
const mainAxis = getMainAxisFromPlacement(placement);
const length = getLengthFromAxis(mainAxis);
let mainAlignmentSide = mainAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top";
if (rects.reference[length] > rects.floating[length]) {
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
}
return {
main: mainAlignmentSide,
cross: getOppositePlacement(mainAlignmentSide)
};
function getListenerCache() {
;
globalThis.__listenerCache__ = globalThis.__listenerCache__ || /* @__PURE__ */ new Map();
return globalThis.__listenerCache__;
}
var hash = {
start: "end",
end: "start"
};
function getOppositeAlignmentPlacement(placement) {
return placement.replace(/start|end/g, (matched) => hash[matched]);
}
function getExpandedPlacements(placement) {
const oppositePlacement = getOppositePlacement(placement);
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
}
var flip = function(options) {
if (options === void 0) {
options = {};
}
return {
name: "flip",
options,
fn(middlewareArguments) {
return __async(this, null, function* () {
var _middlewareData$flip;
const {
placement,
middlewareData,
rects,
initialPlacement,
platform: platform2,
elements
} = middlewareArguments;
const _a2 = options, {
mainAxis: checkMainAxis = true,
crossAxis: checkCrossAxis = true,
fallbackPlacements: specifiedFallbackPlacements,
fallbackStrategy = "bestFit",
flipAlignment = true
} = _a2, detectOverflowOptions = __objRest(_a2, [
"mainAxis",
"crossAxis",
"fallbackPlacements",
"fallbackStrategy",
"flipAlignment"
]);
const side = getSide(placement);
const isBasePlacement = side === initialPlacement;
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
const placements = [initialPlacement, ...fallbackPlacements];
const overflow = yield detectOverflow(middlewareArguments, detectOverflowOptions);
const overflows = [];
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
if (checkMainAxis) {
overflows.push(overflow[side]);
}
if (checkCrossAxis) {
const {
main,
cross
} = getAlignmentSides(placement, rects, yield platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
overflows.push(overflow[main], overflow[cross]);
}
overflowsData = [...overflowsData, {
placement,
overflows
}];
if (!overflows.every((side2) => side2 <= 0)) {
var _middlewareData$flip$, _middlewareData$flip2;
const nextIndex = ((_middlewareData$flip$ = (_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) != null ? _middlewareData$flip$ : 0) + 1;
const nextPlacement = placements[nextIndex];
if (nextPlacement) {
return {
data: {
index: nextIndex,
overflows: overflowsData
},
reset: {
placement: nextPlacement
}
};
}
let resetPlacement = "bottom";
switch (fallbackStrategy) {
case "bestFit": {
var _overflowsData$slice$;
const placement2 = (_overflowsData$slice$ = overflowsData.slice().sort((a, b) => a.overflows.filter((overflow2) => overflow2 > 0).reduce((acc, overflow2) => acc + overflow2, 0) - b.overflows.filter((overflow2) => overflow2 > 0).reduce((acc, overflow2) => acc + overflow2, 0))[0]) == null ? void 0 : _overflowsData$slice$.placement;
if (placement2) {
resetPlacement = placement2;
}
break;
}
case "initialPlacement":
resetPlacement = initialPlacement;
break;
}
if (placement !== resetPlacement) {
return {
reset: {
placement: resetPlacement
}
};
}
}
return {};
});
}
};
};
function convertValueToCoords(placement, rects, value, rtl) {
if (rtl === void 0) {
rtl = false;
}
const side = getSide(placement);
const alignment = getAlignment(placement);
const isVertical = getMainAxisFromPlacement(placement) === "x";
const mainAxisMulti = ["left", "top"].includes(side) ? -1 : 1;
const crossAxisMulti = rtl && isVertical ? -1 : 1;
const rawValue = typeof value === "function" ? value(__spreadProps(__spreadValues({}, rects), {
placement
})) : value;
const isNumber = typeof rawValue === "number";
let {
mainAxis,
crossAxis,
alignmentAxis
} = isNumber ? {
mainAxis: rawValue,
crossAxis: 0,
alignmentAxis: null
} : __spreadValues({
mainAxis: 0,
crossAxis: 0,
alignmentAxis: null
}, rawValue);
if (alignment && typeof alignmentAxis === "number") {
crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
}
return isVertical ? {
x: crossAxis * crossAxisMulti,
y: mainAxis * mainAxisMulti
} : {
x: mainAxis * mainAxisMulti,
y: crossAxis * crossAxisMulti
};
}
var offset = function(value) {
if (value === void 0) {
value = 0;
}
return {
name: "offset",
options: value,
fn(middlewareArguments) {
return __async(this, null, function* () {
const {
x,
y,
placement,
rects,
platform: platform2,
elements
} = middlewareArguments;
const diffCoords = convertValueToCoords(placement, rects, value, yield platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
return {
x: x + diffCoords.x,
y: y + diffCoords.y,
data: diffCoords
};
});
}
};
};
function getCrossAxis(axis) {
return axis === "x" ? "y" : "x";
}
var shift = function(options) {
if (options === void 0) {
options = {};
}
return {
name: "shift",
options,
fn(middlewareArguments) {
return __async(this, null, function* () {
const {
x,
y,
placement
} = middlewareArguments;
const _a2 = options, {
mainAxis: checkMainAxis = true,
crossAxis: checkCrossAxis = false,
limiter = {
fn: (_ref) => {
let {
x: x2,
y: y2
} = _ref;
return {
x: x2,
y: y2
};
}
}
} = _a2, detectOverflowOptions = __objRest(_a2, [
"mainAxis",
"crossAxis",
"limiter"
]);
const coords = {
x,
y
};
const overflow = yield detectOverflow(middlewareArguments, detectOverflowOptions);
const mainAxis = getMainAxisFromPlacement(getSide(placement));
const crossAxis = getCrossAxis(mainAxis);
let mainAxisCoord = coords[mainAxis];
let crossAxisCoord = coords[crossAxis];
if (checkMainAxis) {
const minSide = mainAxis === "y" ? "top" : "left";
const maxSide = mainAxis === "y" ? "bottom" : "right";
const min3 = mainAxisCoord + overflow[minSide];
const max3 = mainAxisCoord - overflow[maxSide];
mainAxisCoord = within(min3, mainAxisCoord, max3);
}
if (checkCrossAxis) {
const minSide = crossAxis === "y" ? "top" : "left";
const maxSide = crossAxis === "y" ? "bottom" : "right";
const min3 = crossAxisCoord + overflow[minSide];
const max3 = crossAxisCoord - overflow[maxSide];
crossAxisCoord = within(min3, crossAxisCoord, max3);
}
const limitedCoords = limiter.fn(__spreadProps(__spreadValues({}, middlewareArguments), {
[mainAxis]: mainAxisCoord,
[crossAxis]: crossAxisCoord
}));
return __spreadProps(__spreadValues({}, limitedCoords), {
data: {
x: limitedCoords.x - x,
y: limitedCoords.y - y
}
});
});
}
};
};
var size = function(options) {
if (options === void 0) {
options = {};
}
return {
name: "size",
options,
fn(middlewareArguments) {
return __async(this, null, function* () {
const {
placement,
rects,
platform: platform2,
elements
} = middlewareArguments;
const _a2 = options, {
apply
} = _a2, detectOverflowOptions = __objRest(_a2, [
"apply"
]);
const overflow = yield detectOverflow(middlewareArguments, detectOverflowOptions);
const side = getSide(placement);
const alignment = getAlignment(placement);
let heightSide;
let widthSide;
if (side === "top" || side === "bottom") {
heightSide = side;
widthSide = alignment === ((yield platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating)) ? "start" : "end") ? "left" : "right";
} else {
widthSide = side;
heightSide = alignment === "end" ? "top" : "bottom";
}
const xMin = max(overflow.left, 0);
const xMax = max(overflow.right, 0);
const yMin = max(overflow.top, 0);
const yMax = max(overflow.bottom, 0);
const dimensions = {
height: rects.floating.height - (["left", "right"].includes(placement) ? 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom)) : overflow[heightSide]),
width: rects.floating.width - (["top", "bottom"].includes(placement) ? 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right)) : overflow[widthSide])
};
const prevDimensions = yield platform2.getDimensions(elements.floating);
apply == null ? void 0 : apply(__spreadValues(__spreadValues({}, dimensions), rects));
const nextDimensions = yield platform2.getDimensions(elements.floating);
if (prevDimensions.width !== nextDimensions.width || prevDimensions.height !== nextDimensions.height) {
return {
reset: {
rects: true
}
};
}
return {};
});
}
};
};
// ../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.esm.js
function isWindow(value) {
return value && value.document && value.location && value.alert && value.setInterval;
}
function getWindow(node) {
if (node == null) {
return window;
}
if (!isWindow(node)) {
const ownerDocument = node.ownerDocument;
return ownerDocument ? ownerDocument.defaultView || window : window;
}
return node;
}
function getComputedStyle$1(element) {
return getWindow(element).getComputedStyle(element);
}
function getNodeName(node) {
return isWindow(node) ? "" : node ? (node.nodeName || "").toLowerCase() : "";
}
function isHTMLElement(value) {
return value instanceof getWindow(value).HTMLElement;
}
function isElement(value) {
return value instanceof getWindow(value).Element;
}
function isNode(value) {
return value instanceof getWindow(value).Node;
}
function isShadowRoot(node) {
const OwnElement = getWindow(node).ShadowRoot;
return node instanceof OwnElement || node instanceof ShadowRoot;
}
function isOverflowElement(element) {
const {
overflow,
overflowX,
overflowY
} = getComputedStyle$1(element);
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
}
function isTableElement(element) {
return ["table", "td", "th"].includes(getNodeName(element));
}
function isContainingBlock(element) {
const isFirefox = navigator.userAgent.toLowerCase().includes("firefox");
const css = getComputedStyle$1(element);
return css.transform !== "none" || css.perspective !== "none" || css.contain === "paint" || ["transform", "perspective"].includes(css.willChange) || isFirefox && css.willChange === "filter" || isFirefox && (css.filter ? css.filter !== "none" : false);
}
function isLayoutViewport() {
return !/^((?!chrome|android).)*safari/i.test(navigator.userAgent);
}
var min2 = Math.min;
var max2 = Math.max;
var round = Math.round;
function getBoundingClientRect(element, includeScale, isFixedStrategy) {
if (includeScale === void 0) {
includeScale = false;
}
if (isFixedStrategy === void 0) {
isFixedStrategy = false;
}
const clientRect = element.getBoundingClientRect();
let scaleX = 1;
let scaleY = 1;
if (includeScale && isHTMLElement(element)) {
scaleX = element.offsetWidth > 0 ? round(clientRect.width) / element.offsetWidth || 1 : 1;
scaleY = element.offsetHeight > 0 ? round(clientRect.height) / element.offsetHeight || 1 : 1;
}
const win = isElement(element) ? getWindow(element) : window;
const addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
const x = (clientRect.left + (addVisualOffsets ? win.visualViewport.offsetLeft : 0)) / scaleX;
const y = (clientRect.top + (addVisualOffsets ? win.visualViewport.offsetTop : 0)) / scaleY;
const width = clientRect.width / scaleX;
const height = clientRect.height / scaleY;
return {
width,
height,
top: y,
right: x + width,
bottom: y + height,
left: x,
x,
y
};
}
function getDocumentElement(node) {
return ((isNode(node) ? node.ownerDocument : node.document) || window.document).documentElement;
}
function getNodeScroll(element) {
if (isElement(element)) {
return {
scrollLeft: element.scrollLeft,
scrollTop: element.scrollTop
};
}
return {
scrollLeft: element.pageXOffset,
scrollTop: element.pageYOffset
};
}
function getWindowScrollBarX(element) {
return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
}
function isScaled(element) {
const rect = getBoundingClientRect(element);
return round(rect.width) !== element.offsetWidth || round(rect.height) !== element.offsetHeight;
}
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
const isOffsetParentAnElement = isHTMLElement(offsetParent);
const documentElement = getDocumentElement(offsetParent);
const rect = getBoundingClientRect(element, isOffsetParentAnElement && isScaled(offsetParent), strategy === "fixed");
let scroll = {
scrollLeft: 0,
scrollTop: 0
};
const offsets = {
x: 0,
y: 0
};
if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== "fixed") {
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
scroll = getNodeScroll(offsetParent);
}
if (isHTMLElement(offsetParent)) {
const offsetRect = getBoundingClientRect(offsetParent, true);
offsets.x = offsetRect.x + offsetParent.clientLeft;
offsets.y = offsetRect.y + offsetParent.clientTop;
} else if (documentElement) {
offsets.x = getWindowScrollBarX(documentElement);
}
}
return {
x: rect.left + scroll.scrollLeft - offsets.x,
y: rect.top + scroll.scrollTop - offsets.y,
width: rect.width,
height: rect.height
};
}
function getParentNode(node) {
if (getNodeName(node) === "html") {
return node;
}
return node.assignedSlot || node.parentNode || (isShadowRoot(node) ? node.host : null) || getDocumentElement(node);
}
function getTrueOffsetParent(element) {
if (!isHTMLElement(element) || getComputedStyle(element).position === "fixed") {
return null;
}
return element.offsetParent;
}
function getContainingBlock(element) {
let currentNode = getParentNode(element);
if (isShadowRoot(currentNode)) {
currentNode = currentNode.host;
}
while (isHTMLElement(currentNode) && !["html", "body"].includes(getNodeName(currentNode))) {
if (isContainingBlock(currentNode)) {
return currentNode;
} else {
currentNode = currentNode.parentNode;
}
}
return null;
}
function getOffsetParent(element) {
const window2 = getWindow(element);
let offsetParent = getTrueOffsetParent(element);
while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === "static") {
offsetParent = getTrueOffsetParent(offsetParent);
}
if (offsetParent && (getNodeName(offsetParent) === "html" || getNodeName(offsetParent) === "body" && getComputedStyle(offsetParent).position === "static" && !isContainingBlock(offsetParent))) {
return window2;
}
return offsetParent || getContainingBlock(element) || window2;
}
function getDimensions(element) {
if (isHTMLElement(element)) {
return {
width: element.offsetWidth,
height: element.offsetHeight
};
}
const rect = getBoundingClientRect(element);
return {
width: rect.width,
height: rect.height
};
}
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
let {
rect,
offsetParent,
strategy
} = _ref;
const isOffsetParentAnElement = isHTMLElement(offsetParent);
const documentElement = getDocumentElement(offsetParent);
if (offsetParent === documentElement) {
return rect;
}
let scroll = {
scrollLeft: 0,
scrollTop: 0
};
const offsets = {
x: 0,
y: 0
};
if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== "fixed") {
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
scroll = getNodeScroll(offsetParent);
}
if (isHTMLElement(offsetParent)) {
const offsetRect = getBoundingClientRect(offsetParent, true);
offsets.x = offsetRect.x + offsetParent.clientLeft;
offsets.y = offsetRect.y + offsetParent.clientTop;
}
}
return __spreadProps(__spreadValues({}, rect), {
x: rect.x - scroll.scrollLeft + offsets.x,
y: rect.y - scroll.scrollTop + offsets.y
});
}
function getViewportRect(element, strategy) {
const win = getWindow(element);
const html = getDocumentElement(element);
const visualViewport = win.visualViewport;
let width = html.clientWidth;
let height = html.clientHeight;
let x = 0;
let y = 0;
if (visualViewport) {
width = visualViewport.width;
height = visualViewport.height;
const layoutViewport = isLayoutViewport();
if (layoutViewport || !layoutViewport && strategy === "fixed") {
x = visualViewport.offsetLeft;
y = visualViewport.offsetTop;
}
}
return {
width,
height,
x,
y
};
}
function getDocumentRect(element) {
var _element$ownerDocumen;
const html = getDocumentElement(element);
const scroll = getNodeScroll(element);
const body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;
const width = max2(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);
const height = max2(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
const y = -scroll.scrollTop;
if (getComputedStyle$1(body || html).direction === "rtl") {
x += max2(html.clientWidth, body ? body.clientWidth : 0) - width;
}
return {
width,
height,
x,
y
};
}
function getNearestOverflowAncestor(node) {
const parentNode = getParentNode(node);
if (["html", "body", "#document"].includes(getNodeName(parentNode))) {
return node.ownerDocument.body;
}
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
return parentNode;
}
return getNearestOverflowAncestor(parentNode);
}
function getOverflowAncestors(node, list) {
var _node$ownerDocument;
if (list === void 0) {
list = [];
}
const scrollableAncestor = getNearestOverflowAncestor(node);
const isBody = scrollableAncestor === ((_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.body);
const win = getWindow(scrollableAncestor);
const target = isBody ? [win].concat(win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : []) : scrollableAncestor;
const updatedList = list.concat(target);
return isBody ? updatedList : updatedList.concat(getOverflowAncestors(getParentNode(target)));
}
function contains(parent, child) {
const rootNode = child.getRootNode == null ? void 0 : child.getRootNode();
if (parent.contains(child)) {
return true;
} else if (rootNode && isShadowRoot(rootNode)) {
let next = child;
do {
if (next && parent === next) {
return true;
}
next = next.parentNode || next.host;
} while (next);
}
return false;
}
function getInnerBoundingClientRect(element, strategy) {
const clientRect = getBoundingClientRect(element, false, strategy === "fixed");
const top = clientRect.top + element.clientTop;
const left = clientRect.left + element.clientLeft;
return {
top,
left,
x: left,
y: top,
right: left + element.clientWidth,
bottom: top + element.clientHeight,
width: element.clientWidth,
height: element.clientHeight
};
}
function getClientRectFromClippingAncestor(element, clippingParent, strategy) {
if (clippingParent === "viewport") {
return rectToClientRect(getViewportRect(element, strategy));
}
if (isElement(clippingParent)) {
return getInnerBoundingClientRect(clippingParent, strategy);
}
return rectToClientRect(getDocumentRect(getDocumentElement(element)));
}
function getClippingAncestors(element) {
const clippingAncestors = getOverflowAncestors(element);
const canEscapeClipping = ["absolute", "fixed"].includes(getComputedStyle$1(element).position);
const clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
if (!isElement(clipperElement)) {
return [];
}
return clippingAncestors.filter((clippingAncestors2) => isElement(clippingAncestors2) && contains(clippingAncestors2, clipperElement) && getNodeName(clippingAncestors2) !== "body");
}
function getClippingRect(_ref) {
let {
element,
boundary,
rootBoundary,
strategy
} = _ref;
const mainClippingAncestors = boundary === "clippingAncestors" ? getClippingAncestors(element) : [].concat(boundary);
const clippingAncestors = [...mainClippingAncestors, rootBoundary];
const firstClippingAncestor = clippingAncestors[0];
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
accRect.top = max2(rect.top, accRect.top);
accRect.right = min2(rect.right, accRect.right);
accRect.bottom = min2(rect.bottom, accRect.bottom);
accRect.left = max2(rect.left, accRect.left);
return accRect;
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
return {
width: clippingRect.right - clippingRect.left,
height: clippingRect.bottom - clippingRect.top,
x: clippingRect.left,
y: clippingRect.top
};
}
var platform = {
getClippingRect,
convertOffsetParentRelativeRectToViewportRelativeRect,
isElement,
getDimensions,
getOffsetParent,
getDocumentElement,
getElementRects: (_ref) => {
let {
reference,
floating,
strategy
} = _ref;
return {
reference: getRectRelativeToOffsetParent(reference, getOffsetParent(floating), strategy),
floating: __spreadProps(__spreadValues({}, getDimensions(floating)), {
x: 0,
y: 0
})
};
},
getClientRects: (element) => Array.from(element.getClientRects()),
isRTL: (element) => getComputedStyle$1(element).direction === "rtl"
};
var computePosition2 = (reference, floating, options) => computePosition(reference, floating, __spreadValues({
platform
}, options));
// ../core/src/functions.ts
var noop = () => {
};
var pipe = (...fns) => (v) => fns.reduce((a, b) => b(a), v);
// ../core/src/guard.ts
var isBoolean = (v) => v === true || v === false;
// ../dom/src/event-bus.ts
var listenerElements = /* @__PURE__ */ new Map();
var listenerCache = /* @__PURE__ */ new Map();
function globalEventBus(node, type, handler, options) {

@@ -1096,11 +64,13 @@ var _a;

return noop;
const hash2 = JSON.stringify({ type, options });
const hash = JSON.stringify({ type, options });
const listenerElements = getListenerElements();
const listenerCache = getListenerCache();
const group = listenerElements.get(node);
if (!listenerElements.has(node)) {
const group2 = /* @__PURE__ */ new Map([[hash2, /* @__PURE__ */ new Set([handler])]]);
const group2 = /* @__PURE__ */ new Map([[hash, /* @__PURE__ */ new Set([handler])]]);
listenerElements.set(node, group2);
} else if (group == null ? void 0 : group.has(hash2)) {
(_a = group == null ? void 0 : group.get(hash2)) == null ? void 0 : _a.add(handler);
} else if (group == null ? void 0 : group.has(hash)) {
(_a = group == null ? void 0 : group.get(hash)) == null ? void 0 : _a.add(handler);
} else {
group == null ? void 0 : group.set(hash2, /* @__PURE__ */ new Set([handler]));
group == null ? void 0 : group.set(hash, /* @__PURE__ */ new Set([handler]));
}

@@ -1112,11 +82,11 @@ function attach(node2) {

const group2 = listenerElements.get(node2);
(_a3 = group2 == null ? void 0 : group2.get(hash2)) == null ? void 0 : _a3.forEach((fn) => fn(event));
(_a3 = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _a3.forEach((fn) => fn(event));
}
if (!(listenerCache == null ? void 0 : listenerCache.has(node2))) {
listenerCache.set(node2, /* @__PURE__ */ new Map([[hash2, listener]]));
listenerCache.set(node2, /* @__PURE__ */ new Map([[hash, listener]]));
node2.addEventListener(type, listener, options);
return;
}
if (!((_a2 = listenerCache == null ? void 0 : listenerCache.get(node2)) == null ? void 0 : _a2.has(hash2))) {
(_b = listenerCache.get(node2)) == null ? void 0 : _b.set(hash2, listener);
if (!((_a2 = listenerCache == null ? void 0 : listenerCache.get(node2)) == null ? void 0 : _a2.has(hash))) {
(_b = listenerCache.get(node2)) == null ? void 0 : _b.set(hash, listener);
node2.addEventListener(type, listener, options);

@@ -1131,8 +101,8 @@ }

const group2 = listenerElements.get(node);
(_a2 = group2 == null ? void 0 : group2.get(hash2)) == null ? void 0 : _a2.delete(handler);
if (((_b = group2 == null ? void 0 : group2.get(hash2)) == null ? void 0 : _b.size) === 0) {
const listener = (_c = listenerCache.get(node)) == null ? void 0 : _c.get(hash2);
(_a2 = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _a2.delete(handler);
if (((_b = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _b.size) === 0) {
const listener = (_c = listenerCache.get(node)) == null ? void 0 : _c.get(hash);
node.removeEventListener(type, listener, options);
group2 == null ? void 0 : group2.delete(hash2);
(_d = listenerCache.get(node)) == null ? void 0 : _d.delete(hash2);
group2 == null ? void 0 : group2.delete(hash);
(_d = listenerCache.get(node)) == null ? void 0 : _d.delete(hash);
if ((group2 == null ? void 0 : group2.size) === 0) {

@@ -1145,4 +115,2 @@ listenerElements.delete(node);

}
// ../dom/src/listener.ts
var t = (v) => Object.prototype.toString.call(v).slice(8, -1);

@@ -1155,20 +123,21 @@ var isRef = (v) => t(v) === "Object" && "current" in v;

}
// ../dom/src/query.ts
function getOwnerDocument(el) {
var _a;
if (isWindow2(el))
if (isWindow(el))
return el.document;
return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
}
function isHTMLElement2(v) {
function isHTMLElement(v) {
return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
}
function isWindow2(value) {
function isWindow(value) {
return (value == null ? void 0 : value.toString()) === "[object Window]";
}
// ../dom/src/rect-observer.ts
var observedElements = /* @__PURE__ */ new Map();
function getObservedElements() {
;
globalThis.__rectObserverMap__ = globalThis.__rectObserverMap__ || /* @__PURE__ */ new Map();
return globalThis.__rectObserverMap__;
}
function observeElementRect(el, fn) {
const observedElements = getObservedElements();
const data = observedElements.get(el);

@@ -1202,2 +171,3 @@ if (!data) {

function runLoop() {
const observedElements = getObservedElements();
const changedRectsData = [];

@@ -1220,3 +190,10 @@ observedElements.forEach((data, element) => {

// ../core/dist/index.mjs
var noop2 = () => {
};
var pipe = (...fns) => (v) => fns.reduce((a, b) => b(a), v);
var isBoolean = (v) => v === true || v === false;
// src/auto-update.ts
var import_dom = require("@floating-ui/dom");
function resolveOptions(option) {

@@ -1231,8 +208,8 @@ if (isBoolean(option))

const ancestors = [];
if (useAncestors && isHTMLElement2(reference)) {
ancestors.push(...getOverflowAncestors(reference));
if (useAncestors && isHTMLElement(reference)) {
ancestors.push(...(0, import_dom.getOverflowAncestors)(reference));
}
function addResizeListeners() {
let cleanups = [observeElementRect(floating, update)];
if (referenceResize && isHTMLElement2(reference)) {
if (referenceResize && isHTMLElement(reference)) {
cleanups.push(observeElementRect(reference, update));

@@ -1328,20 +305,20 @@ }

if (reference == null || floating == null)
return noop;
return noop2;
options = Object.assign({}, defaultOptions, options);
const middleware = [transformOrigin];
if (options.flip) {
middleware.push(flip({ boundary: options.boundary, padding: 8 }));
middleware.push((0, import_dom2.flip)({ boundary: options.boundary, padding: 8 }));
}
if (options.gutter || options.offset) {
const data = options.gutter ? { mainAxis: options.gutter } : options.offset;
middleware.push(offset(data));
middleware.push((0, import_dom2.offset)(data));
}
middleware.push(shift({ boundary: options.boundary }));
middleware.push((0, import_dom2.shift)({ boundary: options.boundary }));
const doc = getOwnerDocument(floating);
const arrowEl = doc.querySelector("[data-part=arrow]");
if (arrowEl) {
middleware.push(arrow({ element: arrowEl, padding: 8 }), shiftArrow({ element: arrowEl }));
middleware.push((0, import_dom2.arrow)({ element: arrowEl, padding: 8 }), shiftArrow({ element: arrowEl }));
}
if (options.sameWidth) {
middleware.push(size({
middleware.push((0, import_dom2.size)({
apply(data) {

@@ -1357,3 +334,3 @@ const { width } = data.reference;

const { placement, strategy } = options;
computePosition2(reference, floating, { placement, middleware, strategy }).then((data) => {
(0, import_dom2.computePosition)(reference, floating, { placement, middleware, strategy }).then((data) => {
const { x, y, strategy: strategy2 } = data;

@@ -1368,3 +345,3 @@ Object.assign(floating.style, { left: `${x}px`, top: `${y}px`, position: strategy2 });

compute();
return pipe(autoUpdate(reference, floating, compute, options.listeners), (_a = options.onCleanup) != null ? _a : noop);
return pipe(autoUpdate(reference, floating, compute, options.listeners), (_a = options.onCleanup) != null ? _a : noop2);
}

@@ -1371,0 +348,0 @@

6

package.json
{
"name": "@zag-js/popper",
"version": "0.0.0-dev-20220413175519",
"version": "0.0.0-dev-20220415160434",
"description": "Dynamic positioning logic for ui machines",

@@ -29,4 +29,4 @@ "keywords": [

"@floating-ui/dom": "^0.4.2",
"@zag-js/dom-utils": "^0.0.0-dev-20220413175519",
"@zag-js/utils": "^0.0.0-dev-20220413175519"
"@zag-js/dom-utils": "^0.0.0-dev-20220415160434",
"@zag-js/utils": "^0.0.0-dev-20220415160434"
},

@@ -33,0 +33,0 @@ "scripts": {

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

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc