import { Axis } from '@judo/model-api';
/** Default column span for visual elements (from EMF meta-model) */
export declare const DEFAULT_COL = 4;
/** Full grid width (12-column system) */
export declare const FULL_GRID_WIDTH = 12;
/**
 * Grid size configuration for responsive breakpoints.
 * - xs: extra small screens (mobile)
 * - sm: small screens (tablets)
 * - md: medium screens and above (desktop)
 */
export interface GridSize {
    xs: number;
    sm: number;
    md?: number;
}
/**
 * Calculate the scaled size for a child element based on parent's column span.
 *
 * **Legacy calculateSize logic:**
 * - If parent spans full 12 columns: use child's col value as-is
 * - If parent spans less than 12: scale proportionally (12 / parentCol) × childCol
 *
 * @param parentCol - Parent Flex container's column span (1-12)
 * @param childCol - Child element's column span (1-12)
 * @returns Calculated size (may exceed 12 if child is larger than parent)
 *
 * @example
 * ```ts
 * calculateScaledSize(12, 6); // 6  - parent full width, child uses col as-is
 * calculateScaledSize(6, 3);  // 6  - (12/6) × 3 = 6
 * calculateScaledSize(6, 6);  // 12 - (12/6) × 6 = 12 (full width)
 * calculateScaledSize(4, 2);  // 6  - (12/4) × 2 = 6
 * ```
 */
export declare function calculateScaledSize(parentCol: number, childCol: number): number;
/**
 * Calculate responsive grid size for horizontal flex layouts.
 *
 * **Responsive behavior:**
 * - xs/sm breakpoints: always full width (12 columns) for mobile/tablet
 * - md breakpoint: use calculated size for desktop
 * - Optimization: omit md property if calculated size equals 12
 *
 * @param parentCol - Parent Flex container's column span
 * @param childCol - Child element's column span
 * @returns GridSize object with responsive breakpoint configuration
 *
 * @example
 * ```ts
 * calculateHorizontalGridSize(12, 6);  // { xs: 12, sm: 12, md: 6 }
 * calculateHorizontalGridSize(6, 6);   // { xs: 12, sm: 12 } - omits md:12
 * calculateHorizontalGridSize(8, 4);   // { xs: 12, sm: 12, md: 6 }
 * ```
 */
export declare function calculateHorizontalGridSize(parentCol: number, childCol: number): GridSize;
/**
 * Calculate grid size for vertical flex layouts (Stack-based).
 *
 * **Vertical layout behavior:**
 * - Always returns full width (12 columns) for all breakpoints
 * - The `force-full-width` CSS class enforces 100% width on Stack children
 * - No md breakpoint needed since width is always 100%
 *
 * @returns GridSize object with full width at all breakpoints
 *
 * @example
 * ```ts
 * calculateVerticalGridSize(); // { xs: 12, sm: 12 }
 * ```
 */
export declare function calculateVerticalGridSize(): GridSize;
/**
 * Determine if a Flex container uses vertical layout direction.
 *
 * @param direction - Axis enum value from Flex element
 * @returns true if vertical, false if horizontal
 */
export declare function isVerticalLayout(direction?: Axis): boolean;
/**
 * Calculate grid size for a child element based on parent's layout direction.
 *
 * **Decision logic:**
 * - Vertical layouts: always full width (Stack + force-full-width CSS)
 * - Horizontal layouts: responsive sizing with calculated md breakpoint
 *
 * @param direction - Parent Flex container's direction
 * @param parentCol - Parent Flex container's column span
 * @param childCol - Child element's column span
 * @returns GridSize object with appropriate responsive configuration
 *
 * @example
 * ```ts
 * // Vertical layout - always full width
 * calculateChildGridSize('VERTICAL', 12, 6);    // { xs: 12, sm: 12 }
 * calculateChildGridSize('VERTICAL', 6, 3);     // { xs: 12, sm: 12 }
 *
 * // Horizontal layout - responsive sizing
 * calculateChildGridSize('HORIZONTAL', 12, 6);  // { xs: 12, sm: 12, md: 6 }
 * calculateChildGridSize('HORIZONTAL', 6, 3);   // { xs: 12, sm: 12, md: 6 }
 * ```
 */
export declare function calculateChildGridSize(direction: Axis | undefined, parentCol: number, childCol: number): GridSize;
//# sourceMappingURL=flex-layout.d.ts.map