@redis-ui/components 49.1.1 → 50.0.1

package/dist/node_modules/rsuite/esm/internals/Overlay/Overlay.js

@@ -0,0 +1,80 @@
+"use client";
+import { __toESM } from "../../../../../_virtual/_rolldown/runtime.js";
+import { _extends } from "../../../../@babel/runtime/helpers/esm/extends.js";
+import { mergeStyles } from "../utils/style-sheet/css.js";
+import { require_classnames } from "../../../../classnames/index.js";
+import mergeRefs from "../utils/react/mergeRefs.js";
+import useRootClose from "../hooks/useRootClose.js";
+import Fade from "../../Animation/Fade.js";
+import Position, { getPositionStyle } from "./Position.js";
+import { useOverlay } from "./OverlayProvider.js";
+import React, { useCallback, useRef, useState } from "react";
+//#region ../../node_modules/rsuite/esm/internals/Overlay/Overlay.js
+var import_classnames = /* @__PURE__ */ __toESM(require_classnames());
+/**
+* Overlay is a powerful component that helps you create floating components.
+* @private
+*/
+var Overlay = /*#__PURE__*/ React.forwardRef((props, ref) => {
+	const { overlayContainer } = useOverlay();
+	const { container = overlayContainer, containerPadding, placement, rootClose, children, childrenProps, transition: Transition = Fade, open, preventOverflow, triggerTarget, onClose, onExited, onExit, onExiting, onEnter, onEntering, onEntered, followCursor, cursorPosition } = props;
+	const [exited, setExited] = useState(!open);
+	const overlayTarget = useRef(null);
+	if (open) {
+		if (exited) setExited(false);
+	} else if (!Transition && !exited) setExited(true);
+	const mountOverlay = open || Transition && !exited;
+	const handleExited = useCallback((args) => {
+		setExited(true);
+		onExited?.(args);
+	}, [onExited]);
+	useRootClose(onClose, {
+		triggerTarget,
+		overlayTarget,
+		disabled: !rootClose || !mountOverlay
+	});
+	if (!mountOverlay) return null;
+	const positionProps = {
+		container,
+		containerPadding,
+		triggerTarget,
+		placement,
+		preventOverflow,
+		followCursor,
+		cursorPosition
+	};
+	const renderChildWithPosition = (transitionProps, transitionRef) => {
+		const { className } = transitionProps || {};
+		return /*#__PURE__*/ React.createElement(Position, _extends({}, positionProps, transitionProps, { ref: mergeRefs(ref, transitionRef) }), (positionChildProps, childRef) => {
+			const { left, top } = positionChildProps;
+			if (typeof children === "function") return children({
+				className,
+				...positionChildProps,
+				...childrenProps
+			}, mergeRefs(childRef, overlayTarget));
+			const childElement = children;
+			const childStyles = mergeStyles(getPositionStyle(left, top), childElement.props.style);
+			return /*#__PURE__*/ React.cloneElement(childElement, {
+				...childrenProps,
+				...childElement.props,
+				className: (0, import_classnames.default)(childElement.props.className, className),
+				style: childStyles,
+				ref: mergeRefs(childRef, overlayTarget)
+			});
+		});
+	};
+	if (Transition) return /*#__PURE__*/ React.createElement(Transition, {
+		in: open,
+		transitionAppear: true,
+		onExit,
+		onExiting,
+		onExited: handleExited,
+		onEnter,
+		onEntering,
+		onEntered
+	}, renderChildWithPosition);
+	return renderChildWithPosition();
+});
+Overlay.displayName = "Overlay";
+//#endregion
+export { Overlay as default };

package/dist/node_modules/rsuite/esm/internals/Overlay/OverlayProvider.cjs

