@neynar/ui 0.4.0 → 1.0.0

package/dist/node_modules/@base-ui/react/esm/composite/root/CompositeRoot.js

@@ -0,0 +1,85 @@
+"use client";
+import * as React from "react";
+import { CompositeList } from "../list/CompositeList.js";
+import { useCompositeRoot } from "./useCompositeRoot.js";
+import { CompositeRootContext } from "./CompositeRootContext.js";
+import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useDirection } from "../../direction-provider/DirectionContext.js";
+import { jsx } from "react/jsx-runtime";
+import { EMPTY_ARRAY, EMPTY_OBJECT } from "../../../../utils/esm/empty.js";
+function CompositeRoot(componentProps) {
+  const {
+    render,
+    className,
+    refs = EMPTY_ARRAY,
+    props = EMPTY_ARRAY,
+    state = EMPTY_OBJECT,
+    stateAttributesMapping,
+    highlightedIndex: highlightedIndexProp,
+    onHighlightedIndexChange: onHighlightedIndexChangeProp,
+    orientation,
+    dense,
+    itemSizes,
+    loopFocus,
+    cols,
+    enableHomeAndEndKeys,
+    onMapChange: onMapChangeProp,
+    stopEventPropagation = true,
+    rootRef,
+    disabledIndices,
+    modifierKeys,
+    highlightItemOnHover = false,
+    tag = "div",
+    ...elementProps
+  } = componentProps;
+  const direction = useDirection();
+  const {
+    props: defaultProps,
+    highlightedIndex,
+    onHighlightedIndexChange,
+    elementsRef,
+    onMapChange: onMapChangeUnwrapped,
+    relayKeyboardEvent
+  } = useCompositeRoot({
+    itemSizes,
+    cols,
+    loopFocus,
+    dense,
+    orientation,
+    highlightedIndex: highlightedIndexProp,
+    onHighlightedIndexChange: onHighlightedIndexChangeProp,
+    rootRef,
+    stopEventPropagation,
+    enableHomeAndEndKeys,
+    direction,
+    disabledIndices,
+    modifierKeys
+  });
+  const element = useRenderElement(tag, componentProps, {
+    state,
+    ref: refs,
+    props: [defaultProps, ...props, elementProps],
+    stateAttributesMapping
+  });
+  const contextValue = React.useMemo(() => ({
+    highlightedIndex,
+    onHighlightedIndexChange,
+    highlightItemOnHover,
+    relayKeyboardEvent
+  }), [highlightedIndex, onHighlightedIndexChange, highlightItemOnHover, relayKeyboardEvent]);
+  return /* @__PURE__ */ jsx(CompositeRootContext.Provider, {
+    value: contextValue,
+    children: /* @__PURE__ */ jsx(CompositeList, {
+      elementsRef,
+      onMapChange: (newMap) => {
+        onMapChangeProp?.(newMap);
+        onMapChangeUnwrapped(newMap);
+      },
+      children: element
+    })
+  });
+}
+export {
+  CompositeRoot
+};
+//# sourceMappingURL=CompositeRoot.js.map

package/dist/node_modules/@base-ui/react/esm/composite/root/CompositeRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompositeRoot.js","sources":["../../../../../../../node_modules/@base-ui/react/esm/composite/root/CompositeRoot.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { CompositeList } from \"../list/CompositeList.js\";\nimport { useCompositeRoot } from \"./useCompositeRoot.js\";\nimport { CompositeRootContext } from \"./CompositeRootContext.js\";\nimport { useRenderElement } from \"../../utils/useRenderElement.js\";\nimport { useDirection } from \"../../direction-provider/DirectionContext.js\";\nimport { EMPTY_ARRAY, EMPTY_OBJECT } from \"../../utils/constants.js\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * @internal\n */\nexport function CompositeRoot(componentProps) {\n  const {\n    render,\n    className,\n    refs = EMPTY_ARRAY,\n    props = EMPTY_ARRAY,\n    state = EMPTY_OBJECT,\n    stateAttributesMapping,\n    highlightedIndex: highlightedIndexProp,\n    onHighlightedIndexChange: onHighlightedIndexChangeProp,\n    orientation,\n    dense,\n    itemSizes,\n    loopFocus,\n    cols,\n    enableHomeAndEndKeys,\n    onMapChange: onMapChangeProp,\n    stopEventPropagation = true,\n    rootRef,\n    disabledIndices,\n    modifierKeys,\n    highlightItemOnHover = false,\n    tag = 'div',\n    ...elementProps\n  } = componentProps;\n  const direction = useDirection();\n  const {\n    props: defaultProps,\n    highlightedIndex,\n    onHighlightedIndexChange,\n    elementsRef,\n    onMapChange: onMapChangeUnwrapped,\n    relayKeyboardEvent\n  } = useCompositeRoot({\n    itemSizes,\n    cols,\n    loopFocus,\n    dense,\n    orientation,\n    highlightedIndex: highlightedIndexProp,\n    onHighlightedIndexChange: onHighlightedIndexChangeProp,\n    rootRef,\n    stopEventPropagation,\n    enableHomeAndEndKeys,\n    direction,\n    disabledIndices,\n    modifierKeys\n  });\n  const element = useRenderElement(tag, componentProps, {\n    state,\n    ref: refs,\n    props: [defaultProps, ...props, elementProps],\n    stateAttributesMapping\n  });\n  const contextValue = React.useMemo(() => ({\n    highlightedIndex,\n    onHighlightedIndexChange,\n    highlightItemOnHover,\n    relayKeyboardEvent\n  }), [highlightedIndex, onHighlightedIndexChange, highlightItemOnHover, relayKeyboardEvent]);\n  return /*#__PURE__*/_jsx(CompositeRootContext.Provider, {\n    value: contextValue,\n    children: /*#__PURE__*/_jsx(CompositeList, {\n      elementsRef: elementsRef,\n      onMapChange: newMap => {\n        onMapChangeProp?.(newMap);\n        onMapChangeUnwrapped(newMap);\n      },\n      children: element\n    })\n  });\n}"],"names":[],"mappings":";;;;;;;;;AAaO;AACL;AAAM;AACJ;AACA;AACO;AACC;AACA;AACR;AACkB;AACQ;AAC1B;AACA;AACA;AACA;AACA;AACA;AACa;AACU;AACvB;AACA;AACA;AACuB;AACjB;AACH;AAEL;AACA;AAAM;AACG;AACP;AACA;AACA;AACa;AACb;AACmB;AACnB;AACA;AACA;AACA;AACA;AACkB;AACQ;AAC1B;AACA;AACA;AACA;AACA;AACA;AAEF;AAAsD;AACpD;AACK;AACuC;AAC5C;AAEF;AAA0C;AACxC;AACA;AACA;AACA;AAEF;AAAwD;AAC/C;AACoC;AACzC;AAEE;AACA;AAA2B;AAC7B;AACU;AACX;AAEL;;;;","x_google_ignoreList":[0]}

