@optiaxiom/react 1.9.36 → 1.9.38

package/dist/esm/packages/react/src/menu/MenuRadioItem.js

@@ -1,40 +1,28 @@
 "use client";
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import '../command/Command.js';
-import '../command/CommandInput.js';
-import { CommandItem } from '../command/CommandItem.js';
-import '../command/CommandListbox.js';
-import { useCommandContext, resolveItemProperty } from '../command/CommandContext.js';
-import '../listbox/Listbox.js';
-import '../listbox/ListboxCheckboxItem.js';
-import '../listbox/ListboxEmpty.js';
-import '../listbox/ListboxGroup.js';
-import '../listbox/ListboxItem.js';
-import '../listbox/ListboxItemIndicator.js';
-import '../listbox/ListboxItemized.js';
-import '../listbox/ListboxLabel.js';
-import { ListboxRadioItem } from '../listbox/ListboxRadioItem.js';
-import '../listbox/ListboxSeparator.js';
-import '../listbox/ListboxSwitchItem.js';
-
-const MenuRadioItem = forwardRef(
-  ({ children, ...props }, ref) => {
-    const Comp = props.item.href ? "a" : "div";
-    const { inputValue } = useCommandContext("@optiaxiom/react/MenuRadioItem");
-    return /* @__PURE__ */ jsx(CommandItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsx(
-      ListboxRadioItem,
-      {
-        addonBefore: resolveItemProperty(props.item.addon, { inputValue }),
-        asChild: true,
-        description: resolveItemProperty(props.item.description, {
-          inputValue
-        }),
-        children: /* @__PURE__ */ jsx(Comp, { ...props.item.href && { href: props.item.href }, children })
-      }
-    ) });
-  }
-);
+import { resolveItemProperty, useCommandContext } from "../command/CommandContext.js";
+import { ListboxRadioItem } from "../listbox/ListboxRadioItem.js";
+import { CommandItem } from "../command/CommandItem.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/menu/MenuRadioItem.tsx
+const MenuRadioItem = forwardRef(({ children, ...props }, ref) => {
+	const Comp = props.item.href ? "a" : "div";
+	const { inputValue } = useCommandContext("@optiaxiom/react/MenuRadioItem");
+	return /* @__PURE__ */ jsx(CommandItem, {
+		asChild: true,
+		ref,
+		...props,
+		children: /* @__PURE__ */ jsx(ListboxRadioItem, {
+			addonBefore: resolveItemProperty(props.item.addon, { inputValue }),
+			asChild: true,
+			description: resolveItemProperty(props.item.description, { inputValue }),
+			children: /* @__PURE__ */ jsx(Comp, {
+				...props.item.href && { href: props.item.href },
+				children
+			})
+		})
+	});
+});
 MenuRadioItem.displayName = "@optiaxiom/react/MenuRadioItem";
-
+//#endregion
 export { MenuRadioItem };

package/dist/esm/packages/react/src/menu/MenuSubContent.js

