import React from "react";
import { connect } from "../../../redux";
import { set } from "dot-prop-immutable";
import { i18n } from '@fishx/i18n';
import { getActiveElementWithChildren } from "../../../selectors";
import { SimpleForm as Form, Input } from '@whalecloud/fdx';
import { toolFormAttr } from "../../../utils";
var itemKey = 'data.settings';
var defaultHeight = {
  height: {
    value: '100%'
  }
};

var HeightSetting = function HeightSetting(props) {
  var element = props.element,
      updateElement = props.updateElement;
  var _element$data = element.data;
  _element$data = _element$data === void 0 ? {} : _element$data;
  var _element$data$setting = _element$data.settings,
      settings = _element$data$setting === void 0 ? {} : _element$data$setting;
  var _settings$height = settings.height,
      height = _settings$height === void 0 ? defaultHeight : _settings$height;

  var onFormChange = function onFormChange(obj) {
    Object.keys(obj).forEach(function (key) {
      var propName = "".concat(itemKey, ".").concat(key);
      var value = {
        value: obj[key]
      };
      var newElement = set(element, propName, value);
      updateElement({
        element: newElement
      });
    });
  };

  return /*#__PURE__*/React.createElement(Form, Object.assign({}, toolFormAttr, {
    initialValues: {
      height: height.value
    },
    onValuesChange: onFormChange
  }), /*#__PURE__*/React.createElement(Form.Item, {
    label: i18n('PAGEBUIDER_SETTINGS_HEIGHT'),
    name: "height"
  }, /*#__PURE__*/React.createElement(Input, null)));
};

var mapDispatchToProps = function mapDispatchToProps(dispatch) {
  return {
    updateElement: function updateElement(payload) {
      dispatch({
        type: 'appBuilder/updateAndFlattenElement',
        payload: payload
      });
    }
  };
};

export default connect(function (state) {
  return {
    element: getActiveElementWithChildren(state)
  };
}, mapDispatchToProps)(HeightSetting);
//# sourceMappingURL=HeightSetting.js.map