package/dist/node_modules/@base-ui/react/esm/composite/root/CompositeRootContext.js

@@ -0,0 +1,17 @@
+"use client";
+import formatErrorMessage from "../../../../utils/esm/formatErrorMessage.js";
+import * as React from "react";
+const CompositeRootContext = /* @__PURE__ */ React.createContext(void 0);
+if (process.env.NODE_ENV !== "production") CompositeRootContext.displayName = "CompositeRootContext";
+function useCompositeRootContext(optional = false) {
+  const context = React.useContext(CompositeRootContext);
+  if (context === void 0 && !optional) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: CompositeRootContext is missing. Composite parts must be placed within <Composite.Root>." : formatErrorMessage(16));
+  }
+  return context;
+}
+export {
+  CompositeRootContext,
+  useCompositeRootContext
+};
+//# sourceMappingURL=CompositeRootContext.js.map

package/dist/node_modules/@base-ui/react/esm/composite/root/CompositeRootContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompositeRootContext.js","sources":["../../../../../../../node_modules/@base-ui/react/esm/composite/root/CompositeRootContext.js"],"sourcesContent":["'use client';\n\nimport _formatErrorMessage from \"@base-ui/utils/formatErrorMessage\";\nimport * as React from 'react';\nexport const CompositeRootContext = /*#__PURE__*/React.createContext(undefined);\nif (process.env.NODE_ENV !== \"production\") CompositeRootContext.displayName = \"CompositeRootContext\";\nexport function useCompositeRootContext(optional = false) {\n  const context = React.useContext(CompositeRootContext);\n  if (context === undefined && !optional) {\n    throw new Error(process.env.NODE_ENV !== \"production\" ? 'Base UI: CompositeRootContext is missing. Composite parts must be placed within <Composite.Root>.' : _formatErrorMessage(16));\n  }\n  return context;\n}"],"names":[],"mappings":";;;AAIY;AACZ;AACO;AACL;AACA;AACE;AAAqL;AAEvL;AACF;;;;;","x_google_ignoreList":[0]}

package/dist/node_modules/@base-ui/react/esm/composite/root/useCompositeRoot.js