@@ -1,168 +1,119 @@
 "use client";
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { useComposedRefs } from '@radix-ui/react-compose-refs';
-import { useId } from '@radix-ui/react-id';
-import clsx from 'clsx';
-import { forwardRef, useState, useMemo, useRef, useEffect } from 'react';
-import { Command } from '../command/Command.js';
-import '../command/CommandInput.js';
-import '../command/CommandItem.js';
-import '../command/CommandListbox.js';
-import { useCommandContext, resolveItemProperty } from '../command/CommandContext.js';
-import '../popover/Popover.js';
-import { PopoverAnchor } from '../popover/PopoverAnchor.js';
-import { PopoverContent } from '../popover/PopoverContent.js';
-import '../popover/PopoverTrigger.js';
-import '../popover/PopoverContentContext.js';
-import { usePopoverContext } from '../popover/PopoverContext.js';
-import { VisuallyHidden } from '../visually-hidden/VisuallyHidden.js';
-import { useMenuContext } from './MenuContext.js';
-import { MenuListbox } from './MenuListbox.js';
-import { useMenuSubContext, MenuSubProvider } from './MenuSubContext.js';
-import { MenuSubInput } from './MenuSubInput.js';
-
-const MenuSubContent = forwardRef(
-  ({ align = "start", side = "right", ...props }, outerRef) => {
-    const {
-      onSelect,
-      setFocusVisible,
-      setOpen: setRootMenuOpen
-    } = useMenuContext("@optiaxiom/react/MenuSubContent");
-    const {
-      highlightedItem: item,
-      inputValue: parentInputValue,
-      setInputValue: setParentInputValue
-    } = useCommandContext("@optiaxiom/react/MenuSubContent");
-    const {
-      contentRef: parentContentRef,
-      inputRef: parentInputRef,
-      itemRef: parentItemRef
-    } = useMenuSubContext("@optiaxiom/react/MenuSubContent");
-    const { open, presence } = usePopoverContext(
-      "@optiaxiom/react/MenuSubContent"
-    );
-    const labelId = useId();
-    const ref = useComposedRefs(parentContentRef, outerRef);
-    const [inputValue, setInputValue] = useState("");
-    const options = useMemo(
-      () => resolveItemProperty(item?.subOptions, { inputValue }) ?? [],
-      [inputValue, item]
-    );
-    const contentRef = useRef(null);
-    const inputRef = useRef(null);
-    const itemRef = useRef(null);
-    const [subMenuOpen, setSubMenuOpen] = useState(false);
-    useEffect(() => {
-      if (!open) {
-        setSubMenuOpen(false);
-      }
-    }, [open]);
-    useEffect(() => {
-      return () => {
-        setInputValue("");
-        setSubMenuOpen(false);
-      };
-    }, [item]);
-    if (!item || !(open || presence)) {
-      return null;
-    }
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(PopoverAnchor, { virtualRef: parentItemRef }),
-      /* @__PURE__ */ jsxs(
-        PopoverContent,
-        {
-          align,
-          alignOffset: item.subOptionsInputVisible ? -46 : -4,
-          "aria-labelledby": clsx(parentItemRef.current?.id, labelId),
-          maxH: "lg",
-          onCloseAutoFocus: (event) => {
-            event.preventDefault();
-            parentInputRef.current?.focus();
-          },
-          onEscapeKeyDown: () => setRootMenuOpen(false),
-          onPointerDown: (event) => {
-            if (event.defaultPrevented) {
-              return;
-            }
-            if (event.target instanceof Element && (event.target.closest('[role="option"]') || inputRef.current?.contains(event.target))) {
-              event.stopPropagation();
-              return;
-            }
-            event.preventDefault();
-            inputRef.current?.focus();
-          },
-          onPointerEnter: () => {
-            if (item.subOptionsInputVisible) {
-              inputRef.current?.focus();
-            }
-          },
-          onPointerLeave: (event) => {
-            if (item.subOptionsInputVisible) {
-              parentInputRef.current?.focus();
-              event.stopPropagation();
-            }
-          },
-          p: "4",
-          ref,
-          side,
-          sideOffset: 0,
-          ...props,
-          children: [
-            /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx("h2", { id: labelId, children: "Submenu" }) }),
-            /* @__PURE__ */ jsxs(
-              Command,
-              {
-                enabled: true,
-                inputValue,
-                onHover: (item2, pointer) => {
-                  if (!pointer) {
-                    setFocusVisible(true);
-                  }
-                  setSubMenuOpen(
-                    pointer && (typeof item2.subOptions === "function" || !!item2.subOptions?.length)
-                  );
-                },
-                onInputValueChange: (inputValue2) => {
-                  if (item.subOptionsInputVisible) {
-                    setInputValue(inputValue2);
-                    return;
-                  }
-                  parentInputRef.current?.focus();
-                  setParentInputValue(inputValue2);
-                },
-                onSelect: (item2, { dismiss }) => {
-                  if (typeof item2.subOptions === "function" || item2.subOptions?.length) {
-                    setSubMenuOpen(true);
-                  } else {
-                    onSelect(item2, { dismiss });
-                  }
-                },
-                options,
-                children: [
-                  /* @__PURE__ */ jsx(VisuallyHidden, { disabled: item.subOptionsInputVisible, children: /* @__PURE__ */ jsx(MenuSubInput, { placeholder: "Filter...", ref: inputRef }) }),
-                  /* @__PURE__ */ jsx(
-                    MenuSubProvider,
-                    {
-                      contentRef,
-                      inputRef,
-                      itemRef,
-                      open: subMenuOpen,
-                      setOpen: setSubMenuOpen,
-                      children: /* @__PURE__ */ jsx(MenuListbox, { onScroll: () => setSubMenuOpen(false) })
-                    }
-                  )
-                ]
-              },
-              item.key ?? resolveItemProperty(item.label, {
-                inputValue: parentInputValue
-              })
-            )
-          ]
-        }
-      )
-    ] });
-  }
-);
+import { VisuallyHidden } from "../visually-hidden/VisuallyHidden.js";
+import { resolveItemProperty, useCommandContext } from "../command/CommandContext.js";
+import { Command } from "../command/Command.js";
+import { usePopoverContext } from "../popover/PopoverContext.js";
+import { PopoverAnchor } from "../popover/PopoverAnchor.js";
+import { PopoverContent } from "../popover/PopoverContent.js";
+import { useMenuContext } from "./MenuContext.js";
+import { MenuSubProvider, useMenuSubContext } from "./MenuSubContext.js";
+import { MenuSubInput } from "./MenuSubInput.js";
+import { MenuListbox } from "./MenuListbox.js";
+import { useId } from "@radix-ui/react-id";
+import { forwardRef, useEffect, useMemo, useRef, useState } from "react";
+import clsx from "clsx";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { useComposedRefs } from "@radix-ui/react-compose-refs";
+//#region src/menu/MenuSubContent.tsx
+const MenuSubContent = forwardRef(({ align = "start", side = "right", ...props }, outerRef) => {
+	const { onSelect, setFocusVisible, setOpen: setRootMenuOpen } = useMenuContext("@optiaxiom/react/MenuSubContent");
+	const { highlightedItem: item, inputValue: parentInputValue, setInputValue: setParentInputValue } = useCommandContext("@optiaxiom/react/MenuSubContent");
+	const { contentRef: parentContentRef, inputRef: parentInputRef, itemRef: parentItemRef } = useMenuSubContext("@optiaxiom/react/MenuSubContent");
+	const { open, presence } = usePopoverContext("@optiaxiom/react/MenuSubContent");
+	const labelId = useId();
+	const ref = useComposedRefs(parentContentRef, outerRef);
+	const [inputValue, setInputValue] = useState("");
+	const options = useMemo(() => resolveItemProperty(item?.subOptions, { inputValue }) ?? [], [inputValue, item]);
+	const contentRef = useRef(null);
+	const inputRef = useRef(null);
+	const itemRef = useRef(null);
+	const [subMenuOpen, setSubMenuOpen] = useState(false);
+	useEffect(() => {
+		if (!open) setSubMenuOpen(false);
+	}, [open]);
+	useEffect(() => {
+		return () => {
+			setInputValue("");
+			setSubMenuOpen(false);
+		};
+	}, [item]);
+	if (!item || !(open || presence)) return null;
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(PopoverAnchor, { virtualRef: parentItemRef }), /* @__PURE__ */ jsxs(PopoverContent, {
+		align,
+		alignOffset: item.subOptionsInputVisible ? -46 : -4,
+		"aria-labelledby": clsx(parentItemRef.current?.id, labelId),
+		maxH: "lg",
+		onCloseAutoFocus: (event) => {
+			event.preventDefault();
+			parentInputRef.current?.focus();
+		},
+		onEscapeKeyDown: () => setRootMenuOpen(false),
+		onPointerDown: (event) => {
+			if (event.defaultPrevented) return;
+			if (event.target instanceof Element && (event.target.closest("[role=\"option\"]") || inputRef.current?.contains(event.target))) {
+				event.stopPropagation();
+				return;
+			}
+			event.preventDefault();
+			inputRef.current?.focus();
+		},
+		onPointerEnter: () => {
+			if (item.subOptionsInputVisible) inputRef.current?.focus();
+		},
+		onPointerLeave: (event) => {
+			if (item.subOptionsInputVisible) {
+				parentInputRef.current?.focus();
+				event.stopPropagation();
+			}
+		},
+		p: "4",
+		ref,
+		side,
+		sideOffset: 0,
+		...props,
+		children: [/* @__PURE__ */ jsx(VisuallyHidden, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx("h2", {
+				id: labelId,
+				children: "Submenu"
+			})
+		}), /* @__PURE__ */ jsxs(Command, {
+			enabled: true,
+			inputValue,
+			onHover: (item, pointer) => {
+				if (!pointer) setFocusVisible(true);
+				setSubMenuOpen(pointer && (typeof item.subOptions === "function" || !!item.subOptions?.length));
+			},
+			onInputValueChange: (inputValue) => {
+				if (item.subOptionsInputVisible) {
+					setInputValue(inputValue);
+					return;
+				}
+				parentInputRef.current?.focus();
+				setParentInputValue(inputValue);
+			},
+			onSelect: (item, { dismiss }) => {
+				if (typeof item.subOptions === "function" || item.subOptions?.length) setSubMenuOpen(true);
+				else onSelect(item, { dismiss });
+			},
+			options,
+			children: [/* @__PURE__ */ jsx(VisuallyHidden, {
+				disabled: item.subOptionsInputVisible,
+				children: /* @__PURE__ */ jsx(MenuSubInput, {
+					placeholder: "Filter...",
+					ref: inputRef
+				})
+			}), /* @__PURE__ */ jsx(MenuSubProvider, {
+				contentRef,
+				inputRef,
+				itemRef,
+				open: subMenuOpen,
+				setOpen: setSubMenuOpen,
+				children: /* @__PURE__ */ jsx(MenuListbox, { onScroll: () => setSubMenuOpen(false) })
+			})]
+		}, item.key ?? resolveItemProperty(item.label, { inputValue: parentInputValue }))]
+	})] });
+});
 MenuSubContent.displayName = "@optiaxiom/react/MenuSubContent";
