33 lines
653 B
TypeScript
33 lines
653 B
TypeScript
import { ReactNode } from 'react';
|
|
import { Box } from './Box';
|
|
import { Container } from './Container';
|
|
|
|
export interface ContentViewportProps {
|
|
children: ReactNode;
|
|
padding?: 'none' | 'sm' | 'md' | 'lg';
|
|
fullWidth?: boolean;
|
|
}
|
|
|
|
export const ContentViewport = ({
|
|
children,
|
|
padding = 'md',
|
|
fullWidth = false
|
|
}: ContentViewportProps) => {
|
|
const paddingMap: Record<string, any> = {
|
|
none: 0,
|
|
sm: 4,
|
|
md: 8,
|
|
lg: 12,
|
|
};
|
|
|
|
return (
|
|
<Box flexGrow={1}>
|
|
<Container size={fullWidth ? 'full' : 'xl'}>
|
|
<Box paddingY={paddingMap[padding]}>
|
|
{children}
|
|
</Box>
|
|
</Container>
|
|
</Box>
|
|
);
|
|
};
|