import React from 'react';
import { Flexbox, List, Media } from '../../../../..';
import { ExpandItem } from './ExpandItem';
export var ExpandItems = function ExpandItems(_ref) {
  var items = _ref.items;
  return React.createElement(React.Fragment, null, React.createElement(Media, {
    query: function query(t) {
      return t.media.lessThan(t.breakpoints.md);
    }
  }, React.createElement(List, null, items === null || items === void 0 ? void 0 : items.map(function (item, index) {
    return React.createElement(ExpandItem, {
      key: "expandItem_mobile_".concat(index + 1),
      item: item,
      mobileItem: true
    });
  }))), React.createElement(Media, {
    query: function query(t) {
      return t.media.greaterThan(t.breakpoints.md);
    }
  }, React.createElement(Flexbox, {
    container: true,
    wrap: "wrap",
    gap: 10,
    as: List
  }, items === null || items === void 0 ? void 0 : items.map(function (item, index) {
    return React.createElement(ExpandItem, {
      key: "expandItem_desktop_".concat(index + 1),
      item: item
    });
  }))));
};