@yamada-ui/react/dist/cjs/components/modal/use-modal.cjs

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
const require_utils_index = require('../../utils/index.cjs');
const require_i18n_provider = require('../../providers/i18n-provider/i18n-provider.cjs');
const require_use_disclosure = require('../../hooks/use-disclosure/use-disclosure.cjs');
let react = require("react");
react = require_rolldown_runtime.__toESM(react);

//#region src/components/modal/use-modal.ts
const useModal = ({ closeOnEsc = true, closeOnOverlay = true, defaultOpen, open: openProp, onClose: onCloseProp, onEsc, onOpen: onOpenProp,...rest } = {}) => {
	const { open, onClose, onOpen } = require_use_disclosure.useDisclosure({
		defaultOpen,
		open: openProp,
		onClose: onCloseProp,
		onOpen: onOpenProp,
		...rest
	});
	const contentId = (0, react.useId)();
	const titleId = (0, react.useId)();
	const bodyId = (0, react.useId)();
	const { t } = require_i18n_provider.useI18n("modal");
	const onKeyDown = (0, react.useCallback)((ev) => {
		if (ev.key !== "Escape") return;
		ev.stopPropagation();
		if (closeOnEsc) onClose();
		onEsc?.();
	}, [
		closeOnEsc,
		onClose,
		onEsc
	]);
	const getRootProps = (0, react.useCallback)((props) => ({
		...rest,
		...props
	}), [rest]);
	const getOverlayProps = (0, react.useCallback)((props = {}) => ({
		"aria-hidden": "true",
		...props,
		onClick: (0, require_utils_index.utils_exports.handlerAll)(props.onClick, (ev) => {
			ev.stopPropagation();
			if (closeOnOverlay) onClose();
		})
	}), [closeOnOverlay, onClose]);
	const getOpenTriggerProps = (0, react.useCallback)((props = {}) => ({
		"aria-controls": open ? contentId : void 0,
		"aria-expanded": open,
		"aria-haspopup": "dialog",
		"aria-label": t("Open modal"),
		...props,
		onClick: (0, require_utils_index.utils_exports.handlerAll)(props.onClick, onOpen)
	}), [
		contentId,
		onOpen,
		open,
		t
	]);
	const getCloseTriggerProps = (0, react.useCallback)((props = {}) => ({
		"aria-label": t("Close modal"),
		...props,
		onClick: (0, require_utils_index.utils_exports.handlerAll)(props.onClick, onClose)
	}), [onClose, t]);
	const getCloseButtonProps = (0, react.useCallback)((props = {}) => ({
		"aria-label": t("Close modal"),
		...props,
		onClick: (0, require_utils_index.utils_exports.handlerAll)(props.onClick, onClose)
	}), [onClose, t]);
	const getContentProps = (0, react.useCallback)(({ "aria-describedby": ariaDescribedby, "aria-labelledby": ariaLabelledby,...props } = {}) => ({
		id: contentId,
		"aria-describedby": (0, require_utils_index.utils_exports.cx)(ariaDescribedby, bodyId),
		"aria-labelledby": (0, require_utils_index.utils_exports.cx)(ariaLabelledby, titleId),
		"aria-modal": "true",
		role: "dialog",
		...props,
		onKeyDown: (0, require_utils_index.utils_exports.handlerAll)(props.onKeyDown, onKeyDown)
	}), [
		bodyId,
		contentId,
		onKeyDown,
		titleId
	]);
	const getHeaderProps = (0, react.useCallback)((props) => ({ ...props }), []);
	const getTitleProps = (0, react.useCallback)((props) => ({
		id: titleId,
		...props
	}), [titleId]);
	return {
		open,
		getBodyProps: (0, react.useCallback)((props) => ({
			id: bodyId,
			...props
		}), [bodyId]),
		getCloseButtonProps,
		getCloseTriggerProps,
		getContentProps,
		getFooterProps: (0, react.useCallback)((props) => ({ ...props }), []),
		getHeaderProps,
		getOpenTriggerProps,
		getOverlayProps,
		getRootProps,
		getTitleProps,
		onClose,
		onOpen
	};
};

//#endregion
exports.useModal = useModal;
//# sourceMappingURL=use-modal.cjs.map