@@ -0,0 +1,214 @@
+"use client";
+import * as React from "react";
+import { isElementDisabled } from "../../../../utils/esm/isElementDisabled.js";
+import { useStableCallback } from "../../../../utils/esm/useStableCallback.js";
+import { useMergedRefs } from "../../../../utils/esm/useMergedRefs.js";
+import { scrollIntoViewIfNeeded, ALL_KEYS, ARROW_KEYS, isNativeInput, ARROW_DOWN, ARROW_RIGHT, HOME, END, ARROW_LEFT, ARROW_UP, VERTICAL_KEYS_WITH_EXTRA_KEYS, VERTICAL_KEYS, HORIZONTAL_KEYS_WITH_EXTRA_KEYS, HORIZONTAL_KEYS, MODIFIER_KEYS } from "../composite.js";
+import { ACTIVE_COMPOSITE_ITEM } from "../constants.js";
+import { getMinListIndex, getMaxListIndex, createGridCellMap, isListIndexDisabled, getGridNavigatedIndex, getGridCellIndexOfCorner, getGridCellIndices, findNonDisabledListIndex, isIndexOutOfListBounds } from "../../floating-ui-react/utils/composite.js";
+const EMPTY_ARRAY = [];
+function useCompositeRoot(params) {
+  const {
+    itemSizes,
+    cols = 1,
+    loopFocus = true,
+    dense = false,
+    orientation = "both",
+    direction,
+    highlightedIndex: externalHighlightedIndex,
+    onHighlightedIndexChange: externalSetHighlightedIndex,
+    rootRef: externalRef,
+    enableHomeAndEndKeys = false,
+    stopEventPropagation = false,
+    disabledIndices,
+    modifierKeys = EMPTY_ARRAY
+  } = params;
+  const [internalHighlightedIndex, internalSetHighlightedIndex] = React.useState(0);
+  const isGrid = cols > 1;
+  const rootRef = React.useRef(null);
+  const mergedRef = useMergedRefs(rootRef, externalRef);
+  const elementsRef = React.useRef([]);
+  const hasSetDefaultIndexRef = React.useRef(false);
+  const highlightedIndex = externalHighlightedIndex ?? internalHighlightedIndex;
+  const onHighlightedIndexChange = useStableCallback((index, shouldScrollIntoView = false) => {
+    (externalSetHighlightedIndex ?? internalSetHighlightedIndex)(index);
+    if (shouldScrollIntoView) {
+      const newActiveItem = elementsRef.current[index];
+      scrollIntoViewIfNeeded(rootRef.current, newActiveItem, direction, orientation);
+    }
+  });
+  const onMapChange = useStableCallback((map) => {
+    if (map.size === 0 || hasSetDefaultIndexRef.current) {
+      return;
+    }
+    hasSetDefaultIndexRef.current = true;
+    const sortedElements = Array.from(map.keys());
+    const activeItem = sortedElements.find((compositeElement) => compositeElement?.hasAttribute(ACTIVE_COMPOSITE_ITEM)) ?? null;
+    const activeIndex = activeItem ? sortedElements.indexOf(activeItem) : -1;
+    if (activeIndex !== -1) {
+      onHighlightedIndexChange(activeIndex);
+    }
+    scrollIntoViewIfNeeded(rootRef.current, activeItem, direction, orientation);
+  });
+  const props = React.useMemo(() => ({
+    "aria-orientation": orientation === "both" ? void 0 : orientation,
+    ref: mergedRef,
+    onFocus(event) {
+      const element = rootRef.current;
+      if (!element || !isNativeInput(event.target)) {
+        return;
+      }
+      event.target.setSelectionRange(0, event.target.value.length ?? 0);
+    },
+    onKeyDown(event) {
+      const RELEVANT_KEYS = enableHomeAndEndKeys ? ALL_KEYS : ARROW_KEYS;
+      if (!RELEVANT_KEYS.has(event.key)) {
+        return;
+      }
+      if (isModifierKeySet(event, modifierKeys)) {
+        return;
+      }
+      const element = rootRef.current;
+      if (!element) {
+        return;
+      }
+      const isRtl = direction === "rtl";
+      const horizontalForwardKey = isRtl ? ARROW_LEFT : ARROW_RIGHT;
+      const forwardKey = {
+        horizontal: horizontalForwardKey,
+        vertical: ARROW_DOWN,
+        both: horizontalForwardKey
+      }[orientation];
+      const horizontalBackwardKey = isRtl ? ARROW_RIGHT : ARROW_LEFT;
+      const backwardKey = {
+        horizontal: horizontalBackwardKey,
+        vertical: ARROW_UP,
+        both: horizontalBackwardKey
+      }[orientation];
+      if (isNativeInput(event.target) && !isElementDisabled(event.target)) {
+        const selectionStart = event.target.selectionStart;
+        const selectionEnd = event.target.selectionEnd;
+        const textContent = event.target.value ?? "";
+        if (selectionStart == null || event.shiftKey || selectionStart !== selectionEnd) {
+          return;
+        }
+        if (event.key !== backwardKey && selectionStart < textContent.length) {
+          return;
+        }
+        if (event.key !== forwardKey && selectionStart > 0) {
+          return;
+        }
+      }
+      let nextIndex = highlightedIndex;
+      const minIndex = getMinListIndex(elementsRef, disabledIndices);
+      const maxIndex = getMaxListIndex(elementsRef, disabledIndices);
+      if (isGrid) {
+        const sizes = itemSizes || Array.from({
+          length: elementsRef.current.length
+        }, () => ({
+          width: 1,
+          height: 1
+        }));
+        const cellMap = createGridCellMap(sizes, cols, dense);
+        const minGridIndex = cellMap.findIndex((index) => index != null && !isListIndexDisabled(elementsRef, index, disabledIndices));
+        const maxGridIndex = cellMap.reduce((foundIndex, index, cellIndex) => index != null && !isListIndexDisabled(elementsRef, index, disabledIndices) ? cellIndex : foundIndex, -1);
+        nextIndex = cellMap[getGridNavigatedIndex({
+          current: cellMap.map((itemIndex) => itemIndex ? elementsRef.current[itemIndex] : null)
+        }, {
+          event,
+          orientation,
+          loopFocus,
+          cols,
+          // treat undefined (empty grid spaces) as disabled indices so we
+          // don't end up in them
+          disabledIndices: getGridCellIndices([...disabledIndices || elementsRef.current.map((_, index) => isListIndexDisabled(elementsRef, index) ? index : void 0), void 0], cellMap),
+          minIndex: minGridIndex,
+          maxIndex: maxGridIndex,
+          prevIndex: getGridCellIndexOfCorner(
+            highlightedIndex > maxIndex ? minIndex : highlightedIndex,
+            sizes,
+            cellMap,
+            cols,
+            // use a corner matching the edge closest to the direction we're
+            // moving in so we don't end up in the same item. Prefer
+            // top/left over bottom/right.
+            // eslint-disable-next-line no-nested-ternary
+            event.key === ARROW_DOWN ? "bl" : event.key === ARROW_RIGHT ? "tr" : "tl"
+          ),
+          rtl: isRtl
+        })];
+      }
+      const forwardKeys = {
+        horizontal: [horizontalForwardKey],
+        vertical: [ARROW_DOWN],
+        both: [horizontalForwardKey, ARROW_DOWN]
+      }[orientation];
+      const backwardKeys = {
+        horizontal: [horizontalBackwardKey],
+        vertical: [ARROW_UP],
+        both: [horizontalBackwardKey, ARROW_UP]
+      }[orientation];
+      const preventedKeys = isGrid ? RELEVANT_KEYS : {
+        horizontal: enableHomeAndEndKeys ? HORIZONTAL_KEYS_WITH_EXTRA_KEYS : HORIZONTAL_KEYS,
+        vertical: enableHomeAndEndKeys ? VERTICAL_KEYS_WITH_EXTRA_KEYS : VERTICAL_KEYS,
+        both: RELEVANT_KEYS
+      }[orientation];
+      if (enableHomeAndEndKeys) {
+        if (event.key === HOME) {
+          nextIndex = minIndex;
+        } else if (event.key === END) {
+          nextIndex = maxIndex;
+        }
+      }
+      if (nextIndex === highlightedIndex && (forwardKeys.includes(event.key) || backwardKeys.includes(event.key))) {
+        if (loopFocus && nextIndex === maxIndex && forwardKeys.includes(event.key)) {
+          nextIndex = minIndex;
+        } else if (loopFocus && nextIndex === minIndex && backwardKeys.includes(event.key)) {
+          nextIndex = maxIndex;
+        } else {
+          nextIndex = findNonDisabledListIndex(elementsRef, {
+            startingIndex: nextIndex,
+            decrement: backwardKeys.includes(event.key),
+            disabledIndices
+          });
+        }
+      }
+      if (nextIndex !== highlightedIndex && !isIndexOutOfListBounds(elementsRef, nextIndex)) {
+        if (stopEventPropagation) {
+          event.stopPropagation();
+        }
+        if (preventedKeys.has(event.key)) {
+          event.preventDefault();
+        }
+        onHighlightedIndexChange(nextIndex, true);
+        queueMicrotask(() => {
+          elementsRef.current[nextIndex]?.focus();
+        });
+      }
+    }
+  }), [cols, dense, direction, disabledIndices, elementsRef, enableHomeAndEndKeys, highlightedIndex, isGrid, itemSizes, loopFocus, mergedRef, modifierKeys, onHighlightedIndexChange, orientation, stopEventPropagation]);
+  return React.useMemo(() => ({
+    props,
+    highlightedIndex,
+    onHighlightedIndexChange,
+    elementsRef,
+    disabledIndices,
+    onMapChange,
+    relayKeyboardEvent: props.onKeyDown
+  }), [props, highlightedIndex, onHighlightedIndexChange, elementsRef, disabledIndices, onMapChange]);
+}
+function isModifierKeySet(event, ignoredModifierKeys) {
+  for (const key of MODIFIER_KEYS.values()) {
+    if (ignoredModifierKeys.includes(key)) {
+      continue;
+    }
+    if (event.getModifierState(key)) {
+      return true;
+    }
+  }
+  return false;
+}
+export {
+  useCompositeRoot
+};
+//# sourceMappingURL=useCompositeRoot.js.map

