var _excluded = ["direction", "wrap", "justify", "align", "gutter", "style", "className", "children"];

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); }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import React, { useContext, useMemo } from 'react';
import clsx from 'clsx';
import FlexContext from './FlexContext';
import ConfigProviderContext from '../config-provider/ConfigProviderContext';

var Flex = function Flex(props) {
  var direction = props.direction,
      wrap = props.wrap,
      justify = props.justify,
      align = props.align,
      gutter = props.gutter,
      style = props.style,
      className = props.className,
      children = props.children,
      rest = _objectWithoutPropertiesLoose(props, _excluded);

  var _useContext = useContext(ConfigProviderContext),
      prefixCls = _useContext.prefixCls,
      createNamespace = _useContext.createNamespace;

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

  var getGutter = useMemo(function () {
    return Array.isArray(gutter) ? gutter : [gutter, 0];
  }, [gutter]);

  var rowStyle = _extends({}, getGutter[0] > 0 ? {
    marginLeft: getGutter[0] / -2,
    marginRight: getGutter[0] / -2
  } : {}, getGutter[1] > 0 ? {
    marginTop: getGutter[1] / -2,
    marginBottom: getGutter[1] / 2
  } : {}, style);

  var wrapCls = clsx(className, bem([direction, wrap, justify ? "justify-" + justify : false, align ? "align-" + align : false]));
  return /*#__PURE__*/React.createElement(FlexContext.Provider, {
    value: {
      gutter: getGutter
    }
  }, /*#__PURE__*/React.createElement("div", _extends({
    className: wrapCls,
    style: rowStyle
  }, rest), children));
};

Flex.defaultProps = {
  gutter: 0
};
export default Flex;