@atlaskit/editor-core 178.1.1 → 179.0.0

package/dist/cjs/ui/ColorPickerButton/index.js

@@ -1,77 +1,53 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _react2 = require("@emotion/react");
-
 var _ui = require("@atlaskit/editor-common/ui");
-
 var _button = _interopRequireDefault(require("@atlaskit/button"));
-
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _constants = require("@atlaskit/theme/constants");
-
 var _ColorPalette = _interopRequireDefault(require("../ColorPalette"));
-
 var _common = require("../ColorPalette/Palettes/common");
-
 var _analyticsNext = require("@atlaskit/analytics-next");
-
 var _consts = require("../../plugins/analytics/consts");
-
 var _types = require("../../plugins/analytics/types");
-
 var _templateObject, _templateObject2, _templateObject3;
-
 // helps adjusts position of popup
-var colorPickerButtonWrapper = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n"]))); // Control the size of color picker buttons and preview
-// TODO: https://product-fabric.atlassian.net/browse/DSP-4134
+var colorPickerButtonWrapper = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n"])));
 
+// Control the size of color picker buttons and preview
+// TODO: https://product-fabric.atlassian.net/browse/DSP-4134
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-
 var colorPickerWrapper = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  border-radius: ", "px;\n  background-color: white;\n  box-shadow: 0 4px 8px -2px ", ", 0 0 1px ", ";\n  padding: 8px 0px;\n"])), (0, _constants.borderRadius)(), _colors.N60A, _colors.N60A);
 /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
 
 var ColorPickerButton = function ColorPickerButton(props) {
   var _props$size, _props$size2;
-
   var buttonRef = _react.default.useRef(null);
-
   var _React$useState = _react.default.useState(false),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      isPopupOpen = _React$useState2[0],
-      setIsPopupOpen = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    isPopupOpen = _React$useState2[0],
+    setIsPopupOpen = _React$useState2[1];
   var togglePopup = function togglePopup() {
     setIsPopupOpen(!isPopupOpen);
   };
-
   _react.default.useEffect(function () {
     if (props.setDisableParentScroll) {
       props.setDisableParentScroll(isPopupOpen);
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isPopupOpen]);
-
   var ColorPaletteWithListeners = (0, _ui.withOuterListeners)(_ColorPalette.default);
-
   var onColorSelected = function onColorSelected(color, label) {
     setIsPopupOpen(false);
-
     if (props.onChange) {
       if (props.createAnalyticsEvent) {
         // fire analytics
@@ -88,26 +64,24 @@ var ColorPickerButton = function ColorPickerButton(props) {
         };
         props.createAnalyticsEvent(payload).fire(_consts.editorAnalyticsChannel);
       }
-
       var newPalette = props.colorPalette.find(function (colorPalette) {
         return colorPalette.value === color;
       });
       newPalette && props.onChange(newPalette);
     }
   };
-
   var renderPopup = function renderPopup() {
     if (!isPopupOpen || !buttonRef.current) {
       return;
     }
-
     return (0, _react2.jsx)(_ui.Popup, {
       target: buttonRef.current,
       fitHeight: 350,
       fitWidth: 350,
       offset: [0, 10],
       alignX: props.alignX,
-      mountTo: props.setDisableParentScroll ? props.mountPoint : undefined // Confluence inline comment editor has z-index: 500
+      mountTo: props.setDisableParentScroll ? props.mountPoint : undefined
+      // Confluence inline comment editor has z-index: 500
       // if the toolbar is scrollable, this will be mounted in the root editor
       // we need an index of > 500 to display over it
       ,
@@ -124,7 +98,6 @@ var ColorPickerButton = function ColorPickerButton(props) {
       handleClickOutside: togglePopup
     })));
   };
-
   var title = props.title || '';
   var buttonStyle = (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n    padding: 6px;\n    background-color: ", ";\n    &:before {\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      align-self: center;\n      content: '';\n      border: 1px solid ", ";\n      border-radius: ", "px;\n      background-color: ", ";\n      width: ", "px;\n      height: ", "px;\n      padding: 0;\n    }\n  "])), "var(--ds-background-neutral, transparent)", _common.DEFAULT_BORDER_COLOR, (0, _constants.borderRadius)(), props.currentColor || 'transparent', ((_props$size = props.size) === null || _props$size === void 0 ? void 0 : _props$size.width) || 14, ((_props$size2 = props.size) === null || _props$size2 === void 0 ? void 0 : _props$size2.height) || 14);
   return (0, _react2.jsx)("div", {
@@ -140,9 +113,7 @@ var ColorPickerButton = function ColorPickerButton(props) {
     css: buttonStyle
   })), renderPopup());
 };
