import { CssLength } from '@breadstone/mosaik-themes'; /** * Describes the gaps between rows and columns of a grid layout. * * When both `rows` and `columns` are specified separately, the grid * will use different gap sizes per axis. * * @example * ```ts * const gap: IGridLayoutGap = { * rows: 16, // 16px row gap * columns: '1.5rem', // 1.5rem column gap * }; * ``` * * @public */ export interface IGridLayoutGap { /** * The gap between rows in pixels (if `number`) or as a CSS length string. * * @defaultValue `0` * @public */ rows?: CssLength; /** * The gap between columns in pixels (if `number`) or as a CSS length string. * * @defaultValue `0` * @public */ columns?: CssLength; } /** * Accepted input forms for the grid `gap` property. * * | Form | Example | Meaning | * |------------------|-----------------------------------|-----------------------------------------------| * | `CssLength` | `16`, `'1rem'`, `'8px'` | Uniform gap on both axes. | * | `IGridLayoutGap` | `{ rows: 8, columns: '1.5rem' }` | Separate gap per axis. | * * @public */ export type GridLayoutGap = CssLength | IGridLayoutGap; /** * Parses a `GridLayoutGap` input into a resolved `IGridLayoutGap` * with both axes normalised to CSS length strings. * * @example * ```ts * parseGridLayoutGap(16); * // → { rows: '16px', columns: '16px' } * * parseGridLayoutGap('1rem'); * // → { rows: '1rem', columns: '1rem' } * * parseGridLayoutGap({ rows: 8, columns: '1.5rem' }); * // → { rows: '8px', columns: '1.5rem' } * ``` * * @param value - The raw gap input. * @returns An object with resolved `rows` and `columns` CSS strings. * * @throws {Error} If any axis value is invalid or negative. * * @public */ export declare function parseGridLayoutGap(value: GridLayoutGap): { rows: string; columns: string; }; //# sourceMappingURL=IGridLayoutGap.d.ts.map