40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
import { Stack } from '@/ui/primitives/Stack';
|
|
import React from 'react';
|
|
|
|
interface DashboardShellProps {
|
|
children: React.ReactNode;
|
|
rail?: React.ReactNode;
|
|
controlBar?: React.ReactNode;
|
|
}
|
|
|
|
/**
|
|
* DashboardShell
|
|
*
|
|
* The primary layout container for the Telemetry Workspace.
|
|
* Orchestrates the sidebar rail, top control bar, and main content area.
|
|
* Uses UI primitives to comply with architectural constraints.
|
|
*/
|
|
export function DashboardShell({ children, rail, controlBar }: DashboardShellProps) {
|
|
return (
|
|
<Stack direction="row" h="screen" overflow="hidden" bg="base-black" color="white">
|
|
{rail && (
|
|
<Stack as="aside" w="16" flexShrink={0} borderRight bg="surface-charcoal" borderColor="var(--color-outline)">
|
|
{rail}
|
|
</Stack>
|
|
)}
|
|
<Stack flexGrow={1} overflow="hidden">
|
|
{controlBar && (
|
|
<Stack as="header" h="14" borderBottom bg="surface-charcoal" borderColor="var(--color-outline)">
|
|
{controlBar}
|
|
</Stack>
|
|
)}
|
|
<Stack as="main" flexGrow={1} overflow="auto" p={6}>
|
|
<Stack maxWidth="7xl" mx="auto" gap={6} fullWidth>
|
|
{children}
|
|
</Stack>
|
|
</Stack>
|
|
</Stack>
|
|
</Stack>
|
|
);
|
|
}
|