-
 var _default = (0, _analyticsNext.withAnalyticsContext)({
   source: 'ConfigPanel'
 })((0, _analyticsNext.withAnalyticsEvents)()(ColorPickerButton));
-
 exports.default = _default;

package/dist/cjs/ui/ConfigPanel/ConfigPanel.js

@@ -1,116 +1,75 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
 var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
-
 var _analyticsNext = require("@atlaskit/analytics-next");
-
 var _form = _interopRequireWildcard(require("@atlaskit/form"));
-
 var _extensions = require("@atlaskit/editor-common/extensions");
-
 var _isEqual2 = _interopRequireDefault(require("lodash/isEqual"));
-
 var _merge = _interopRequireDefault(require("lodash/merge"));
-
 var _analytics = require("../../plugins/analytics");
-
 var _LoadingState = _interopRequireDefault(require("./LoadingState"));
-
 var _Header = _interopRequireDefault(require("./Header"));
-
 var _ErrorMessage = _interopRequireDefault(require("./ErrorMessage"));
-
 var _transformers = require("./transformers");
-
 var _reactIntlNext = require("react-intl-next");
-
 var _buttonGroup = _interopRequireDefault(require("@atlaskit/button/button-group"));
-
 var _customThemeButton = _interopRequireDefault(require("@atlaskit/button/custom-theme-button"));
-
 var _pluginKey = require("../../plugins/extension/plugin-key");
-
 var _WithPluginState = _interopRequireDefault(require("../WithPluginState"));
-
 var _FormContent = _interopRequireDefault(require("./FormContent"));
-
 var _messages = require("./messages");
-
 var _FormErrorBoundary = require("./FormErrorBoundary");
-
 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 _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 function ConfigForm(_ref) {
   var canSave = _ref.canSave,
-      errorMessage = _ref.errorMessage,
-      extensionManifest = _ref.extensionManifest,
-      fields = _ref.fields,
-      firstVisibleFieldName = _ref.firstVisibleFieldName,
-      hasParsedParameters = _ref.hasParsedParameters,
-      intl = _ref.intl,
-      isLoading = _ref.isLoading,
-      onCancel = _ref.onCancel,
-      onFieldChange = _ref.onFieldChange,
-      parameters = _ref.parameters,
-      submitting = _ref.submitting,
-      contextIdentifierProvider = _ref.contextIdentifierProvider;
+    errorMessage = _ref.errorMessage,
+    extensionManifest = _ref.extensionManifest,
+    fields = _ref.fields,
+    firstVisibleFieldName = _ref.firstVisibleFieldName,
+    hasParsedParameters = _ref.hasParsedParameters,
+    intl = _ref.intl,
+    isLoading = _ref.isLoading,
+    onCancel = _ref.onCancel,
+    onFieldChange = _ref.onFieldChange,
+    parameters = _ref.parameters,
+    submitting = _ref.submitting,
+    contextIdentifierProvider = _ref.contextIdentifierProvider;
   (0, _react.useEffect)(function () {
     if (fields) {
       var firstDuplicateField = (0, _transformers.findDuplicateFields)(fields);
-
       if (firstDuplicateField) {
         throw new Error("Possible duplicate field name: `".concat(firstDuplicateField.name, "`."));
       }
     }
   }, [fields]);
-
   if (isLoading || !hasParsedParameters && errorMessage === null) {
     return /*#__PURE__*/_react.default.createElement(_LoadingState.default, null);
   }
-
   if (errorMessage || !fields) {
     return /*#__PURE__*/_react.default.createElement(_ErrorMessage.default, {
       errorMessage: errorMessage || ''
     });
   }
-
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_FormContent.default, {
     fields: fields,
     parameters: parameters,
@@ -133,14 +92,12 @@ function ConfigForm(_ref) {
     onClick: onCancel
   }, intl.formatMessage(_messages.messages.cancel))))));
 }
-
 var ConfigFormIntl = (0, _reactIntlNext.injectIntl)(ConfigForm);
