import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import React from 'react';
import styled from 'styled-components';
import { ElementRoot } from "../../../../render/components/ElementRoot";
import FormContainer from "./FormContainer";
import FormAppContainer from "./FormAppContainer";
var FormStyle = /*#__PURE__*/styled('div', {
  target: "es70mh20",
  label: "FormStyle"
})({
  position: 'relative',
  color: '#666',
  boxSizing: 'border-box'
});

var Form = function Form(props) {
  var element = props.element,
      buildMode = props.buildMode;
  var id = element.id;
  return /*#__PURE__*/React.createElement(FormStyle, {
    id: id,
    style: {
      position: 'relative'
    }
  }, /*#__PURE__*/React.createElement(ElementRoot, {
    element: element
  }, function (_ref) {
    var elementStyle = _ref.elementStyle,
        elementAttributes = _ref.elementAttributes,
        customClasses = _ref.customClasses,
        combineClassNames = _ref.combineClassNames;

    if (buildMode === 'H5App') {
      return /*#__PURE__*/React.createElement(FormAppContainer, {
        elementId: id,
        elementStyle: elementStyle,
        elementAttributes: elementAttributes,
        customClasses: ['webiny-pb-layout-form webiny-pb-base-page-element-style'].concat(_toConsumableArray(customClasses)),
        combineClassNames: combineClassNames
      });
    }

    return /*#__PURE__*/React.createElement(FormContainer, {
      elementId: id,
      elementStyle: elementStyle,
      elementAttributes: elementAttributes,
      customClasses: ['webiny-pb-layout-form webiny-pb-base-page-element-style'].concat(_toConsumableArray(customClasses)),
      combineClassNames: combineClassNames
    });
  }));
};

export default /*#__PURE__*/React.memo(Form);
//# sourceMappingURL=Form.js.map