feat: override close option

packages/dockview/src/__tests__/dockview/defaultTab.spec.tsx

@@ -40,6 +40,58 @@ describe('defaultTab', () => {
         expect(element.querySelector('.dv-react-tab-close-btn')).toBeNull();
     });
 
+    test('that settings closeActionOverride skips api.close()', async () => {
+        const api = fromPartial<DockviewPanelApi>({
+            close: jest.fn(),
+        });
+        const containerApi = fromPartial<DockviewApi>({});
+        const params = {};
+
+        const closeActionOverride = jest.fn();
+
+        render(
+            <DockviewDefaultTab
+                api={api}
+                containerApi={containerApi}
+                params={params}
+                closeActionOverride={closeActionOverride}
+            />
+        );
+
+        const element = await screen.getByTestId('dockview-default-tab');
+        const btn = element.querySelector(
+            '.dv-react-tab-close-btn'
+        ) as HTMLElement;
+        fireEvent.click(btn);
+
+        expect(closeActionOverride).toBeCalledTimes(1);
+        expect(api.close).toBeCalledTimes(0);
+    });
+
+    test('that clicking close calls api.close()', async () => {
+        const api = fromPartial<DockviewPanelApi>({
+            close: jest.fn(),
+        });
+        const containerApi = fromPartial<DockviewApi>({});
+        const params = {};
+
+        render(
+            <DockviewDefaultTab
+                api={api}
+                containerApi={containerApi}
+                params={params}
+            />
+        );
+
+        const element = await screen.getByTestId('dockview-default-tab');
+        const btn = element.querySelector(
+            '.dv-react-tab-close-btn'
+        ) as HTMLElement;
+        fireEvent.click(btn);
+
+        expect(api.close).toBeCalledTimes(1);
+    });
+
     test('has close button when hideClose=false', async () => {
         const api = fromPartial<DockviewPanelApi>({});
         const containerApi = fromPartial<DockviewApi>({});

packages/dockview/src/dockview/defaultTab.tsx

@@ -3,7 +3,10 @@ import * as React from 'react';
 import { CloseButton } from '../svg';
 
 export type IDockviewDefaultTabProps = IDockviewPanelHeaderProps &
-    React.DOMAttributes<HTMLDivElement> & { hideClose?: boolean };
+    React.DOMAttributes<HTMLDivElement> & {
+        hideClose?: boolean;
+        closeActionOverride?: () => void;
+    };
 
 export const DockviewDefaultTab: React.FunctionComponent<
     IDockviewDefaultTabProps
@@ -12,14 +15,20 @@ export const DockviewDefaultTab: React.FunctionComponent<
     containerApi: _containerApi,
     params: _params,
     hideClose,
+    closeActionOverride,
     ...rest
 }) => {
     const onClose = React.useCallback(
         (event: React.MouseEvent<HTMLSpanElement>) => {
             event.preventDefault();
+
+            if (closeActionOverride) {
+                closeActionOverride();
+            } else {
                 api.close();
+            }
         },
-        [api]
+        [api, closeActionOverride]
     );
 
     const onMouseDown = React.useCallback((e: React.MouseEvent) => {