/** * Responsive Utility Functions * * Centralized responsive calculations to avoid code duplication. * All components should use these utilities instead of manual calculations. */ /** * Calculate responsive size from base value * Multiplies base size by spacingMultiplier and floors the result * * @param baseSize - Base size in pixels (e.g., 16, 24, 32) * @param spacingMultiplier - Multiplier from design tokens (0.9, 1.0, 1.2) * @returns Responsive size in pixels (floored for integer values) * * @example * const responsive = useResponsive(); * const padding = calculateResponsiveSize(16, responsive.spacingMultiplier); // 14.4 → 14 */ export declare const calculateResponsiveSize: (baseSize: number, spacingMultiplier: number) => number; /** * Calculate multiple responsive sizes at once * Useful for component configs with multiple size properties * * @param sizes - Object with base sizes * @param spacingMultiplier - Multiplier from design tokens * @returns Object with responsive sizes * * @example * const baseConfig = { padding: 16, margin: 24, fontSize: 14 }; * const responsiveConfig = calculateResponsiveSizes(baseConfig, spacingMultiplier); * // { padding: 14, margin: 21, fontSize: 12 } */ export declare const calculateResponsiveSizes: >(sizes: T, spacingMultiplier: number) => { [K in keyof T]: number; }; /** * Calculate responsive size with subtle scaling * For values that shouldn't scale as much (e.g., borderWidth, borderRadius) * Uses 0.8x of the spacing multiplier * * @param baseSize - Base size in pixels * @param spacingMultiplier - Multiplier from design tokens * @returns Responsive size with subtle scaling * * @example * const borderWidth = calculateResponsiveSizeSubtle(2, spacingMultiplier); // 2 → 2 (small tablets) */ export declare const calculateResponsiveSizeSubtle: (baseSize: number, spacingMultiplier: number) => number; /** * Calculate responsive line height from font size * Standard 1.5x ratio for readability * * @param fontSize - Font size in pixels * @param spacingMultiplier - Multiplier from design tokens * @returns Line height in pixels * * @example * const lineHeight = calculateLineHeight(16, spacingMultiplier); // 24 → 20 */ export declare const calculateLineHeight: (fontSize: number, spacingMultiplier: number) => number; /** * Create responsive StyleSheet values * Converts an object with base sizes to responsive sizes * * @param baseStyles - Object with base style values * @param spacingMultiplier - Multiplier from design tokens * @returns Responsive style values * * @example * const baseSizes = { width: 100, height: 50, padding: 16 }; * const responsiveSizes = createResponsiveSizes(baseSizes, spacingMultiplier); */ export declare const createResponsiveSizes: >(baseSizes: T, spacingMultiplier: number) => T;