mirror of
https://github.com/shuaiplus/nodewarden.git
synced 2026-08-05 06:50:10 +00:00
fix: preserve dialog title during closing animation to prevent flash
This commit is contained in:
@@ -87,6 +87,7 @@ export default function ConfirmDialog(props: ConfirmDialogProps) {
|
|||||||
const cardRef = useRef<HTMLFormElement | null>(null);
|
const cardRef = useRef<HTMLFormElement | null>(null);
|
||||||
const maskPointerStartedRef = useRef(false);
|
const maskPointerStartedRef = useRef(false);
|
||||||
const restoreFocusRef = useRef<HTMLElement | null>(null);
|
const restoreFocusRef = useRef<HTMLElement | null>(null);
|
||||||
|
const lastTitleRef = useRef<ComponentChildren>(props.title);
|
||||||
const dialogId = useMemo(() => `confirm-dialog-${++dialogIdCounter}`, []);
|
const dialogId = useMemo(() => `confirm-dialog-${++dialogIdCounter}`, []);
|
||||||
const titleId = `${dialogId}-title`;
|
const titleId = `${dialogId}-title`;
|
||||||
const messageId = `${dialogId}-message`;
|
const messageId = `${dialogId}-message`;
|
||||||
@@ -95,6 +96,7 @@ export default function ConfirmDialog(props: ConfirmDialogProps) {
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (props.open) {
|
if (props.open) {
|
||||||
|
lastTitleRef.current = props.title;
|
||||||
setPresent(true);
|
setPresent(true);
|
||||||
setClosing(false);
|
setClosing(false);
|
||||||
return;
|
return;
|
||||||
@@ -228,7 +230,7 @@ export default function ConfirmDialog(props: ConfirmDialogProps) {
|
|||||||
<X size={18} />
|
<X size={18} />
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
<h3 id={titleId} className="dialog-title">{props.title}</h3>
|
<h3 id={titleId} className="dialog-title">{props.open ? props.title : lastTitleRef.current}</h3>
|
||||||
{hasMessage && <div id={messageId} className={`dialog-message ${props.variant === 'warning' ? 'warning' : ''}`}>{props.message}</div>}
|
{hasMessage && <div id={messageId} className={`dialog-message ${props.variant === 'warning' ? 'warning' : ''}`}>{props.message}</div>}
|
||||||
{props.children}
|
{props.children}
|
||||||
{!props.hideConfirm && (
|
{!props.hideConfirm && (
|
||||||
|
|||||||
Reference in New Issue
Block a user