UNPKG

@youwen/ai-design-system

Version:

Enterprise AI-driven design system with comprehensive design tokens

130 lines (129 loc) 4.15 kB
/** * HVAC Layout Design Tokens * 基于Figma精确提取的布局和间距规范 */ export declare const layoutSystem: { readonly dimensions: { readonly widgetSmall: { readonly width: 195; readonly height: 97; }; readonly container: { readonly width: 430; readonly height: 225; }; readonly button: { readonly width: 195; readonly height: 47; }; readonly card: { readonly width: 440; readonly height: 1081; }; }; readonly spacing: { readonly unit: 15; readonly none: 0; readonly xs: 5; readonly sm: 10; readonly md: 15; readonly lg: 20; readonly xl: 30; readonly component: { readonly containerPadding: 15; readonly itemGap: 10; readonly textVerticalGap: 10; readonly moduleMargin: 15; }; }; readonly grid: { readonly columns: { readonly single: "1fr"; readonly double: "repeat(2, 195px)"; readonly triple: "repeat(3, 195px)"; readonly auto: "repeat(auto-fit, minmax(195px, 1fr))"; }; readonly gaps: { readonly sm: 10; readonly md: 15; readonly lg: 20; }; }; readonly flex: { readonly widgetInternal: { readonly direction: "column"; readonly justify: "flex-start"; readonly align: "flex-start"; readonly gap: 10; }; readonly containerLayout: { readonly direction: "row"; readonly justify: "space-between"; readonly align: "flex-start"; readonly gap: 15; }; readonly layouts: { readonly verticalStack: { readonly display: "flex"; readonly flexDirection: "column"; readonly gap: "10px"; readonly alignItems: "flex-start"; }; readonly horizontalLayout: { readonly display: "flex"; readonly flexDirection: "row"; readonly gap: "15px"; readonly alignItems: "flex-start"; }; readonly gridLayout: { readonly display: "grid"; readonly gridTemplateColumns: "repeat(auto-fit, minmax(195px, 1fr))"; readonly gap: "15px"; readonly padding: "15px"; }; }; }; readonly positioning: { readonly offsets: { readonly containerMargin: 15; readonly componentSpacing: 15; readonly textBaseline: 0; }; readonly alignment: { readonly left: "flex-start"; readonly center: "center"; readonly right: "flex-end"; readonly justify: "space-between"; }; }; readonly breakpoints: { readonly mobile: 390; readonly tablet: 615; readonly desktop: 840; readonly wide: 1065; }; }; export declare const getLayoutDimension: (component: keyof typeof layoutSystem.dimensions) => { readonly width: 195; readonly height: 97; } | { readonly width: 430; readonly height: 225; } | { readonly width: 195; readonly height: 47; } | { readonly width: 440; readonly height: 1081; }; export declare const getLayoutSpacing: (key: keyof typeof layoutSystem.spacing) => string | { readonly containerPadding: 15; readonly itemGap: 10; readonly textVerticalGap: 10; readonly moduleMargin: 15; }; export declare const getLayoutGridColumns: (count: keyof typeof layoutSystem.grid.columns) => "1fr" | "repeat(2, 195px)" | "repeat(3, 195px)" | "repeat(auto-fit, minmax(195px, 1fr))"; export type LayoutDimension = keyof typeof layoutSystem.dimensions; export type LayoutSpacing = keyof typeof layoutSystem.spacing; export type LayoutGridColumns = keyof typeof layoutSystem.grid.columns; export type LayoutFlexLayout = keyof typeof layoutSystem.flex.layouts;