-
+//#endregion
 export { MenuSubContent };

package/dist/esm/packages/react/src/menu/MenuSubContext.js

@@ -1,6 +1,7 @@
 "use client";
-import { createContext } from '@radix-ui/react-context';
-
+"use client";
+import { createContext } from "@radix-ui/react-context";
+//#region src/menu/MenuSubContext.ts
 const [MenuSubProvider, useMenuSubContext] = createContext("@optiaxiom/react/MenuSub");
-
+//#endregion
 export { MenuSubProvider, useMenuSubContext };

package/dist/esm/packages/react/src/menu/MenuSubInput.js

@@ -1,48 +1,32 @@
 "use client";
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import '../command/Command.js';
-import { CommandInput } from '../command/CommandInput.js';
-import '../command/CommandItem.js';
-import '../command/CommandListbox.js';
-import { useCommandContext } from '../command/CommandContext.js';
-import { useMenuSubContext } from './MenuSubContext.js';
-
-const MenuSubInput = forwardRef(
-  ({ onKeyDown, ...props }, ref) => {
-    const { downshift, highlightedItem } = useCommandContext(
-      "@optiaxiom/react/MenuSubInput"
-    );
-    const { setOpen } = useMenuSubContext("@optiaxiom/react/MenuSubInput");
-    return /* @__PURE__ */ jsx(
-      CommandInput,
-      {
-        m: "4",
-        onKeyDown: (event) => {
-          onKeyDown?.(event);
-          if (event.defaultPrevented) {
-            return;
-          }
-          if (!(event.target instanceof HTMLInputElement)) {
-            return;
-          }
-          if (event.target.value) {
-            return;
-          }
-          if (event.key === "ArrowLeft") {
-            event.preventDefault();
-            setOpen(false);
-          } else if (event.key === "ArrowRight" && (typeof highlightedItem?.subOptions === "function" || highlightedItem?.subOptions?.length)) {
-            event.preventDefault();
-            downshift.selectItem(highlightedItem);
-          }
-        },
-        ref,
-        ...props
-      }
-    );
-  }
-);
+import { useCommandContext } from "../command/CommandContext.js";
+import { CommandInput } from "../command/CommandInput.js";
+import { useMenuSubContext } from "./MenuSubContext.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/menu/MenuSubInput.tsx
+const MenuSubInput = forwardRef(({ onKeyDown, ...props }, ref) => {
+	const { downshift, highlightedItem } = useCommandContext("@optiaxiom/react/MenuSubInput");
+	const { setOpen } = useMenuSubContext("@optiaxiom/react/MenuSubInput");
+	return /* @__PURE__ */ jsx(CommandInput, {
+		m: "4",
+		onKeyDown: (event) => {
+			onKeyDown?.(event);
+			if (event.defaultPrevented) return;
+			if (!(event.target instanceof HTMLInputElement)) return;
+			if (event.target.value) return;
+			if (event.key === "ArrowLeft") {
+				event.preventDefault();
+				setOpen(false);
+			} else if (event.key === "ArrowRight" && (typeof highlightedItem?.subOptions === "function" || highlightedItem?.subOptions?.length)) {
+				event.preventDefault();
+				downshift.selectItem(highlightedItem);
+			}
+		},
+		ref,
+		...props
+	});
+});
 MenuSubInput.displayName = "@optiaxiom/react/MenuSubInput";
