tuiuiu.js 0.1.1 → 0.1.4-next.64ff654

package/dist/components/grid.js

@@ -1,719 +0,0 @@
-/**
- * Grid Layout System
- *
- * CSS Grid-inspired layout for terminal UIs.
- * Supports:
- * - Template-based grid definition (rows/columns)
- * - Named areas
- * - Gap control
- * - Auto-placement
- * - Span across cells
- * - Alignment (justify/align items)
- *
- * @example
- * ```typescript
- * Grid({
- *   columns: '1fr 2fr 1fr',
- *   rows: 'auto 1fr auto',
- *   gap: 1,
- *   areas: `
- *     "header header header"
- *     "nav    main   aside"
- *     "footer footer footer"
- *   `,
- * },
- *   GridItem({ area: 'header' }, Text({}, 'Header')),
- *   GridItem({ area: 'nav' }, Text({}, 'Nav')),
- *   GridItem({ area: 'main' }, Text({}, 'Main')),
- *   GridItem({ area: 'aside' }, Text({}, 'Aside')),
- *   GridItem({ area: 'footer' }, Text({}, 'Footer'))
- * )
- * ```
- */
-import { Box } from '../primitives/index.js';
-// =============================================================================
-// Track Parsing
-// =============================================================================
-/**
- * Parse a track size string into structured format
- */
-export function parseTrackSize(size) {
-    if (typeof size === 'number') {
-        return { type: 'fixed', value: size };
-    }
-    if (size === 'auto') {
-        return { type: 'auto', value: 0 };
-    }
-    if (size === 'min-content') {
-        return { type: 'min-content', value: 0 };
-    }
-    if (size === 'max-content') {
-        return { type: 'max-content', value: 0 };
-    }
-    // Check for pure numeric string (fixed size)
-    const numericMatch = size.match(/^(\d+(?:\.\d+)?)$/);
-    if (numericMatch) {
-        return { type: 'fixed', value: parseFloat(numericMatch[1]) };
-    }
-    // Check for fr unit
-    const frMatch = size.match(/^(\d+(?:\.\d+)?)fr$/);
-    if (frMatch) {
-        return { type: 'fr', value: parseFloat(frMatch[1]) };
-    }
-    // Check for minmax - allow optional spaces around comma
-    const minmaxMatch = size.match(/^minmax\(\s*([^,]+?)\s*,\s*([^)]+?)\s*\)$/);
-    if (minmaxMatch) {
-        const minTrack = parseTrackSize(minmaxMatch[1].trim());
-        const maxTrack = parseTrackSize(minmaxMatch[2].trim());
-        return {
-            type: 'minmax',
-            value: 0,
-            min: minTrack.type === 'fixed' ? minTrack.value : 0,
-            max: maxTrack.type === 'fixed' ? maxTrack.value : Infinity,
-        };
-    }
-    // Default to auto
-    return { type: 'auto', value: 0 };
-}
-/**
- * Parse track definition string into array
- * e.g., '1fr 2fr 1fr' -> [{ type: 'fr', value: 1 }, ...]
- */
-export function parseTrackDefinition(definition) {
-    if (Array.isArray(definition)) {
-        return definition.map(parseTrackSize);
-    }
-    // Handle repeat() function
-    const repeatMatch = definition.match(/repeat\((\d+),\s*([^)]+)\)/);
-    if (repeatMatch) {
-        const count = parseInt(repeatMatch[1], 10);
-        const trackDef = repeatMatch[2].trim();
-        const parsed = parseTrackSize(trackDef);
-        const result = [];
-        for (let i = 0; i < count; i++) {
-            result.push({ ...parsed });
-        }
-        // Replace repeat() with expansion and continue parsing
-        const expanded = definition.replace(/repeat\(\d+,\s*[^)]+\)/, result.map(() => trackDef).join(' '));
-        return parseTrackDefinition(expanded);
-    }
-    // Split by whitespace
-    const parts = definition.trim().split(/\s+/);
-    return parts.map((part) => parseTrackSize(part));
-}
-/**
- * Parse grid-template-areas string
- */
-export function parseGridAreas(areasTemplate) {
-    const areas = new Map();
-    const rows = areasTemplate
-        .trim()
-        .split('\n')
-        .map((row) => row
-        .trim()
-        .replace(/^["']|["']$/g, '')
-        .split(/\s+/));
-    // Track area positions
-    const areaPositions = new Map();
-    for (let rowIndex = 0; rowIndex < rows.length; rowIndex++) {
-        const row = rows[rowIndex];
-        for (let colIndex = 0; colIndex < row.length; colIndex++) {
-            const name = row[colIndex];
-            if (name === '.')
-                continue; // Empty cell
-            const existing = areaPositions.get(name);
-            if (existing) {
-                existing.minRow = Math.min(existing.minRow, rowIndex);
-                existing.maxRow = Math.max(existing.maxRow, rowIndex);
-                existing.minCol = Math.min(existing.minCol, colIndex);
-                existing.maxCol = Math.max(existing.maxCol, colIndex);
-            }
-            else {
-                areaPositions.set(name, {
-                    minRow: rowIndex,
-                    maxRow: rowIndex,
-                    minCol: colIndex,
-                    maxCol: colIndex,
-                });
-            }
-        }
-    }
-    // Convert to GridArea (1-based indices)
-    for (const [name, pos] of areaPositions) {
-        areas.set(name, {
-            name,
-            rowStart: pos.minRow + 1,
-            rowEnd: pos.maxRow + 2,
-            colStart: pos.minCol + 1,
-            colEnd: pos.maxCol + 2,
-        });
-    }
-    return areas;
-}
-// =============================================================================
-// Track Size Calculation
-// =============================================================================
-/**
- * Calculate track sizes given available space
- */
-export function calculateTrackSizes(tracks, availableSpace, gap, contentSizes) {
-    const sizes = new Array(tracks.length).fill(0);
-    const totalGaps = Math.max(0, tracks.length - 1) * gap;
-    let remainingSpace = availableSpace - totalGaps;
-    let totalFr = 0;
-    // First pass: calculate fixed and content-based sizes
-    for (let i = 0; i < tracks.length; i++) {
-        const track = tracks[i];
-        switch (track.type) {
-            case 'fixed':
-                sizes[i] = track.value;
-                remainingSpace -= track.value;
-                break;
-            case 'auto':
-            case 'min-content':
-            case 'max-content':
-                sizes[i] = contentSizes[i] || 0;
-                remainingSpace -= sizes[i];
-                break;
-            case 'minmax':
-                // Start with minimum
-                sizes[i] = track.min || 0;
-                remainingSpace -= sizes[i];
-                break;
-            case 'fr':
-                totalFr += track.value;
-                break;
-        }
-    }
-    // Second pass: distribute remaining space to fr units
-    if (totalFr > 0 && remainingSpace > 0) {
-        const frSize = remainingSpace / totalFr;
-        for (let i = 0; i < tracks.length; i++) {
-            const track = tracks[i];
-            if (track.type === 'fr') {
-                sizes[i] = Math.floor(frSize * track.value);
-            }
-        }
-    }
-    // Third pass: handle minmax expansion
-    for (let i = 0; i < tracks.length; i++) {
-        const track = tracks[i];
-        if (track.type === 'minmax' && track.max !== undefined) {
-            const maxSize = track.max === Infinity ? availableSpace : track.max;
-            // Could expand minmax tracks if there's leftover space
-            // For simplicity, we'll leave them at their minimum for now
-            sizes[i] = Math.min(Math.max(sizes[i], track.min || 0), maxSize);
-        }
-    }
-    // Ensure no negative sizes
-    return sizes.map((s) => Math.max(0, s));
-}
-// =============================================================================
-// Item Placement
-// =============================================================================
-/** Parse grid-column or grid-row shorthand */
-function parseLineSpec(spec, defaultStart, trackCount) {
-    if (spec === undefined) {
-        return { start: defaultStart, end: defaultStart + 1 };
-    }
-    if (typeof spec === 'number') {
-        return { start: spec, end: spec + 1 };
-    }
-    // Handle 'span N'
-    const spanMatch = spec.match(/^span\s+(\d+)$/);
-    if (spanMatch) {
-        const span = parseInt(spanMatch[1], 10);
-        return { start: defaultStart, end: defaultStart + span };
-    }
-    // Handle 'start / end'
-    const rangeMatch = spec.match(/^(\d+)\s*\/\s*(\d+)$/);
-    if (rangeMatch) {
-        return {
-            start: parseInt(rangeMatch[1], 10),
-            end: parseInt(rangeMatch[2], 10),
-        };
-    }
-    // Handle 'start / span N'
-    const startSpanMatch = spec.match(/^(\d+)\s*\/\s*span\s+(\d+)$/);
-    if (startSpanMatch) {
-        const start = parseInt(startSpanMatch[1], 10);
-        const span = parseInt(startSpanMatch[2], 10);
-        return { start, end: start + span };
-    }
-    return { start: defaultStart, end: defaultStart + 1 };
-}
-/**
- * Calculate cell position for a grid item
- */
-export function calculateCellPosition(options, areas, columnCount, rowCount, autoPlacement) {
-    // Check for named area
-    if (options.area) {
-        const area = areas.get(options.area);
-        if (area) {
-            return {
-                row: area.rowStart,
-                column: area.colStart,
-                rowSpan: area.rowEnd - area.rowStart,
-                columnSpan: area.colEnd - area.colStart,
-            };
-        }
-    }
-    // Parse column spec
-    const colSpec = parseLineSpec(options.column ?? options.columnStart, autoPlacement.column, columnCount);
-    if (options.columnEnd !== undefined) {
-        colSpec.end = options.columnEnd;
-    }
-    if (options.columnSpan !== undefined) {
-        colSpec.end = colSpec.start + options.columnSpan;
-    }
-    // Parse row spec
-    const rowSpec = parseLineSpec(options.row ?? options.rowStart, autoPlacement.row, rowCount);
-    if (options.rowEnd !== undefined) {
-        rowSpec.end = options.rowEnd;
-    }
-    if (options.rowSpan !== undefined) {
-        rowSpec.end = rowSpec.start + options.rowSpan;
-    }
-    return {
-        row: rowSpec.start,
-        column: colSpec.start,
-        rowSpan: rowSpec.end - rowSpec.start,
-        columnSpan: colSpec.end - colSpec.start,
-    };
-}
-// =============================================================================
-// Grid Layout Calculation
-// =============================================================================
-/**
- * Calculate complete grid layout
- */
-export function calculateGridLayout(options, items, containerWidth, containerHeight) {
-    // Parse column and row definitions
-    const columns = options.columns
-        ? parseTrackDefinition(options.columns)
-        : [{ type: 'fr', value: 1 }];
-    const rows = options.rows
-        ? parseTrackDefinition(options.rows)
-        : items.map(() => ({ type: 'auto', value: 0 }));
-    // Parse areas
-    const areas = options.areas ? parseGridAreas(options.areas) : new Map();
-    // Calculate gaps
-    let rowGap = options.rowGap ?? 0;
-    let columnGap = options.columnGap ?? 0;
-    if (options.gap !== undefined) {
-        if (Array.isArray(options.gap)) {
-            [rowGap, columnGap] = options.gap;
-        }
-        else {
-            rowGap = columnGap = options.gap;
-        }
-    }
-    // Adjust for border/padding
-    const borderOffset = options.border ? 2 : 0;
-    const paddingOffset = (options.padding ?? 0) * 2;
-    const effectiveWidth = containerWidth - borderOffset - paddingOffset;
-    // Calculate column sizes (content sizes not yet known, use 0)
-    const contentColSizes = new Array(columns.length).fill(0);
-    const columnSizes = calculateTrackSizes(columns, effectiveWidth, columnGap, contentColSizes);
-    // Auto-placement cursor
-    const autoPlacement = { row: 1, column: 1 };
-    const isDense = options.autoFlow?.includes('dense') ?? false;
-    const isColumnFlow = options.autoFlow?.includes('column') ?? false;
-    // Track occupied cells
-    const occupied = new Set();
-    // Place items
-    const cells = new Map();
-    // Sort by order if specified
-    const sortedItems = [...items].sort((a, b) => (a.options.order ?? 0) - (b.options.order ?? 0));
-    // First pass: place explicitly positioned items
-    for (const item of sortedItems) {
-        if (item.options.area ||
-            item.options.column !== undefined ||
-            item.options.row !== undefined ||
-            item.options.columnStart !== undefined ||
-            item.options.rowStart !== undefined) {
-            const position = calculateCellPosition(item.options, areas, columns.length, rows.length, autoPlacement);
-            cells.set(item.node, position);
-            // Mark cells as occupied
-            for (let r = position.row; r < position.row + position.rowSpan; r++) {
-                for (let c = position.column; c < position.column + position.columnSpan; c++) {
-                    occupied.add(`${r},${c}`);
-                }
-            }
-        }
-    }
-    // Second pass: auto-place remaining items
-    for (const item of sortedItems) {
-        if (cells.has(item.node))
-            continue;
-        // Find next available position
-        if (isDense) {
-            // Dense: start from beginning each time
-            autoPlacement.row = 1;
-            autoPlacement.column = 1;
-        }
-        // Find first available cell
-        let placed = false;
-        const maxRows = Math.max(rows.length, 100); // Limit search
-        const maxCols = columns.length;
-        outer: for (let r = autoPlacement.row; r <= maxRows && !placed; r++) {
-            const startCol = r === autoPlacement.row ? autoPlacement.column : 1;
-            for (let c = startCol; c <= maxCols && !placed; c++) {
-                if (!occupied.has(`${r},${c}`)) {
-                    cells.set(item.node, {
-                        row: r,
-                        column: c,
-                        rowSpan: 1,
-                        columnSpan: 1,
-                    });
-                    occupied.add(`${r},${c}`);
-                    // Update cursor
-                    if (isColumnFlow) {
-                        autoPlacement.row = r + 1;
-                        if (autoPlacement.row > maxRows) {
-                            autoPlacement.row = 1;
-                            autoPlacement.column = c + 1;
-                        }
-                    }
-                    else {
-                        autoPlacement.column = c + 1;
-                        if (autoPlacement.column > maxCols) {
-                            autoPlacement.column = 1;
-                            autoPlacement.row = r + 1;
-                        }
-                    }
-                    placed = true;
-                    break outer;
-                }
-            }
-        }
-    }
-    // Determine actual row count
-    let maxRow = rows.length;
-    for (const pos of cells.values()) {
-        maxRow = Math.max(maxRow, pos.row + pos.rowSpan - 1);
-    }
-    // Extend rows array if needed
-    const autoRowTrack = options.autoRows
-        ? parseTrackSize(options.autoRows)
-        : { type: 'auto', value: 0 };
-    while (rows.length < maxRow) {
-        rows.push({ ...autoRowTrack });
-    }
-    // Calculate row sizes
-    const contentRowSizes = new Array(rows.length).fill(1); // Default to 1 for now
-    const effectiveHeight = containerHeight ? containerHeight - borderOffset - paddingOffset : 100;
-    const rowSizes = calculateTrackSizes(rows, effectiveHeight, rowGap, contentRowSizes);
-    return {
-        columnSizes,
-        rowSizes,
-        cells,
-        areas,
-    };
-}
-// =============================================================================
-// Grid Components
-// =============================================================================
-/** Grid item data attached to nodes */
-const gridItemData = new WeakMap();
-/**
- * Grid container component
- */
-export function Grid(options, ...children) {
-    const validChildren = children.filter((c) => c !== null);
-    // Extract item options
-    const items = validChildren.map((node) => ({
-        node,
-        options: gridItemData.get(node) || {},
-    }));
-    // Calculate layout
-    const containerWidth = options.width ?? 80;
-    const layout = calculateGridLayout(options, items, containerWidth, options.height);
-    // Calculate gaps
-    let rowGap = options.rowGap ?? 0;
-    let columnGap = options.columnGap ?? 0;
-    if (options.gap !== undefined) {
-        if (Array.isArray(options.gap)) {
-            [rowGap, columnGap] = options.gap;
-        }
-        else {
-            rowGap = columnGap = options.gap;
-        }
-    }
-    // Build positioned children
-    const rows = [];
-    // Group items by row
-    const itemsByRow = new Map();
-    for (const [node, position] of layout.cells) {
-        for (let r = position.row; r < position.row + position.rowSpan; r++) {
-            if (!itemsByRow.has(r)) {
-                itemsByRow.set(r, []);
-            }
-            // Only add to first row of span
-            if (r === position.row) {
-                itemsByRow.get(r).push({ node, position });
-            }
-        }
-    }
-    // Create rows
-    const rowIndices = [...itemsByRow.keys()].sort((a, b) => a - b);
-    for (let i = 0; i < rowIndices.length; i++) {
-        const rowIndex = rowIndices[i];
-        const rowItems = itemsByRow.get(rowIndex) || [];
-        const rowHeight = layout.rowSizes[rowIndex - 1] || 1;
-        // Sort items by column
-        rowItems.sort((a, b) => a.position.column - b.position.column);
-        // Create cells for this row
-        const cells = [];
-        let currentCol = 1;
-        for (const { node, position } of rowItems) {
-            const itemOptions = gridItemData.get(node) || {};
-            // Add spacer for gap before this cell
-            if (position.column > currentCol) {
-                const gapCols = position.column - currentCol;
-                let spacerWidth = 0;
-                for (let c = currentCol; c < position.column; c++) {
-                    spacerWidth += layout.columnSizes[c - 1] || 0;
-                    if (c > currentCol)
-                        spacerWidth += columnGap;
-                }
-                if (spacerWidth > 0) {
-                    cells.push(Box({ width: spacerWidth }));
-                }
-            }
-            // Calculate cell width
-            let cellWidth = 0;
-            for (let c = position.column; c < position.column + position.columnSpan; c++) {
-                cellWidth += layout.columnSizes[c - 1] || 0;
-                if (c > position.column)
-                    cellWidth += columnGap;
-            }
-            // Calculate cell height
-            let cellHeight = 0;
-            for (let r = position.row; r < position.row + position.rowSpan; r++) {
-                cellHeight += layout.rowSizes[r - 1] || 0;
-                if (r > position.row)
-                    cellHeight += rowGap;
-            }
-            // Apply alignment
-            const justifySelf = itemOptions.justifySelf ?? options.justifyItems ?? 'stretch';
-            const alignSelf = itemOptions.alignSelf ?? options.alignItems ?? 'stretch';
-            let justifyContent;
-            let alignItems;
-            switch (justifySelf) {
-                case 'start':
-                    justifyContent = 'flex-start';
-                    break;
-                case 'end':
-                    justifyContent = 'flex-end';
-                    break;
-                case 'center':
-                    justifyContent = 'center';
-                    break;
-                case 'stretch':
-                default:
-                    justifyContent = 'flex-start';
-                    break;
-            }
-            switch (alignSelf) {
-                case 'start':
-                    alignItems = 'flex-start';
-                    break;
-                case 'end':
-                    alignItems = 'flex-end';
-                    break;
-                case 'center':
-                    alignItems = 'center';
-                    break;
-                case 'stretch':
-                default:
-                    alignItems = 'flex-start';
-                    break;
-            }
-            cells.push(Box({
-                width: cellWidth,
-                height: cellHeight,
-                justifyContent,
-                alignItems,
-            }, node));
-            currentCol = position.column + position.columnSpan;
-        }
-        // Add row gap if not first row
-        if (i > 0 && rowGap > 0) {
-            rows.push(Box({ height: rowGap }));
-        }
-        rows.push(Box({
-            flexDirection: 'row',
-            height: rowHeight,
-        }, ...cells));
-    }
-    // Wrap in container
-    const containerStyle = {
-        flexDirection: 'column',
-        width: options.width,
-        height: options.height,
-        padding: options.padding,
-    };
-    if (options.border) {
-        containerStyle.borderStyle = options.borderStyle ?? 'single';
-        containerStyle.borderColor = options.borderColor;
-    }
-    return Box(containerStyle, ...rows);
-}
-/**
- * Grid item wrapper
- */
-export function GridItem(options, ...children) {
-    const node = Box({}, ...children.filter((c) => c !== null));
-    gridItemData.set(node, options);
-    return node;
-}
-// =============================================================================
-// Convenience Components
-// =============================================================================
-/**
- * Simple row grid (equal columns)
- */
-export function GridRow(options, ...children) {
-    const validChildren = children.filter((c) => c !== null);
-    const columnCount = options.columnCount ?? validChildren.length;
-    const columns = Array(columnCount).fill('1fr').join(' ');
-    return Grid({ ...options, columns }, ...validChildren);
-}
-/**
- * Simple column grid (equal rows)
- */
-export function GridColumn(options, ...children) {
-    const validChildren = children.filter((c) => c !== null);
-    const rowCount = options.rowCount ?? validChildren.length;
-    const rows = Array(rowCount).fill('1fr').join(' ');
-    return Grid({ ...options, columns: '1fr', rows }, ...validChildren);
-}
-/**
- * Auto-fitting grid (responsive columns)
- */
-export function AutoGrid(options, ...children) {
-    const containerWidth = options.width ?? 80;
-    const gap = typeof options.gap === 'number' ? options.gap : options.gap?.[1] ?? 0;
-    const columnCount = Math.floor((containerWidth + gap) / (options.minColumnWidth + gap));
-    const columns = Array(Math.max(1, columnCount)).fill('1fr').join(' ');
-    return Grid({ ...options, columns }, ...children);
-}
-/**
- * Dashboard-style grid with named areas
- */
-export function DashboardGrid(options, areas) {
-    const { width = 80, height, gap = 0, headerHeight = 3, footerHeight = 1, sidebarWidth = 20, border, borderStyle, borderColor, } = options;
-    const hasHeader = areas.header !== undefined;
-    const hasSidebar = areas.sidebar !== undefined;
-    const hasFooter = areas.footer !== undefined;
-    // Build columns
-    const columns = hasSidebar ? `${sidebarWidth} 1fr` : '1fr';
-    // Build rows
-    const rowParts = [];
-    if (hasHeader)
-        rowParts.push(`${headerHeight}`);
-    rowParts.push('1fr');
-    if (hasFooter)
-        rowParts.push(`${footerHeight}`);
-    const rows = rowParts.join(' ');
-    // Build areas template
-    const areaRows = [];
-    if (hasHeader) {
-        areaRows.push(hasSidebar ? '"header header"' : '"header"');
-    }
-    areaRows.push(hasSidebar ? '"sidebar main"' : '"main"');
-    if (hasFooter) {
-        areaRows.push(hasSidebar ? '"footer footer"' : '"footer"');
-    }
-    const areasTemplate = areaRows.join('\n');
-    const children = [];
-    if (areas.header) {
-        children.push(GridItem({ area: 'header' }, areas.header));
-    }
-    if (areas.sidebar) {
-        children.push(GridItem({ area: 'sidebar' }, areas.sidebar));
-    }
-    children.push(GridItem({ area: 'main' }, areas.main));
-    if (areas.footer) {
-        children.push(GridItem({ area: 'footer' }, areas.footer));
-    }
-    return Grid({
-        width,
-        height,
-        columns,
-        rows,
-        areas: areasTemplate,
-        gap,
-        border,
-        borderStyle,
-        borderColor,
-    }, ...children);
-}
-/**
- * Masonry-style grid (variable height items)
- */
-export function MasonryGrid(options, ...children) {
-    const validChildren = children.filter((c) => c !== null);
-    const { columns: columnCount, gap = 0, width = 80 } = options;
-    // Track column heights
-    const columnHeights = new Array(columnCount).fill(0);
-    // Place items in shortest column
-    const placedItems = [];
-    for (const child of validChildren) {
-        // Find shortest column
-        let shortestCol = 0;
-        let shortestHeight = columnHeights[0];
-        for (let i = 1; i < columnCount; i++) {
-            if (columnHeights[i] < shortestHeight) {
-                shortestHeight = columnHeights[i];
-                shortestCol = i;
-            }
-        }
-        placedItems.push({ node: child, column: shortestCol });
-        columnHeights[shortestCol] += 1; // Assume height 1 for simplicity
-    }
-    // Build column containers
-    const columnNodes = [];
-    const columnWidth = Math.floor((width - (columnCount - 1) * gap) / columnCount);
-    for (let col = 0; col < columnCount; col++) {
-        const columnItems = placedItems.filter((item) => item.column === col).map((item) => item.node);
-        columnNodes.push(Box({
-            flexDirection: 'column',
-            width: columnWidth,
-            gap,
-        }, ...columnItems));
-    }
-    return Box({
-        flexDirection: 'row',
-        gap,
-        width,
-    }, ...columnNodes);
-}
-// =============================================================================
-// Utility Functions
-// =============================================================================
-/**
- * Create a repeat track definition
- */
-export function repeat(count, track) {
-    if (typeof track === 'number') {
-        return Array(count).fill(`${track}`).join(' ');
-    }
-    return Array(count).fill(track).join(' ');
-}
-/**
- * Create a minmax track
- */
-export function minmax(min, max) {
-    const minStr = typeof min === 'number' ? `${min}` : min;
-    const maxStr = typeof max === 'number' ? `${max}` : max;
-    return `minmax(${minStr},${maxStr})`;
-}
-/**
- * Calculate grid template from areas
- */
-export function gridAreasToTemplate(areas) {
-    return areas.map((row) => `"${row.join(' ')}"`).join('\n');
-}
-//# sourceMappingURL=grid.js.map