@lobehub/ui/es/Modal/ModalStackItem.mjs

Lobe UI is an open-source UI component library for building AIGC web apps

'use client';

import { useEventCallback } from "../hooks/useEventCallback.mjs";
import Modal_default from "./Modal.mjs";
import { ModalProvider } from "./ModalProvider.mjs";
import { memo, useCallback, useMemo } from "react";
import { jsx } from "react/jsx-runtime";

//#region src/Modal/ModalStackItem.tsx
const noop = () => {};
const ModalStackItem = memo(({ id, props, onClose, onUpdate, onDestroy }) => {
	const { afterClose, afterOpenChange, children, onCancel, open, ...rest } = props;
	const stableAfterClose = useEventCallback(afterClose ?? noop);
	const stableAfterOpenChange = useEventCallback(afterOpenChange ?? noop);
	const stableOnCancel = useEventCallback(onCancel ?? noop);
	const close = useEventCallback(() => onClose(id));
	const setCanDismissByClickOutside = useEventCallback((value) => onUpdate(id, { maskClosable: value }));
	const stableContextValue = useMemo(() => ({
		close,
		setCanDismissByClickOutside
	}), [close, setCanDismissByClickOutside]);
	return /* @__PURE__ */ jsx(Modal_default, {
		...rest,
		afterClose: useCallback(() => {
			stableAfterClose?.();
			onDestroy(id);
		}, [
			stableAfterClose,
			onDestroy,
			id
		]),
		afterOpenChange: useCallback((nextOpen) => {
			stableAfterOpenChange?.(nextOpen);
			if (!nextOpen) onDestroy(id);
		}, [
			stableAfterOpenChange,
			onDestroy,
			id
		]),
		onCancel: useCallback((event) => {
			stableOnCancel?.(event);
			close();
		}, [stableOnCancel, close]),
		open: open ?? true,
		children: /* @__PURE__ */ jsx(ModalProvider, {
			value: stableContextValue,
			children
		})
	});
});
ModalStackItem.displayName = "ModalStackItem";

//#endregion
export { ModalStackItem };
//# sourceMappingURL=ModalStackItem.mjs.map