@baseplate-dev/ui-components/dist/components/layouts/sidebar-layout/sidebar-layout.js

Shared UI component library

import { jsx as _jsx } from "react/jsx-runtime";
import { clsx } from 'clsx';
import { cn } from '#src/utils/index.js';
/**
 * Displays a 2 column layout with a sidebar and content.
 */
function SidebarLayout({ className, children, }) {
    return _jsx("div", { className: clsx('flex h-full', className), children: children });
}
function SidebarLayoutSidebar({ className, children, width = 'md', noPadding, }) {
    return (_jsx("aside", { className: cn('sticky shrink-0 overflow-y-auto border-r border-border', {
            'w-64': width === 'sm',
            'w-72': width === 'md',
            'w-96': width === 'lg',
            'p-4': !noPadding,
        }, className), children: children }));
}
function SidebarLayoutContent({ className, children, }) {
    return (_jsx("div", { className: cn('w-full flex-auto overflow-y-auto', className), children: children }));
}
export { SidebarLayout, SidebarLayoutContent, SidebarLayoutSidebar };
//# sourceMappingURL=sidebar-layout.js.map