package/dist/node_modules/@base-ui/react/esm/composite/root/useCompositeRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCompositeRoot.js","sources":["../../../../../../../node_modules/@base-ui/react/esm/composite/root/useCompositeRoot.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { isElementDisabled } from '@base-ui/utils/isElementDisabled';\nimport { useStableCallback } from '@base-ui/utils/useStableCallback';\nimport { useMergedRefs } from '@base-ui/utils/useMergedRefs';\nimport { ALL_KEYS, ARROW_DOWN, ARROW_KEYS, ARROW_LEFT, ARROW_RIGHT, ARROW_UP, END, HOME, HORIZONTAL_KEYS, HORIZONTAL_KEYS_WITH_EXTRA_KEYS, MODIFIER_KEYS, VERTICAL_KEYS, VERTICAL_KEYS_WITH_EXTRA_KEYS, createGridCellMap, findNonDisabledListIndex, getGridCellIndexOfCorner, getGridCellIndices, getGridNavigatedIndex, getMaxListIndex, getMinListIndex, isListIndexDisabled, isIndexOutOfListBounds, isNativeInput, scrollIntoViewIfNeeded } from \"../composite.js\";\nimport { ACTIVE_COMPOSITE_ITEM } from \"../constants.js\";\nconst EMPTY_ARRAY = [];\nexport function useCompositeRoot(params) {\n  const {\n    itemSizes,\n    cols = 1,\n    loopFocus = true,\n    dense = false,\n    orientation = 'both',\n    direction,\n    highlightedIndex: externalHighlightedIndex,\n    onHighlightedIndexChange: externalSetHighlightedIndex,\n    rootRef: externalRef,\n    enableHomeAndEndKeys = false,\n    stopEventPropagation = false,\n    disabledIndices,\n    modifierKeys = EMPTY_ARRAY\n  } = params;\n  const [internalHighlightedIndex, internalSetHighlightedIndex] = React.useState(0);\n  const isGrid = cols > 1;\n  const rootRef = React.useRef(null);\n  const mergedRef = useMergedRefs(rootRef, externalRef);\n  const elementsRef = React.useRef([]);\n  const hasSetDefaultIndexRef = React.useRef(false);\n  const highlightedIndex = externalHighlightedIndex ?? internalHighlightedIndex;\n  const onHighlightedIndexChange = useStableCallback((index, shouldScrollIntoView = false) => {\n    (externalSetHighlightedIndex ?? internalSetHighlightedIndex)(index);\n    if (shouldScrollIntoView) {\n      const newActiveItem = elementsRef.current[index];\n      scrollIntoViewIfNeeded(rootRef.current, newActiveItem, direction, orientation);\n    }\n  });\n  const onMapChange = useStableCallback(map => {\n    if (map.size === 0 || hasSetDefaultIndexRef.current) {\n      return;\n    }\n    hasSetDefaultIndexRef.current = true;\n    const sortedElements = Array.from(map.keys());\n    const activeItem = sortedElements.find(compositeElement => compositeElement?.hasAttribute(ACTIVE_COMPOSITE_ITEM)) ?? null;\n    // Set the default highlighted index of an arbitrary composite item.\n    const activeIndex = activeItem ? sortedElements.indexOf(activeItem) : -1;\n    if (activeIndex !== -1) {\n      onHighlightedIndexChange(activeIndex);\n    }\n    scrollIntoViewIfNeeded(rootRef.current, activeItem, direction, orientation);\n  });\n  const props = React.useMemo(() => ({\n    'aria-orientation': orientation === 'both' ? undefined : orientation,\n    ref: mergedRef,\n    onFocus(event) {\n      const element = rootRef.current;\n      if (!element || !isNativeInput(event.target)) {\n        return;\n      }\n      event.target.setSelectionRange(0, event.target.value.length ?? 0);\n    },\n    onKeyDown(event) {\n      const RELEVANT_KEYS = enableHomeAndEndKeys ? ALL_KEYS : ARROW_KEYS;\n      if (!RELEVANT_KEYS.has(event.key)) {\n        return;\n      }\n      if (isModifierKeySet(event, modifierKeys)) {\n        return;\n      }\n      const element = rootRef.current;\n      if (!element) {\n        return;\n      }\n      const isRtl = direction === 'rtl';\n      const horizontalForwardKey = isRtl ? ARROW_LEFT : ARROW_RIGHT;\n      const forwardKey = {\n        horizontal: horizontalForwardKey,\n        vertical: ARROW_DOWN,\n        both: horizontalForwardKey\n      }[orientation];\n      const horizontalBackwardKey = isRtl ? ARROW_RIGHT : ARROW_LEFT;\n      const backwardKey = {\n        horizontal: horizontalBackwardKey,\n        vertical: ARROW_UP,\n        both: horizontalBackwardKey\n      }[orientation];\n      if (isNativeInput(event.target) && !isElementDisabled(event.target)) {\n        const selectionStart = event.target.selectionStart;\n        const selectionEnd = event.target.selectionEnd;\n        const textContent = event.target.value ?? '';\n        // return to native textbox behavior when\n        // 1 - Shift is held to make a text selection, or if there already is a text selection\n        if (selectionStart == null || event.shiftKey || selectionStart !== selectionEnd) {\n          return;\n        }\n        // 2 - arrow-ing forward and not in the last position of the text\n        if (event.key !== backwardKey && selectionStart < textContent.length) {\n          return;\n        }\n        // 3 -arrow-ing backward and not in the first position of the text\n        if (event.key !== forwardKey && selectionStart > 0) {\n          return;\n        }\n      }\n      let nextIndex = highlightedIndex;\n      const minIndex = getMinListIndex(elementsRef, disabledIndices);\n      const maxIndex = getMaxListIndex(elementsRef, disabledIndices);\n      if (isGrid) {\n        const sizes = itemSizes || Array.from({\n          length: elementsRef.current.length\n        }, () => ({\n          width: 1,\n          height: 1\n        }));\n        // To calculate movements on the grid, we use hypothetical cell indices\n        // as if every item was 1x1, then convert back to real indices.\n        const cellMap = createGridCellMap(sizes, cols, dense);\n        const minGridIndex = cellMap.findIndex(index => index != null && !isListIndexDisabled(elementsRef, index, disabledIndices));\n        // last enabled index\n        const maxGridIndex = cellMap.reduce((foundIndex, index, cellIndex) => index != null && !isListIndexDisabled(elementsRef, index, disabledIndices) ? cellIndex : foundIndex, -1);\n        nextIndex = cellMap[getGridNavigatedIndex({\n          current: cellMap.map(itemIndex => itemIndex ? elementsRef.current[itemIndex] : null)\n        }, {\n          event,\n          orientation,\n          loopFocus,\n          cols,\n          // treat undefined (empty grid spaces) as disabled indices so we\n          // don't end up in them\n          disabledIndices: getGridCellIndices([...(disabledIndices || elementsRef.current.map((_, index) => isListIndexDisabled(elementsRef, index) ? index : undefined)), undefined], cellMap),\n          minIndex: minGridIndex,\n          maxIndex: maxGridIndex,\n          prevIndex: getGridCellIndexOfCorner(highlightedIndex > maxIndex ? minIndex : highlightedIndex, sizes, cellMap, cols,\n          // use a corner matching the edge closest to the direction we're\n          // moving in so we don't end up in the same item. Prefer\n          // top/left over bottom/right.\n          // eslint-disable-next-line no-nested-ternary\n          event.key === ARROW_DOWN ? 'bl' : event.key === ARROW_RIGHT ? 'tr' : 'tl'),\n          rtl: isRtl\n        })]; // navigated cell will never be nullish\n      }\n      const forwardKeys = {\n        horizontal: [horizontalForwardKey],\n        vertical: [ARROW_DOWN],\n        both: [horizontalForwardKey, ARROW_DOWN]\n      }[orientation];\n      const backwardKeys = {\n        horizontal: [horizontalBackwardKey],\n        vertical: [ARROW_UP],\n        both: [horizontalBackwardKey, ARROW_UP]\n      }[orientation];\n      const preventedKeys = isGrid ? RELEVANT_KEYS : {\n        horizontal: enableHomeAndEndKeys ? HORIZONTAL_KEYS_WITH_EXTRA_KEYS : HORIZONTAL_KEYS,\n        vertical: enableHomeAndEndKeys ? VERTICAL_KEYS_WITH_EXTRA_KEYS : VERTICAL_KEYS,\n        both: RELEVANT_KEYS\n      }[orientation];\n      if (enableHomeAndEndKeys) {\n        if (event.key === HOME) {\n          nextIndex = minIndex;\n        } else if (event.key === END) {\n          nextIndex = maxIndex;\n        }\n      }\n      if (nextIndex === highlightedIndex && (forwardKeys.includes(event.key) || backwardKeys.includes(event.key))) {\n        if (loopFocus && nextIndex === maxIndex && forwardKeys.includes(event.key)) {\n          nextIndex = minIndex;\n        } else if (loopFocus && nextIndex === minIndex && backwardKeys.includes(event.key)) {\n          nextIndex = maxIndex;\n        } else {\n          nextIndex = findNonDisabledListIndex(elementsRef, {\n            startingIndex: nextIndex,\n            decrement: backwardKeys.includes(event.key),\n            disabledIndices\n          });\n        }\n      }\n      if (nextIndex !== highlightedIndex && !isIndexOutOfListBounds(elementsRef, nextIndex)) {\n        if (stopEventPropagation) {\n          event.stopPropagation();\n        }\n        if (preventedKeys.has(event.key)) {\n          event.preventDefault();\n        }\n        onHighlightedIndexChange(nextIndex, true);\n\n        // Wait for FocusManager `returnFocus` to execute.\n        queueMicrotask(() => {\n          elementsRef.current[nextIndex]?.focus();\n        });\n      }\n    }\n  }), [cols, dense, direction, disabledIndices, elementsRef, enableHomeAndEndKeys, highlightedIndex, isGrid, itemSizes, loopFocus, mergedRef, modifierKeys, onHighlightedIndexChange, orientation, stopEventPropagation]);\n  return React.useMemo(() => ({\n    props,\n    highlightedIndex,\n    onHighlightedIndexChange,\n    elementsRef,\n    disabledIndices,\n    onMapChange,\n    relayKeyboardEvent: props.onKeyDown\n  }), [props, highlightedIndex, onHighlightedIndexChange, elementsRef, disabledIndices, onMapChange]);\n}\nfunction isModifierKeySet(event, ignoredModifierKeys) {\n  for (const key of MODIFIER_KEYS.values()) {\n    if (ignoredModifierKeys.includes(key)) {\n      continue;\n    }\n    if (event.getModifierState(key)) {\n      return true;\n    }\n  }\n  return false;\n}"],"names":[],"mappings":";;;;;;;;AAQA;AACO;AACL;AAAM;AACJ;AACO;AACK;AACJ;AACM;AACd;AACkB;AACQ;AACjB;AACc;AACA;AACvB;AACe;AAEjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACE;AACA;AACE;AACA;AAA6E;AAC/E;AAEF;AACE;AACE;AAAA;AAEF;AACA;AACA;AAEA;AACA;AACE;AAAoC;AAEtC;AAA0E;AAE5E;AAAmC;AACwB;AACpD;AAEH;AACA;AACE;AAAA;AAEF;AAAgE;AAClE;AAEE;AACA;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACA;AACE;AAAA;AAEF;AACA;AACA;AAAmB;AACL;AACF;AACJ;AAER;AACA;AAAoB;AACN;AACF;AACJ;AAER;AACE;AACA;AACA;AAGA;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AACF;AAEF;AACA;AACA;AACA;AACE;AAAsC;AACR;AACpB;AACD;AACC;AAIV;AACA;AAEA;AACA;AAA0C;AAC2C;AAClF;AACD;AACA;AACA;AACA;AAAA;AAAA;AAGoL;AAC1K;AACA;AACC;AAAkE;AAAkB;AAAO;AAAS;AAAA;AAAA;AAAA;AAAA;AAK1C;AAAI;AACpE;AACL;AAEJ;AAAoB;AACe;AACZ;AACkB;AAEzC;AAAqB;AACe;AACf;AACmB;AAExC;AAA+C;AACwB;AACJ;AAC3D;AAER;AACE;AACE;AAAY;AAEZ;AAAY;AACd;AAEF;AACE;AACE;AAAY;AAEZ;AAAY;AAEZ;AAAkD;AACjC;AAC2B;AAC1C;AACD;AACH;AAEF;AACE;AACE;AAAqB;AAEvB;AACE;AAAoB;AAEtB;AAGA;AACE;AAAqC;AACtC;AACH;AACF;AAEF;AAA4B;AAC1B;AACA;AACA;AACA;AACA;AACA;AAC0B;AAE9B;AACA;AACE;AACE;AACE;AAAA;AAEF;AACE;AAAO;AACT;AAEF;AACF;;;;","x_google_ignoreList":[0]}

