feat(modal): add onLeftClick prop to control left button event-handli…

…ng (#200)
warp-ds · Feb 5, 2024 · 96a750b · 96a750b
1 parent 003d82f
commit 96a750b
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 1 deletion.
diff --git a/packages/modal/src/component.tsx b/packages/modal/src/component.tsx
@@ -91,7 +91,7 @@ export const Modal = ({
                   ccModal.titleButton,
                   ccModal.titleButtonLeft
                 )}
-                onClick={props.onDismiss}
+                onClick={props.onLeftClick ? props.onLeftClick : props.onDismiss}
               >
                 <IconTableSortDown16
                   className={classNames(

diff --git a/packages/modal/src/props.ts b/packages/modal/src/props.ts
@@ -49,6 +49,11 @@ export type ModalProps = {
    */
   onDismiss?: () => void;
 
+  /**
+   * Handler that is called when the user clicks the left button
+   */
+  onLeftClick?: () => void;
+
   /**
    * Defines a string value that labels the current element. Must be set if neither `aria-labelledby` or `<ModalHeading>` is defined,
    */

diff --git a/packages/modal/stories/Modal.stories.tsx b/packages/modal/stories/Modal.stories.tsx
@@ -70,6 +70,10 @@ export const WithBackAndCloseButton = () => {
         left
         right
         onDismiss={toggleModal}
+        onLeftClick={() => {
+          console.log('left clicked');
+          toggleModal();
+        }}
         title="Title of the content goes here"
         footer={
           <>