"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const tslib_1 = require("tslib");

const react_1 = tslib_1.__importDefault(require("react"));

const exotic_1 = require("exotic");

const state_1 = require("@skava/state");

const utils_1 = require("@skava/utils");

const Blink_1 = tslib_1.__importDefault(require("@skava/ui/dist/components/atoms/Blink"));

const styled_1 = require("./styled");

const FLEX_CONTAINER_PROPS = Object.freeze(['flexWrap', 'direction', 'justifyContent', 'alignItems']);
const FLEX_ITEM_CSS_PROPS = Object.freeze(['order', 'grow', 'shrink', 'basis', 'align']);

function defaultRenderItem(props) {
  const {
    item
  } = props;
  return react_1.default.createElement(styled_1.ItemPlaceholder, null, item);
}

exports.defaultRenderItem = defaultRenderItem;

function defaultRenderList(props) {
  const {
    list,
    shouldAdapt,
    gridGap,
    direction,
    renderItem
  } = props,
        remainingProps = tslib_1.__rest(props, ["list", "shouldAdapt", "gridGap", "direction", "renderItem"]);

  const containerProps = utils_1.keep(remainingProps, FLEX_CONTAINER_PROPS);
  const {
    flexWrap
  } = containerProps;
  const currentDeviceName = state_1.application.deviceType;
  const columnCount = remainingProps[currentDeviceName + 'Column'];
  const itemWidth = shouldAdapt ? 'auto' : 100 / columnCount + '%';
  const flexItemCSSProps = utils_1.keep(remainingProps, FLEX_ITEM_CSS_PROPS);
  const grow = shouldAdapt === true && flexWrap === 'wrap' ? 1 : 0;
  const itemProps = Object.assign({
    itemWidth,
    grow,
    gridGap,
    direction,
    shouldAdapt
  }, flexItemCSSProps);
  const view = exotic_1.isArray(list) ? list.map((item, index) => {
    return react_1.default.createElement(styled_1.FlexBoxItem, Object.assign({
      key: index
    }, itemProps), renderItem(Object.assign({
      index,
      item
    }, remainingProps)));
  }) : react_1.default.createElement(Blink_1.default, null, "There is no item to load!");
  return react_1.default.createElement(styled_1.FlexBoxContainer, Object.assign({
    direction: direction,
    flexWrap: flexWrap
  }, containerProps), view);
}

exports.defaultRenderList = defaultRenderList;

function defaultRenderWrapper(props) {
  const {
    className,
    children
  } = props;
  return react_1.default.createElement(styled_1.FlexBoxWrapper, {
    className: className
  }, children);
}

exports.defaultRenderWrapper = defaultRenderWrapper;