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

main
Tsu-ba-me 2 years ago committed by digimer
parent f8d395299c
commit 4376fdbc10
  1. 18
      striker-ui/components/TabContent.tsx
  2. 9
      striker-ui/types/TabContent.d.ts

@ -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(
() => (isTabIdMatch ? 'initial' : 'none'),
[isTabIdMatch],
const result = useMemo<ReactNode>(
() =>
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;

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

Loading…
Cancel
Save