@configuratorware/configurator-admingui 1.28.4 → 1.29.0

package/Screens/Channel/__tests/ChannelScreen.js

@@ -0,0 +1,363 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+var _enzyme = require("enzyme");
+
+var _lodash = _interopRequireDefault(require("lodash"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Api = require("../../../App/Api");
+
+var _TestHelpers = require("../../../App/TestHelpers");
+
+var _Screen = _interopRequireDefault(require("../Screen"));
+
+var _GeneralFragments = require("../../../Components/GeneralFragments");
+
+var _List = _interopRequireDefault(require("../Containers/List"));
+
+var _List2 = _interopRequireWildcard(require("../../../Components/List"));
+
+var _Table = require("material-ui/Table");
+
+var _Form = _interopRequireWildcard(require("../../../Components/Form"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+// Use the mappings instead of real API calls
+_Api.ApiSimulator.init(); // Request mapping for listing items
+
+
+_Api.ApiSimulator.addRequestMapping({
+  config: {
+    url: 'channels',
+    params: {
+      offset: 0,
+      limit: 10,
+      _language: 'en_GB'
+    }
+  },
+  response: {
+    data: {
+      metadata: {
+        totalcount: '2'
+      },
+      data: [{
+        id: 1,
+        identifier: '_default',
+        currency: {
+          id: 1,
+          iso: 'eur',
+          symbol: '€'
+        }
+      }, {
+        id: 2,
+        identifier: 'usd',
+        currency: {
+          id: 2,
+          iso: 'usd',
+          symbol: '$'
+        }
+      }]
+    }
+  }
+}); // Request mapping for adding new item
+
+
+var addItemRequest = {
+  config: {
+    url: 'channels',
+    method: 'post',
+    data: {
+      id: null,
+      identifier: 'usd2',
+      currency: 2,
+      globalDiscountPercentage: 20.5
+    }
+  },
+  response: {
+    data: {
+      id: 3,
+      identifier: 'usd2',
+      currency: {
+        id: 2,
+        iso: 'usd',
+        symbol: '$'
+      },
+      globalDiscountPercentage: 20.5
+    }
+  }
+};
+
+_Api.ApiSimulator.addRequestMapping(addItemRequest); // Request mapping for getting an item
+
+
+var getItemRequest = {
+  config: 'channels/1',
+  response: {
+    data: {
+      id: 1,
+      identifier: '_default',
+      currency: {
+        id: 1,
+        iso: 'eur',
+        symbol: '€'
+      }
+    }
+  }
+};
+
+_Api.ApiSimulator.addRequestMapping(getItemRequest);
+
+var updateItemRequest = {
+  config: {
+    url: 'channels',
+    method: 'post',
+    data: {
+      id: 1,
+      identifier: '',
+      currency: null
+    }
+  },
+  response: {
+    data: {
+      errors: [{
+        property: 'identifier',
+        invalidvalue: '',
+        message: 'This value should not be blank.'
+      }],
+      success: false,
+      code: 'validation_error'
+    }
+  },
+  error: true
+};
+
+_Api.ApiSimulator.addRequestMapping(updateItemRequest); // Request mapping for additional currency list request
+
+
+var getCurrenciesRequest = {
+  config: 'currencies',
+  response: {
+    data: {
+      metadata: {
+        totalcount: '1'
+      },
+      data: [{
+        id: 1,
+        iso: 'eur',
+        symbol: '€'
+      }]
+    }
+  }
+};
+
+_Api.ApiSimulator.addRequestMapping(getCurrenciesRequest);
+
+var ConnectedScreen = (0, _TestHelpers.initConnectedComponent)(_Screen["default"]);
+// Header columns to be shown
+var expectedHeaderColumns = ['', // checkbox
+'Identifier']; // Expected data in the list (rows[columns[]])
+
+var expectedListData = [['', '_default'], ['', 'usd']]; // Expected inputs with IDs
+
+var expectedFormInputs = {
+  identifier: 'text',
+  currency: 'select',
+  globalDiscountPercentage: 'number'
+}; // Input values for add new item
+
+var inputValues = _lodash["default"].omit(addItemRequest.config.data, 'id'); // Input values for update item
+
+
+var inputValuesUpdate = _lodash["default"].omit(updateItemRequest.config.data, 'id');
+
+var inputValuesUpdateErrors = [{
+  property: 'identifier',
+  message: "can't be blank"
+}, {
+  property: 'currency',
+  message: "can't be blank"
+}];
+describe('Channel / Screen', function () {
+  var wrapper = null;
+  it.skip('INTEGRATION - renders the headline and the list', function () {
+    wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react["default"].createElement(ConnectedScreen, null));
+    expect(wrapper.find(_GeneralFragments.Headline).length).toBe(1);
+    expect(wrapper.find(_List["default"]).length).toBe(1);
+  });
+  it.skip('INTEGRATION - mounts the List Component by default', function (done) {
+    (0, _TestHelpers.waitFor)(function () {
+      return wrapper.find(_List2["default"]).length === 1;
+    }, done);
+  });
+  it.skip('INTEGRATION - loads the correct list', function () {
+    var cols = wrapper.find(_Table.TableHeaderColumn);
+    expect(cols.length).toBe(expectedHeaderColumns.length);
+    cols.forEach(function (elem, idx) {
+      expect(elem.text()).toBe(expectedHeaderColumns[idx]);
+    });
+    var rows = wrapper.find(_Table.TableBody).find(_Table.TableRow);
+    rows.forEach(function (row, ridx) {
+      var cols = row.find(_Table.TableRowColumn);
+      cols.forEach(function (col, cidx) {
+        expect(col.text()).toBe(expectedListData[ridx][cidx]);
+      });
+    });
+  });
+  it.skip('INTEGRATION - renders the Add Item button', function () {
+    var addItemButton = wrapper.find(_List2.AddItemButton).find('button');
+    expect(addItemButton.length).toBe(1);
+    addItemButton.simulate('click');
+  });
+  it.skip('INTEGRATION - mounts the Edit Component', function (done) {
+    (0, _TestHelpers.waitFor)(function () {
+      return wrapper.find(_Form["default"]).length === 1;
+    }, done);
+  });
+  it.skip('INTEGRATION - loads the Currency select', function (done) {
+    (0, _TestHelpers.waitFor)(function () {
+      return wrapper.find(_Form["default"]).find('#currency').length === 1;
+    }, done);
+  });
+  it.skip('INTEGRATION - renders the correct form', function () {
+    var inputs = wrapper.find(_Form["default"]).find('.form-input-wrapper');
+    var inputIDs = Object.keys(expectedFormInputs);
+    expect(inputs.length).toBe(inputIDs.length);
+    inputs.forEach(function (input, idx) {
+      expect(input.getDOMNode().id).toBe(inputIDs[idx]);
+      expect(input.find((0, _Form.getInputComponentByType)(expectedFormInputs[inputIDs[idx]])).length).toBe(1);
+    });
+  });
+  it.skip('INTEGRATION - fills the form and sets the state in the Reducer', function () {
+    for (var prop in inputValues) {
+      var input = wrapper.find(_Form["default"]).find('.form-input-wrapper#' + prop).find((0, _Form.getInputComponentByType)(expectedFormInputs[prop]));
+      expect(input.length).toBe(1);
+      input.prop('onChange')(prop, inputValues[prop]);
+    }
+
+    var _store$getState = _TestHelpers.store.getState(),
+        channelData = _store$getState.channelData;
+
+    for (var _prop in inputValues) {
+      expect(channelData.data[_prop].value).toBe(inputValues[_prop]);
+    }
+  });
+  it.skip('INTEGRATION - renders the Save button, calls the post request on click #1', function () {
+    spyOn(_Api.ApiSimulator, 'request').and.callThrough();
+
+    _Api.ApiSimulator.init();
+
+    var save = wrapper.find('#submit button');
+    expect(save.length).toBe(1);
+    save.simulate('click');
+    expect(_Api.ApiSimulator.request.calls.count()).toBe(1);
+    expect(_Api.ApiSimulator.request.calls.argsFor(0)[0]).toEqual(addItemRequest.config);
+  });
+  it.skip('INTEGRATION - hides the Edit component after save', function (done) {
+    (0, _TestHelpers.waitFor)(function () {
+      return wrapper.find(_Form["default"]).length === 0;
+    }, done);
+  });
+  it.skip('INTEGRATION - select an item and send the request for it', function (done) {
+    spyOn(_Api.ApiSimulator, 'request').and.callThrough();
+
+    _Api.ApiSimulator.init();
+
+    var checkbox = wrapper.find(_Table.TableBody).find(_Table.TableRow).find('input[type="checkbox"]');
+    expect(checkbox.length).toBe(2);
+    checkbox.first().simulate('click');
+    (0, _TestHelpers.waitFor)(function () {
+      return _Api.ApiSimulator.request.calls.count() === 1;
+    }, function () {
+      expect(_Api.ApiSimulator.request.calls.argsFor(0)[0]).toEqual(getItemRequest.config);
+      done();
+    });
+  });
+  it.skip('INTEGRATION - shows the Edit component after loading the item', function (done) {
+    (0, _TestHelpers.waitFor)(function () {
+      return wrapper.find(_Form["default"]).length === 1;
+    }, done);
+  });
+  it.skip('INTEGRATION - loads the Currency select', function (done) {
+    (0, _TestHelpers.waitFor)(function () {
+      return wrapper.find(_Form["default"]).find('#currency').length === 1;
+    }, done);
+  });
+  it.skip('INTEGRATION - loads the details of the selected item', function () {
+    var inputs = wrapper.find(_Form["default"]).find('.form-input-wrapper');
+    var inputIDs = Object.keys(expectedFormInputs);
+    expect(inputs.length).toBe(inputIDs.length);
+    inputs.forEach(function (input, idx) {
+      var prop = inputIDs[idx];
+      expect(input.childAt(0).prop('value')).toBe(getItemRequest.response.data[prop]);
+    });
+  });
+  it.skip('INTEGRATION - updates the data and sets the state in the Reducer', function () {
+    for (var prop in inputValuesUpdate) {
+      var input = wrapper.find(_Form["default"]).find('.form-input-wrapper#' + prop).find((0, _Form.getInputComponentByType)(expectedFormInputs[prop]));
+      expect(input.length).toBe(1);
+      input.prop('onChange')(prop, inputValuesUpdate[prop]);
+    }
+
+    var _store$getState2 = _TestHelpers.store.getState(),
+        channelData = _store$getState2.channelData;
+
+    for (var _prop2 in inputValuesUpdate) {
+      expect(channelData.data[_prop2].value).toBe(inputValuesUpdate[_prop2]);
+    }
+  });
+  it.skip('INTEGRATION - renders the Save button, does NOT call the post request on click', function () {
+    spyOn(_Api.ApiSimulator, 'request').and.callThrough();
+
+    _Api.ApiSimulator.init();
+
+    var save = wrapper.find('#submit button');
+    expect(save.length).toBe(1);
+    save.simulate('click');
+    expect(_Api.ApiSimulator.request.calls.count()).toBe(0);
+  });
+  it.skip('INTEGRATION - marks data as invalid', function (done) {
+    (0, _TestHelpers.waitFor)(function () {
+      var _store$getState3 = _TestHelpers.store.getState(),
+          channelData = _store$getState3.channelData;
+
+      return channelData.isInvalidData === true;
+    }, done);
+  });
+  it.skip('INTEGRATION - shows the validation errors', function () {
+    var inputs = wrapper.find(_Form["default"]).find('.form-input-wrapper');
+
+    var _iterator = _createForOfIteratorHelper(inputValuesUpdateErrors),
+        _step;
+
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var e = _step.value;
+        var input = inputs.filter({
+          id: e.property
+        });
+        expect(input.length).toBe(1); // there must be a field for the wrong property value
+        // which must has the error prop set correctly
+
+        expect(input.childAt(0).prop('error').props.value).toBe(e.message);
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  });
+});

package/Screens/Channel/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _Screen = _interopRequireDefault(require("./Screen"));
+
+var _Reducer = _interopRequireDefault(require("./Reducers/Reducer"));
+
+var _FeatureReducers = require("../../App/FeatureReducers");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+(0, _FeatureReducers.addReducers)(_Reducer["default"]);
+var _default = {
+  Screen: _Screen["default"]
+};
+exports["default"] = _default;

package/Screens/Client/Components/ColorTextField.js

@@ -0,0 +1,90 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _core = require("@material-ui/core");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _i18n = require("../../../App/i18n");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var ColorTextField = function ColorTextField(_ref) {
+  var name = _ref.name,
+      value = _ref.value,
+      _onChange = _ref.onChange,
+      error = _ref.error;
+
+  var _useState = (0, _react.useState)(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      customError = _useState2[0],
+      setCustomError = _useState2[1];
+
+  (0, _react.useEffect)(function () {
+    if (error) {
+      if (value === "" || value === undefined) {
+        setCustomError(error);
+      } else {
+        validateColor(value);
+      }
+    }
+  }, [error]);
+
+  var validateColor = function validateColor(color) {
+    if (color !== '') {
+      var s = new Option().style;
+      s.color = color;
+      var isValidColorText = s.color == color;
+
+      if (isValidColorText || /^#[0-9a-fA-F]{6}$/i.test(color)) {
+        setCustomError(null);
+      } else if (/^[0-9a-fA-F]{6}$/i.test(color)) {
+        _onChange(name, '#' + color);
+
+        setCustomError(null);
+      } else {
+        setCustomError((0, _i18n.T)('themeColorError'));
+      }
+    }
+  };
+
+  return /*#__PURE__*/_react["default"].createElement(_core.TextField, {
+    label: (0, _i18n.t)("Theme - Highlight color"),
+    onChange: function onChange(evt) {
+      _onChange(name, evt.target.value);
+    },
+    onBlur: function onBlur(evt) {
+      validateColor(evt.target.value);
+    },
+    style: {
+      width: '100%'
+    },
+    error: customError,
+    helperText: customError,
+    value: value || "",
+    type: "text"
+  });
+};
+
+var _default = ColorTextField;
+exports["default"] = _default;

package/Screens/Client/Components/PdfMarkdownField.js

@@ -0,0 +1,171 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.PdfMarkDownField = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _reactMde = _interopRequireDefault(require("react-mde"));
+
+var Showdown = _interopRequireWildcard(require("showdown"));
+
+require("react-mde/lib/styles/css/react-mde-all.css");
+
+var _FormControlLabel = _interopRequireDefault(require("../../../UIComponents/FormControlLabel"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+
+var _i18n = require("../../../App/i18n");
+
+var _ErrorWrapper = _interopRequireDefault(require("../../../Components/FormFragments/ErrorWrapper"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var MARK_DOWN_FIELD_TRANSLATION_KEY = 'markDownField';
+(0, _i18n.use)({
+  en: _defineProperty({}, MARK_DOWN_FIELD_TRANSLATION_KEY, {
+    write: 'Write',
+    preview: 'Preview'
+  }),
+  de: _defineProperty({}, MARK_DOWN_FIELD_TRANSLATION_KEY, {
+    write: 'Schreiben',
+    preview: 'Vorschau'
+  })
+}, true);
+var converter = new Showdown.Converter({
+  tables: true,
+  simplifiedAutoLink: true,
+  openLinksInNewWindow: true,
+  simpleLineBreaks: true
+});
+var toolbarCommands = [['bold', 'italic'], ['link'], ['unordered-list', 'ordered-list']];
+var StyledFormControlLabel = (0, _styles.withStyles)({
+  labelPlacementStart: {},
+  root: {
+    margin: 0,
+    alignItems: 'flex-start',
+    width: '100%'
+  }
+})(_FormControlLabel["default"]);
+var StyledMde = (0, _styles.withStyles)({
+  reactMde: {
+    width: '100%',
+    border: 0,
+    marginBottom: 10
+  },
+  toolbar: {
+    background: 'none',
+    border: 0
+  },
+  textArea: {
+    border: '1px solid rgba(0, 0, 0, 0.2) !important'
+  },
+  preview: {
+    overflowX: 'auto'
+  }
+})(_reactMde["default"]);
+
+var PdfMarkDownField = function PdfMarkDownField(props) {
+  var _useState = (0, _react.useState)('write'),
+      _useState2 = _slicedToArray(_useState, 2),
+      selectedTab = _useState2[0],
+      setSelectedTab = _useState2[1];
+
+  var value = props.value,
+      error = props.error,
+      onChange = props.onChange,
+      label = props.label,
+      classes = props.classes,
+      maxEditorHeight = props.maxEditorHeight,
+      name = props.name,
+      htmlField = props.htmlField,
+      helperText = props.helperText;
+
+  var _useState3 = (0, _react.useState)(value.text),
+      _useState4 = _slicedToArray(_useState3, 2),
+      currentValue = _useState4[0],
+      setCurrentValue = _useState4[1];
+
+  (0, _react.useEffect)(function () {
+    setCurrentValue(value);
+  }, [value]);
+
+  var changeHandler = function changeHandler(value) {
+    setCurrentValue(value);
+    onChange(htmlField, converter.makeHtml(value));
+    onChange(name, value);
+    setCurrentValue(value);
+  };
+
+  var translations = (0, _i18n.t)(MARK_DOWN_FIELD_TRANSLATION_KEY);
+  return /*#__PURE__*/_react["default"].createElement(_ErrorWrapper["default"], {
+    error: error
+  }, /*#__PURE__*/_react["default"].createElement(StyledFormControlLabel, {
+    label: label,
+    labelPlacement: "top",
+    classes: classes,
+    control: /*#__PURE__*/_react["default"].createElement(StyledMde, {
+      maxEditorHeight: maxEditorHeight,
+      value: currentValue,
+      onChange: changeHandler,
+      selectedTab: selectedTab,
+      onTabChange: setSelectedTab,
+      generateMarkdownPreview: function generateMarkdownPreview(markdown) {
+        return Promise.resolve(converter.makeHtml(markdown));
+      },
+      childProps: {
+        writeButton: {
+          tabIndex: -1
+        }
+      },
+      toolbarCommands: toolbarCommands,
+      l18n: translations
+    })
+  }), helperText && /*#__PURE__*/_react["default"].createElement("span", {
+    className: "helper-text"
+  }, helperText));
+};
+
+exports.PdfMarkDownField = PdfMarkDownField;
+PdfMarkDownField.propTypes = {
+  value: _propTypes["default"].string,
+  error: _propTypes["default"].node,
+  onChange: _propTypes["default"].func.isRequired,
+  label: _propTypes["default"].node,
+  classes: _propTypes["default"].object,
+  maxEditorHeight: _propTypes["default"].number,
+  name: _propTypes["default"].string,
+  htmlField: _propTypes["default"].string,
+  helperText: _propTypes["default"].string
+};
+PdfMarkDownField.defaultProps = {
+  value: ''
+};
+var _default = PdfMarkDownField;
+exports["default"] = _default;