import React, { ReactNode } from 'react';
import { Box } from 'folds';

type SidebarContentProps = {
  scrollable: ReactNode;
  sticky: ReactNode;
};
export function SidebarContent({ scrollable, sticky }: SidebarContentProps) {
  return (
    <>
      <Box direction="Column" grow="Yes" data-sidebar-scroll-region="" style={{ overflow: 'visible', minWidth: 0 }}>
        {scrollable}
      </Box>
      <Box direction="Column" shrink="No" data-sidebar-sticky="" style={{ overflow: 'visible' }}>
        {sticky}
      </Box>
    </>
  );
}
