myshell-react-lib 0.2.44 → 0.2.45

package/dist/index.cjs

@@ -4305,6 +4305,9 @@ __export(index_exports, {
     DropdownMenuGroup: function() {
         return DropdownMenuGroup;
     },
+    DropdownMenuHover: function() {
+        return DropdownMenuHover;
+    },
     DropdownMenuItem: function() {
         return DropdownMenuItem;
     },
@@ -11293,7 +11296,107 @@ var import_lucide_react5 = require("lucide-react");
 var React21 = __toESM(require("react"), 1);
 var import_jsx_runtime27 = require("react/jsx-runtime");
 var DropdownMenu = DropdownMenuPrimitive.Root;
-var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+var DropdownMenuHoverContext = React21.createContext(null);
+var DropdownMenuHover = function(_param) {
+    var children = _param.children, _param_openDelay = _param.openDelay, openDelay = _param_openDelay === void 0 ? 200 : _param_openDelay, _param_closeDelay = _param.closeDelay, closeDelay = _param_closeDelay === void 0 ? 300 : _param_closeDelay, _param_modal = _param.modal, modal = _param_modal === void 0 ? false : _param_modal, props = _object_without_properties(_param, [
+        "children",
+        "openDelay",
+        "closeDelay",
+        "modal"
+    ]);
+    var _React21_useState = _sliced_to_array(React21.useState(false), 2), open = _React21_useState[0], setOpen = _React21_useState[1];
+    var openTimeoutRef = React21.useRef();
+    var closeTimeoutRef = React21.useRef();
+    var openStateRef = React21.useRef(false);
+    React21.useEffect(function() {
+        openStateRef.current = open;
+    }, [
+        open
+    ]);
+    var clearAllTimeouts = React21.useCallback(function() {
+        if (openTimeoutRef.current) {
+            clearTimeout(openTimeoutRef.current);
+            openTimeoutRef.current = void 0;
+        }
+        if (closeTimeoutRef.current) {
+            clearTimeout(closeTimeoutRef.current);
+            closeTimeoutRef.current = void 0;
+        }
+    }, []);
+    var handleMouseEnter = React21.useCallback(function() {
+        if (closeTimeoutRef.current) {
+            clearTimeout(closeTimeoutRef.current);
+            closeTimeoutRef.current = void 0;
+        }
+        if (openTimeoutRef.current || openStateRef.current) {
+            return;
+        }
+        openTimeoutRef.current = setTimeout(function() {
+            setOpen(true);
+            openTimeoutRef.current = void 0;
+        }, openDelay);
+    }, [
+        openDelay
+    ]);
+    var handleMouseLeave = React21.useCallback(function() {
+        if (openTimeoutRef.current) {
+            clearTimeout(openTimeoutRef.current);
+            openTimeoutRef.current = void 0;
+        }
+        if (closeTimeoutRef.current || !openStateRef.current) {
+            return;
+        }
+        closeTimeoutRef.current = setTimeout(function() {
+            setOpen(false);
+            closeTimeoutRef.current = void 0;
+        }, closeDelay);
+    }, [
+        closeDelay
+    ]);
+    React21.useEffect(function() {
+        return function() {
+            clearAllTimeouts();
+        };
+    }, [
+        clearAllTimeouts
+    ]);
+    var contextValue = React21.useMemo(function() {
+        return {
+            handleMouseEnter: handleMouseEnter,
+            handleMouseLeave: handleMouseLeave
+        };
+    }, [
+        handleMouseEnter,
+        handleMouseLeave
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DropdownMenuHoverContext.Provider, {
+        value: contextValue,
+        children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DropdownMenuPrimitive.Root, _object_spread_props(_object_spread({
+            open: open,
+            modal: modal,
+            onOpenChange: function(newOpen) {
+                if (!newOpen) {
+                    setOpen(false);
+                    clearAllTimeouts();
+                } else {
+                    setOpen(true);
+                }
+            }
+        }, props), {
+            children: children
+        }))
+    });
+};
+var DropdownMenuTriggerPrimitive = DropdownMenuPrimitive.Trigger;
+var DropdownMenuTrigger = React21.forwardRef(function(props, ref) {
+    var hoverContext = React21.useContext(DropdownMenuHoverContext);
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DropdownMenuTriggerPrimitive, _object_spread({
+        ref: ref,
+        onMouseEnter: hoverContext === null || hoverContext === void 0 ? void 0 : hoverContext.handleMouseEnter,
+        onMouseLeave: hoverContext === null || hoverContext === void 0 ? void 0 : hoverContext.handleMouseLeave
+    }, props));
+});
+DropdownMenuTrigger.displayName = DropdownMenuPrimitive.Trigger.displayName;
 var DropdownMenuGroup = DropdownMenuPrimitive.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
@@ -11318,24 +11421,77 @@ var DropdownMenuSubTrigger = React21.forwardRef(function(_param, ref) {
 });
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
 var DropdownMenuSubContent = React21.forwardRef(function(_param, ref) {
-    var className = _param.className, props = _object_without_properties(_param, [
-        "className"
+    var className = _param.className, _param_sideOffset = _param.sideOffset, sideOffset = _param_sideOffset === void 0 ? 4 : _param_sideOffset, onMouseEnter = _param.onMouseEnter, onMouseLeave = _param.onMouseLeave, props = _object_without_properties(_param, [
+        "className",
+        "sideOffset",
+        "onMouseEnter",
+        "onMouseLeave"
+    ]);
+    var hoverContext = React21.useContext(DropdownMenuHoverContext);
+    var handleMouseEnter = React21.useCallback(function(event) {
+        onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(event);
+        if (hoverContext) {
+            hoverContext.handleMouseEnter();
+        }
+    }, [
+        hoverContext,
+        onMouseEnter
+    ]);
+    var handleMouseLeave = React21.useCallback(function(event) {
+        onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(event);
+        if (hoverContext) {
+            hoverContext.handleMouseLeave();
+        }
+    }, [
+        hoverContext,
+        onMouseLeave
     ]);
     return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DropdownMenuPrimitive.SubContent, _object_spread({
         ref: ref,
-        className: cn("z-50 min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Default bg-Colors-Background-Utilities-Modal p-2 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className)
+        sideOffset: sideOffset,
+        className: cn("z-50 min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Default bg-Colors-Background-Utilities-Modal p-2 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className),
+        onMouseEnter: hoverContext ? handleMouseEnter : onMouseEnter,
+        onMouseLeave: hoverContext ? handleMouseLeave : onMouseLeave
     }, props));
 });
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
 var DropdownMenuContent = React21.forwardRef(function(_param, ref) {
-    var className = _param.className, _param_sideOffset = _param.sideOffset, sideOffset = _param_sideOffset === void 0 ? 4 : _param_sideOffset, props = _object_without_properties(_param, [
+    var className = _param.className, _param_sideOffset = _param.sideOffset, sideOffset = _param_sideOffset === void 0 ? 4 : _param_sideOffset, onMouseEnter = _param.onMouseEnter, onMouseLeave = _param.onMouseLeave, props = _object_without_properties(_param, [
         "className",
-        "sideOffset"
+        "sideOffset",
+        "onMouseEnter",
+        "onMouseLeave"
+    ]);
+    var hoverContext = React21.useContext(DropdownMenuHoverContext);
+    var handleMouseEnter = React21.useCallback(function(event) {
+        onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(event);
+        if (hoverContext) {
+            hoverContext.handleMouseEnter();
+        }
+    }, [
+        hoverContext,
+        onMouseEnter
+    ]);
+    var handleMouseLeave = React21.useCallback(function(event) {
+        onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(event);
+        var relatedTarget = event.relatedTarget;
+        var currentTarget = event.currentTarget;
+        if (relatedTarget && currentTarget.contains(relatedTarget)) {
+            return;
+        }
+        if (hoverContext) {
+            hoverContext.handleMouseLeave();
+        }
+    }, [
+        hoverContext,
+        onMouseLeave
     ]);
     return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DropdownMenuPrimitive.Content, _object_spread({
         ref: ref,
         sideOffset: sideOffset,
-        className: cn("z-[100] min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal p-1 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className)
+        className: cn("z-[100] min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal p-1 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className),
+        onMouseEnter: hoverContext ? handleMouseEnter : onMouseEnter,
+        onMouseLeave: hoverContext ? handleMouseLeave : onMouseLeave
     }, props));
 });
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
@@ -26568,6 +26724,7 @@ var Message = /*#__PURE__*/ function() {
     DropdownMenuCheckboxItem: DropdownMenuCheckboxItem,
     DropdownMenuContent: DropdownMenuContent,
     DropdownMenuGroup: DropdownMenuGroup,
+    DropdownMenuHover: DropdownMenuHover,
     DropdownMenuItem: DropdownMenuItem,
     DropdownMenuLabel: DropdownMenuLabel,
     DropdownMenuPortal: DropdownMenuPortal,