make onClose optional

sumup-oss · Nov 29, 2024 · f0d2abd · f0d2abd
1 parent 7cfd7f9
commit f0d2abd
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 8 deletions.
diff --git a/packages/circuit-ui/components/Dialog/Dialog.tsx b/packages/circuit-ui/components/Dialog/Dialog.tsx
@@ -44,7 +44,7 @@ import { getFirstFocusableElement } from './DialogService.js';
 export interface DialogProps
   extends Omit<HTMLAttributes<HTMLDialogElement>, 'children'> {
   open: boolean;
-  onClose: () => void;
+  onClose?: () => void;
   children: () => ReactNode;
   closeButtonLabel: string;
   isModal?: boolean;
@@ -60,7 +60,7 @@ export const Dialog = forwardRef<HTMLDialogElement, DialogProps>(
       onClose,
       closeButtonLabel,
       variant = 'contextual',
-      isModal = true,
+      isModal = false,
       children,
       className,
       ...props
@@ -130,10 +130,14 @@ export const Dialog = forwardRef<HTMLDialogElement, DialogProps>(
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
       // @ts-ignore The package is bundled incorrectly
       dialogPolyfill.registerDialog(dialogElement);
-      dialogElement.addEventListener('close', onClose);
+      if (onClose) {
+        dialogElement.addEventListener('close', onClose);
+      }
 
       return () => {
-        dialogElement.removeEventListener('close', onClose);
+        if (onClose) {
+          dialogElement.removeEventListener('close', onClose);
+        }
       };
     }, [onClose]);
 

diff --git a/packages/circuit-ui/components/Dialog/ModalDialogContext.tsx b/packages/circuit-ui/components/Dialog/ModalDialogContext.tsx
@@ -26,19 +26,17 @@ import {
 import type { Dialog, DialogProps } from './Dialog.js';
 
 type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
-export type SetModalArgs = Optional<DialogProps, 'open' | 'onClose'>;
+export type SetModalArgs = Optional<DialogProps, 'open'>;
 
-// keep initial state compatible prior to the old version of this component
+// keep initial state compatible with the old version of this component
 type ModalDialogState = SetModalArgs & {
   component: typeof Dialog;
   id: string | number;
 };
 
 type ModalDialogContextValue = {
-  /* eslint-disable @typescript-eslint/no-explicit-any */
   setModal: (modal: ModalDialogState) => void;
   removeModal: (modal: ModalDialogState) => void;
-  /* eslint-enable @typescript-eslint/no-explicit-any */
 };
 export interface ModalDialogProviderProps {
   /**