-
 var WithOnFieldChange = function WithOnFieldChange(_ref2) {
   var getState = _ref2.getState,
-      autoSave = _ref2.autoSave,
-      handleSubmit = _ref2.handleSubmit,
-      children = _ref2.children;
+    autoSave = _ref2.autoSave,
+    handleSubmit = _ref2.handleSubmit,
+    children = _ref2.children;
   var getStateRef = (0, _react.useRef)(getState);
   (0, _react.useEffect)(function () {
     getStateRef.current = getState;
@@ -148,42 +105,34 @@ var WithOnFieldChange = function WithOnFieldChange(_ref2) {
   var handleFieldChange = (0, _react.useCallback)(function (name, isDirty) {
     if (!autoSave) {
       return;
-    } // Don't trigger submit if nothing actually changed
-
+    }
 
+    // Don't trigger submit if nothing actually changed
     if (!isDirty) {
       return;
     }
-
     var _getStateRef$current = getStateRef.current(),
-        errors = _getStateRef$current.errors,
-        values = _getStateRef$current.values; // Get only values that does not contain errors
-
+      errors = _getStateRef$current.errors,
+      values = _getStateRef$current.values;
 
+    // Get only values that does not contain errors
     var validValues = {};
-
     for (var _i = 0, _Object$keys = Object.keys(values); _i < _Object$keys.length; _i++) {
       var key = _Object$keys[_i];
-
       if (!errors[key]) {
         // not has error
         validValues[key] = values[key];
       }
     }
-
     handleSubmit(validValues);
   }, [autoSave, handleSubmit]);
   return children(handleFieldChange);
 };
-
 var ConfigPanel = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(ConfigPanel, _React$Component);
-
   var _super = _createSuper(ConfigPanel);
-
   function ConfigPanel(props) {
     var _this;
-
     (0, _classCallCheck2.default)(this, ConfigPanel);
     _this = _super.call(this, props);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleKeyDown", function (e) {
@@ -196,7 +145,6 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
         if (field.hasGroupedValues && !(field.name in backfill)) {
           backfill[field.name] = {};
         }
-
         var actualFormParams = field.hasGroupedValues ? formParams[field.name] || {} : formParams;
         var actualCurrentParams = field.hasGroupedValues ? currentParams[field.name] || {} : currentParams;
         var actualBackfillParams = field.hasGroupedValues ? backfill[field.name] : backfill;
@@ -205,29 +153,27 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
           currentParams: actualCurrentParams,
           backfillParams: actualBackfillParams
         };
-      }; // Traverse any tab structures and backfill field values on tabs
+      };
+
+      // Traverse any tab structures and backfill field values on tabs
       // which aren't shown. This filter should be ok because tabs are
       // currently only allowed on top level
