@parkassist/pa-ui-library/dist/components/CardGrid/index.js

INX Platform elements

import { jsx as _jsx } from "react/jsx-runtime";
import React from 'react';
import Grid from '@mui/material/Unstable_Grid2';
import { ThemeProvider, createTheme } from '@mui/material/styles';
import { Card } from "../Card";
const defaultBreakpoints = {
  laptop: 1280,
  tablet: 720,
  mobile: 0,
  desktop: 1440
};
export function CardGrid({
  items,
  width = '100%',
  height,
  responsiveBreakpoints = defaultBreakpoints
}) {
  return _jsx(ThemeProvider, {
    theme: createTheme({
      breakpoints: {
        values: responsiveBreakpoints
      }
    }),
    children: _jsx(Grid, {
      width: width,
      height: height,
      container: true,
      spacing: {
        mobile: 1,
        tablet: 2,
        laptop: 3
      },
      children: items.map((item, index) => {
        return _jsx(Grid, {
          mobile: 12,
          tablet: 6,
          laptop: 4,
          children: _jsx(Card, Object.assign({}, item))
        }, index);
      })
    })
  });
}