D5315.id17416.diff
No OneTemporary
Actions

Size

1 KB

Referenced Files

None

Subscribers

None

D5315.id17416.diff
View Options

	diff --git a/web/modals/modal.react.js b/web/modals/modal.react.js
	--- a/web/modals/modal.react.js
	+++ b/web/modals/modal.react.js
	@@ -2,6 +2,7 @@

	import classNames from 'classnames';
	import * as React from 'react';
	+import { useState } from 'react';

	import SWMansionIcon, { type Icon } from '../SWMansionIcon.react';
	import css from './modal.css';
	@@ -31,14 +32,26 @@
	withCloseButton = true,
	} = props;
	const overlayRef = React.useRef();
	+ const [isBackgroundClick, setIsBackgroundClick] = useState(false);

	- const onBackgroundClick = React.useCallback(
	+ const onBackgroundMouseDown = React.useCallback(
	event => {
	if (event.target === overlayRef.current) {
	+ setIsBackgroundClick(true);
	+ } else {
	+ setIsBackgroundClick(false);
	+ }
	+ },
	+ [setIsBackgroundClick],
	+ );
	+
	+ const onBackgroundMouseUp = React.useCallback(
	+ event => {
	+ if (event.target === overlayRef.current && isBackgroundClick === true) {
	onClose();
	}
	},
	- [onClose],
	+ [onClose, isBackgroundClick],
	);

	const onKeyDown = React.useCallback(
	@@ -87,7 +100,8 @@
	<div
	className={css.modalOverlay}
	ref={overlayRef}
	- onClick={onBackgroundClick}
	+ onMouseDown={onBackgroundMouseDown}
	+ onMouseUp={onBackgroundMouseUp}
	tabIndex={0}
	onKeyDown={onKeyDown}
	>