-
-
       var mergedTabGroups = fields.filter(_extensions.isTabGroup).reduce(function (missingBackfill, tabGroup) {
         var _getRelevantData = getRelevantData(tabGroup, formData, currentParameters, missingBackfill),
-            tabGroupFormData = _getRelevantData.formParams,
-            tabGroupCurrentData = _getRelevantData.currentParams,
-            tabGroupParams = _getRelevantData.backfillParams; // Loop through tabs and see what fields are missing from current data
-
+          tabGroupFormData = _getRelevantData.formParams,
+          tabGroupCurrentData = _getRelevantData.currentParams,
+          tabGroupParams = _getRelevantData.backfillParams;
 
+        // Loop through tabs and see what fields are missing from current data
         tabGroup.fields.forEach(function (tabField) {
           var _getRelevantData2 = getRelevantData(tabField, tabGroupFormData, tabGroupCurrentData, tabGroupParams),
-              tabFormData = _getRelevantData2.formParams,
-              tabCurrentData = _getRelevantData2.currentParams,
-              tabParams = _getRelevantData2.backfillParams;
-
+            tabFormData = _getRelevantData2.formParams,
+            tabCurrentData = _getRelevantData2.currentParams,
+            tabParams = _getRelevantData2.backfillParams;
           tabField.fields.forEach(function (field) {
             if (field.name in tabFormData || !(field.name in tabCurrentData)) {
               return;
             }
-
             tabParams[field.name] = tabCurrentData[field.name];
           });
         });
@@ -238,44 +184,36 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleSubmit", /*#__PURE__*/function () {
       var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(formData) {
         var _this$props, fields, extensionManifest, onChange, autoSaveReject, serializedData;
-
         return _regenerator.default.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
               case 0:
                 _this$props = _this.props, fields = _this$props.fields, extensionManifest = _this$props.extensionManifest, onChange = _this$props.onChange, autoSaveReject = _this$props.autoSaveReject;
-
                 if (!(!extensionManifest || !fields)) {
                   _context.next = 4;
                   break;
                 }
-
                 if (!extensionManifest) {
                   autoSaveReject === null || autoSaveReject === void 0 ? void 0 : autoSaveReject(new Error('Extension manifest not loaded'));
                 } else if (!fields) {
                   autoSaveReject === null || autoSaveReject === void 0 ? void 0 : autoSaveReject(new Error('Config fields not loaded'));
                 }
-
                 return _context.abrupt("return");
-
               case 4:
                 _context.prev = 4;
                 _context.next = 7;
                 return (0, _transformers.serialize)(extensionManifest, _this.backfillTabFormData(fields, formData, _this.state.currentParameters), fields);
-
               case 7:
                 serializedData = _context.sent;
                 onChange(serializedData);
                 _context.next = 15;
                 break;
-
               case 11:
                 _context.prev = 11;
                 _context.t0 = _context["catch"](4);
-                autoSaveReject === null || autoSaveReject === void 0 ? void 0 : autoSaveReject(_context.t0); // eslint-disable-next-line no-console
-
+                autoSaveReject === null || autoSaveReject === void 0 ? void 0 : autoSaveReject(_context.t0);
+                // eslint-disable-next-line no-console
                 console.error("Error serializing parameters", _context.t0);
-
               case 15:
               case "end":
                 return _context.stop();
@@ -283,7 +221,6 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
           }
         }, _callee, null, [[4, 11]]);
       }));
-
       return function (_x) {
         return _ref3.apply(this, arguments);
       };
@@ -296,39 +233,30 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
             switch (_context2.prev = _context2.next) {
               case 0:
                 extensionManifest = _this.props.extensionManifest;
-
                 if (!(!extensionManifest || !fields || fields.length === 0)) {
                   _context2.next = 3;
                   break;
                 }
-
                 return _context2.abrupt("return");
-
               case 3:
                 if (!(typeof parameters === 'undefined')) {
                   _context2.next = 6;
                   break;
                 }
-
                 _this.setState({
                   currentParameters: {},
                   hasParsedParameters: true
                 });
-
                 return _context2.abrupt("return");
-
               case 6:
                 _context2.next = 8;
                 return (0, _transformers.deserialize)(extensionManifest, parameters, fields);
-
               case 8:
                 currentParameters = _context2.sent;
-
                 _this.setState({
                   currentParameters: currentParameters,
                   hasParsedParameters: true
                 });
-
               case 10:
               case "end":
                 return _context2.stop();
@@ -336,20 +264,17 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
           }
         }, _callee2);
       }));
-
       return function (_x2, _x3) {
         return _ref4.apply(this, arguments);
       };
     }());
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderHeader", (0, _memoizeOne.default)(function (extensionManifest) {
       var _this$props2 = _this.props,
-          onCancel = _this$props2.onCancel,
-          showHeader = _this$props2.showHeader;
-
+        onCancel = _this$props2.onCancel,
+        showHeader = _this$props2.showHeader;
       if (!showHeader) {
         return null;
       }
-
       return /*#__PURE__*/_react.default.createElement(_Header.default, {
         icon: extensionManifest.icons['48'],
         title: extensionManifest.title,
@@ -364,14 +289,12 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
         if ('isHidden' in field) {
           return !field.isHidden;
         }
-
         return true;
-      } // finds the first visible field, true for FieldSets too
-
+      }
 
+      // finds the first visible field, true for FieldSets too
       var firstVisibleField = fields.find(nonHidden);
       var newFirstVisibleFieldName;
-
       if (firstVisibleField) {
         // if it was a fieldset, go deeper trying to locate the field
         if (firstVisibleField.type === 'fieldset') {
@@ -381,12 +304,10 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
           newFirstVisibleFieldName = firstVisibleField.name;
         }
       }
-
       return newFirstVisibleFieldName;
     }));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setFirstVisibleFieldName", function (fields) {
       var newFirstVisibleFieldName = _this.getFirstVisibleFieldName(fields);
