Grid constructor

Grid({ Object? child, List<Object?> children = const [], Object? columns, Object? sm, Object? md, Object? lg, Object? xl, Object? rows, Object? gap, String? alignItems, String? justifyItems, String? className, Map<String, Object?> props = const {}, Map<String, Object?> style = const {}, DartStyle? dartStyle, })

Creates a grid around child content.

• columns sets the CSS grid-template-columns. Accepts integer column counts (e.g. 3), GridTemplateColumns instances (e.g. GridCols.fit(250)), or CSS string values.
• sm, md, lg, xl define responsive breakpoint overrides (accepts integers like 1, 2, 3 or GridTemplateColumns).
• rows sets the CSS grid-template-rows template.
• gap sets the CSS gap spacing between grid items (accepts numbers like 20 or '20px').
• alignItems sets the CSS align-items grid container alignment.
• justifyItems sets the CSS justify-items grid container alignment.

Implementation

Grid({
  Object? child,
  List<Object?> children = const [],
  Object? columns,
  Object? sm,
  Object? md,
  Object? lg,
  Object? xl,
  Object? rows,
  Object? gap,
  String? alignItems,
  String? justifyItems,
  String? className,
  Map<String, Object?> props = const {},
  Map<String, Object?> style = const {},
  DartStyle? dartStyle,
}) : super(
        'div',
        props: mergeComponentProps(
          props,
          className: className,
          defaultStyle: {
            'display': 'grid',
            if (columns != null)
              'grid-template-columns': _coerceGridColumns(columns),
            if (rows != null) 'grid-template-rows': cssValue(rows),
            if (gap != null) 'gap': cssValue(gap),
            if (alignItems != null) 'align-items': alignItems,
            if (justifyItems != null) 'justify-items': justifyItems,
          },
          dartStyle: DartStyle(
            sm: sm == null
                ? null
                : DartStyle(gridTemplateColumns: _coerceGridColumns(sm)),
            md: md == null
                ? null
                : DartStyle(gridTemplateColumns: _coerceGridColumns(md)),
            lg: lg == null
                ? null
                : DartStyle(gridTemplateColumns: _coerceGridColumns(lg)),
            xl: xl == null
                ? null
                : DartStyle(gridTemplateColumns: _coerceGridColumns(xl)),
          ).merge(dartStyle),
          style: style,
        ),
        children: normalizeChildren(child, children),
      );