import { ReactNode } from 'react'; /** * Responsive breakpoint values for grid columns */ export interface ResponsiveColumns { /** Extra small devices (mobile) */ xs?: number; /** Small devices (tablets) */ sm?: number; /** Medium devices (small laptops) */ md?: number; /** Large devices (desktops) */ lg?: number; /** Extra large devices (large desktops) */ xl?: number; } /** * Gap size options */ export type GapSize = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl'; /** * Alignment options for grid items */ export type AlignItems = 'start' | 'center' | 'end' | 'stretch'; /** * Justify content options */ export type JustifyContent = 'start' | 'center' | 'end' | 'space-between' | 'space-around'; /** * Props for the Grid component */ export interface GridProps { /** Grid items */ children: ReactNode; /** Number of columns (responsive object or fixed number) */ columns?: number | ResponsiveColumns; /** Gap between items */ gap?: GapSize; /** Alignment of items within grid cells */ align?: AlignItems; /** Justify content distribution */ justify?: JustifyContent; /** Use auto-fit for responsive columns */ autoFit?: boolean; /** Minimum column width when using autoFit */ minColumnWidth?: string; /** Additional CSS classes */ className?: string; /** Test ID (deprecated, use dataTestId) */ 'data-testid'?: string; /** Test identifier for automated testing */ dataTestId?: string; /** Data identifier for ib-ui compatibility */ dataId?: string; } /** * Props for the Grid.Item component */ export interface GridItemProps { /** Grid item content */ children: ReactNode; /** Column span */ colSpan?: number | ResponsiveColumns; /** Row span */ rowSpan?: number; /** Additional CSS classes */ className?: string; /** Test ID (deprecated, use dataTestId) */ 'data-testid'?: string; /** Test identifier for automated testing */ dataTestId?: string; /** Data identifier for ib-ui compatibility */ dataId?: string; } //# sourceMappingURL=Grid.types.d.ts.map