-
       if (newFirstVisibleFieldName !== _this.state.firstVisibleFieldName) {
         _this.setState({
           firstVisibleFieldName: newFirstVisibleFieldName
@@ -401,21 +322,20 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
     _this.onFieldChange = null;
     return _this;
   }
-
   (0, _createClass2.default)(ConfigPanel, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       var _this$props3 = this.props,
-          fields = _this$props3.fields,
-          parameters = _this$props3.parameters;
+        fields = _this$props3.fields,
+        parameters = _this$props3.parameters;
       this.parseParameters(fields, parameters);
     }
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       var _this$props4 = this.props,
-          createAnalyticsEvent = _this$props4.createAnalyticsEvent,
-          extensionManifest = _this$props4.extensionManifest;
+        createAnalyticsEvent = _this$props4.createAnalyticsEvent,
+        extensionManifest = _this$props4.extensionManifest;
       (0, _analytics.fireAnalyticsEvent)(createAnalyticsEvent)({
         payload: {
           action: _analytics.ACTION.CLOSED,
@@ -432,25 +352,21 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
       var _this$props5 = this.props,
-          parameters = _this$props5.parameters,
-          fields = _this$props5.fields,
-          autoSaveTrigger = _this$props5.autoSaveTrigger,
-          extensionManifest = _this$props5.extensionManifest;
-
+        parameters = _this$props5.parameters,
+        fields = _this$props5.fields,
+        autoSaveTrigger = _this$props5.autoSaveTrigger,
+        extensionManifest = _this$props5.extensionManifest;
       if (parameters && parameters !== prevProps.parameters || fields && (!prevProps.fields || !(0, _isEqual2.default)(fields, prevProps.fields))) {
         this.parseParameters(fields, parameters);
       }
-
       if (fields && (!prevProps.fields || !(0, _isEqual2.default)(fields, prevProps.fields))) {
         this.setFirstVisibleFieldName(fields);
       }
-
       if (prevProps.autoSaveTrigger !== autoSaveTrigger) {
         if (this.onFieldChange) {
           this.onFieldChange('', true);
         }
       }
-
       if (prevProps.extensionManifest === undefined && prevProps.extensionManifest !== extensionManifest) {
         // This will only be fired once when extensionManifest is loaded initially
         // Can't do this in componentDidMount because extensionManifest is still undefined at that point
@@ -471,31 +387,28 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this2 = this;
-
       var extensionManifest = this.props.extensionManifest;
-
       if (!extensionManifest) {
         return /*#__PURE__*/_react.default.createElement(_LoadingState.default, null);
       }
-
       var _this$props6 = this.props,
-          autoSave = _this$props6.autoSave,
-          errorMessage = _this$props6.errorMessage,
-          fields = _this$props6.fields,
-          isLoading = _this$props6.isLoading,
-          onCancel = _this$props6.onCancel;
+        autoSave = _this$props6.autoSave,
+        errorMessage = _this$props6.errorMessage,
+        fields = _this$props6.fields,
+        isLoading = _this$props6.isLoading,
+        onCancel = _this$props6.onCancel;
       var _this$state = this.state,
-          currentParameters = _this$state.currentParameters,
-          hasParsedParameters = _this$state.hasParsedParameters,
-          firstVisibleFieldName = _this$state.firstVisibleFieldName;
+        currentParameters = _this$state.currentParameters,
+        hasParsedParameters = _this$state.hasParsedParameters,
+        firstVisibleFieldName = _this$state.firstVisibleFieldName;
       var handleSubmit = this.handleSubmit,
-          handleKeyDown = this.handleKeyDown;
+        handleKeyDown = this.handleKeyDown;
       return /*#__PURE__*/_react.default.createElement(_form.default, {
         onSubmit: handleSubmit
       }, function (_ref5) {
         var formProps = _ref5.formProps,
-            getState = _ref5.getState,
-            submitting = _ref5.submitting;
+          getState = _ref5.getState,
+          submitting = _ref5.submitting;
         return /*#__PURE__*/_react.default.createElement(WithOnFieldChange, {
           autoSave: !!autoSave,
           getState: getState,
@@ -538,9 +451,7 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
   }]);
   return ConfigPanel;
 }(_react.default.Component);
-
 var _default = (0, _analyticsNext.withAnalyticsContext)({
   source: 'ConfigPanel'
 })((0, _analyticsNext.withAnalyticsEvents)()(ConfigPanel));
-
 exports.default = _default;