function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React from 'react';
import clsx from 'clsx';
import ConfigProviderContext from '../config-provider/ConfigProviderContext';

var formatGap = function formatGap(gap) {
  return typeof gap === 'number' ? gap + "px" : gap;
};

var Space = function Space(props) {
  var _bem;

  var wrap = props.wrap,
      block = props.block,
      direction = props.direction,
      align = props.align,
      justify = props.justify;

  var _React$useContext = React.useContext(ConfigProviderContext),
      prefixCls = _React$useContext.prefixCls,
      createNamespace = _React$useContext.createNamespace;

  var _createNamespace = createNamespace('space', prefixCls),
      bem = _createNamespace[0];

  var style = React.useMemo(function () {
    if (props.gap) {
      if (Array.isArray(props.gap)) {
        var _props$gap = props.gap,
            gapH = _props$gap[0],
            gapV = _props$gap[1];
        return _extends({}, props.style, {
          '--gap-vertical': formatGap(gapV),
          '--gap-horizontal': formatGap(gapH)
        });
      }

      return _extends({}, props.style, {
        '--gap': formatGap(props.gap)
      });
    }

    return props.style;
  }, [props.style, props.gap]);
  return /*#__PURE__*/React.createElement("div", {
    className: clsx(props.className, bem((_bem = {
      wrap: wrap,
      block: block
    }, _bem["" + direction] = !!direction, _bem["align-" + align] = !!align, _bem["justify-" + justify] = !!justify, _bem))),
    style: style,
    onClick: props.onClick
  }, React.Children.map(props.children, function (child) {
    return child !== null && child !== undefined && /*#__PURE__*/React.createElement("div", {
      className: clsx(bem('item'))
    }, child);
  }));
};

Space.defaultProps = {
  direction: 'horizontal'
};
export default Space;