import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import * as React from 'react';
import styled from "styled-components";
import { connect } from "../../redux";
import { getActiveElement, getElement } from "../../selectors";
import { Collapse } from '@whalecloud/fdx';
import { toolCollapseAttr } from "../../utils";
var Panel = Collapse.Panel;
var FormContainer = /*#__PURE__*/styled('div', {
  target: "e1e0wzup0",
  label: "FormContainer"
})({
  padding: 5
});

var PluginSettingContainer = function PluginSettingContainer(_ref) {
  var element = _ref.element,
      Components = _ref.components,
      updateElement = _ref.updateElement;
  return /*#__PURE__*/React.createElement(FormContainer, null, Components.map(function (SettingComponent, index) {
    if (!SettingComponent.title) {
      return /*#__PURE__*/React.createElement(SettingComponent, {
        element: element,
        updateElement: updateElement
      });
    }

    return /*#__PURE__*/React.createElement(Collapse, Object.assign({}, toolCollapseAttr, {
      defaultActiveKey: [index]
    }), /*#__PURE__*/React.createElement(Panel, {
      header: SettingComponent.title,
      key: "0"
    }, /*#__PURE__*/React.createElement(SettingComponent.content, null)));
  }));
};

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

export default connect(function (state) {
  var element = getActiveElement(state);
  return {
    element: _objectSpread(_objectSpread({}, element), {}, {
      elements: element && element.elements.map(function (id) {
        return getElement(state, id);
      })
    })
  };
}, mapDispatchToProps)(PluginSettingContainer);
//# sourceMappingURL=PluginSettingContainer.js.map