@@ -0,0 +1,15 @@
+"use client";
+const require_runtime = require("../../../../../_virtual/_rolldown/runtime.cjs");
+let react = require("react");
+react = require_runtime.__toESM(react);
+//#region ../../node_modules/rsuite/esm/internals/Overlay/OverlayProvider.js
+var OverlayContext = /*#__PURE__*/ react.default.createContext({});
+var OverlayProvider = (props) => {
+	const { overlayContainer, children } = props;
+	return /*#__PURE__*/ react.default.createElement(OverlayContext.Provider, { value: { overlayContainer } }, children);
+};
+var useOverlay = () => (0, react.useContext)(OverlayContext);
+OverlayProvider.displayName = "OverlayProvider";
+//#endregion
+exports.OverlayProvider = OverlayProvider;
+exports.useOverlay = useOverlay;

package/dist/node_modules/rsuite/esm/internals/Overlay/OverlayProvider.js

@@ -0,0 +1,12 @@
+"use client";
+import React, { useContext } from "react";
+//#region ../../node_modules/rsuite/esm/internals/Overlay/OverlayProvider.js
+var OverlayContext = /*#__PURE__*/ React.createContext({});
+var OverlayProvider = (props) => {
+	const { overlayContainer, children } = props;
+	return /*#__PURE__*/ React.createElement(OverlayContext.Provider, { value: { overlayContainer } }, children);
+};
+var useOverlay = () => useContext(OverlayContext);
+OverlayProvider.displayName = "OverlayProvider";
+//#endregion
+export { OverlayProvider, useOverlay };

package/dist/node_modules/rsuite/esm/internals/Overlay/OverlayTrigger.cjs