-
+//#endregion
 export { MenuSubInput };

package/dist/esm/packages/react/src/menu/MenuSubTrigger.js

@@ -1,104 +1,85 @@
 "use client";
-import { jsx } from 'react/jsx-runtime';
-import { useComposedRefs } from '@radix-ui/react-compose-refs';
-import { forwardRef, useRef, useEffect } from 'react';
-import { useCommandContext } from '../command/CommandContext.js';
-import { IconAngleRight } from '../icons/IconAngleRight.js';
-import '../popover/PopoverContentContext.js';
-import { usePopoverContext } from '../popover/PopoverContext.js';
-import { MenuItem } from './MenuItem.js';
-import { useMenuSubContext } from './MenuSubContext.js';
-
-const MenuSubTrigger = forwardRef(
-  ({
-    children,
-    item,
-    onPointerDown,
-    onPointerEnter,
-    onPointerLeave,
-    onPointerMove,
-    ...props
-  }, outerRef) => {
-    const { downshift, enabled, highlightedItem, pauseInteractionRef } = useCommandContext("@optiaxiom/react/MenuSubTrigger");
-    const { open } = usePopoverContext("@optiaxiom/react/MenuSubTrigger");
-    const { contentRef, itemRef } = useMenuSubContext(
-      "@optiaxiom/react/MenuSubTrigger"
-    );
-    const pointerEnterRef = useRef(false);
-    const innerRef = useRef();
-    const ref = useComposedRefs(innerRef, outerRef);
-    useEffect(() => {
-      if (open && highlightedItem === item && innerRef.current) {
-        itemRef.current = innerRef.current;
-      }
-    }, [highlightedItem, item, open, itemRef]);
-    return /* @__PURE__ */ jsx(
-      MenuItem,
-      {
-        addonAfter: /* @__PURE__ */ jsx(IconAngleRight, {}),
-        item,
-        onPointerDown: (event) => {
-          onPointerDown?.(event);
-          if (open) {
-            event.preventDefault();
-          }
-        },
-        onPointerEnter: (event) => {
-          onPointerEnter?.(event);
-          if (event.defaultPrevented) {
-            return;
-          }
-          if (highlightedItem === item) {
-            pointerEnterRef.current = true;
-          }
-        },
-        onPointerLeave: (event) => {
-          onPointerLeave?.(event);
-          pointerEnterRef.current = false;
-          const box = contentRef.current?.getBoundingClientRect();
-          if (!box) {
-            return;
-          }
-          if (pauseInteractionRef.current.isInsideTriangle) {
-            return;
-          }
-          const bottom = {
-            x: box.left,
-            y: box.top + box.height
-          };
-          const side = {
-            x: event.clientX + 10 * (box.left > event.clientX ? -1 : 1),
-            y: event.clientY
-          };
-          const top = {
-            x: box.left,
-            y: box.top
-          };
-          pauseInteractionRef.current.isInsideTriangle = (target) => {
-            const b0 = (top.x - side.x) * (bottom.y - side.y) - (bottom.x - side.x) * (top.y - side.y), b1 = ((top.x - target.x) * (bottom.y - target.y) - (bottom.x - target.x) * (top.y - target.y)) / b0, b2 = ((bottom.x - target.x) * (side.y - target.y) - (side.x - target.x) * (bottom.y - target.y)) / b0, b3 = ((side.x - target.x) * (top.y - target.y) - (top.x - target.x) * (side.y - target.y)) / b0;
-            return b1 > 0 && b2 > 0 && b3 > 0;
-          };
-          pauseInteractionRef.current.timer = window.setTimeout(() => {
-            pauseInteractionRef.current.isInsideTriangle = null;
-          }, 20);
-        },
-        onPointerMove: (event) => {
-          onPointerMove?.(event);
-          if (event.defaultPrevented) {
-            return;
-          }
-          if (pointerEnterRef.current && enabled) {
-            downshift.selectItem(item);
-          }
-          pointerEnterRef.current = false;
-        },
-        ref,
-        ...props,
-        children
-      }
-    );
-  }
-);
+import { useCommandContext } from "../command/CommandContext.js";
+import { usePopoverContext } from "../popover/PopoverContext.js";
+import { IconAngleRight } from "../icons/IconAngleRight.js";
+import { useMenuSubContext } from "./MenuSubContext.js";
+import { MenuItem } from "./MenuItem.js";
+import { forwardRef, useEffect, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useComposedRefs } from "@radix-ui/react-compose-refs";
+//#region src/menu/MenuSubTrigger.tsx
+const MenuSubTrigger = forwardRef(({ children, item, onPointerDown, onPointerEnter, onPointerLeave, onPointerMove, ...props }, outerRef) => {
+	const { downshift, enabled, highlightedItem, pauseInteractionRef } = useCommandContext("@optiaxiom/react/MenuSubTrigger");
+	const { open } = usePopoverContext("@optiaxiom/react/MenuSubTrigger");
+	const { contentRef, itemRef } = useMenuSubContext("@optiaxiom/react/MenuSubTrigger");
+	/**
+	* We use a ref and combine pointerenter + pointermove because pointerenter
+	* is triggered both when mouse moves into the element and also when element
+	* is inserted into DOM and mouse happens to be present at that coordinate.
+	*
+	* So we only open the submenu when user moves the enters and then moves
+	* the mouse for the first time.
+	*/
+	const pointerEnterRef = useRef(false);
+	const innerRef = useRef();
+	const ref = useComposedRefs(innerRef, outerRef);
+	useEffect(() => {
+		if (open && highlightedItem === item && innerRef.current) itemRef.current = innerRef.current;
+	}, [
+		highlightedItem,
+		item,
+		open,
+		itemRef
+	]);
+	return /* @__PURE__ */ jsx(MenuItem, {
+		addonAfter: /* @__PURE__ */ jsx(IconAngleRight, {}),
+		item,
+		onPointerDown: (event) => {
+			onPointerDown?.(event);
+			if (open) event.preventDefault();
+		},
+		onPointerEnter: (event) => {
+			onPointerEnter?.(event);
+			if (event.defaultPrevented) return;
+			if (highlightedItem === item) pointerEnterRef.current = true;
+		},
+		onPointerLeave: (event) => {
+			onPointerLeave?.(event);
+			pointerEnterRef.current = false;
+			const box = contentRef.current?.getBoundingClientRect();
+			if (!box) return;
+			if (pauseInteractionRef.current.isInsideTriangle) return;
+			const bottom = {
+				x: box.left,
+				y: box.top + box.height
+			};
+			const side = {
+				x: event.clientX + 10 * (box.left > event.clientX ? -1 : 1),
+				y: event.clientY
+			};
+			const top = {
+				x: box.left,
+				y: box.top
+			};
+			pauseInteractionRef.current.isInsideTriangle = (target) => {
+				const b0 = (top.x - side.x) * (bottom.y - side.y) - (bottom.x - side.x) * (top.y - side.y), b1 = ((top.x - target.x) * (bottom.y - target.y) - (bottom.x - target.x) * (top.y - target.y)) / b0, b2 = ((bottom.x - target.x) * (side.y - target.y) - (side.x - target.x) * (bottom.y - target.y)) / b0, b3 = ((side.x - target.x) * (top.y - target.y) - (top.x - target.x) * (side.y - target.y)) / b0;
+				return b1 > 0 && b2 > 0 && b3 > 0;
+			};
+			pauseInteractionRef.current.timer = window.setTimeout(() => {
+				pauseInteractionRef.current.isInsideTriangle = null;
+			}, 20);
+		},
+		onPointerMove: (event) => {
+			onPointerMove?.(event);
+			if (event.defaultPrevented) return;
+			if (pointerEnterRef.current && enabled) downshift.selectItem(item);
+			pointerEnterRef.current = false;
+		},
+		ref,
+		...props,
+		children
+	});
+});
 MenuSubTrigger.displayName = "@optiaxiom/react/MenuSubTrigger";
-
+//#endregion
 export { MenuSubTrigger };