UNPKG

@erudilabs/modal

Version:

An accessible overlay dialog.

1,422 lines (1,414 loc) 79.9 kB
"use client" "use strict"; var __create = Object.create; var __defProp = Object.defineProperty; var __defProps = Object.defineProperties; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropDescs = Object.getOwnPropertyDescriptors; var __getOwnPropNames = Object.getOwnPropertyNames; var __getOwnPropSymbols = Object.getOwnPropertySymbols; var __getProtoOf = Object.getPrototypeOf; var __hasOwnProp = Object.prototype.hasOwnProperty; var __propIsEnum = Object.prototype.propertyIsEnumerable; var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; var __spreadValues = (a, b) => { for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]); if (__getOwnPropSymbols) for (var prop of __getOwnPropSymbols(b)) { if (__propIsEnum.call(b, prop)) __defNormalProp(a, prop, b[prop]); } return a; }; 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) => { 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 __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()); }); }; // src/index.ts var src_exports = {}; __export(src_exports, { Modal: () => Modal }); module.exports = __toCommonJS(src_exports); // src/modal.tsx var import_react3 = require("react"); // ../../../node_modules/.pnpm/@floating-ui+core@1.2.6/node_modules/@floating-ui/core/dist/floating-ui.core.mjs function getAlignment(placement) { return placement.split("-")[1]; } function getLengthFromAxis(axis) { return axis === "y" ? "height" : "width"; } function getSide(placement) { return placement.split("-")[0]; } function getMainAxisFromPlacement(placement) { return ["top", "bottom"].includes(getSide(placement)) ? "x" : "y"; } 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 validMiddleware = middleware.filter(Boolean); const rtl = yield platform2.isRTL == null ? void 0 : platform2.isRTL(floating); let rects = yield platform2.getElementRects({ reference, floating, strategy }); let { x, y } = computeCoordsFromPlacement(rects, placement, rtl); let statefulPlacement = placement; let middlewareData = {}; let resetCount = 0; for (let i = 0; i < validMiddleware.length; i++) { const { name, fn } = validMiddleware[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 && resetCount <= 50) { resetCount++; 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 rectToClientRect(rect) { return __spreadProps(__spreadValues({}, rect), { top: rect.y, left: rect.x, right: rect.x + rect.width, bottom: rect.y + rect.height }); } // ../../../node_modules/.pnpm/@floating-ui+dom@1.2.8/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs function getWindow(node) { var _node$ownerDocument; return ((_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window; } function getComputedStyle$1(element) { return getWindow(element).getComputedStyle(element); } function isNode(value) { return value instanceof getWindow(value).Node; } function getNodeName(node) { return isNode(node) ? (node.nodeName || "").toLowerCase() : ""; } var uaString; function getUAString() { if (uaString) { return uaString; } const uaData = navigator.userAgentData; if (uaData && Array.isArray(uaData.brands)) { uaString = uaData.brands.map((item) => item.brand + "/" + item.version).join(" "); return uaString; } return navigator.userAgent; } function isHTMLElement(value) { return value instanceof getWindow(value).HTMLElement; } function isElement(value) { return value instanceof getWindow(value).Element; } function isShadowRoot(node) { if (typeof ShadowRoot === "undefined") { return false; } const OwnElement = getWindow(node).ShadowRoot; return node instanceof OwnElement || node instanceof ShadowRoot; } function isOverflowElement(element) { const { overflow, overflowX, overflowY, display } = getComputedStyle$1(element); return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !["inline", "contents"].includes(display); } function isTableElement(element) { return ["table", "td", "th"].includes(getNodeName(element)); } function isContainingBlock(element) { const isFirefox = /firefox/i.test(getUAString()); const css = getComputedStyle$1(element); const backdropFilter = css.backdropFilter || css.WebkitBackdropFilter; return css.transform !== "none" || css.perspective !== "none" || (backdropFilter ? backdropFilter !== "none" : false) || isFirefox && css.willChange === "filter" || isFirefox && (css.filter ? css.filter !== "none" : false) || ["transform", "perspective"].some((value) => css.willChange.includes(value)) || ["paint", "layout", "strict", "content"].some((value) => { const contain = css.contain; return contain != null ? contain.includes(value) : false; }); } function isClientRectVisualViewportBased() { return /^((?!chrome|android).)*safari/i.test(getUAString()); } function isLastTraversableNode(node) { return ["html", "body", "#document"].includes(getNodeName(node)); } var min = Math.min; var max = Math.max; var round = Math.round; function getCssDimensions(element) { const css = getComputedStyle$1(element); let width = parseFloat(css.width) || 0; let height = parseFloat(css.height) || 0; const hasOffset = isHTMLElement(element); const offsetWidth = hasOffset ? element.offsetWidth : width; const offsetHeight = hasOffset ? element.offsetHeight : height; const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight; if (shouldFallback) { width = offsetWidth; height = offsetHeight; } return { width, height, fallback: shouldFallback }; } function unwrapElement(element) { return !isElement(element) ? element.contextElement : element; } var FALLBACK_SCALE = { x: 1, y: 1 }; function getScale(element) { const domElement = unwrapElement(element); if (!isHTMLElement(domElement)) { return FALLBACK_SCALE; } const rect = domElement.getBoundingClientRect(); const { width, height, fallback } = getCssDimensions(domElement); let x = (fallback ? round(rect.width) : rect.width) / width; let y = (fallback ? round(rect.height) : rect.height) / height; if (!x || !Number.isFinite(x)) { x = 1; } if (!y || !Number.isFinite(y)) { y = 1; } return { x, y }; } function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) { var _win$visualViewport, _win$visualViewport2; if (includeScale === void 0) { includeScale = false; } if (isFixedStrategy === void 0) { isFixedStrategy = false; } const clientRect = element.getBoundingClientRect(); const domElement = unwrapElement(element); let scale = FALLBACK_SCALE; if (includeScale) { if (offsetParent) { if (isElement(offsetParent)) { scale = getScale(offsetParent); } } else { scale = getScale(element); } } const win = domElement ? getWindow(domElement) : window; const addVisualOffsets = isClientRectVisualViewportBased() && isFixedStrategy; let x = (clientRect.left + (addVisualOffsets ? ((_win$visualViewport = win.visualViewport) == null ? void 0 : _win$visualViewport.offsetLeft) || 0 : 0)) / scale.x; let y = (clientRect.top + (addVisualOffsets ? ((_win$visualViewport2 = win.visualViewport) == null ? void 0 : _win$visualViewport2.offsetTop) || 0 : 0)) / scale.y; let width = clientRect.width / scale.x; let height = clientRect.height / scale.y; if (domElement) { const win2 = getWindow(domElement); const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent; let currentIFrame = win2.frameElement; while (currentIFrame && offsetParent && offsetWin !== win2) { const iframeScale = getScale(currentIFrame); const iframeRect = currentIFrame.getBoundingClientRect(); const css = getComputedStyle(currentIFrame); iframeRect.x += (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x; iframeRect.y += (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y; x *= iframeScale.x; y *= iframeScale.y; width *= iframeScale.x; height *= iframeScale.y; x += iframeRect.x; y += iframeRect.y; currentIFrame = getWindow(currentIFrame).frameElement; } } return rectToClientRect({ width, height, 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 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 }; let scale = { x: 1, y: 1 }; 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); scale = getScale(offsetParent); offsets.x = offsetRect.x + offsetParent.clientLeft; offsets.y = offsetRect.y + offsetParent.clientTop; } } return { width: rect.width * scale.x, height: rect.height * scale.y, x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x, y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y }; } function getWindowScrollBarX(element) { return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft; } function getDocumentRect(element) { const html = getDocumentElement(element); const scroll = getNodeScroll(element); const body = element.ownerDocument.body; const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth); const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight); let x = -scroll.scrollLeft + getWindowScrollBarX(element); const y = -scroll.scrollTop; if (getComputedStyle$1(body).direction === "rtl") { x += max(html.clientWidth, body.clientWidth) - width; } return { width, height, x, y }; } function getParentNode(node) { if (getNodeName(node) === "html") { return node; } const result = ( // Step into the shadow DOM of the parent of a slotted node. node.assignedSlot || // DOM Element detected. node.parentNode || // ShadowRoot detected. isShadowRoot(node) && node.host || // Fallback. getDocumentElement(node) ); return isShadowRoot(result) ? result.host : result; } function getNearestOverflowAncestor(node) { const parentNode = getParentNode(node); if (isLastTraversableNode(parentNode)) { return parentNode.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); if (isBody) { return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : []); } return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor)); } 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 visualViewportBased = isClientRectVisualViewportBased(); if (!visualViewportBased || visualViewportBased && strategy === "fixed") { x = visualViewport.offsetLeft; y = visualViewport.offsetTop; } } return { width, height, x, y }; } function getInnerBoundingClientRect(element, strategy) { const clientRect = getBoundingClientRect(element, true, strategy === "fixed"); const top = clientRect.top + element.clientTop; const left = clientRect.left + element.clientLeft; const scale = isHTMLElement(element) ? getScale(element) : { x: 1, y: 1 }; const width = element.clientWidth * scale.x; const height = element.clientHeight * scale.y; const x = left * scale.x; const y = top * scale.y; return { width, height, x, y }; } function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) { let rect; if (clippingAncestor === "viewport") { rect = getViewportRect(element, strategy); } else if (clippingAncestor === "document") { rect = getDocumentRect(getDocumentElement(element)); } else if (isElement(clippingAncestor)) { rect = getInnerBoundingClientRect(clippingAncestor, strategy); } else { const mutableRect = __spreadValues({}, clippingAncestor); if (isClientRectVisualViewportBased()) { var _win$visualViewport, _win$visualViewport2; const win = getWindow(element); mutableRect.x -= ((_win$visualViewport = win.visualViewport) == null ? void 0 : _win$visualViewport.offsetLeft) || 0; mutableRect.y -= ((_win$visualViewport2 = win.visualViewport) == null ? void 0 : _win$visualViewport2.offsetTop) || 0; } rect = mutableRect; } return rectToClientRect(rect); } function hasFixedPositionAncestor(element, stopNode) { const parentNode = getParentNode(element); if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) { return false; } return getComputedStyle$1(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode); } function getClippingElementAncestors(element, cache) { const cachedResult = cache.get(element); if (cachedResult) { return cachedResult; } let result = getOverflowAncestors(element).filter((el) => isElement(el) && getNodeName(el) !== "body"); let currentContainingBlockComputedStyle = null; const elementIsFixed = getComputedStyle$1(element).position === "fixed"; let currentNode = elementIsFixed ? getParentNode(element) : element; while (isElement(currentNode) && !isLastTraversableNode(currentNode)) { const computedStyle = getComputedStyle$1(currentNode); const currentNodeIsContaining = isContainingBlock(currentNode); if (!currentNodeIsContaining && computedStyle.position === "fixed") { currentContainingBlockComputedStyle = null; } const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && ["absolute", "fixed"].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode); if (shouldDropCurrentNode) { result = result.filter((ancestor) => ancestor !== currentNode); } else { currentContainingBlockComputedStyle = computedStyle; } currentNode = getParentNode(currentNode); } cache.set(element, result); return result; } function getClippingRect(_ref) { let { element, boundary, rootBoundary, strategy } = _ref; const elementClippingAncestors = boundary === "clippingAncestors" ? getClippingElementAncestors(element, this._c) : [].concat(boundary); const clippingAncestors = [...elementClippingAncestors, rootBoundary]; const firstClippingAncestor = clippingAncestors[0]; const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => { const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy); accRect.top = max(rect.top, accRect.top); accRect.right = min(rect.right, accRect.right); accRect.bottom = min(rect.bottom, accRect.bottom); accRect.left = max(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 }; } function getDimensions(element) { return getCssDimensions(element); } function getTrueOffsetParent(element, polyfill) { if (!isHTMLElement(element) || getComputedStyle$1(element).position === "fixed") { return null; } if (polyfill) { return polyfill(element); } return element.offsetParent; } function getContainingBlock(element) { let currentNode = getParentNode(element); while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) { if (isContainingBlock(currentNode)) { return currentNode; } else { currentNode = getParentNode(currentNode); } } return null; } function getOffsetParent(element, polyfill) { const window2 = getWindow(element); if (!isHTMLElement(element)) { return window2; } let offsetParent = getTrueOffsetParent(element, polyfill); while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === "static") { offsetParent = getTrueOffsetParent(offsetParent, polyfill); } if (offsetParent && (getNodeName(offsetParent) === "html" || getNodeName(offsetParent) === "body" && getComputedStyle$1(offsetParent).position === "static" && !isContainingBlock(offsetParent))) { return window2; } return offsetParent || getContainingBlock(element) || window2; } function getRectRelativeToOffsetParent(element, offsetParent, strategy) { const isOffsetParentAnElement = isHTMLElement(offsetParent); const documentElement = getDocumentElement(offsetParent); const rect = getBoundingClientRect(element, true, strategy === "fixed", offsetParent); 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 }; } var platform = { getClippingRect, convertOffsetParentRelativeRectToViewportRelativeRect, isElement, getDimensions, getOffsetParent, getDocumentElement, getScale, getElementRects(_ref) { return __async(this, null, function* () { let { reference, floating, strategy } = _ref; const getOffsetParentFn = this.getOffsetParent || getOffsetParent; const getDimensionsFn = this.getDimensions; return { reference: getRectRelativeToOffsetParent(reference, yield getOffsetParentFn(floating), strategy), floating: __spreadValues({ x: 0, y: 0 }, yield getDimensionsFn(floating)) }; }); }, getClientRects: (element) => Array.from(element.getClientRects()), isRTL: (element) => getComputedStyle$1(element).direction === "rtl" }; var computePosition2 = (reference, floating, options) => { const cache = /* @__PURE__ */ new Map(); const mergedOptions = __spreadValues({ platform }, options); const platformWithCache = __spreadProps(__spreadValues({}, mergedOptions.platform), { _c: cache }); return computePosition(reference, floating, __spreadProps(__spreadValues({}, mergedOptions), { platform: platformWithCache })); }; // ../../../node_modules/.pnpm/@floating-ui+react-dom@1.3.0_react-dom@18.2.0_react@18.2.0/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.esm.js var React = __toESM(require("react")); var import_react = require("react"); var ReactDOM = __toESM(require("react-dom")); var index = typeof document !== "undefined" ? import_react.useLayoutEffect : import_react.useEffect; function deepEqual(a, b) { if (a === b) { return true; } if (typeof a !== typeof b) { return false; } if (typeof a === "function" && a.toString() === b.toString()) { return true; } let length, i, keys; if (a && b && typeof a == "object") { if (Array.isArray(a)) { length = a.length; if (length != b.length) return false; for (i = length; i-- !== 0; ) { if (!deepEqual(a[i], b[i])) { return false; } } return true; } keys = Object.keys(a); length = keys.length; if (length !== Object.keys(b).length) { return false; } for (i = length; i-- !== 0; ) { if (!Object.prototype.hasOwnProperty.call(b, keys[i])) { return false; } } for (i = length; i-- !== 0; ) { const key = keys[i]; if (key === "_owner" && a.$$typeof) { continue; } if (!deepEqual(a[key], b[key])) { return false; } } return true; } return a !== a && b !== b; } function useLatestRef(value) { const ref = React.useRef(value); index(() => { ref.current = value; }); return ref; } function useFloating(options) { if (options === void 0) { options = {}; } const { placement = "bottom", strategy = "absolute", middleware = [], platform: platform2, whileElementsMounted, open } = options; const [data, setData] = React.useState({ x: null, y: null, strategy, placement, middlewareData: {}, isPositioned: false }); const [latestMiddleware, setLatestMiddleware] = React.useState(middleware); if (!deepEqual(latestMiddleware, middleware)) { setLatestMiddleware(middleware); } const referenceRef = React.useRef(null); const floatingRef = React.useRef(null); const dataRef = React.useRef(data); const whileElementsMountedRef = useLatestRef(whileElementsMounted); const platformRef = useLatestRef(platform2); const [reference, _setReference] = React.useState(null); const [floating, _setFloating] = React.useState(null); const setReference = React.useCallback((node) => { if (referenceRef.current !== node) { referenceRef.current = node; _setReference(node); } }, []); const setFloating = React.useCallback((node) => { if (floatingRef.current !== node) { floatingRef.current = node; _setFloating(node); } }, []); const update = React.useCallback(() => { if (!referenceRef.current || !floatingRef.current) { return; } const config = { placement, strategy, middleware: latestMiddleware }; if (platformRef.current) { config.platform = platformRef.current; } computePosition2(referenceRef.current, floatingRef.current, config).then((data2) => { const fullData = __spreadProps(__spreadValues({}, data2), { isPositioned: true }); if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) { dataRef.current = fullData; ReactDOM.flushSync(() => { setData(fullData); }); } }); }, [latestMiddleware, placement, strategy, platformRef]); index(() => { if (open === false && dataRef.current.isPositioned) { dataRef.current.isPositioned = false; setData((data2) => __spreadProps(__spreadValues({}, data2), { isPositioned: false })); } }, [open]); const isMountedRef = React.useRef(false); index(() => { isMountedRef.current = true; return () => { isMountedRef.current = false; }; }, []); index(() => { if (reference && floating) { if (whileElementsMountedRef.current) { return whileElementsMountedRef.current(reference, floating, update); } else { update(); } } }, [reference, floating, update, whileElementsMountedRef]); const refs = React.useMemo(() => ({ reference: referenceRef, floating: floatingRef, setReference, setFloating }), [setReference, setFloating]); const elements = React.useMemo(() => ({ reference, floating }), [reference, floating]); return React.useMemo(() => __spreadProps(__spreadValues({}, data), { update, refs, elements, reference: setReference, floating: setFloating }), [data, update, refs, elements, setReference, setFloating]); } // ../../../node_modules/.pnpm/@floating-ui+react@0.23.1_react-dom@18.2.0_react@18.2.0/node_modules/@floating-ui/react/dist/floating-ui.react.esm.js var React2 = __toESM(require("react")); var import_react2 = require("react"); // ../../../node_modules/.pnpm/tabbable@6.1.2/node_modules/tabbable/dist/index.esm.js var candidateSelectors = ["input:not([inert])", "select:not([inert])", "textarea:not([inert])", "a[href]:not([inert])", "button:not([inert])", "[tabindex]:not(slot):not([inert])", "audio[controls]:not([inert])", "video[controls]:not([inert])", '[contenteditable]:not([contenteditable="false"]):not([inert])', "details>summary:first-of-type:not([inert])", "details:not([inert])"]; var candidateSelector = /* @__PURE__ */ candidateSelectors.join(","); var NoElement = typeof Element === "undefined"; var matches = NoElement ? function() { } : Element.prototype.matches || Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector; var getRootNode = !NoElement && Element.prototype.getRootNode ? function(element) { var _element$getRootNode; return element === null || element === void 0 ? void 0 : (_element$getRootNode = element.getRootNode) === null || _element$getRootNode === void 0 ? void 0 : _element$getRootNode.call(element); } : function(element) { return element === null || element === void 0 ? void 0 : element.ownerDocument; }; var isInert = function isInert2(node, lookUp) { var _node$getAttribute; if (lookUp === void 0) { lookUp = true; } var inertAtt = node === null || node === void 0 ? void 0 : (_node$getAttribute = node.getAttribute) === null || _node$getAttribute === void 0 ? void 0 : _node$getAttribute.call(node, "inert"); var inert = inertAtt === "" || inertAtt === "true"; var result = inert || lookUp && node && isInert2(node.parentNode); return result; }; var isContentEditable = function isContentEditable2(node) { var _node$getAttribute2; var attValue = node === null || node === void 0 ? void 0 : (_node$getAttribute2 = node.getAttribute) === null || _node$getAttribute2 === void 0 ? void 0 : _node$getAttribute2.call(node, "contenteditable"); return attValue === "" || attValue === "true"; }; var getCandidates = function getCandidates2(el, includeContainer, filter) { if (isInert(el)) { return []; } var candidates = Array.prototype.slice.apply(el.querySelectorAll(candidateSelector)); if (includeContainer && matches.call(el, candidateSelector)) { candidates.unshift(el); } candidates = candidates.filter(filter); return candidates; }; var getCandidatesIteratively = function getCandidatesIteratively2(elements, includeContainer, options) { var candidates = []; var elementsToCheck = Array.from(elements); while (elementsToCheck.length) { var element = elementsToCheck.shift(); if (isInert(element, false)) { continue; } if (element.tagName === "SLOT") { var assigned = element.assignedElements(); var content = assigned.length ? assigned : element.children; var nestedCandidates = getCandidatesIteratively2(content, true, options); if (options.flatten) { candidates.push.apply(candidates, nestedCandidates); } else { candidates.push({ scopeParent: element, candidates: nestedCandidates }); } } else { var validCandidate = matches.call(element, candidateSelector); if (validCandidate && options.filter(element) && (includeContainer || !elements.includes(element))) { candidates.push(element); } var shadowRoot = element.shadowRoot || // check for an undisclosed shadow typeof options.getShadowRoot === "function" && options.getShadowRoot(element); var validShadowRoot = !isInert(shadowRoot, false) && (!options.shadowRootFilter || options.shadowRootFilter(element)); if (shadowRoot && validShadowRoot) { var _nestedCandidates = getCandidatesIteratively2(shadowRoot === true ? element.children : shadowRoot.children, true, options); if (options.flatten) { candidates.push.apply(candidates, _nestedCandidates); } else { candidates.push({ scopeParent: element, candidates: _nestedCandidates }); } } else { elementsToCheck.unshift.apply(elementsToCheck, element.children); } } } return candidates; }; var getTabindex = function getTabindex2(node, isScope) { if (node.tabIndex < 0) { if ((isScope || /^(AUDIO|VIDEO|DETAILS)$/.test(node.tagName) || isContentEditable(node)) && isNaN(parseInt(node.getAttribute("tabindex"), 10))) { return 0; } } return node.tabIndex; }; var sortOrderedTabbables = function sortOrderedTabbables2(a, b) { return a.tabIndex === b.tabIndex ? a.documentOrder - b.documentOrder : a.tabIndex - b.tabIndex; }; var isInput = function isInput2(node) { return node.tagName === "INPUT"; }; var isHiddenInput = function isHiddenInput2(node) { return isInput(node) && node.type === "hidden"; }; var isDetailsWithSummary = function isDetailsWithSummary2(node) { var r = node.tagName === "DETAILS" && Array.prototype.slice.apply(node.children).some(function(child) { return child.tagName === "SUMMARY"; }); return r; }; var getCheckedRadio = function getCheckedRadio2(nodes, form) { for (var i = 0; i < nodes.length; i++) { if (nodes[i].checked && nodes[i].form === form) { return nodes[i]; } } }; var isTabbableRadio = function isTabbableRadio2(node) { if (!node.name) { return true; } var radioScope = node.form || getRootNode(node); var queryRadios = function queryRadios2(name) { return radioScope.querySelectorAll('input[type="radio"][name="' + name + '"]'); }; var radioSet; if (typeof window !== "undefined" && typeof window.CSS !== "undefined" && typeof window.CSS.escape === "function") { radioSet = queryRadios(window.CSS.escape(node.name)); } else { try { radioSet = queryRadios(node.name); } catch (err) { console.error("Looks like you have a radio button with a name attribute containing invalid CSS selector characters and need the CSS.escape polyfill: %s", err.message); return false; } } var checked = getCheckedRadio(radioSet, node.form); return !checked || checked === node; }; var isRadio = function isRadio2(node) { return isInput(node) && node.type === "radio"; }; var isNonTabbableRadio = function isNonTabbableRadio2(node) { return isRadio(node) && !isTabbableRadio(node); }; var isNodeAttached = function isNodeAttached2(node) { var _nodeRoot; var nodeRoot = node && getRootNode(node); var nodeRootHost = (_nodeRoot = nodeRoot) === null || _nodeRoot === void 0 ? void 0 : _nodeRoot.host; var attached = false; if (nodeRoot && nodeRoot !== node) { var _nodeRootHost, _nodeRootHost$ownerDo, _node$ownerDocument; attached = !!((_nodeRootHost = nodeRootHost) !== null && _nodeRootHost !== void 0 && (_nodeRootHost$ownerDo = _nodeRootHost.ownerDocument) !== null && _nodeRootHost$ownerDo !== void 0 && _nodeRootHost$ownerDo.contains(nodeRootHost) || node !== null && node !== void 0 && (_node$ownerDocument = node.ownerDocument) !== null && _node$ownerDocument !== void 0 && _node$ownerDocument.contains(node)); while (!attached && nodeRootHost) { var _nodeRoot2, _nodeRootHost2, _nodeRootHost2$ownerD; nodeRoot = getRootNode(nodeRootHost); nodeRootHost = (_nodeRoot2 = nodeRoot) === null || _nodeRoot2 === void 0 ? void 0 : _nodeRoot2.host; attached = !!((_nodeRootHost2 = nodeRootHost) !== null && _nodeRootHost2 !== void 0 && (_nodeRootHost2$ownerD = _nodeRootHost2.ownerDocument) !== null && _nodeRootHost2$ownerD !== void 0 && _nodeRootHost2$ownerD.contains(nodeRootHost)); } } return attached; }; var isZeroArea = function isZeroArea2(node) { var _node$getBoundingClie = node.getBoundingClientRect(), width = _node$getBoundingClie.width, height = _node$getBoundingClie.height; return width === 0 && height === 0; }; var isHidden = function isHidden2(node, _ref) { var displayCheck = _ref.displayCheck, getShadowRoot = _ref.getShadowRoot; if (getComputedStyle(node).visibility === "hidden") { return true; } var isDirectSummary = matches.call(node, "details>summary:first-of-type"); var nodeUnderDetails = isDirectSummary ? node.parentElement : node; if (matches.call(nodeUnderDetails, "details:not([open]) *")) { return true; } if (!displayCheck || displayCheck === "full" || displayCheck === "legacy-full") { if (typeof getShadowRoot === "function") { var originalNode = node; while (node) { var parentElement = node.parentElement; var rootNode = getRootNode(node); if (parentElement && !parentElement.shadowRoot && getShadowRoot(parentElement) === true) { return isZeroArea(node); } else if (node.assignedSlot) { node = node.assignedSlot; } else if (!parentElement && rootNode !== node.ownerDocument) { node = rootNode.host; } else { node = parentElement; } } node = originalNode; } if (isNodeAttached(node)) { return !node.getClientRects().length; } if (displayCheck !== "legacy-full") { return true; } } else if (displayCheck === "non-zero-area") { return isZeroArea(node); } return false; }; var isDisabledFromFieldset = function isDisabledFromFieldset2(node) { if (/^(INPUT|BUTTON|SELECT|TEXTAREA)$/.test(node.tagName)) { var parentNode = node.parentElement; while (parentNode) { if (parentNode.tagName === "FIELDSET" && parentNode.disabled) { for (var i = 0; i < parentNode.children.length; i++) { var child = parentNode.children.item(i); if (child.tagName === "LEGEND") { return matches.call(parentNode, "fieldset[disabled] *") ? true : !child.contains(node); } } return true; } parentNode = parentNode.parentElement; } } return false; }; var isNodeMatchingSelectorFocusable = function isNodeMatchingSelectorFocusable2(options, node) { if (node.disabled || // we must do an inert look up to filter out any elements inside an inert ancestor // because we're limited in the type of selectors we can use in JSDom (see related // note related to `candidateSelectors`) isInert(node) || isHiddenInput(node) || isHidden(node, options) || // For a details element with a summary, the summary element gets the focus isDetailsWithSummary(node) || isDisabledFromFieldset(node)) { return false; } return true; }; var isNodeMatchingSelectorTabbable = function isNodeMatchingSelectorTabbable2(options, node) { if (isNonTabbableRadio(node) || getTabindex(node) < 0 || !isNodeMatchingSelectorFocusable(options, node)) { return false; } return true; }; var isValidShadowRootTabbable = function isValidShadowRootTabbable2(shadowHostNode) { var tabIndex = parseInt(shadowHostNode.getAttribute("tabindex"), 10); if (isNaN(tabIndex) || tabIndex >= 0) { return true; } return false; }; var sortByOrder = function sortByOrder2(candidates) { var regularTabbables = []; var orderedTabbables = []; candidates.forEach(function(item, i) { var isScope = !!item.scopeParent; var element = isScope ? item.scopeParent : item; var candidateTabindex = getTabindex(element, isScope); var elements = isScope ? sortByOrder2(item.candidates) : element; if (candidateTabindex === 0) { isScope ? regularTabbables.push.apply(regularTabbables, elements) : regularTabbables.push(element); } else { orderedTabbables.push({ documentOrder: i, tabIndex: candidateTabindex, item, isScope, content: elements }); } }); return orderedTabbables.sort(sortOrderedTabbables).reduce(function(acc, sortable) { sortable.isScope ? acc.push.apply(acc, sortable.content) : acc.push(sortable.content); return acc; }, []).concat(regularTabbables); }; var tabbable = function tabbable2(el, options) { options = options || {}; var candidates; if (options.getShadowRoot) { candidates = getCandidatesIteratively([el], options.includeContainer, { filter: isNodeMatchingSelectorTabbable.bind(null, options), flatten: false, getShadowRoot: options.getShadowRoot, shadowRootFilter: isValidShadowRootTabbable }); } else { candidates = getCandidates(el, options.includeContainer, isNodeMatchingSelectorTabbable.bind(null, options)); } return sortByOrder(candidates); }; // ../../../node_modules/.pnpm/@floating-ui+react@0.23.1_react-dom@18.2.0_react@18.2.0/node_modules/@floating-ui/react/dist/floating-ui.react.esm.js var import_react_dom2 = require("react-dom"); function _extends() { _extends = Object.assign || function(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } var index2 = typeof document !== "undefined" ? import_react2.useLayoutEffect : import_react2.useEffect; var serverHandoffComplete = false; var count = 0; var genId = () => "floating-ui-" + count++; function useFloatingId() { const [id, setId] = React2.useState(() => serverHandoffComplete ? genId() : void 0); index2(() => { if (id == null) { setId(genId()); } }, []); React2.useEffect(() => { if (!serverHandoffComplete) { serverHandoffComplete = true; } }, []); return id; } var useReactId = React2[/* @__PURE__ */ "useId".toString()]; var useId = useReactId || useFloatingId; function createPubSub() { const map = /* @__PURE__ */ new Map(); return { emit(event, data) { var _map$get; (_map$get = map.get(event)) == null ? void 0 : _map$get.forEach((handler) => handler(data)); }, on(event, listener) { map.set(event, [...map.get(event) || [], listener]); }, off(event, listener) { var _map$get2; map.set(event, ((_map$get2 = map.get(event)) == null ? void 0 : _map$get2.filter((l) => l !== listener)) || []); } }; } var FloatingNodeContext = /* @__PURE__ */ React2.createContext(null); var FloatingTreeContext = /* @__PURE__ */ React2.createContext(null); var useFloatingParentNodeId = () => { var _React$useContext; return ((_React$useContext = React2.useContext(FloatingNodeContext)) == null ? void 0 : _React$useContext.id) || null; }; var useFloatingTree = () => React2.useContext(FloatingTreeContext); function getDocument(node) { return (node == null ? void 0 : node.ownerDocument) || document; } function getPlatform() { const uaData = navigator.userAgentData; if (uaData != null && uaData.platform) { return uaData.platform; } return navigator.platform; } function getUserAgent() { const uaData = navigator.userAgentData; if (uaData && Array.isArray(uaData.brands)) { return uaData.brands.map((_ref) => { let { brand, version } = _ref; return brand + "/" + version; }).join(" "); } return navigator.userAgent; } function getWindow2(value) { return getDocument(value).defaultView || window; } function isElement2(value) { return value ? value instanceof getWindow2(value).Element : false; } function isHTMLElement2(value) { return value ? value instanceof getWindow2(value).HTMLElement : false; } function isShadowRoot2(node) { if (typeof ShadowRoot === "undefined") { return false; } const OwnElement = getWindow2(node).ShadowRoot; return node instanceof OwnElement || node instanceof ShadowRoot; } function isVirtualClick(event) { if (event.mozInputSource === 0 && event.isTrusted) { return true; } const androidRe = /Android/i; if ((androidRe.test(getPlatform()) || androidRe.test(getUserAgent())) && event.pointerType) { return event.type === "click" && event.buttons === 1; } return event.detail === 0 && !event.pointerType; } function isVirtualPointerEvent(event) { return event.width === 0 && event.height === 0 || event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType !== "mouse" || // iOS VoiceOver returns 0.333• for width/height. event.width < 1 && event.height < 1 && event.pressure === 0 && event.detail === 0; } function isSafari() { return /apple/i.test(navigator.vendor); } function isMouseLikePointerType(pointerType, strict) { const values = ["mouse", "pen"]; if (!strict) { values.push("", void 0); } return values.includes(pointerType); } function contains(parent, child) { if (!parent || !child) { return false; } const rootNode = child.getRootNode && child.getRootNode(); if (parent.contains(child)) { return true; } if (rootNode && isShadowRoot2(rootNode)) { let next = child; while (next) { if (parent === next) { return true; } next = next.parentNode || next.host; } } return false; } function activeElement(doc) { let activeElement2 = doc.activeElement; while (((_activeElement = activeElement2) == null ? void 0 : (_activeElement$shadow = _activeElement.shadowRoot) == null ? void 0 : _activeElement$shadow.activeElement) != null) { var _activeElement, _activeElement$shadow; activeElement2 = activeElement2.shadowRoot.activeElement; } return activeElement2; } function getChildren(nodes, id) { let allChildren = nodes.filter((node) => { var _node$context; return node.parentId === id && ((_node$context = node.context) == null ? void 0 : _node$context.open); }); let currentChildren = allChildren; while (currentChildren.length) { currentChildren = nodes.filter((node) => { var _currentChildren; return (_currentChildren = currentChildren) == null ? void 0 : _currentChildren.some((n) => { var _node$context2; return node.parentId === n.id && ((_node$context2 = node.context) == null ? void 0 : _node$context2.open); }); }); allChildren = allChildren.concat(currentChildren); } return allChildren; } function getTarget(event) { if ("composedPath" in event) { return event.composedPath()[0]; } return event.target; } var TYPEABLE_SELECTOR = "input:not([type='hidden']):not([disabled]),[contenteditable]:not([contenteditable='false']),textarea:not([disabled])"; function isTypeableElement(element) { return isHTMLElement2(element) && element.matches(TYPEABLE_SELECTOR); } var getTabbableOptions = () => ({ getShadowRoot: true, displayCheck: ( // JSDOM does not support the `tabbable` library. To solve this we can // check if `ResizeObserver` is a real function (not polyfilled), which // determines if the current environment is JSDOM-like. typeof ResizeObserver === "function" && ResizeObserver.toString().includes("[native code]") ? "full" : "none" ) }); function getTabbableIn(container, direction) { const allTabbable = tabbable(container, getTabbableOptions()); if (direction === "prev") { allTabbable.reverse(); } const activeIndex = allTabbable.indexOf(activeElement(getDocument(container))); const nextTabbableElements = allTabbable.slice(activeIndex + 1); return nextTabbableElements[0]; } function getNextTabbable() { return getTabbableIn(document.body, "next"); } function getPreviousTabbable() { return getTabbableIn(document.body, "prev"); } function isOutsideEvent(event, container) { const containerElement = container || event.currentTarget; const relatedTarget = event.relatedTarget; return !relatedTarget || !contains(containerElement, relatedTarget); } function disableFocusInside(container) { const tabbableElements = tabbable(container, getTabbableOptions());