docs(changeset): feat(Former): add keep open functionality and update onClose behavior

.changeset/curly-cougars-draw.md

@@ -0,0 +1,5 @@
+---
+'@warkypublic/oranguru': patch
+---
+
+feat(Former): add keep open functionality and update onClose behavior

src/Former/Former.store.tsx

@@ -118,21 +118,38 @@ const { Provider: FormerProvider, useStore: useFormerStore } = createSyncStore<
             if (get().afterSave) {
               await get().afterSave!(newData, get());
             }
+
+            if (keepOpen) {
+              const keyName = get()?.uniqueKeyField || 'id';
+              const clearedData = { ...newData };
+              delete clearedData[keyName];
+              set({ loading: false, values: clearedData });
+              get().onChange?.(clearedData, get());
+              formMethods.reset(clearedData);
+              return newData;
+            }
+
             set({ loading: false, values: newData });
             get().onChange?.(newData, get());
             formMethods.reset(newData); //reset with saved data to clear dirty state
-            if (!keepOpen) {
+            get().onClose?.(newData);
-              get().onClose?.(newData);
-            }
             return newData;
           }
 
+          if (keepOpen) {
+            const keyName = get()?.uniqueKeyField || 'id';
+            const clearedData = { ...data };
+            delete clearedData[keyName];
+            set({ loading: false, values: clearedData });
+            formMethods.reset(clearedData);
+            get().onChange?.(clearedData, get());
+            return data;
+          }
+
           set({ loading: false, values: data });
           formMethods.reset(data); //reset with saved data to clear dirty state
           get().onChange?.(data, get());
-          if (!keepOpen) {
+          get().onClose?.(data);
-            get().onClose?.(data);
-          }
 
           return data;
         }

src/Former/Former.types.ts

@@ -31,12 +31,13 @@ export interface FormerProps<T extends FieldValues = any> {
     renderTop?: FormerSectionRender<T>;
     saveButtonProps?: ButtonProps;
     saveButtonTitle?: React.ReactNode;
+    showKeepOpenSwitch?: boolean;
     title?: string;
   };
   onAPICall?: FormerAPICallType<T>;
   onCancel?: () => void;
   onChange?: (value: T, state: Partial<FormStateAndProps<T>>) => void;
-  onClose?: (data: T | undefined) => void;
+  onClose?: (data?: T | undefined) => void;
   onConfirmDelete?: (values?: T) => Promise<boolean>;
   onError?: (error: Error | string, state: Partial<FormStateAndProps<T>>) => void;
   onOpen?: (data?: T) => void;

src/Former/FormerButtonArea.tsx

@@ -1,4 +1,4 @@
-import { Button, Group, Tooltip } from '@mantine/core';
+import { Button, Group, Switch, Tooltip } from '@mantine/core';
 import { IconDeviceFloppy, IconX } from '@tabler/icons-react';
 
 import { useFormerStore } from './Former.store';
@@ -9,21 +9,29 @@ export const FormerButtonArea = () => {
     closeButtonProps,
     closeButtonTitle,
     dirty,
+    getState,
+    keepOpen,
     onClose,
     request,
     save,
     saveButtonProps,
     saveButtonTitle,
+    setState,
+    showKeepOpenSwitch,
   } = useFormerStore((state) => ({
     buttonAreaGroupProps: state.layout?.buttonAreaGroupProps,
     closeButtonProps: state.layout?.closeButtonProps,
     closeButtonTitle: state.layout?.closeButtonTitle,
     dirty: state.dirty,
+    getState: state.getState,
+    keepOpen: state.keepOpen,
     onClose: state.onClose,
     request: state.request,
     save: state.save,
     saveButtonProps: state.layout?.saveButtonProps,
     saveButtonTitle: state.layout?.saveButtonTitle,
+    setState: state.setState,
+    showKeepOpenSwitch: state.layout?.showKeepOpenSwitch,
   }));
 
   const disabledSave =
@@ -47,12 +55,19 @@ export const FormerButtonArea = () => {
             size="sm"
             {...closeButtonProps}
             onClick={() => {
-              onClose();
+              onClose(getState('values'));
             }}
           >
             {closeButtonTitle || 'Close'}
           </Button>
         )}
+        {showKeepOpenSwitch && (
+          <Switch
+            checked={keepOpen}
+            label="Keep Open"
+            onChange={(event) => setState('keepOpen', event.currentTarget.checked)}
+          />
+        )}
         <Tooltip
           label={
             disabledSave ? (