@atlaskit/editor-core 153.1.3 → 155.0.0

package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js

@@ -7,12 +7,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.FullPageContentArea = exports.CONTENT_AREA_TEST_ID = void 0;
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _ui = require("@atlaskit/editor-common/ui");
 
 var _context = require("../../ContextPanel/context");
 
 var _react = _interopRequireDefault(require("react"));
 
+var _reactIntlNext = require("react-intl-next");
+
 var _Addon = require("../../Addon");
 
 var _ContextPanel = _interopRequireDefault(require("../../ContextPanel"));
@@ -23,11 +25,13 @@ var _WidthEmitter = _interopRequireDefault(require("../../WidthEmitter"));
 
 var _StyledComponents = require("./StyledComponents");
 
+var _messages = _interopRequireDefault(require("./messages"));
+
 var CONTENT_AREA_TEST_ID = 'ak-editor-fp-content-area';
 exports.CONTENT_AREA_TEST_ID = CONTENT_AREA_TEST_ID;
 
-var FullPageContentArea = /*#__PURE__*/_react.default.memo(function (props) {
-  return /*#__PURE__*/_react.default.createElement(_editorCommon.WidthConsumer, null, function (_ref) {
+var Content = /*#__PURE__*/_react.default.memo(function (props) {
+  return /*#__PURE__*/_react.default.createElement(_ui.WidthConsumer, null, function (_ref) {
     var width = _ref.width;
     return /*#__PURE__*/_react.default.createElement(_context.ContextPanelConsumer, null, function (_ref2) {
       var positionedOverEditor = _ref2.positionedOverEditor;
@@ -41,6 +45,8 @@ var FullPageContentArea = /*#__PURE__*/_react.default.memo(function (props) {
       }, /*#__PURE__*/_react.default.createElement(_Addon.ClickAreaBlock, {
         editorView: props.editorView
       }, /*#__PURE__*/_react.default.createElement(_StyledComponents.EditorContentArea, {
+        role: "region",
+        "aria-label": props.intl.formatMessage(_messages.default.editableContentLabel),
         fullWidthMode: props.appearance === 'full-width',
         innerRef: props.contentAreaRef,
         containerWidth: width
@@ -69,4 +75,5 @@ var FullPageContentArea = /*#__PURE__*/_react.default.memo(function (props) {
   });
 });
 
+var FullPageContentArea = (0, _reactIntlNext.injectIntl)(Content);
 exports.FullPageContentArea = FullPageContentArea;

package/dist/cjs/ui/Appearance/FullPage/FullPageToolbar.js

@@ -7,12 +7,14 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.FullPageToolbar = void 0;
+exports.FullPageToolbar = exports.EditorToolbar = void 0;
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _reactIntlNext = require("react-intl-next");
+
 var _ui = _interopRequireDefault(require("../../../plugins/collab-edit/ui"));
 
 var _FindReplaceToolbarButtonWithState = _interopRequireDefault(require("../../../plugins/find-replace/FindReplaceToolbarButtonWithState"));
@@ -25,11 +27,13 @@ var _MainToolbar = require("./MainToolbar");
 
 var _context = require("../../ContextPanel/context");
 
+var _messages = _interopRequireDefault(require("./messages"));
+
 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; }
 
-var FullPageToolbar = /*#__PURE__*/_react.default.memo(function (props) {
+var EditorToolbar = /*#__PURE__*/_react.default.memo(function (props) {
   var _props$featureFlags, _props$featureFlags2, _props$featureFlags3, _props$collabEdit, _props$collabEdit2, _props$collabEdit3, _props$featureFlags4, _props$featureFlags5;
 
   var _useState = (0, _react.useState)(false),
@@ -94,12 +98,18 @@ var FullPageToolbar = /*#__PURE__*/_react.default.memo(function (props) {
       showKeyline: props.showKeyline || contextPanelWidth > 0,
       twoLineEditorToolbar: !!((_props$featureFlags7 = props.featureFlags) !== null && _props$featureFlags7 !== void 0 && _props$featureFlags7.twoLineEditorToolbar)
     }, /*#__PURE__*/_react.default.createElement(_MainToolbar.MainToolbarFirstChild, {
-      twoLineEditorToolbar: !!((_props$featureFlags8 = props.featureFlags) !== null && _props$featureFlags8 !== void 0 && _props$featureFlags8.twoLineEditorToolbar)
+      twoLineEditorToolbar: !!((_props$featureFlags8 = props.featureFlags) !== null && _props$featureFlags8 !== void 0 && _props$featureFlags8.twoLineEditorToolbar),
+      role: "region",
+      "aria-label": props.intl.formatMessage(_messages.default.toolbarLabel)
     }, shouldSplitToolbar ? customToolbar : nonCustomToolbar), /*#__PURE__*/_react.default.createElement(_MainToolbar.MainToolbarSecondChild, {
       "data-testid": 'avatar-group-outside-plugin',
-      twoLineEditorToolbar: !!((_props$featureFlags9 = props.featureFlags) !== null && _props$featureFlags9 !== void 0 && _props$featureFlags9.twoLineEditorToolbar)
+      twoLineEditorToolbar: !!((_props$featureFlags9 = props.featureFlags) !== null && _props$featureFlags9 !== void 0 && _props$featureFlags9.twoLineEditorToolbar),
+      role: "region",
+      "aria-label": props.intl.formatMessage(_messages.default.pageActionsLabel)
     }, shouldSplitToolbar ? nonCustomToolbar : customToolbar));
   });
 });
 
+exports.EditorToolbar = EditorToolbar;
+var FullPageToolbar = (0, _reactIntlNext.injectIntl)(EditorToolbar);
 exports.FullPageToolbar = FullPageToolbar;

package/dist/cjs/ui/Appearance/FullPage/messages.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _reactIntl = require("react-intl");
+
+var _default = (0, _reactIntl.defineMessages)({
+  toolbarLabel: {
+    id: 'fabric.editor.toolbarLabel',
+    defaultMessage: 'Editor toolbar',
+    description: 'Label for the ARIA region landmark'
+  },
+  pageActionsLabel: {
+    id: 'fabric.editor.pageActionsLabel',
+    defaultMessage: 'Page actions',
+    description: 'Label for the ARIA region landmark'
+  },
+  editableContentLabel: {
+    id: 'fabric.editor.editableContentLabel',
+    defaultMessage: 'Editable content',
+    description: 'Label for the ARIA region landmark'
+  }
+});
+
+exports.default = _default;

package/dist/cjs/ui/AppearanceComponents/Mobile.js

@@ -49,11 +49,13 @@ function MobileAppearance(_ref) {
         mobileDimensions = _ref2.mobileDimensions;
     var maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
     var minHeight = 100;
+    var currentIsExpanded = true; // isExpanded prop should always be true for Hybrid Editor
 
     if (mobileDimensions) {
       var keyboardHeight = mobileDimensions.keyboardHeight,
           windowHeight = mobileDimensions.windowHeight,
-          mobilePaddingTop = mobileDimensions.mobilePaddingTop;
+          mobilePaddingTop = mobileDimensions.mobilePaddingTop,
+          isExpanded = mobileDimensions.isExpanded;
       /*
         We calculate the min-height based on the windowHeight - keyboardHeight - paddingTop.
         This is needed due to scrolling issues when there is no content to scroll (like, only having 1 paragraph),
@@ -61,9 +63,16 @@ function MobileAppearance(_ref) {
         is scrolled nevertheless, and it gives the sensation that the content was lost.
       */
 
-      var keyboardHeightVh = keyboardHeight * 100 / windowHeight;
-      var paddingVh = mobilePaddingTop * 100 / windowHeight;
-      minHeight = 100 - keyboardHeightVh - paddingVh;
+      if (!persistScrollGutter) {
+        // in iOS Hybrid Editor windowHeight doesn't exclude keyboardHeight
+        // in Android keyboardHeight is always set to -1;
+        minHeight = windowHeight - keyboardHeight - 2 * mobilePaddingTop;
+      } else {
+        // in iOS Compact Editor windowHeight excludes keyboardHeight
+        minHeight = windowHeight - mobilePaddingTop; // isExpanded can be true of false for Compact editor
+
+        currentIsExpanded = isExpanded;
+      }
     }
 
     return /*#__PURE__*/_react.default.createElement(_WithFlash.default, {
@@ -74,7 +83,8 @@ function MobileAppearance(_ref) {
     }, /*#__PURE__*/_react.default.createElement(_Addon.ClickAreaMobile, {
       editorView: editorView || undefined,
       minHeight: minHeight,
-      persistScrollGutter: persistScrollGutter
+      persistScrollGutter: persistScrollGutter,
+      isExpanded: currentIsExpanded
     }, /*#__PURE__*/_react.default.createElement(ContentArea, null, /*#__PURE__*/_react.default.createElement("div", {
       className: "ak-editor-content-area"
     }, children)))));

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

@@ -27,6 +27,10 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _styles = require("./styles");
 
+var _reactIntlNext = require("react-intl-next");
+
+var _messages = require("./messages");
+
 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; }
@@ -74,7 +78,7 @@ var ChromeCollapsed = /*#__PURE__*/function (_PureComponent) {
   (0, _createClass2.default)(ChromeCollapsed, [{
     key: "render",
     value: function render() {
-      var placeholder = this.props.text || 'Type something…';
+      var placeholder = this.props.text || this.props.intl.formatMessage(_messages.messages.chromeCollapsedPlaceholder);
       return /*#__PURE__*/_react.default.createElement(_styles.Input, {
         innerRef: this.handleInputRef,
         onFocus: this.focusHandler,
@@ -85,4 +89,6 @@ var ChromeCollapsed = /*#__PURE__*/function (_PureComponent) {
   return ChromeCollapsed;
 }(_react.PureComponent);
 
-exports.default = ChromeCollapsed;
+var _default = (0, _reactIntlNext.injectIntl)(ChromeCollapsed);
+
+exports.default = _default;

package/dist/cjs/ui/ChromeCollapsed/messages.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.messages = void 0;
+
+var _reactIntlNext = require("react-intl-next");
+
+var messages = (0, _reactIntlNext.defineMessages)({
+  chromeCollapsedPlaceholder: {
+    id: 'fabric.editor.chromeCollapsedPlaceholder',
+    defaultMessage: 'Type something…',
+    description: 'placeholder for an input where users insert text'
+  }
+});
+exports.messages = messages;

package/dist/cjs/ui/ColorPalette/Palettes/panelBackgroundPalette.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.panelBackgroundPalette = void 0;
+exports.panelDarkModeBackgroundPalette = exports.panelBackgroundPalette = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
@@ -13,76 +13,147 @@ var _theme = require("@atlaskit/theme");
 
 var _common = require("./common");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+var _styles = require("@atlaskit/editor-common/styles");
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 var panelBackgroundPalette = [{
-  label: 'Doctor',
+  label: 'White',
   value: _theme.colors.N0
 }, {
-  label: 'Pixie dust',
+  label: 'Light blue',
   value: _theme.colors.B50
 }, {
-  label: "Gram's sofa",
+  label: 'Light teal',
   value: _theme.colors.T50
 }, {
-  label: 'The smell',
+  label: 'Light green',
   value: _theme.colors.G50
 }, {
-  label: 'James blonde',
+  label: 'Light yellow',
   value: _theme.colors.Y50
 }, {
-  label: 'Rosie',
+  label: 'Light red',
   value: _theme.colors.R50
 }, {
-  label: 'Lavender secret',
+  label: 'Light purple',
   value: _theme.colors.P50
 }, {
-  label: "Gram's hair",
+  label: 'Light gray',
   value: _theme.colors.N20
 }, {
-  label: 'Schwag',
+  label: 'Blue',
   value: _theme.colors.B75
 }, {
-  label: 'Arctic chill',
+  label: 'Teal',
   value: _theme.colors.T75
 }, {
-  label: 'Mintie',
+  label: 'Green',
   value: _theme.colors.G75
 }, {
-  label: 'Dandelion whisper',
+  label: 'Yellow',
   value: _theme.colors.Y75
 }, {
-  label: 'Bondi sunburn',
+  label: 'Red',
   value: _theme.colors.R75
 }, {
-  label: 'Phantom mist',
+  label: 'Purple',
   value: _theme.colors.P75
 }, {
-  label: 'Sentinel',
+  label: 'Gray',
   value: _theme.colors.N60
 }, {
-  label: 'Arvo breeze',
+  label: 'Dark blue',
   value: _theme.colors.B100
 }, {
-  label: 'Hairy fairy',
+  label: 'Dark teal',
   value: _theme.colors.T100
 }, {
-  label: 'Green tea',
+  label: 'Dark green',
   value: _theme.colors.G200
 }, {
-  label: 'Pub mix',
+  label: 'Dark yellow',
   value: _theme.colors.Y200
 }, {
-  label: 'Alexandria',
+  label: 'Dark red',
   value: _theme.colors.R100
 }, {
-  label: 'Herky jerky',
+  label: 'Dark purple',
   value: _theme.colors.P100
 }].map(function (color) {
   return _objectSpread(_objectSpread({}, color), {}, {
     border: _common.DEFAULT_BORDER_COLOR
   });
 });
-exports.panelBackgroundPalette = panelBackgroundPalette;
+exports.panelBackgroundPalette = panelBackgroundPalette;
+var panelDarkModeBackgroundPalette = [{
+  label: 'Dark gray',
+  value: _styles.darkPanelColors.DarkGray
+}, {
+  label: 'Dark blue',
+  value: _styles.darkPanelColors.B1200S
+}, {
+  label: 'Dark teal',
+  value: _styles.darkPanelColors.T1200S
+}, {
+  label: 'Dark green',
+  value: _styles.darkPanelColors.G1200S
+}, {
+  label: 'Dark yellow',
+  value: _styles.darkPanelColors.Y1200S
+}, {
+  label: 'Dark red',
+  value: _styles.darkPanelColors.R1200S
+}, {
+  label: 'Dark purple',
+  value: _styles.darkPanelColors.P1200S
+}, {
+  label: 'Gray',
+  value: _styles.darkPanelColors.Gray
+}, {
+  label: 'blue',
+  value: _styles.darkPanelColors.B900
+}, {
+  label: 'teal',
+  value: _styles.darkPanelColors.T900
+}, {
+  label: 'green',
+  value: _styles.darkPanelColors.G900
+}, {
+  label: 'yellow',
+  value: _styles.darkPanelColors.Y900
+}, {
+  label: 'red',
+  value: _styles.darkPanelColors.R900
+}, {
+  label: 'purple',
+  value: _styles.darkPanelColors.P900
+}, {
+  label: 'Light gray',
+  value: _styles.darkPanelColors.LightGray
+}, {
+  label: 'Light blue',
+  value: _styles.darkPanelColors.B800S
+}, {
+  label: 'Light teal',
+  value: _styles.darkPanelColors.T900S
+}, {
+  label: 'Light green',
+  value: _styles.darkPanelColors.G900S
+}, {
+  label: 'Light yellow',
+  value: _styles.darkPanelColors.Y800S
+}, {
+  label: 'Light red',
+  value: _styles.darkPanelColors.R800S
+}, {
+  label: 'Light purple',
+  value: _styles.darkPanelColors.P800S
+}].map(function (color) {
+  return _objectSpread(_objectSpread({}, color), {}, {
+    border: _common.DEFAULT_BORDER_COLOR
+  });
+});
+exports.panelDarkModeBackgroundPalette = panelDarkModeBackgroundPalette;

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

@@ -40,7 +40,6 @@ var ColorPalette = function ColorPalette(props) {
       onClick = props.onClick,
       selectedColor = props.selectedColor,
       className = props.className,
-      isShowingMoreColors = props.isShowingMoreColors,
       formatMessage = props.intl.formatMessage;
 
   var colorsPerRow = _react.default.useMemo(function () {
@@ -70,8 +69,7 @@ var ColorPalette = function ColorPalette(props) {
         label: message ? formatMessage(message) : label,
         onClick: onClick,
         isSelected: value === selectedColor,
-        checkMarkColor: getContrastColor(value, [_colors.N0, _colors.N500]),
-        autoFocus: isShowingMoreColors && rowIdx === 1 && colorIdx === 0
+        checkMarkColor: getContrastColor(value, [_colors.N0, _colors.N500])
       });
     }));
   }));

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

@@ -15,7 +15,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
-var _editorCommon = require("@atlaskit/editor-common");
+var _ui = require("@atlaskit/editor-common/ui");
 
 var _button = _interopRequireDefault(require("@atlaskit/button"));
 
@@ -57,7 +57,7 @@ var ColorPickerButton = function ColorPickerButton(props) {
     setIsPopupOpen(!isPopupOpen);
   };
 
-  var ColorPaletteWithListeners = (0, _editorCommon.withOuterListeners)(_ColorPalette.default);
+  var ColorPaletteWithListeners = (0, _ui.withOuterListeners)(_ColorPalette.default);
 
   var onColorSelected = function onColorSelected(color, label) {
     setIsPopupOpen(false);
@@ -91,7 +91,7 @@ var ColorPickerButton = function ColorPickerButton(props) {
       return;
     }
 
-    return /*#__PURE__*/_react.default.createElement(_editorCommon.Popup, {
+    return /*#__PURE__*/_react.default.createElement(_ui.Popup, {
       target: buttonRef.current,
       fitHeight: 350,
       fitWidth: 350,

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

@@ -31,6 +31,9 @@ var _FieldMessages = _interopRequireDefault(require("../FieldMessages"));
 
 var _RequiredIndicator = require("./common/RequiredIndicator");
 
+var _excluded = ["value"],
+    _excluded2 = ["id", "value"];
+
 var _templateObject, _templateObject2;
 
 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); }
@@ -75,7 +78,7 @@ function Checkbox(_ref) {
     var fieldProps = _ref2.fieldProps,
         error = _ref2.error;
     var isChecked = fieldProps.value,
-        restFieldProps = (0, _objectWithoutProperties2.default)(fieldProps, ["value"]);
+        restFieldProps = (0, _objectWithoutProperties2.default)(fieldProps, _excluded);
     return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_checkbox.Checkbox, (0, _extends2.default)({}, restFieldProps, {
       label: label,
       onChange: function onChange(event) {
@@ -111,7 +114,7 @@ function Toggle(_ref3) {
         error = _ref4.error;
     var id = fieldProps.id,
         isChecked = fieldProps.value,
-        restFieldProps = (0, _objectWithoutProperties2.default)(fieldProps, ["id", "value"]);
+        restFieldProps = (0, _objectWithoutProperties2.default)(fieldProps, _excluded2);
     return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(ToggleFieldWrapper, null, /*#__PURE__*/_react.default.createElement(ToggleLabel, {
       id: id,
       htmlFor: id

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

@@ -29,6 +29,8 @@ var _types = require("../types");
 
 var _FieldMessages = _interopRequireDefault(require("../FieldMessages"));
 
+var _excluded = ["onChange", "value"];
+
 var _templateObject;
 
 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); }
@@ -52,7 +54,7 @@ function CheckboxGroupInner(_ref) {
       fieldProps = _ref.fieldProps;
   var onChange = fieldProps.onChange,
       value = fieldProps.value,
-      restFieldProps = (0, _objectWithoutProperties2.default)(fieldProps, ["onChange", "value"]);
+      restFieldProps = (0, _objectWithoutProperties2.default)(fieldProps, _excluded);
 
   function _onChange(optionValue, isChecked) {
     var active = new Set(value ? value : []);

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

@@ -33,9 +33,9 @@ var _ColorPickerButton = _interopRequireDefault(require("../../ColorPickerButton
 
 var _templateObject, _templateObject2;
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 /*
     NOTE: color used here are not yet in atlaskit code

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

@@ -45,9 +45,9 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 var HorizontalFields = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n"])));
 

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

@@ -53,9 +53,9 @@ var _colors = require("@atlaskit/theme/colors");
 
 var _templateObject, _templateObject2;
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 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); }; }
 

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

@@ -29,9 +29,9 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function RadioField(_ref) {
   var name = _ref.name,

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

@@ -25,6 +25,8 @@ var _FieldMessages = _interopRequireDefault(require("../FieldMessages"));
 
 var _utils = require("../utils");
 
+var _excluded = ["onChange"];
+
 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; }
@@ -54,7 +56,7 @@ function String(_ref) {
 
     if (field.style === 'multiline') {
       var _onChange = fieldProps.onChange,
-          restFieldProps = (0, _objectWithoutProperties2.default)(fieldProps, ["onChange"]);
+          restFieldProps = (0, _objectWithoutProperties2.default)(fieldProps, _excluded);
       var options = field.options;
       return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_textarea.default, (0, _extends2.default)({}, restFieldProps, options, {
         onChange: function onChange(e) {

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

@@ -33,6 +33,8 @@ var _utils = require("../utils");
 
 var _FieldMessages = _interopRequireDefault(require("../FieldMessages"));
 
+var _excluded = ["value"];
+
 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; }
@@ -115,7 +117,7 @@ function SafeSmartUserPicker(_ref) {
       _context$includeUsers = context.includeUsers,
       includeUsers = _context$includeUsers === void 0 ? true : _context$includeUsers;
   var safeValue = formFieldProps.value,
-      formFieldPropsRest = (0, _objectWithoutProperties2.default)(formFieldProps, ["value"]);
+      formFieldPropsRest = (0, _objectWithoutProperties2.default)(formFieldProps, _excluded);
   var isMultiple = field.isMultiple,
       placeholder = field.placeholder;
 

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

@@ -46,9 +46,9 @@ var _utils = require("./utils");
 
 var _FormErrorBoundary = require("./FormErrorBoundary");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function FieldComponent(_ref) {
   var _parameters$errors;

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

@@ -73,10 +73,13 @@ var Header = function Header(_ref) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Item, null, /*#__PURE__*/_react.default.createElement(ItemIcon, null, /*#__PURE__*/_react.default.createElement(ResolvedIcon, {
     label: title
   })), /*#__PURE__*/_react.default.createElement(ItemBody, null, summary ? /*#__PURE__*/_react.default.createElement(ItemText, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "item-title"
+    className: "item-title",
+    id: "context-panel-title"
   }, title), /*#__PURE__*/_react.default.createElement("div", {
     className: "item-summary"
-  }, summary)) : /*#__PURE__*/_react.default.createElement(CenteredItemTitle, null, title)), /*#__PURE__*/_react.default.createElement(CloseButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_customThemeButton.default, {
+  }, summary)) : /*#__PURE__*/_react.default.createElement(CenteredItemTitle, {
+    id: "context-panel-title"
+  }, title)), /*#__PURE__*/_react.default.createElement(CloseButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_customThemeButton.default, {
     appearance: "subtle",
     iconBefore: /*#__PURE__*/_react.default.createElement(_cross.default, {
       label: intl.formatMessage(_messages.messages.close)