package/dist/node_modules/@base-ui/react/esm/context-menu/root/ContextMenuRoot.js

@@ -0,0 +1,50 @@
+"use client";
+import * as React from "react";
+import { useId } from "../../../../utils/esm/useId.js";
+import { ContextMenuRootContext } from "./ContextMenuRootContext.js";
+import { MenuRootContext } from "../../menu/root/MenuRootContext.js";
+import { jsx } from "react/jsx-runtime";
+import { MenuRoot } from "../../menu/root/MenuRoot.js";
+function ContextMenuRoot(props) {
+  const [anchor, setAnchor] = React.useState({
+    getBoundingClientRect() {
+      return DOMRect.fromRect({
+        width: 0,
+        height: 0,
+        x: 0,
+        y: 0
+      });
+    }
+  });
+  const backdropRef = React.useRef(null);
+  const internalBackdropRef = React.useRef(null);
+  const actionsRef = React.useRef(null);
+  const positionerRef = React.useRef(null);
+  const allowMouseUpTriggerRef = React.useRef(true);
+  const initialCursorPointRef = React.useRef(null);
+  const id = useId();
+  const contextValue = React.useMemo(() => ({
+    anchor,
+    setAnchor,
+    actionsRef,
+    backdropRef,
+    internalBackdropRef,
+    positionerRef,
+    allowMouseUpTriggerRef,
+    initialCursorPointRef,
+    rootId: id
+  }), [anchor, id]);
+  return /* @__PURE__ */ jsx(ContextMenuRootContext.Provider, {
+    value: contextValue,
+    children: /* @__PURE__ */ jsx(MenuRootContext.Provider, {
+      value: void 0,
+      children: /* @__PURE__ */ jsx(MenuRoot, {
+        ...props
+      })
+    })
+  });
+}
+export {
+  ContextMenuRoot
+};
+//# sourceMappingURL=ContextMenuRoot.js.map

