mirror of
https://github.com/mountain-loop/yaak.git
synced 2026-08-25 04:44:12 +02:00
Unify dialog close behavior
This commit is contained in:
@@ -10,12 +10,13 @@ export interface DialogProps {
|
|||||||
children: ReactNode;
|
children: ReactNode;
|
||||||
open: boolean;
|
open: boolean;
|
||||||
onClose?: () => void;
|
onClose?: () => void;
|
||||||
|
/** Block dismissal from the backdrop, Escape key, and built-in close button. */
|
||||||
disableClose?: boolean;
|
disableClose?: boolean;
|
||||||
disableBackdropClose?: boolean;
|
|
||||||
title?: ReactNode;
|
title?: ReactNode;
|
||||||
description?: ReactNode;
|
description?: ReactNode;
|
||||||
className?: string;
|
className?: string;
|
||||||
size?: DialogSize;
|
size?: DialogSize;
|
||||||
|
/** Hide the built-in close button without changing backdrop or Escape behavior. */
|
||||||
hideX?: boolean;
|
hideX?: boolean;
|
||||||
noPadding?: boolean;
|
noPadding?: boolean;
|
||||||
noScroll?: boolean;
|
noScroll?: boolean;
|
||||||
@@ -29,7 +30,6 @@ export function Dialog({
|
|||||||
open,
|
open,
|
||||||
onClose,
|
onClose,
|
||||||
disableClose,
|
disableClose,
|
||||||
disableBackdropClose,
|
|
||||||
title,
|
title,
|
||||||
description,
|
description,
|
||||||
hideX,
|
hideX,
|
||||||
@@ -44,11 +44,7 @@ export function Dialog({
|
|||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Overlay
|
<Overlay open={open} onClose={disableClose ? undefined : onClose} portalName="dialog">
|
||||||
open={open}
|
|
||||||
onClose={disableClose || disableBackdropClose ? undefined : onClose}
|
|
||||||
portalName="dialog"
|
|
||||||
>
|
|
||||||
<div
|
<div
|
||||||
role="dialog"
|
role="dialog"
|
||||||
className={classNames(
|
className={classNames(
|
||||||
@@ -116,7 +112,7 @@ export function Dialog({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/*Put close at the end so that it's the last thing to be tabbed to*/}
|
{/*Put close at the end so that it's the last thing to be tabbed to*/}
|
||||||
{!hideX && !disableClose && (
|
{!disableClose && !hideX && (
|
||||||
<div className="ml-auto absolute right-1 top-1">
|
<div className="ml-auto absolute right-1 top-1">
|
||||||
<IconButton
|
<IconButton
|
||||||
className="opacity-70 hover:opacity-100"
|
className="opacity-70 hover:opacity-100"
|
||||||
|
|||||||
@@ -86,10 +86,8 @@ export async function promptDivergedStrategy({
|
|||||||
showDialog({
|
showDialog({
|
||||||
id: "git-diverged",
|
id: "git-diverged",
|
||||||
title: "Branches Diverged",
|
title: "Branches Diverged",
|
||||||
hideX: true,
|
|
||||||
size: "sm",
|
size: "sm",
|
||||||
disableBackdropClose: true,
|
disableClose: true,
|
||||||
onClose: () => resolve("cancel"),
|
|
||||||
render: ({ hide }) =>
|
render: ({ hide }) =>
|
||||||
DivergedDialog({
|
DivergedDialog({
|
||||||
remote,
|
remote,
|
||||||
|
|||||||
@@ -14,9 +14,8 @@ export function showAlert({ id, title, body, size = "sm" }: AlertArgs) {
|
|||||||
showDialog({
|
showDialog({
|
||||||
id,
|
id,
|
||||||
title,
|
title,
|
||||||
hideX: true,
|
|
||||||
size,
|
size,
|
||||||
disableBackdropClose: true, // Prevent accidental dismisses
|
disableClose: true,
|
||||||
render: ({ hide }) => Alert({ onHide: hide, body }),
|
render: ({ hide }) => Alert({ onHide: hide, body }),
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -18,9 +18,8 @@ export async function showConfirm({
|
|||||||
return new Promise((onResult: ConfirmProps["onResult"]) => {
|
return new Promise((onResult: ConfirmProps["onResult"]) => {
|
||||||
showDialog({
|
showDialog({
|
||||||
...extraProps,
|
...extraProps,
|
||||||
hideX: true,
|
|
||||||
size,
|
size,
|
||||||
disableBackdropClose: true, // Prevent accidental dismisses
|
disableClose: true,
|
||||||
render: ({ hide }) => Confirm({ onHide: hide, color, onResult, confirmText, requireTyping }),
|
render: ({ hide }) => Confirm({ onHide: hide, color, onResult, confirmText, requireTyping }),
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -25,13 +25,8 @@ export async function showPromptForm({
|
|||||||
id,
|
id,
|
||||||
title,
|
title,
|
||||||
description,
|
description,
|
||||||
hideX: true,
|
|
||||||
size: size ?? "sm",
|
size: size ?? "sm",
|
||||||
disableBackdropClose: true, // Prevent accidental dismisses
|
disableClose: true,
|
||||||
onClose: () => {
|
|
||||||
// Click backdrop, close, or escape
|
|
||||||
resolve(null);
|
|
||||||
},
|
|
||||||
render: ({ hide }) =>
|
render: ({ hide }) =>
|
||||||
Prompt({
|
Prompt({
|
||||||
onCancel: () => {
|
onCancel: () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user