@kommo-crm/crm-react-ui-kit 1.1.1-beta.1 → 1.1.1-beta.3

package/dist/components/ContextMenu/components/Sub/Sub.js

@@ -1,59 +1,15 @@
-import { jsx as r } from "react/jsx-runtime";
-import { S as b } from "../../../../index-BA3njR2k.mjs";
-import "react";
-import { ContextMenuMode as l } from "../../ContextMenu.enums.js";
-import "../../providers/LevelProvider/LevelProvider.js";
-import "../../../../useContentPositioning-27D32n5u.mjs";
-import "../Content/Content.utils.js";
-import { useContextMenuSub as x } from "../../hooks/useContextMenuSub/useContextMenuSub.js";
-import { ContextMenuSubProvider as C, DISPLAY_NAME as t } from "./Sub.context.js";
-const O = ({
-  children: i,
-  mode: e = l.HOVER,
-  defaultOpen: o,
-  ...m
-}) => {
-  const {
-    open: n,
-    setOpen: p,
-    animatedOpen: a,
-    startAnimation: s,
-    handleMouseEnter: u,
-    handleMouseLeave: d,
-    handleOpenChange: M,
-    triggerId: h,
-    onOpenByKeyboard: S
-  } = x({
-    displayName: t,
-    mode: e,
-    defaultOpen: o
-  });
-  return /* @__PURE__ */ r(
-    C,
-    {
-      mode: e,
-      open: n,
-      setOpen: p,
-      animatedOpen: a,
-      defaultOpen: o,
-      startAnimation: s,
-      onMouseEnter: u,
-      onMouseLeave: d,
-      onOpenByKeyboard: S,
-      triggerId: h,
-      children: /* @__PURE__ */ r(
-        b,
-        {
-          open: n,
-          onOpenChange: M,
-          ...m,
-          children: i
-        }
-      )
-    }
-  );
-};
-O.displayName = t;
-export {
-  O as Sub
+import React from 'react';
+import { Sub as RadixDropdownMenuSub } from '@radix-ui/react-dropdown-menu';
+import { useContextMenuSub } from '../../hooks';
+import { ContextMenuMode } from '../../ContextMenu.enums';
+import { ContextMenuSubProvider, DISPLAY_NAME } from './Sub.context';
+export const Sub = ({ children, mode = ContextMenuMode.HOVER, defaultOpen, ...rest }) => {
+    const { open, setOpen, animatedOpen, startAnimation, handleMouseEnter, handleMouseLeave, handleOpenChange, triggerId, onOpenByKeyboard, } = useContextMenuSub({
+        displayName: DISPLAY_NAME,
+        mode,
+        defaultOpen,
+    });
+    return (React.createElement(ContextMenuSubProvider, { mode: mode, open: open, setOpen: setOpen, animatedOpen: animatedOpen, defaultOpen: defaultOpen, startAnimation: startAnimation, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onOpenByKeyboard: onOpenByKeyboard, triggerId: triggerId },
+        React.createElement(RadixDropdownMenuSub, { open: open, onOpenChange: handleOpenChange, ...rest }, children)));
 };
+Sub.displayName = DISPLAY_NAME;

package/dist/components/ContextMenu/components/Sub/Sub.props.js

@@ -1 +1 @@
-
+export {};

package/dist/components/ContextMenu/components/Sub/index.js

@@ -1,4 +1 @@
-import { Sub as b } from "./Sub.js";
-export {
-  b as Sub
-};
+export { Sub } from './Sub';

package/dist/components/ContextMenu/components/SubContent/SubContent.d.ts

@@ -1,3 +1,3 @@
-import { default as React } from 'react';
-export declare const SubContent: React.ForwardRefExoticComponent<Omit<import('@radix-ui/react-dropdown-menu').DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+import React from 'react';
+export declare const SubContent: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=SubContent.d.ts.map

package/dist/components/ContextMenu/components/SubContent/SubContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SubContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/ContextMenu/components/SubContent/SubContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgD,MAAM,OAAO,CAAC;AAiBrE,eAAO,MAAM,UAAU,+LAoFtB,CAAC"}
+{"version":3,"file":"SubContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/ContextMenu/components/SubContent/SubContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgD,MAAM,OAAO,CAAC;AAiBrE,eAAO,MAAM,UAAU,+LAoGtB,CAAC"}

package/dist/components/ContextMenu/components/SubContent/SubContent.js

@@ -1,72 +1,59 @@
-import { jsx as o } from "react/jsx-runtime";
-import { forwardRef as y, useState as s, useLayoutEffect as r } from "react";
-import { c as E } from "../../../../index-BA3njR2k.mjs";
-import { u as g, e as h, a as N } from "../../../../react-spring_web.modern-Dnq1lqN5.mjs";
-import { c as L } from "../../../../index-L8X2o7IH.mjs";
-import { LevelProvider as P } from "../../providers/LevelProvider/LevelProvider.js";
-import { useContextMenuSubContext as F } from "../Sub/Sub.context.js";
-import { useContextMenuContext as O } from "../../ContextMenu.context.js";
-import '../../../../assets/SubContent.css';const w = "_sub_content_y6v65_1", D = {
-  sub_content: w
-}, i = "ContextMenu.SubContent", R = y(
-  ({ className: u, children: c, sideOffset: m = 4, collisionPadding: f = 10, ...d }, p) => {
-    const [l, I] = s(null), {
-      animatedOpen: t,
-      startAnimation: b,
-      onMouseEnter: x,
-      onMouseLeave: _,
-      defaultOpen: a
-    } = F(i), { animationDuration: v } = O(i), [C, S] = s(!1), [A, e] = s(!1);
-    r(() => {
-      b();
-    }, []), r(() => {
-      let n;
-      return t ? (e(!1), n = requestAnimationFrame(() => {
-        e(!0);
-      })) : e(!1), () => {
-        n && cancelAnimationFrame(n);
-      };
-    }, [t]);
-    const M = g({
-      opacity: A && t || a !== void 0 ? 1 : 0,
-      config: a === void 0 ? { duration: v, easing: h.easeInOutCubic } : { duration: 0 }
+import React, { forwardRef, useLayoutEffect, useState } from 'react';
+import { SubContent as RadixDropdownMenuSubContent } from '@radix-ui/react-dropdown-menu';
+import { useSpring, animated, easings } from '@react-spring/web';
+import cx from 'classnames';
+import { LevelProvider } from '../../providers/LevelProvider';
+import { useContextMenuSubContext } from '../Sub/Sub.context';
+import { useContextMenuContext } from '../../ContextMenu.context';
+import s from './SubContent.module.css';
+const DISPLAY_NAME = 'ContextMenu.SubContent';
+export const SubContent = forwardRef(({ className, children, sideOffset = 4, collisionPadding = 10, onMouseEnter, onMouseLeave, ...rest }, ref) => {
+    const [activeItemId, setActiveItemId] = useState(null);
+    const { animatedOpen, startAnimation, onMouseEnter: onMouseEnterContext, onMouseLeave: onMouseLeaveContext, defaultOpen, } = useContextMenuSubContext(DISPLAY_NAME);
+    const { animationDuration } = useContextMenuContext(DISPLAY_NAME);
+    const [hasItemWithIcon, setHasItemWithIcon] = useState(false);
+    const [isPositioned, setIsPositioned] = useState(false);
+    useLayoutEffect(() => {
+        startAnimation();
+    }, []);
+    /**
+     * Handles the prerender of the submenu (needed for the icons).
+     */
+    useLayoutEffect(() => {
+        let raf;
+        if (animatedOpen) {
+            setIsPositioned(false);
+            raf = requestAnimationFrame(() => {
+                setIsPositioned(true);
+            });
+        }
+        else {
+            setIsPositioned(false);
+        }
+        return () => {
+            if (raf) {
+                cancelAnimationFrame(raf);
+            }
+        };
+    }, [animatedOpen]);
+    const springStyles = useSpring({
+        opacity: (isPositioned && animatedOpen) || defaultOpen !== undefined ? 1 : 0,
+        config: defaultOpen === undefined
+            ? { duration: animationDuration, easing: easings.easeInOutCubic }
+            : { duration: 0 },
     });
-    return /* @__PURE__ */ o(
-      P,
-      {
-        hasItemWithIcon: C,
-        setHasItemWithIcon: S,
-        activeItemId: l,
-        setActiveItemId: I,
-        children: /* @__PURE__ */ o(
-          N.div,
-          {
-            style: {
-              position: "fixed",
-              zIndex: Number.MAX_SAFE_INTEGER,
-              ...M
-            },
-            onMouseEnter: x,
-            onMouseLeave: _,
-            "data-content-wrapper": !0,
-            children: /* @__PURE__ */ o(
-              E,
-              {
-                ref: p,
-                className: L(D.sub_content, u),
-                sideOffset: m,
-                collisionPadding: f,
-                ...d,
-                children: c
-              }
-            )
-          }
-        )
-      }
-    );
-  }
-);
-R.displayName = i;
-export {
-  R as SubContent
-};
+    return (React.createElement(LevelProvider, { hasItemWithIcon: hasItemWithIcon, setHasItemWithIcon: setHasItemWithIcon, activeItemId: activeItemId, setActiveItemId: setActiveItemId },
+        React.createElement(animated.div, { style: {
+                position: 'fixed',
+                zIndex: Number.MAX_SAFE_INTEGER,
+                ...springStyles,
+            }, onMouseEnter: (e) => {
+                onMouseEnterContext?.(e);
+                onMouseEnter?.(e);
+            }, onMouseLeave: (e) => {
+                onMouseLeaveContext?.(e);
+                onMouseLeave?.(e);
+            }, "data-content-wrapper": true },
+            React.createElement(RadixDropdownMenuSubContent, { ref: ref, className: cx(s.sub_content, className), sideOffset: sideOffset, collisionPadding: collisionPadding, ...rest }, children))));
+});
+SubContent.displayName = DISPLAY_NAME;

package/dist/components/ContextMenu/components/SubContent/SubContent.props.js

@@ -1 +1 @@
-
+export {};

package/dist/components/ContextMenu/components/SubContent/index.js

@@ -1,4 +1 @@
-import { SubContent as e } from "./SubContent.js";
-export {
-  e as SubContent
-};
+export { SubContent } from './SubContent';

package/dist/components/ContextMenu/components/SubRoot/SubRoot.js

@@ -1,94 +1,37 @@
-import { jsx as p } from "react/jsx-runtime";
-import { forwardRef as E, useImperativeHandle as N } from "react";
-import { R as T } from "../../../../index-BA3njR2k.mjs";
-import { useContextMenuContext as w, ContextMenuProvider as L } from "../../ContextMenu.context.js";
-import { ContextMenuMode as P } from "../../ContextMenu.enums.js";
-import { useContextMenuSubMenu as j } from "../../hooks/useContextMenuSubMenu/useContextMenuSubMenu.js";
-import "../../../../useContentPositioning-27D32n5u.mjs";
-import "../Content/Content.utils.js";
-import "../../providers/LevelProvider/LevelProvider.js";
-import { useContextMenuItemContext as B } from "../Item/Item.context.js";
-import { Trigger as K } from "./components/Trigger/Trigger.js";
-import { Content as V } from "./components/Content/Content.js";
-const e = "ContextMenu.SubRoot", t = E(
-  ({
-    children: a,
-    mode: l = P.HOVER,
-    onOpen: M,
-    defaultOpen: d,
-    isCloseWithRootMenu: C = !1,
-    ...f
-  }, x) => {
-    const {
-      animationDuration: n,
-      hoverCloseDelay: r,
-      closeMenuImmediately: c
-    } = w(e), { subMenuOpen: o, setSubMenuOpen: m } = B(e), y = C ? c : void 0, {
-      mode: b,
-      open: R,
-      onOpenChange: g,
-      triggerRef: O,
-      contentRef: I,
-      inheritedArrowColor: v,
-      animatedOpen: S,
-      temporaryHoverClose: h,
-      closeMenuImmediately: i,
-      onMouseEnter: H,
-      onMouseLeave: A,
-      enableTemporaryHoverClose: u,
-      triggerId: D,
-      onOpenByKeyboard: s
-    } = j({
-      displayName: e,
-      mode: l,
-      defaultOpen: d,
-      onOpen: M,
-      animationDuration: n,
-      subMenuOpen: o,
-      setSubMenuOpen: m,
-      hoverCloseDelay: r,
-      closeRootMenuImmediately: y
+import React, { forwardRef, useImperativeHandle } from 'react';
+import { Root as RadixDropdownMenuRoot } from '@radix-ui/react-dropdown-menu';
+import { ContextMenuProvider, useContextMenuContext, } from '../../ContextMenu.context';
+import { ContextMenuMode } from '../../ContextMenu.enums';
+import { useContextMenuSubMenu } from '../../hooks';
+import { useContextMenuItemContext } from '../Item/Item.context';
+import { Trigger } from './components/Trigger/Trigger';
+import { Content } from './components/Content/Content';
+const DISPLAY_NAME = 'ContextMenu.SubRoot';
+export const SubRoot = forwardRef(({ children, mode = ContextMenuMode.HOVER, onOpen, defaultOpen, isCloseWithRootMenu = false, ...rest }, ref) => {
+    const { animationDuration, hoverCloseDelay, closeMenuImmediately: closeRootMenuImmediatelyContext, } = useContextMenuContext(DISPLAY_NAME);
+    const { subMenuOpen: subMenuOpenContext, setSubMenuOpen } = useContextMenuItemContext(DISPLAY_NAME);
+    const closeRootMenuImmediately = isCloseWithRootMenu
+        ? closeRootMenuImmediatelyContext
+        : undefined;
+    const { mode: rootMode, open: openContext, onOpenChange, triggerRef, contentRef, inheritedArrowColor, animatedOpen, temporaryHoverClose, closeMenuImmediately, onMouseEnter, onMouseLeave, enableTemporaryHoverClose, triggerId, onOpenByKeyboard, } = useContextMenuSubMenu({
+        displayName: DISPLAY_NAME,
+        mode: mode,
+        defaultOpen,
+        onOpen,
+        animationDuration,
+        subMenuOpen: subMenuOpenContext,
+        setSubMenuOpen,
+        hoverCloseDelay,
+        closeRootMenuImmediately,
     });
-    return N(x, () => ({
-      closeMenuImmediately: i,
-      enableTemporaryHoverClose: u,
-      onOpenByKeyboard: s
-    })), /* @__PURE__ */ p(
-      L,
-      {
-        mode: b,
-        triggerRef: O,
-        contentRef: I,
-        inheritedArrowColor: v,
-        animatedOpen: S,
-        animationDuration: n,
-        hoverCloseDelay: r,
-        temporaryHoverClose: h,
-        closeMenuImmediately: i,
-        onMouseEnter: H,
-        onMouseLeave: A,
-        enableTemporaryHoverClose: u,
-        subMenuOpen: o,
-        setSubMenuOpen: m,
-        triggerId: D,
-        onOpenByKeyboard: s,
-        children: /* @__PURE__ */ p(
-          T,
-          {
-            open: R || o,
-            onOpenChange: g,
-            modal: !1,
-            ...f,
-            children: a
-          }
-        )
-      }
-    );
-  }
-);
-t.displayName = e;
-t.Trigger = K;
-t.Content = V;
-export {
-  t as SubRoot
-};
+    useImperativeHandle(ref, () => ({
+        closeMenuImmediately,
+        enableTemporaryHoverClose,
+        onOpenByKeyboard,
+    }));
+    return (React.createElement(ContextMenuProvider, { mode: rootMode, triggerRef: triggerRef, contentRef: contentRef, inheritedArrowColor: inheritedArrowColor, animatedOpen: animatedOpen, animationDuration: animationDuration, hoverCloseDelay: hoverCloseDelay, temporaryHoverClose: temporaryHoverClose, closeMenuImmediately: closeMenuImmediately, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, enableTemporaryHoverClose: enableTemporaryHoverClose, subMenuOpen: subMenuOpenContext, setSubMenuOpen: setSubMenuOpen, triggerId: triggerId, onOpenByKeyboard: onOpenByKeyboard },
+        React.createElement(RadixDropdownMenuRoot, { open: openContext || subMenuOpenContext, onOpenChange: onOpenChange, modal: false, ...rest }, children)));
+});
+SubRoot.displayName = DISPLAY_NAME;
+SubRoot.Trigger = Trigger;
+SubRoot.Content = Content;

package/dist/components/ContextMenu/components/SubRoot/SubRoot.props.d.ts

@@ -1,4 +1,4 @@
-import { DropdownMenuProps as RadixDropdownMenuRootProps } from '@radix-ui/react-dropdown-menu';
+import { type DropdownMenuProps as RadixDropdownMenuRootProps } from '@radix-ui/react-dropdown-menu';
 import { ContextMenuModeType } from '../../ContextMenu.types';
 export type ContextMenuSubRootProps = Omit<RadixDropdownMenuRootProps, 'onOpenChange' | 'modal'> & {
     /**

package/dist/components/ContextMenu/components/SubRoot/SubRoot.props.js

@@ -1 +1 @@
-
+export {};

package/dist/components/ContextMenu/components/SubRoot/SubRoot.types.d.ts

@@ -1,4 +1,4 @@
-import { ForwardRefExoticComponent, RefAttributes } from 'react';
+import type { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { ContentProps } from '../Content/Content.props';
 import { TriggerProps } from '../Trigger/Trigger.props';
 import { ContextMenuHandle } from '../../ContextMenu.types';

package/dist/components/ContextMenu/components/SubRoot/SubRoot.types.js

@@ -1 +1 @@
-
+export {};

package/dist/components/ContextMenu/components/SubRoot/components/Content/Content.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
+import React from 'react';
 export declare const Content: React.ForwardRefExoticComponent<{
     onChange?: React.FormEventHandler<HTMLDivElement> | undefined;
     key?: React.Key | null | undefined;
@@ -295,7 +295,7 @@ export declare const Content: React.ForwardRefExoticComponent<{
     }>) => void) | undefined;
     forceMount?: true | undefined;
 } & {
-    direction?: import('../../../Content').DirectionType;
+    direction?: import("../../../Content").DirectionType;
     collisionBoundary?: Element;
     disableAutoPositioning?: boolean;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/components/ContextMenu/components/SubRoot/components/Content/Content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Content.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/ContextMenu/components/SubRoot/components/Content/Content.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AA4BpD,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAmGnB,CAAC"}
+{"version":3,"file":"Content.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/ContextMenu/components/SubRoot/components/Content/Content.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AA4BpD,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAkHnB,CAAC"}

package/dist/components/ContextMenu/components/SubRoot/components/Content/Content.js

@@ -1,96 +1,64 @@
-import { jsx as e } from "react/jsx-runtime";
-import { forwardRef as P, useState as c } from "react";
-import { C as _ } from "../../../../../../index-BA3njR2k.mjs";
-import { c as H } from "../../../../../../index-L8X2o7IH.mjs";
-import { u as T, e as W, a as b } from "../../../../../../react-spring_web.modern-Dnq1lqN5.mjs";
-import { mergeRefs as G } from "../../../../../../lib/utils.js";
-import { LevelProvider as j } from "../../../../providers/LevelProvider/LevelProvider.js";
-import { useContextMenuContext as k } from "../../../../ContextMenu.context.js";
-import { ContextMenuMode as p } from "../../../../ContextMenu.enums.js";
-import { focusParentItem as z } from "../../../../utils/focusParentItem/focusParentItem.js";
-import { u as F, s as X } from "../../../../../../useContentPositioning-27D32n5u.mjs";
-import { Direction as Y } from "../../../Content/Content.enums.js";
-import { directionToSide as q } from "../../../Content/Content.utils.js";
-const u = "ContextMenu.Content", J = P(
-  ({
-    style: d,
-    className: I,
-    children: t,
-    alignOffset: l,
-    arrowPadding: C = 5,
-    collisionBoundary: o,
-    direction: n = Y.DOWN_RIGHT,
-    disableAutoPositioning: r = !1,
-    ...g
-  }, x) => {
-    const [y, M] = c(!1), [v, D] = c(null), {
-      triggerRef: i,
-      contentRef: s,
-      animatedOpen: E,
-      animationDuration: L,
-      mode: m,
-      temporaryHoverClose: a,
-      onMouseEnter: N,
-      onMouseLeave: R,
-      closeMenuImmediately: S
-    } = k(u), { align: h, labelOffset: w, isPositioned: f } = F({
-      direction: n,
-      alignOffset: l,
-      disableAutoPositioning: r,
-      triggerRef: i,
-      contentRef: s,
-      collisionBoundary: o,
-      children: t
-    }), A = T({
-      opacity: f && (m === p.CLICK && !a || E) ? 1 : 0,
-      config: m === p.CLICK && !a ? { duration: 0 } : { duration: L, easing: W.easeInOutCubic }
-    }), O = (K) => {
-      K.key === "ArrowLeft" && (S(), z(i.current));
+import React, { forwardRef, useState } from 'react';
+import { Content as RadixDropdownMenuContent } from '@radix-ui/react-dropdown-menu';
+import cx from 'classnames';
+import { useSpring, animated, easings } from '@react-spring/web';
+import { mergeRefs } from 'src/lib/utils';
+import { LevelProvider } from '../../../../providers/LevelProvider';
+import { useContextMenuContext } from '../../../../ContextMenu.context';
+import { ContextMenuMode } from '../../../../ContextMenu.enums';
+import { useContentPositioning } from '../../../../hooks';
+import { focusParentItem } from '../../../../utils';
+import { Direction } from '../../../Content';
+import { directionToSide } from '../../../Content';
+import s from '../../../Content/Content.module.css';
+const DISPLAY_NAME = 'ContextMenu.Content';
+export const Content = forwardRef(({ style, className, children, alignOffset, arrowPadding = 5, collisionBoundary, direction = Direction.DOWN_RIGHT, disableAutoPositioning = false, onMouseEnter, onMouseLeave, onKeyDown, ...rest }, ref) => {
+    const [hasItemWithIcon, setHasItemWithIcon] = useState(false);
+    const [activeItemId, setActiveItemId] = useState(null);
+    const { triggerRef, contentRef, animatedOpen, animationDuration, mode, temporaryHoverClose, onMouseEnter: onMouseEnterContext, onMouseLeave: onMouseLeaveContext, closeMenuImmediately, } = useContextMenuContext(DISPLAY_NAME);
+    const { align, labelOffset, isPositioned } = useContentPositioning({
+        direction,
+        alignOffset,
+        disableAutoPositioning,
+        triggerRef,
+        contentRef,
+        collisionBoundary,
+        children,
+    });
+    const springStyles = useSpring({
+        opacity: isPositioned &&
+            ((mode === ContextMenuMode.CLICK && !temporaryHoverClose) ||
+                animatedOpen)
+            ? 1
+            : 0,
+        config: mode === ContextMenuMode.CLICK && !temporaryHoverClose
+            ? { duration: 0 }
+            : { duration: animationDuration, easing: easings.easeInOutCubic },
+    });
+    const handleKeyDown = (e) => {
+        if (e.key === 'ArrowLeft') {
+            closeMenuImmediately();
+            focusParentItem(triggerRef.current);
+        }
+        onKeyDown?.(e);
     };
-    return /* @__PURE__ */ e(
-      j,
-      {
-        hasItemWithIcon: y,
-        setHasItemWithIcon: M,
-        activeItemId: v,
-        setActiveItemId: D,
-        children: /* @__PURE__ */ e(
-          b.div,
-          {
-            style: {
-              zIndex: Number.MAX_SAFE_INTEGER,
-              position: "fixed",
-              ...A
-            },
-            "data-content-wrapper": !0,
-            children: /* @__PURE__ */ e(
-              _,
-              {
-                ref: G(s, x),
-                className: H(X.content, I),
-                style: {
-                  ...d || {},
-                  pointerEvents: r || f ? "auto" : "none"
-                },
-                collisionBoundary: o,
-                side: q[n],
-                align: h,
-                arrowPadding: C,
-                alignOffset: w,
-                onMouseEnter: N,
-                onMouseLeave: R,
-                onKeyDown: O,
-                ...g,
-                children: t
-              }
-            )
-          }
-        )
-      }
-    );
-  }
-);
-J.displayName = u;
-export {
-  J as Content
-};
+    return (React.createElement(LevelProvider, { hasItemWithIcon: hasItemWithIcon, setHasItemWithIcon: setHasItemWithIcon, activeItemId: activeItemId, setActiveItemId: setActiveItemId },
+        React.createElement(animated.div, { style: {
+                zIndex: Number.MAX_SAFE_INTEGER,
+                position: 'fixed',
+                ...springStyles,
+            }, "data-content-wrapper": true },
+            React.createElement(RadixDropdownMenuContent, { ref: mergeRefs(contentRef, ref), className: cx(s.content, className), style: {
+                    ...(style || {}),
+                    pointerEvents: disableAutoPositioning || isPositioned ? 'auto' : 'none',
+                }, collisionBoundary: collisionBoundary, side: directionToSide[direction], align: align, arrowPadding: arrowPadding, alignOffset: labelOffset, onMouseEnter: (e) => {
+                    onMouseEnterContext?.(e);
+                    onMouseEnter?.(e);
+                }, onMouseLeave: (e) => {
+                    onMouseLeaveContext?.(e);
+                    onMouseLeave?.(e);
+                }, onKeyDown: (e) => {
+                    handleKeyDown(e);
+                }, ...rest }, children))));
+});
+Content.displayName = DISPLAY_NAME;

package/dist/components/ContextMenu/components/SubRoot/components/Content/index.js

@@ -1,4 +1 @@
-import { Content as e } from "./Content.js";
-export {
-  e as Content
-};
+export { Content } from './Content';

package/dist/components/ContextMenu/components/SubRoot/components/Trigger/Trigger.d.ts

@@ -1,3 +1,3 @@
-import { default as React } from 'react';
-export declare const Trigger: React.ForwardRefExoticComponent<Omit<import('@radix-ui/react-dropdown-menu').DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+import React from 'react';
+export declare const Trigger: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=Trigger.d.ts.map

package/dist/components/ContextMenu/components/SubRoot/components/Trigger/Trigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Trigger.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/ContextMenu/components/SubRoot/components/Trigger/Trigger.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAgB1C,eAAO,MAAM,OAAO,kMA6CnB,CAAC"}
+{"version":3,"file":"Trigger.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/ContextMenu/components/SubRoot/components/Trigger/Trigger.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAe1C,eAAO,MAAM,OAAO,kMA+EnB,CAAC"}