package/dist/node_modules/@base-ui/react/esm/context-menu/root/ContextMenuRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenuRoot.js","sources":["../../../../../../../node_modules/@base-ui/react/esm/context-menu/root/ContextMenuRoot.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useId } from '@base-ui/utils/useId';\nimport { ContextMenuRootContext } from \"./ContextMenuRootContext.js\";\nimport { Menu } from \"../../menu/index.js\";\nimport { MenuRootContext } from \"../../menu/root/MenuRootContext.js\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * A component that creates a context menu activated by right clicking or long pressing.\n * Doesn’t render its own HTML element.\n *\n * Documentation: [Base UI Context Menu](https://base-ui.com/react/components/context-menu)\n */\nexport function ContextMenuRoot(props) {\n  const [anchor, setAnchor] = React.useState({\n    getBoundingClientRect() {\n      return DOMRect.fromRect({\n        width: 0,\n        height: 0,\n        x: 0,\n        y: 0\n      });\n    }\n  });\n  const backdropRef = React.useRef(null);\n  const internalBackdropRef = React.useRef(null);\n  const actionsRef = React.useRef(null);\n  const positionerRef = React.useRef(null);\n  const allowMouseUpTriggerRef = React.useRef(true);\n  const initialCursorPointRef = React.useRef(null);\n  const id = useId();\n  const contextValue = React.useMemo(() => ({\n    anchor,\n    setAnchor,\n    actionsRef,\n    backdropRef,\n    internalBackdropRef,\n    positionerRef,\n    allowMouseUpTriggerRef,\n    initialCursorPointRef,\n    rootId: id\n  }), [anchor, id]);\n  return /*#__PURE__*/_jsx(ContextMenuRootContext.Provider, {\n    value: contextValue,\n    children: /*#__PURE__*/_jsx(MenuRootContext.Provider, {\n      value: undefined,\n      children: /*#__PURE__*/_jsx(Menu.Root, {\n        ...props\n      })\n    })\n  });\n}"],"names":[],"mappings":";;;;;;;AAcO;AACL;AAA2C;AAEvC;AAAwB;AACf;AACC;AACL;AACA;AACJ;AACH;AAEF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAA0C;AACxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACQ;AAEV;AAA0D;AACjD;AAC+C;AAC7C;AACgC;AAClC;AACJ;AACF;AAEL;;;;","x_google_ignoreList":[0]}

package/dist/node_modules/@base-ui/react/esm/context-menu/root/ContextMenuRootContext.js

@@ -0,0 +1,16 @@
+import formatErrorMessage from "../../../../utils/esm/formatErrorMessage.js";
+import * as React from "react";
+const ContextMenuRootContext = /* @__PURE__ */ React.createContext(void 0);
+if (process.env.NODE_ENV !== "production") ContextMenuRootContext.displayName = "ContextMenuRootContext";
+function useContextMenuRootContext(optional = true) {
+  const context = React.useContext(ContextMenuRootContext);
+  if (context === void 0 && !optional) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: ContextMenuRootContext is missing. ContextMenu parts must be placed within <ContextMenu.Root>." : formatErrorMessage(25));
+  }
+  return context;
+}
+export {
+  ContextMenuRootContext,
+  useContextMenuRootContext
+};
+//# sourceMappingURL=ContextMenuRootContext.js.map

package/dist/node_modules/@base-ui/react/esm/context-menu/root/ContextMenuRootContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenuRootContext.js","sources":["../../../../../../../node_modules/@base-ui/react/esm/context-menu/root/ContextMenuRootContext.js"],"sourcesContent":["import _formatErrorMessage from \"@base-ui/utils/formatErrorMessage\";\nimport * as React from 'react';\nexport const ContextMenuRootContext = /*#__PURE__*/React.createContext(undefined);\nif (process.env.NODE_ENV !== \"production\") ContextMenuRootContext.displayName = \"ContextMenuRootContext\";\nexport function useContextMenuRootContext(optional = true) {\n  const context = React.useContext(ContextMenuRootContext);\n  if (context === undefined && !optional) {\n    throw new Error(process.env.NODE_ENV !== \"production\" ? 'Base UI: ContextMenuRootContext is missing. ContextMenu parts must be placed within <ContextMenu.Root>.' : _formatErrorMessage(25));\n  }\n  return context;\n}"],"names":["_formatErrorMessage"],"mappings":";;AAEY,MAAC,yBAAsC,sBAAM,cAAc,MAAS;AAChF,IAAI,QAAQ,IAAI,aAAa,aAAc,wBAAuB,cAAc;AACzE,SAAS,0BAA0B,WAAW,MAAM;AACzD,QAAM,UAAU,MAAM,WAAW,sBAAsB;AACvD,MAAI,YAAY,UAAa,CAAC,UAAU;AACtC,UAAM,IAAI,MAAM,QAAQ,IAAI,aAAa,eAAe,4GAA4GA,mBAAoB,EAAE,CAAC;AAAA,EAC7L;AACA,SAAO;AACT;","x_google_ignoreList":[0]}

package/dist/node_modules/@base-ui/react/esm/context-menu/trigger/ContextMenuTrigger.js