@@ -0,0 +1,306 @@
+"use client";
+const require_runtime = require("../../../../../_virtual/_rolldown/runtime.cjs");
+const require_extends = require("../../../../@babel/runtime/helpers/esm/extends.cjs");
+const require_ReactIs = require("../utils/react/ReactIs.cjs");
+const require_get$1 = require("../../../../lodash/get.cjs");
+const require_createChainedFunction = require("../utils/createChainedFunction.cjs");
+const require_isOneOf = require("../utils/isOneOf.cjs");
+const require_useControlled = require("../hooks/useControlled.cjs");
+const require_usePortal = require("../hooks/usePortal.cjs");
+const require_contains = require("../../../../dom-lib/esm/contains.cjs");
+const require_isNil$1 = require("../../../../lodash/isNil.cjs");
+const require_isUndefined$1 = require("../../../../lodash/isUndefined.cjs");
+const require_OverlayProvider = require("./OverlayProvider.cjs");
+const require_Overlay = require("./Overlay.cjs");
+let react = require("react");
+react = require_runtime.__toESM(react);
+//#region ../../node_modules/rsuite/esm/internals/Overlay/OverlayTrigger.js
+var import_get = /* @__PURE__ */ require_runtime.__toESM(require_get$1.default);
+var import_isNil = /* @__PURE__ */ require_runtime.__toESM(require_isNil$1.default);
+var import_isUndefined = /* @__PURE__ */ require_runtime.__toESM(require_isUndefined$1.default);
+function mergeEvents(events = {}, props = {}) {
+	const nextEvents = {};
+	Object.keys(events).forEach((eventName) => {
+		if (events[eventName]) nextEvents[eventName] = require_createChainedFunction.default(events[eventName], props?.[eventName]);
+	});
+	return nextEvents;
+}
+/**
+* The reason that triggers closing of an overlay
+* - Clicking outside of the overlay
+* - Direct invocation of triggerRef.current.close()
+*/
+var OverlayCloseCause = /*#__PURE__*/ function(OverlayCloseCause) {
+	OverlayCloseCause[OverlayCloseCause["ClickOutside"] = 0] = "ClickOutside";
+	OverlayCloseCause[OverlayCloseCause["ImperativeHandle"] = 1] = "ImperativeHandle";
+	return OverlayCloseCause;
+}({});
+/**
+* Useful for mouseover and mouseout.
+* In order to resolve the node entering the mouseover element, a mouseout event and a mouseover event will be triggered.
+* https://javascript.info/mousemove-mouseover-mouseout-mouseenter-mouseleave
+* @param handler
+* @param event
+*/
+function onMouseEventHandler(handler, event, relatedNative) {
+	const target = event.currentTarget;
+	const related = event.relatedTarget || (0, import_get.default)(event, ["nativeEvent", relatedNative]);
+	if ((!related || related !== target) && !require_contains.default(target, related)) handler(event);
+}
+var defaultTrigger = ["hover", "focus"];
+/**
+* OverlayTrigger is used to display floating elements on another component.
+* @private
+*/
+var OverlayTrigger = /*#__PURE__*/ react.default.forwardRef((props, ref) => {
+	const { overlayContainer } = require_OverlayProvider.useOverlay();
+	const { children, container = overlayContainer, controlId, defaultOpen, trigger = defaultTrigger, disabled, followCursor, readOnly, plaintext, open: openProp, delay, delayOpen: delayOpenProp, delayClose: delayCloseProp, enterable, placement = "bottomStart", speaker, rootClose = true, overlayAs: OverlayComponent, onClick, onMouseOver, onMouseMove, onMouseOut, onContextMenu, onFocus, onBlur, onOpen, onClose, onExited, ...rest } = props;
+	const { Portal, target: containerElement } = require_usePortal.default({ container });
+	const triggerRef = (0, react.useRef)(null);
+	const overlayRef = (0, react.useRef)(null);
+	const [open, setOpen] = require_useControlled.default(openProp, defaultOpen);
+	const [cursorPosition, setCursorPosition] = (0, react.useState)(null);
+	const delayOpenTimer = (0, react.useRef)(null);
+	const delayCloseTimer = (0, react.useRef)(null);
+	const delayOpen = (0, import_isNil.default)(delayOpenProp) ? delay : delayOpenProp;
+	const delayClose = (0, import_isNil.default)(delayCloseProp) ? delay : delayCloseProp;
+	const isOnOverlay = (0, react.useRef)(false);
+	const isOnTrigger = (0, react.useRef)(false);
+	(0, react.useEffect)(() => {
+		return () => {
+			if (!(0, import_isNil.default)(delayOpenTimer.current)) clearTimeout(delayOpenTimer.current);
+			if (!(0, import_isNil.default)(delayCloseTimer.current)) clearTimeout(delayCloseTimer.current);
+		};
+	}, []);
+	const mouseEnter = (0, react.useRef)(false);
+	const handleOpenChange = (0, react.useCallback)((nextOpen, closeCause) => {
+		if (nextOpen === open) return;
+		if (nextOpen) onOpen?.();
+		else onClose?.(closeCause);
+		setOpen(nextOpen);
+	}, [
+		open,
+		onOpen,
+		onClose,
+		setOpen
+	]);
+	const handleOpen = (0, react.useCallback)((delay) => {
+		const ms = (0, import_isUndefined.default)(delay) ? delayOpen : delay;
+		if (ms && typeof ms === "number") return delayOpenTimer.current = setTimeout(() => {
+			delayOpenTimer.current = null;
+			if (mouseEnter.current) handleOpenChange(true);
+		}, ms);
+		handleOpenChange(true);
+	}, [delayOpen, handleOpenChange]);
+	const handleClose = (0, react.useCallback)((delay, closeCause) => {
+		const ms = (0, import_isUndefined.default)(delay) ? delayClose : delay;
+		if (ms && typeof ms === "number") return delayCloseTimer.current = setTimeout(() => {
+			delayCloseTimer.current = null;
+			handleOpenChange(false, closeCause);
+		}, ms);
+		handleOpenChange(false, closeCause);
+	}, [delayClose, handleOpenChange]);
+	const handleExited = (0, react.useCallback)(() => {
+		setCursorPosition(null);
+	}, []);
+	(0, react.useImperativeHandle)(ref, () => ({
+		get root() {
+			return triggerRef.current;
+		},
+		get overlay() {
+			return overlayRef.current?.child;
+		},
+		getState: () => ({ open }),
+		open: handleOpen,
+		close: (delay) => handleClose(delay, OverlayCloseCause.ImperativeHandle),
+		updatePosition: () => {
+			overlayRef.current?.updatePosition?.();
+		}
+	}));
+	/**
+	* Close after the cursor leaves.
+	*/
+	const handleCloseWhenLeave = (0, react.useCallback)(() => {
+		if (!isOnOverlay.current && !isOnTrigger.current) handleClose(void 0, OverlayCloseCause.ClickOutside);
+	}, [handleClose]);
+	const handleDelayedOpen = (0, react.useCallback)(() => {
+		mouseEnter.current = true;
+		if (!enterable) return handleOpen();
+		isOnTrigger.current = true;
+		if (!(0, import_isNil.default)(delayCloseTimer.current)) {
+			clearTimeout(delayCloseTimer.current);
+			delayCloseTimer.current = null;
+			return handleOpen();
+		}
+		if (open) return;
+		handleOpen();
+	}, [
+		enterable,
+		open,
+		handleOpen
+	]);
+	/**
+	* Toggle open and closed state.
+	*/
+	const handleOpenState = (0, react.useCallback)(() => {
+		if (open) handleCloseWhenLeave();
+		else handleDelayedOpen();
+	}, [
+		open,
+		handleCloseWhenLeave,
+		handleDelayedOpen
+	]);
+	const handleDelayedClose = (0, react.useCallback)(() => {
+		mouseEnter.current = false;
+		if (!enterable) return handleClose();
+		isOnTrigger.current = false;
+		if (!(0, import_isNil.default)(delayOpenTimer.current)) {
+			clearTimeout(delayOpenTimer.current);
+			delayOpenTimer.current = null;
+			return;
+		}
+		if (!open || !(0, import_isNil.default)(delayCloseTimer.current)) return;
+		delayCloseTimer.current = setTimeout(() => {
+			if (!(0, import_isNil.default)(delayCloseTimer.current)) {
+				clearTimeout(delayCloseTimer.current);
+				delayCloseTimer.current = null;
+			}
+			handleCloseWhenLeave();
+		}, 200);
+	}, [
+		enterable,
+		open,
+		handleClose,
+		handleCloseWhenLeave
+	]);
+	const handleSpeakerMouseEnter = (0, react.useCallback)(() => {
+		isOnOverlay.current = true;
+	}, []);
+	const handleSpeakerMouseLeave = (0, react.useCallback)(() => {
+		isOnOverlay.current = false;
+		if (!require_isOneOf.default("click", trigger) && !require_isOneOf.default("contextMenu", trigger) && !require_isOneOf.default("active", trigger)) handleCloseWhenLeave();
+	}, [handleCloseWhenLeave, trigger]);
+	const handledMoveOverlay = (0, react.useCallback)((event) => {
+		setCursorPosition(() => ({
+			top: event.pageY,
+			left: event.pageX,
+			clientTop: event.clientX,
+			clientLeft: event.clientY
+		}));
+	}, []);
+	const handleMouseOver = (0, react.useCallback)((event) => {
+		onMouseEventHandler(handleDelayedOpen, event, "fromElement");
+	}, [handleDelayedOpen]);
+	const handleMouseOut = (0, react.useCallback)((event) => {
+		onMouseEventHandler(handleDelayedClose, event, "toElement");
+	}, [handleDelayedClose]);
+	const preventDefault = (0, react.useCallback)((event) => {
+		event.preventDefault();
+	}, []);
+	const triggerEvents = (0, react.useMemo)(() => {
+		const events = {
+			onClick,
+			onContextMenu,
+			onMouseOver,
+			onMouseOut,
+			onFocus,
+			onBlur,
+			onMouseMove
+		};
+		if (disabled || readOnly || plaintext || trigger === "none") return events;
+		if (followCursor) events.onMouseMove = require_createChainedFunction.default(handledMoveOverlay, onMouseMove);
+		if (require_isOneOf.default("click", trigger)) {
+			events.onClick = require_createChainedFunction.default(handleOpenState, events.onClick);
+			return events;
+		}
+		if (require_isOneOf.default("active", trigger)) {
+			events.onClick = require_createChainedFunction.default(handleDelayedOpen, events.onClick);
+			return events;
+		}
+		if (require_isOneOf.default("hover", trigger)) {
+			events.onMouseOver = require_createChainedFunction.default(handleMouseOver, events.onMouseOver);
+			events.onMouseOut = require_createChainedFunction.default(handleMouseOut, events.onMouseOut);
+		}
+		if (require_isOneOf.default("focus", trigger)) {
+			events.onFocus = require_createChainedFunction.default(handleDelayedOpen, events.onFocus);
+			events.onBlur = require_createChainedFunction.default(handleDelayedClose, events.onBlur);
+		}
+		if (require_isOneOf.default("contextMenu", trigger)) events.onContextMenu = require_createChainedFunction.default(preventDefault, handleOpenState, events.onContextMenu);
+		return events;
+	}, [
+		disabled,
+		followCursor,
+		handleDelayedClose,
+		handleDelayedOpen,
+		handleMouseOut,
+		handleMouseOver,
+		handleOpenState,
+		handledMoveOverlay,
+		onBlur,
+		onClick,
+		onContextMenu,
+		onFocus,
+		onMouseMove,
+		onMouseOut,
+		onMouseOver,
+		plaintext,
+		preventDefault,
+		readOnly,
+		trigger
+	]);
+	const renderOverlay = () => {
+		const overlayProps = {
+			...rest,
+			rootClose,
+			triggerTarget: triggerRef,
+			onClose: trigger !== "none" ? () => handleClose(void 0, OverlayCloseCause.ClickOutside) : void 0,
+			onExited: require_createChainedFunction.default(followCursor ? handleExited : void 0, onExited),
+			placement,
+			container: containerElement,
+			open
+		};
+		const speakerProps = { id: controlId };
+		if (trigger !== "none" && enterable) {
+			speakerProps.onMouseEnter = handleSpeakerMouseEnter;
+			speakerProps.onMouseLeave = handleSpeakerMouseLeave;
+		}
+		return /*#__PURE__*/ react.default.createElement(require_Overlay.default, require_extends._extends({}, overlayProps, {
+			ref: overlayRef,
+			childrenProps: speakerProps,
+			followCursor,
+			cursorPosition
+		}), typeof speaker === "function" ? (props, ref) => {
+			return speaker({
+				...props,
+				onClose: handleClose
+			}, ref);
+		} : speaker);
+	};
+	const triggerElement = (0, react.useMemo)(() => {
+		if (typeof children === "function") return children(triggerEvents, triggerRef);
+		else if (require_ReactIs.isFragment(children) || !/*#__PURE__*/ (0, react.isValidElement)(children)) return /*#__PURE__*/ react.default.createElement("span", require_extends._extends({
+			ref: triggerRef,
+			"aria-describedby": controlId
+		}, triggerEvents), children);
+		const childElement = children;
+		return /*#__PURE__*/ (0, react.cloneElement)(childElement, {
+			ref: triggerRef,
+			"aria-describedby": controlId,
+			...mergeEvents(triggerEvents, childElement.props)
+		});
+	}, [
+		children,
+		controlId,
+		triggerEvents
+	]);
+	return /*#__PURE__*/ react.default.createElement(react.default.Fragment, null, triggerElement, OverlayComponent ? /*#__PURE__*/ react.default.createElement(OverlayComponent, {
+		open,
+		onClose: handleClose,
+		placement: "bottom",
+		speaker
+	}) : /*#__PURE__*/ react.default.createElement(Portal, null, renderOverlay()));
+});
+OverlayTrigger.displayName = "OverlayTrigger";
+//#endregion
+exports.OverlayCloseCause = OverlayCloseCause;
+exports.default = OverlayTrigger;