@awsui/components-react
Version:
On July 19th, 2022, we launched [Cloudscape Design System](https://cloudscape.design). Cloudscape is an evolution of AWS-UI. It consists of user interface guidelines, front-end components, design resources, and development tools for building intuitive, en
59 lines • 2.44 kB
TypeScript
import { AppLayoutPropsWithDefaults } from '../interfaces';
interface HorizontalLayoutInput {
navigationOpen: boolean;
navigationWidth: number;
placement: AppLayoutPropsWithDefaults['placement'];
minContentWidth: number;
activeDrawerSize: number;
splitPanelOpen: boolean;
splitPanelPosition: 'side' | 'bottom' | undefined;
splitPanelSize: number;
isMobile: boolean;
activeGlobalDrawersSizes: Record<string, number>;
}
export declare const CONTENT_PADDING: number;
export declare function computeHorizontalLayout({ navigationOpen, navigationWidth, placement, minContentWidth, activeDrawerSize, splitPanelOpen, splitPanelPosition, splitPanelSize, isMobile, activeGlobalDrawersSizes, }: HorizontalLayoutInput): {
splitPanelPosition: "bottom" | "side";
splitPanelForcedPosition: boolean;
sideSplitPanelSize: number;
maxSplitPanelSize: number;
maxDrawerSize: number;
maxGlobalDrawersSizes: Record<string, number>;
totalActiveGlobalDrawersSize: number;
resizableSpaceAvailable: number;
};
interface VerticalLayoutInput {
topOffset: number;
hasVisibleToolbar: boolean;
toolbarHeight: number;
stickyNotifications: boolean;
notificationsHeight: number;
}
export interface VerticalLayoutOutput {
toolbar: number;
notifications: number;
header: number;
drawers: number;
}
export declare function computeVerticalLayout({ topOffset, hasVisibleToolbar, toolbarHeight, stickyNotifications, notificationsHeight, }: VerticalLayoutInput): VerticalLayoutOutput;
interface SplitPanelOffsetInput {
hasSplitPanel: boolean;
placement: AppLayoutPropsWithDefaults['placement'];
splitPanelPosition: 'bottom' | 'side';
splitPanelOpen: boolean;
splitPanelHeaderHeight: number;
splitPanelFullHeight: number;
}
export declare function computeSplitPanelOffsets({ hasSplitPanel, splitPanelPosition, placement, splitPanelOpen, splitPanelFullHeight, splitPanelHeaderHeight, }: SplitPanelOffsetInput): {
stickyVerticalBottomOffset: number;
mainContentPaddingBlockEnd: undefined;
} | {
stickyVerticalBottomOffset: number;
mainContentPaddingBlockEnd: number;
};
export declare function getDrawerStyles(verticalOffsets: VerticalLayoutOutput, isMobile: boolean, placement: AppLayoutPropsWithDefaults['placement']): {
drawerTopOffset: number;
drawerHeight: string;
};
export {};
//# sourceMappingURL=compute-layout.d.ts.map