@@ -0,0 +1,155 @@
+"use client";
+import * as React from "react";
+import { ownerDocument } from "../../../../utils/esm/owner.js";
+import { useTimeout } from "../../../../utils/esm/useTimeout.js";
+import { useContextMenuRootContext } from "../root/ContextMenuRootContext.js";
+import { useMenuRootContext } from "../../menu/root/MenuRootContext.js";
+import { useRenderElement } from "../../utils/useRenderElement.js";
+import { createChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
+import { pressableTriggerOpenStateMapping } from "../../utils/popupStateMapping.js";
+import { findRootOwnerId } from "../../menu/utils/findRootOwnerId.js";
+import { getTarget, contains } from "../../floating-ui-react/utils/element.js";
+import { stopEvent } from "../../floating-ui-react/utils/event.js";
+import { cancelOpen, triggerPress } from "../../utils/reason-parts.js";
+const LONG_PRESS_DELAY = 500;
+const ContextMenuTrigger = /* @__PURE__ */ React.forwardRef(function ContextMenuTrigger2(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    ...elementProps
+  } = componentProps;
+  const {
+    setAnchor,
+    actionsRef,
+    internalBackdropRef,
+    backdropRef,
+    positionerRef,
+    allowMouseUpTriggerRef,
+    initialCursorPointRef,
+    rootId
+  } = useContextMenuRootContext(false);
+  const {
+    store
+  } = useMenuRootContext(false);
+  const open = store.useState("open");
+  const triggerRef = React.useRef(null);
+  const touchPositionRef = React.useRef(null);
+  const longPressTimeout = useTimeout();
+  const allowMouseUpTimeout = useTimeout();
+  const allowMouseUpRef = React.useRef(false);
+  function handleLongPress(x, y, event) {
+    const isTouchEvent = event.type.startsWith("touch");
+    initialCursorPointRef.current = {
+      x,
+      y
+    };
+    setAnchor({
+      getBoundingClientRect() {
+        return DOMRect.fromRect({
+          width: isTouchEvent ? 10 : 0,
+          height: isTouchEvent ? 10 : 0,
+          x,
+          y
+        });
+      }
+    });
+    allowMouseUpRef.current = false;
+    actionsRef.current?.setOpen(true, createChangeEventDetails(triggerPress, event));
+    allowMouseUpTimeout.start(LONG_PRESS_DELAY, () => {
+      allowMouseUpRef.current = true;
+    });
+  }
+  function handleContextMenu(event) {
+    allowMouseUpTriggerRef.current = true;
+    stopEvent(event);
+    handleLongPress(event.clientX, event.clientY, event.nativeEvent);
+    const doc = ownerDocument(triggerRef.current);
+    doc.addEventListener("mouseup", (mouseEvent) => {
+      allowMouseUpTriggerRef.current = false;
+      if (!allowMouseUpRef.current) {
+        return;
+      }
+      allowMouseUpTimeout.clear();
+      allowMouseUpRef.current = false;
+      const mouseUpTarget = getTarget(mouseEvent);
+      if (contains(positionerRef.current, mouseUpTarget)) {
+        return;
+      }
+      if (rootId && mouseUpTarget && findRootOwnerId(mouseUpTarget) === rootId) {
+        return;
+      }
+      actionsRef.current?.setOpen(false, createChangeEventDetails(cancelOpen, mouseEvent));
+    }, {
+      once: true
+    });
+  }
+  function handleTouchStart(event) {
+    allowMouseUpTriggerRef.current = false;
+    if (event.touches.length === 1) {
+      event.stopPropagation();
+      const touch = event.touches[0];
+      touchPositionRef.current = {
+        x: touch.clientX,
+        y: touch.clientY
+      };
+      longPressTimeout.start(LONG_PRESS_DELAY, () => {
+        if (touchPositionRef.current) {
+          handleLongPress(touchPositionRef.current.x, touchPositionRef.current.y, event.nativeEvent);
+        }
+      });
+    }
+  }
+  function handleTouchMove(event) {
+    if (longPressTimeout.isStarted() && touchPositionRef.current && event.touches.length === 1) {
+      const touch = event.touches[0];
+      const moveThreshold = 10;
+      const deltaX = Math.abs(touch.clientX - touchPositionRef.current.x);
+      const deltaY = Math.abs(touch.clientY - touchPositionRef.current.y);
+      if (deltaX > moveThreshold || deltaY > moveThreshold) {
+        longPressTimeout.clear();
+      }
+    }
+  }
+  function handleTouchEnd() {
+    longPressTimeout.clear();
+    touchPositionRef.current = null;
+  }
+  React.useEffect(() => {
+    function handleDocumentContextMenu(event) {
+      const target = getTarget(event);
+      const targetElement = target;
+      if (contains(triggerRef.current, targetElement) || contains(internalBackdropRef.current, targetElement) || contains(backdropRef.current, targetElement)) {
+        event.preventDefault();
+      }
+    }
+    const doc = ownerDocument(triggerRef.current);
+    doc.addEventListener("contextmenu", handleDocumentContextMenu);
+    return () => {
+      doc.removeEventListener("contextmenu", handleDocumentContextMenu);
+    };
+  }, [backdropRef, internalBackdropRef]);
+  const state = React.useMemo(() => ({
+    open
+  }), [open]);
+  const element = useRenderElement("div", componentProps, {
+    state,
+    ref: [triggerRef, forwardedRef],
+    props: [{
+      onContextMenu: handleContextMenu,
+      onTouchStart: handleTouchStart,
+      onTouchMove: handleTouchMove,
+      onTouchEnd: handleTouchEnd,
+      onTouchCancel: handleTouchEnd,
+      style: {
+        WebkitTouchCallout: "none"
+      }
+    }, elementProps],
+    stateAttributesMapping: pressableTriggerOpenStateMapping
+  });
+  return element;
+});
+if (process.env.NODE_ENV !== "production") ContextMenuTrigger.displayName = "ContextMenuTrigger";
+export {
+  ContextMenuTrigger
+};
+//# sourceMappingURL=ContextMenuTrigger.js.map

