ccic-web/packages/component.ui/lib/react-router-prompt/index.js

var __awaiter =
	(this && this.__awaiter) ||
	function (thisArg, _arguments, P, generator) {
		function adopt(value) {
			return value instanceof P
				? value
				: new P(function (resolve) {
						resolve(value);
				  });
		}
		return new (P || (P = Promise))(function (resolve, reject) {
			function fulfilled(value) {
				try {
					step(generator.next(value));
				} catch (e) {
					reject(e);
				}
			}
			function rejected(value) {
				try {
					step(generator['throw'](value));
				} catch (e) {
					reject(e);
				}
			}
			function step(result) {
				result.done
					? resolve(result.value)
					: adopt(result.value).then(fulfilled, rejected);
			}
			step((generator = generator.apply(thisArg, _arguments || [])).next());
		});
	};
import { jsx as _jsx } from 'react/jsx-runtime';
import { useCallback, useContext } from 'react';
import useConfirm from './hooks/use-confirm';
import useBlocker from './hooks/use-blocker';
import ConfirmContextProvider, { ConfirmContext } from './ConfirmContext';
/**
 * A replacement component for the react-router `Prompt`.
 * Allows for more flexible dialogs.
 *
 * @example
 * <ReactRouterPrompt when={isDirty}>
 *   {({isActive, onConfirm, onCancel}) => (
 *     <Modal show={isActive}>
 *       <div>
 *         <p>Do you really want to leave?</p>
 *         <button onClick={onCancel}>Cancel</button>
 *         <button onClick={onConfirm}>Ok</button>
 *       </div>
 *     </Modal>
 *   )}
 * </ReactRouterPrompt>
 */
const ReactRouterPrompt = ({ when, children }) => {
	const { onConfirm, resetConfirmation, isActive, proceed, cancel } =
		useConfirm();
	const { resolve } = useContext(ConfirmContext) || {};
	const blocker = useCallback(
		// @ts-ignore
		(tx) =>
			__awaiter(void 0, void 0, void 0, function* () {
				if (yield onConfirm()) {
					resetConfirmation();
					tx.retry();
				}
			}),
		[resetConfirmation, onConfirm],
	);
	useBlocker(blocker, when && !resolve);
	return _jsx('div', {
		children: children({
			isActive,
			onConfirm: proceed,
			onCancel: cancel,
		}),
	});
};
const Main = (props) => {
	return _jsx(ConfirmContextProvider, {
		children: _jsx(ReactRouterPrompt, Object.assign({}, props)),
	});
};
export default Main;