fix(striker-ui): allow retain/discard tab content

striker-ui/components/TabContent.tsx

@@ -1,21 +1,29 @@
 import { Box } from '@mui/material';
-import { ReactElement, useMemo } from 'react';
+import { ReactElement, ReactNode, useMemo } from 'react';
 
 const TabContent = <T,>({
   changingTabId,
   children,
+  retain = false,
   tabId,
 }: TabContentProps<T>): ReactElement => {
   const isTabIdMatch = useMemo(
     () => changingTabId === tabId,
     [changingTabId, tabId],
   );
-  const displayValue = useMemo(
+  const result = useMemo<ReactNode>(
-    () => (isTabIdMatch ? 'initial' : 'none'),
+    () =>
-    [isTabIdMatch],
+      retain ? (
+        <Box sx={{ display: isTabIdMatch ? 'initial' : 'none' }}>
+          {children}
+        </Box>
+      ) : (
+        isTabIdMatch && children
+      ),
+    [children, isTabIdMatch, retain],
   );
 
-  return <Box sx={{ display: displayValue }}>{children}</Box>;
+  return <>{result}</>;
 };
 
 export default TabContent;

striker-ui/types/TabContent.d.ts

@@ -1,4 +1,9 @@
-type TabContentProps<T> = import('react').PropsWithChildren<{
+type TabContentOptionalProps = {
-  changingTabId: T;
+  retain?: boolean;
-  tabId: T;
+};
-}>;
+
+type TabContentProps<T> = TabContentOptionalProps &
+  import('react').PropsWithChildren<{
+    changingTabId: T;
+    tabId: T;
+  }>;