package/dist/node_modules/@base-ui/react/esm/context-menu/trigger/ContextMenuTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenuTrigger.js","sources":["../../../../../../../node_modules/@base-ui/react/esm/context-menu/trigger/ContextMenuTrigger.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ownerDocument } from '@base-ui/utils/owner';\nimport { useTimeout } from '@base-ui/utils/useTimeout';\nimport { contains, getTarget, stopEvent } from \"../../floating-ui-react/utils.js\";\nimport { useContextMenuRootContext } from \"../root/ContextMenuRootContext.js\";\nimport { useMenuRootContext } from \"../../menu/root/MenuRootContext.js\";\nimport { useRenderElement } from \"../../utils/useRenderElement.js\";\nimport { createChangeEventDetails } from \"../../utils/createBaseUIEventDetails.js\";\nimport { pressableTriggerOpenStateMapping } from \"../../utils/popupStateMapping.js\";\nimport { REASONS } from \"../../utils/reasons.js\";\nimport { findRootOwnerId } from \"../../menu/utils/findRootOwnerId.js\";\nconst LONG_PRESS_DELAY = 500;\n\n/**\n * An area that opens the menu on right click or long press.\n * Renders a `<div>` element.\n *\n * Documentation: [Base UI Context Menu](https://base-ui.com/react/components/context-menu)\n */\nexport const ContextMenuTrigger = /*#__PURE__*/React.forwardRef(function ContextMenuTrigger(componentProps, forwardedRef) {\n  const {\n    render,\n    className,\n    ...elementProps\n  } = componentProps;\n  const {\n    setAnchor,\n    actionsRef,\n    internalBackdropRef,\n    backdropRef,\n    positionerRef,\n    allowMouseUpTriggerRef,\n    initialCursorPointRef,\n    rootId\n  } = useContextMenuRootContext(false);\n  const {\n    store\n  } = useMenuRootContext(false);\n  const open = store.useState('open');\n  const triggerRef = React.useRef(null);\n  const touchPositionRef = React.useRef(null);\n  const longPressTimeout = useTimeout();\n  const allowMouseUpTimeout = useTimeout();\n  const allowMouseUpRef = React.useRef(false);\n  function handleLongPress(x, y, event) {\n    const isTouchEvent = event.type.startsWith('touch');\n    initialCursorPointRef.current = {\n      x,\n      y\n    };\n    setAnchor({\n      getBoundingClientRect() {\n        return DOMRect.fromRect({\n          width: isTouchEvent ? 10 : 0,\n          height: isTouchEvent ? 10 : 0,\n          x,\n          y\n        });\n      }\n    });\n    allowMouseUpRef.current = false;\n    actionsRef.current?.setOpen(true, createChangeEventDetails(REASONS.triggerPress, event));\n    allowMouseUpTimeout.start(LONG_PRESS_DELAY, () => {\n      allowMouseUpRef.current = true;\n    });\n  }\n  function handleContextMenu(event) {\n    allowMouseUpTriggerRef.current = true;\n    stopEvent(event);\n    handleLongPress(event.clientX, event.clientY, event.nativeEvent);\n    const doc = ownerDocument(triggerRef.current);\n    doc.addEventListener('mouseup', mouseEvent => {\n      allowMouseUpTriggerRef.current = false;\n      if (!allowMouseUpRef.current) {\n        return;\n      }\n      allowMouseUpTimeout.clear();\n      allowMouseUpRef.current = false;\n      const mouseUpTarget = getTarget(mouseEvent);\n      if (contains(positionerRef.current, mouseUpTarget)) {\n        return;\n      }\n      if (rootId && mouseUpTarget && findRootOwnerId(mouseUpTarget) === rootId) {\n        return;\n      }\n      actionsRef.current?.setOpen(false, createChangeEventDetails(REASONS.cancelOpen, mouseEvent));\n    }, {\n      once: true\n    });\n  }\n  function handleTouchStart(event) {\n    allowMouseUpTriggerRef.current = false;\n    if (event.touches.length === 1) {\n      event.stopPropagation();\n      const touch = event.touches[0];\n      touchPositionRef.current = {\n        x: touch.clientX,\n        y: touch.clientY\n      };\n      longPressTimeout.start(LONG_PRESS_DELAY, () => {\n        if (touchPositionRef.current) {\n          handleLongPress(touchPositionRef.current.x, touchPositionRef.current.y, event.nativeEvent);\n        }\n      });\n    }\n  }\n  function handleTouchMove(event) {\n    if (longPressTimeout.isStarted() && touchPositionRef.current && event.touches.length === 1) {\n      const touch = event.touches[0];\n      const moveThreshold = 10;\n      const deltaX = Math.abs(touch.clientX - touchPositionRef.current.x);\n      const deltaY = Math.abs(touch.clientY - touchPositionRef.current.y);\n      if (deltaX > moveThreshold || deltaY > moveThreshold) {\n        longPressTimeout.clear();\n      }\n    }\n  }\n  function handleTouchEnd() {\n    longPressTimeout.clear();\n    touchPositionRef.current = null;\n  }\n  React.useEffect(() => {\n    function handleDocumentContextMenu(event) {\n      const target = getTarget(event);\n      const targetElement = target;\n      if (contains(triggerRef.current, targetElement) || contains(internalBackdropRef.current, targetElement) || contains(backdropRef.current, targetElement)) {\n        event.preventDefault();\n      }\n    }\n    const doc = ownerDocument(triggerRef.current);\n    doc.addEventListener('contextmenu', handleDocumentContextMenu);\n    return () => {\n      doc.removeEventListener('contextmenu', handleDocumentContextMenu);\n    };\n  }, [backdropRef, internalBackdropRef]);\n  const state = React.useMemo(() => ({\n    open\n  }), [open]);\n  const element = useRenderElement('div', componentProps, {\n    state,\n    ref: [triggerRef, forwardedRef],\n    props: [{\n      onContextMenu: handleContextMenu,\n      onTouchStart: handleTouchStart,\n      onTouchMove: handleTouchMove,\n      onTouchEnd: handleTouchEnd,\n      onTouchCancel: handleTouchEnd,\n      style: {\n        WebkitTouchCallout: 'none'\n      }\n    }, elementProps],\n    stateAttributesMapping: pressableTriggerOpenStateMapping\n  });\n  return element;\n});\nif (process.env.NODE_ENV !== \"production\") ContextMenuTrigger.displayName = \"ContextMenuTrigger\";"],"names":[],"mappings":";;;;;;;;;;;;;AAaA;AAQY;AACV;AAAM;AACJ;AACA;AACG;AAEL;AAAM;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEF;AAAM;AACJ;AAEF;AACA;AACA;AACA;AACA;AACA;AACA;AACE;AACA;AAAgC;AAC9B;AACA;AAEF;AAAU;AAEN;AAAwB;AACK;AACC;AAC5B;AACA;AACD;AACH;AAEF;AACA;AACA;AACE;AAA0B;AAC3B;AAEH;AACE;AACA;AACA;AACA;AACA;AACE;AACA;AACE;AAAA;AAEF;AACA;AACA;AACA;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AAA2F;AAC1F;AACK;AACP;AAEH;AACE;AACA;AACE;AACA;AACA;AAA2B;AAChB;AACA;AAEX;AACE;AACE;AAAyF;AAC3F;AACD;AACH;AAEF;AACE;AACE;AACA;AACA;AACA;AACA;AACE;AAAsB;AACxB;AACF;AAEF;AACE;AACA;AAA2B;AAE7B;AACE;AACE;AACA;AACA;AACE;AAAoB;AACtB;AAEF;AACA;AACA;AACE;AAAgE;AAClE;AAEF;AAAmC;AACjC;AAEF;AAAwD;AACtD;AAC8B;AACtB;AACS;AACD;AACD;AACD;AACG;AACR;AACe;AAC5B;AACmB;AACS;AAE1B;AACF;AACA;;;;","x_google_ignoreList":[0]}

package/dist/node_modules/@base-ui/react/esm/dialog/backdrop/DialogBackdrop.js

@@ -0,0 +1,48 @@
+"use client";
+import * as React from "react";
+import { useDialogRootContext } from "../root/DialogRootContext.js";
+import { useRenderElement } from "../../utils/useRenderElement.js";
+import { popupStateMapping } from "../../utils/popupStateMapping.js";
+import { transitionStatusMapping } from "../../utils/stateAttributesMapping.js";
+const stateAttributesMapping = {
+  ...popupStateMapping,
+  ...transitionStatusMapping
+};
+const DialogBackdrop = /* @__PURE__ */ React.forwardRef(function DialogBackdrop2(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    forceRender = false,
+    ...elementProps
+  } = componentProps;
+  const {
+    store
+  } = useDialogRootContext();
+  const open = store.useState("open");
+  const nested = store.useState("nested");
+  const mounted = store.useState("mounted");
+  const transitionStatus = store.useState("transitionStatus");
+  const state = React.useMemo(() => ({
+    open,
+    transitionStatus
+  }), [open, transitionStatus]);
+  return useRenderElement("div", componentProps, {
+    state,
+    ref: [store.context.backdropRef, forwardedRef],
+    stateAttributesMapping,
+    props: [{
+      role: "presentation",
+      hidden: !mounted,
+      style: {
+        userSelect: "none",
+        WebkitUserSelect: "none"
+      }
+    }, elementProps],
+    enabled: forceRender || !nested
+  });
+});
+if (process.env.NODE_ENV !== "production") DialogBackdrop.displayName = "DialogBackdrop";
+export {
+  DialogBackdrop
+};
+//# sourceMappingURL=DialogBackdrop.js.map