@atlaskit/editor-common 60.3.0 → 61.0.0

package/CHANGELOG.md

@@ -1,5 +1,48 @@
 # @atlaskit/editor-common
 
+## 61.0.0
+
+### Major Changes
+
+- [`fd675db8754`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fd675db8754) - [ux] ED-13100: added GroupedField.hasGroupedValues and enable parameter flattening for expand/tab-group/tab fields in config panels. The default value of `GroupedField.hasGroupedValues` is `False`, which will flatten data structures. Set `GroupedField.hasGroupedValues` to `True` on all tab-group/tab/expand fields if you wish to retain existing behaviour.
+
+  This change has several parts to ensure the correctness of serialize(), deserialize(), GroupedField.hasGroupedValues and BaseFieldDefinition.allowDuplicates
+
+  - Introduced GroupedField.hasGroupedValues which allows expand/tabgroup/tab to store the value of its fields by the name of the expand/tabgroup/tab if hasGroupedValues=True (False by default)
+  - Fixed a type safety issue with Parameters and ParametersWithDuplicateFields where Typescript would consider the types Parameters = Parameters[] (resolves some inconsistencies in the editor code and extensions)
+  - Restrict allowDuplicates so it only works within Fieldset as originally intended
+  - serialize() now populates `Field.defaultValue` as expected
+
+### Minor Changes
+
+- [`3a2a5e14fdc`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3a2a5e14fdc) - As we are moving to full schema, merged the customPanel nodeSpec with panel nodeSpec
+- [`d8b414ed707`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d8b414ed707) - CETI-170 Emoji vertical alignment in Firefox
+- [`23514411f27`](https://bitbucket.org/atlassian/atlassian-frontend/commits/23514411f27) - CETI-134 added support to render dark colors for the custom panels in the dark mode
+- [`8581ed429dd`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8581ed429dd) - ED-13688: Add reliability edit sessions to UFO analytics
+- [`b230f366971`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b230f366971) - [ED-14008] Bump prosemirror-view from 1.20.2 to 1.23.1
+- [`47c349601b2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/47c349601b2) - ED-13869 Added the option to automatically select ADF content inserted via the `insertAfter()` extension API. We've modified our extension API and introduced a new parameter in `insertAfter()`. The function has now a third parameter, ie `options`, which is an object and has a property flag called `allowSelectionToNewNode` that lets you focus on the ADF added when set to `true`.
+- [`8bbb96540ea`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8bbb96540ea) - Add "fragment" mark to stage0 ADF schema
+- [`a3737a9b3aa`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a3737a9b3aa) - CETI-64 Updating the dark mode colors for the standard panels
+- [`d21da111ec2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d21da111ec2) - CETI-95 Predefined icon sizes are different from existing icons
+
+### Patch Changes
+
+- [`c6feed82071`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c6feed82071) - ED-11632: Bump prosemirror packages;
+
+  - prosmirror-commands 1.1.4 -> 1.1.11,
+  - prosemirror-model 1.11.0 -> 1.14.3,
+  - prosemirror-state 1.3.3 -> 1.3.4,
+  - prosemirror-transform 1.2.8 -> 1.3.2,
+  - prosemirror-view 1.15.4 + 1.18.8 -> 1.20.2.
+
+- [`b1034ea4393`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b1034ea4393) - ED-13752 Added child entry points for each export in editor-common root entry point file
+- [`d44279ef8dd`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d44279ef8dd) - [ux] Fixes the issue on mobile when the media file is set to wrap-left and the table below has a numbered column. Adds a css rule to pm-table-container[data-number-column='true']
+- [`17552f32a6c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/17552f32a6c) - CONFDEV-77488 Updated the reference entity type
+- [`8f0577e0eb1`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8f0577e0eb1) - [ux] Promoted captions to full schema and better support of wikimarkup, email and slack renderer
+- [`a82305310db`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a82305310db) - [ux] ED-7449: Sort cells in a given table column based on case sensitivity of same letter then on alphabet+ascii code values
+- [`9d43feb1f6a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d43feb1f6a) - CETI-167 Remove opacity for panels in dark mode.
+- Updated dependencies
+
 ## 60.3.0
 
 ### Minor Changes

package/card/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@atlaskit/editor-common/card",
+  "main": "../dist/cjs/card/index.js",
+  "module": "../dist/esm/card/index.js",
+  "module:es2019": "../dist/es2019/card/index.js",
+  "types": "../dist/types/card/index.d.ts"
+}

package/dist/cjs/card/cardOptions.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/emoji.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Emoji", {
+  enumerable: true,
+  get: function get() {
+    return _Emoji.default;
+  }
+});
+Object.defineProperty(exports, "EmojiSharedCssClassName", {
+  enumerable: true,
+  get: function get() {
+    return _emoji.EmojiSharedCssClassName;
+  }
+});
+
+var _Emoji = _interopRequireDefault(require("./ui/Emoji"));
+
+var _emoji = require("./styles/shared/emoji");

package/dist/cjs/extensions/index.js

@@ -17,6 +17,12 @@ Object.defineProperty(exports, "isTabGroup", {
     return _types.isTabGroup;
   }
 });
+Object.defineProperty(exports, "isTabField", {
+  enumerable: true,
+  get: function get() {
+    return _types.isTabField;
+  }
+});
 Object.defineProperty(exports, "isExpand", {
   enumerable: true,
   get: function get() {

package/dist/cjs/extensions/types/field-definitions.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isDateRange = exports.isExpand = exports.isTabGroup = exports.isFieldset = void 0;
+exports.isDateRange = exports.isExpand = exports.isTabField = exports.isTabGroup = exports.isFieldset = void 0;
 
 // Radio fields are different, they cannot be deselected by a user
 //   Thereby they _always_ need a value for submission
@@ -21,6 +21,12 @@ var isTabGroup = function isTabGroup(field) {
 
 exports.isTabGroup = isTabGroup;
 
+var isTabField = function isTabField(field) {
+  return 'type' in field && field.type === 'tab';
+};
+
+exports.isTabField = isTabField;
+
 var isExpand = function isExpand(field) {
   return field.type === 'expand';
 };

package/dist/cjs/extensions/types/index.js

@@ -15,6 +15,12 @@ Object.defineProperty(exports, "isTabGroup", {
     return _fieldDefinitions.isTabGroup;
   }
 });
+Object.defineProperty(exports, "isTabField", {
+  enumerable: true,
+  get: function get() {
+    return _fieldDefinitions.isTabField;
+  }
+});
 Object.defineProperty(exports, "isExpand", {
   enumerable: true,
   get: function get() {

package/dist/cjs/extensions.js

@@ -99,6 +99,12 @@ Object.defineProperty(exports, "isTabGroup", {
     return _index.isTabGroup;
   }
 });
+Object.defineProperty(exports, "isTabField", {
+  enumerable: true,
+  get: function get() {
+    return _index.isTabField;
+  }
+});
 Object.defineProperty(exports, "isExpand", {
   enumerable: true,
   get: function get() {

package/dist/cjs/index.js

@@ -549,6 +549,12 @@ Object.defineProperty(exports, "getPanelTypeBackground", {
     return _styles.getPanelTypeBackground;
   }
 });
+Object.defineProperty(exports, "getPanelBackgroundDarkModeColors", {
+  enumerable: true,
+  get: function get() {
+    return _styles.getPanelBackgroundDarkModeColors;
+  }
+});
 Object.defineProperty(exports, "panelSharedStyles", {
   enumerable: true,
   get: function get() {

package/dist/cjs/mention.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Mention", {
+  enumerable: true,
+  get: function get() {
+    return _Mention.default;
+  }
+});
+Object.defineProperty(exports, "MentionSharedCssClassName", {
+  enumerable: true,
+  get: function get() {
+    return _mention.MentionSharedCssClassName;
+  }
+});
+
+var _Mention = _interopRequireDefault(require("./ui/Mention"));
+
+var _mention = require("./styles/shared/mention");

package/dist/cjs/styles/index.js

@@ -141,6 +141,12 @@ Object.defineProperty(exports, "PanelSharedSelectors", {
     return _panel.PanelSharedSelectors;
   }
 });
+Object.defineProperty(exports, "getPanelBackgroundDarkModeColors", {
+  enumerable: true,
+  get: function get() {
+    return _panel.getPanelBackgroundDarkModeColors;
+  }
+});
 Object.defineProperty(exports, "ruleSharedStyles", {
   enumerable: true,
   get: function get() {

package/dist/cjs/styles/shared/panel.js

@@ -7,10 +7,13 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.panelSharedStyles = exports.getPanelTypeBackground = exports.PanelSharedSelectors = exports.PanelSharedCssClassName = void 0;
+exports.getPanelDarkModeCSS = getPanelDarkModeCSS;
+exports.panelSharedStyles = exports.getPanelTypeBackground = exports.PanelSharedSelectors = exports.PanelSharedCssClassName = exports.getPanelBackgroundDarkModeColors = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _styledComponents = require("styled-components");
 
 var _adfSchema = require("@atlaskit/adf-schema");
@@ -41,22 +44,67 @@ var lightPanelColor = {
   warning: colors.Y50,
   error: colors.R50
 };
-var darkPanelOpacity = 0.64;
-var darkPanelColor = {
-  info: colors.B500,
-  note: colors.P500,
-  tip: colors.G500,
-  success: colors.G500,
-  warning: colors.Y500,
-  error: colors.R500
-};
-var darkPanelBorderColor = {
-  info: colors.B400,
-  note: colors.P400,
-  tip: colors.G400,
-  success: colors.G400,
-  warning: colors.Y400,
-  error: colors.R400
+var darkPanelColors = {
+  // standard panels
+  info: '#0C294F',
+  error: "#441C13",
+  warning: "#413001",
+  tip: "#052E21",
+  success: "#052E21",
+  note: "#282249",
+  // Reds
+  R900: '#601D16',
+  // Red Saturated
+  R100S: "#FFEFEB",
+  R300S: "#FFB5A3",
+  R500S: "#FF6B47",
+  R800S: "#C4320E",
+  R1200S: "#441C13",
+  // Yellows
+  Y900: '#533F04',
+  // Yellow Saturated
+  Y100S: "#FFF3D1",
+  Y300S: "#FFDC7A",
+  Y500S: "#FFC933",
+  Y800S: "#D8A003",
+  Y1200S: "#413001",
+  // Greens
+  G900: '#164B35',
+  // Green Saturated
+  G100S: "#E3FCF0",
+  G300S: "#95EEC5",
+  G400S: "#60DCA8",
+  G900S: "#086848",
+  G1200S: "#052E21",
+  // Blues
+  B900: '#09326C',
+  // Saturated Blues
+  B100S: '#E5F0FF',
+  B300S: '#A3C9FF',
+  B500S: '#4794FF',
+  B800S: '#0055CC',
+  B1200S: '#0C294F',
+  // Purples
+  P900: "#352C63",
+  // Purple Saturated
+  P100S: "#EEEBFF",
+  P300S: "#CCC3FE",
+  P500S: "#A292F7",
+  P800S: "#5E49CA",
+  P1200S: "#282249",
+  // Teals
+  T900: '#1D474C',
+  // Teal Saturated
+  T100S: "#DBFAFF",
+  T300S: "#78EBFC",
+  T400S: "#3AD6EE",
+  T900S: "#056270",
+  T1200S: "#0B3037",
+  // Dark Mode Alpha
+  DNA20A: 'rgba(150, 176, 210, 0.53)',
+  DNA40A: 'rgba(134, 156, 180, 0.29)',
+  DNA80A: '#161A1D',
+  TextColor: '#D9DDE3'
 };
 var lightIconColor = {
   info: colors.B400,
@@ -73,16 +121,24 @@ var darkIconColor = {
   success: colors.G200,
   warning: colors.Y100,
   error: colors.R200
-};
-var darkTextColor = {
-  info: colors.B75,
-  note: colors.P75,
-  tip: colors.G75,
-  success: colors.G75,
-  warning: colors.Y75,
-  error: colors.R75
-};
-var verticalAlignment = -(((0, _constants.gridSize)() * 3 - _consts.akEditorCustomIconSize) / 2);
+}; // New custom icons are a little smaller than predefined icons.
+// To fix alignment issues with custom icons, vertical alignment is updated.
+
+var panelEmojiSpriteVerticalAlignment = -((0, _constants.gridSize)() * 3 - _consts.akEditorCustomIconSize) / 2;
+var panelEmojiImageVerticalAlignment = panelEmojiSpriteVerticalAlignment - 1;
+var getPanelBackgroundDarkModeColors = [[colors.B50, darkPanelColors.B1200S], [colors.B75, darkPanelColors.B900], [colors.B100, darkPanelColors.B800S], [colors.N0, darkPanelColors.DNA80A], [colors.N20, darkPanelColors.DNA40A], [colors.N60, darkPanelColors.DNA20A], [colors.T50, darkPanelColors.T1200S], [colors.T75, darkPanelColors.T900], [colors.T100, darkPanelColors.T900S], [colors.G50, darkPanelColors.G1200S], [colors.G75, darkPanelColors.G900], [colors.G200, darkPanelColors.G900S], [colors.Y50, darkPanelColors.Y1200S], [colors.Y75, darkPanelColors.Y900], [colors.Y200, darkPanelColors.Y800S], [colors.R50, darkPanelColors.R1200S], [colors.R75, darkPanelColors.R900], [colors.R100, darkPanelColors.R800S], [colors.P50, darkPanelColors.P1200S], [colors.P75, darkPanelColors.P900], [colors.P100, darkPanelColors.P800S]].map(function (_ref) {
+  var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
+      colorName = _ref2[0],
+      colorValue = _ref2[1];
+
+  return getPanelDarkModeCSS(colorName, colorValue);
+}).join('\n');
+exports.getPanelBackgroundDarkModeColors = getPanelBackgroundDarkModeColors;
+
+function getPanelDarkModeCSS(colorName, colorValue) {
+  return "\n  &[data-panel-color=\"".concat(colorName, "\"] {\n    background-color: ").concat(colorValue, " !important; // !important to override default style color\n    color: ").concat(darkPanelColors.TextColor, ";\n  }\n  ");
+}
+
 var prefix = 'ak-editor-panel';
 var PanelSharedCssClassName = {
   prefix: prefix,
@@ -122,7 +178,7 @@ var iconDynamicStyles = function iconDynamicStyles(panelType) {
 var getPanelTypeBackground = function getPanelTypeBackground(panelType) {
   var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   var light = lightPanelColor[panelType];
-  var dark = (0, _adfSchema.hexToRgba)(darkPanelColor[panelType], darkPanelOpacity);
+  var dark = darkPanelColors[panelType];
   var background = (0, _components.themed)({
     light: light,
     dark: dark
@@ -135,19 +191,15 @@ exports.getPanelTypeBackground = getPanelTypeBackground;
 var mainDynamicStyles = function mainDynamicStyles(panelType) {
   return function (props) {
     var background = getPanelTypeBackground(panelType, props);
-    var darkText = darkTextColor[panelType];
-    var darkBorder = '1px solid ' + darkPanelBorderColor[panelType];
-    var border = (0, _components.themed)({
-      light: 'none',
-      dark: darkBorder
-    })(props);
     var text = (0, _components.themed)({
       light: 'inherit',
-      dark: darkText
+      dark: darkPanelColors.TextColor
     })(props);
-    return "\n    background-color: ".concat(background, ";\n    border: ").concat(border, ";\n    color: ").concat(text, ";\n  ");
+    return "\n    background-color: ".concat(background, ";\n    color: ").concat(text, ";\n  ");
   };
 };
 
-var panelSharedStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    border-radius: ", "px;\n    margin: ", " 0 0;\n    padding: ", "px;\n    min-width: ", "px;\n    display: flex;\n    position: relative;\n    align-items: baseline;\n    word-break: break-word;\n\n    ", "\n\n    .", " {\n      flex-shrink: 0;\n      height: ", "px;\n      width: ", "px;\n      box-sizing: content-box;\n      padding-right: ", "px;\n      text-align: center;\n      user-select: none;\n      -moz-user-select: none;\n      -webkit-user-select: none;\n      -ms-user-select: none;\n      ", "\n\n      > span {\n        vertical-align: middle;\n        display: inline;\n      }\n\n      .", ", .", " {\n        vertical-align: ", "px;\n      }\n    }\n\n    .ak-editor-panel__content {\n      margin: 1px 0 1px;\n      flex: 1 0 0;\n      /*\n        https://ishadeed.com/article/min-max-css/#setting-min-width-to-zero-with-flexbox\n        The default value for min-width is auto, which is computed to zero. When an element is a flex item, the value of min-width doesn\u2019t compute to zero. The minimum size of a flex item is equal to the size of its contents.\n      */\n      min-width: 0;\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n  }\n"])), PanelSharedCssClassName.prefix, (0, _constants.borderRadius)(), _editorSharedStyles.blockNodesVerticalMargin, (0, _constants.gridSize)(), _editorSharedStyles.akEditorTableCellMinWidth, mainDynamicStyles(_adfSchema.PanelType.INFO), PanelSharedCssClassName.icon, (0, _constants.gridSize)() * 3, (0, _constants.gridSize)() * 3, (0, _constants.gridSize)(), iconDynamicStyles(_adfSchema.PanelType.INFO), _emoji.emojiSprite, _emoji.emojiImage, verticalAlignment, _adfSchema.PanelType.NOTE, mainDynamicStyles(_adfSchema.PanelType.NOTE), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.NOTE), _adfSchema.PanelType.TIP, mainDynamicStyles(_adfSchema.PanelType.TIP), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.TIP), _adfSchema.PanelType.WARNING, mainDynamicStyles(_adfSchema.PanelType.WARNING), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.WARNING), _adfSchema.PanelType.ERROR, mainDynamicStyles(_adfSchema.PanelType.ERROR), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.ERROR), _adfSchema.PanelType.SUCCESS, mainDynamicStyles(_adfSchema.PanelType.SUCCESS), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.SUCCESS));
+var panelSharedStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    border-radius: ", "px;\n    margin: ", " 0 0;\n    padding: ", "px;\n    min-width: ", "px;\n    display: flex;\n    position: relative;\n    align-items: baseline;\n    word-break: break-word;\n\n    ", "\n\n    .", " {\n      flex-shrink: 0;\n      height: ", "px;\n      width: ", "px;\n      box-sizing: content-box;\n      padding-right: ", "px;\n      text-align: center;\n      user-select: none;\n      -moz-user-select: none;\n      -webkit-user-select: none;\n      -ms-user-select: none;\n      ", "\n\n      > span {\n        vertical-align: middle;\n        display: inline;\n      }\n\n      .", " {\n        vertical-align: ", "px;\n      }\n\n      .", " {\n        vertical-align: ", "px;\n\n        // Vertical align only works for inline-block elements in Firefox\n        @-moz-document url-prefix() {\n          img {\n            display: inline-block;\n          }\n        }\n      }\n    }\n\n    .ak-editor-panel__content {\n      margin: 1px 0 1px;\n      flex: 1 0 0;\n      /*\n        https://ishadeed.com/article/min-max-css/#setting-min-width-to-zero-with-flexbox\n        The default value for min-width is auto, which is computed to zero. When an element is a flex item, the value of min-width doesn\u2019t compute to zero. The minimum size of a flex item is equal to the size of its contents.\n      */\n      min-width: 0;\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", ";\n    }\n  }\n"])), PanelSharedCssClassName.prefix, (0, _constants.borderRadius)(), _editorSharedStyles.blockNodesVerticalMargin, (0, _constants.gridSize)(), _editorSharedStyles.akEditorTableCellMinWidth, mainDynamicStyles(_adfSchema.PanelType.INFO), PanelSharedCssClassName.icon, (0, _constants.gridSize)() * 3, (0, _constants.gridSize)() * 3, (0, _constants.gridSize)(), iconDynamicStyles(_adfSchema.PanelType.INFO), _emoji.emojiSprite, panelEmojiSpriteVerticalAlignment, _emoji.emojiImage, panelEmojiImageVerticalAlignment, _adfSchema.PanelType.NOTE, mainDynamicStyles(_adfSchema.PanelType.NOTE), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.NOTE), _adfSchema.PanelType.TIP, mainDynamicStyles(_adfSchema.PanelType.TIP), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.TIP), _adfSchema.PanelType.WARNING, mainDynamicStyles(_adfSchema.PanelType.WARNING), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.WARNING), _adfSchema.PanelType.ERROR, mainDynamicStyles(_adfSchema.PanelType.ERROR), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.ERROR), _adfSchema.PanelType.SUCCESS, mainDynamicStyles(_adfSchema.PanelType.SUCCESS), PanelSharedCssClassName.icon, iconDynamicStyles(_adfSchema.PanelType.SUCCESS), _adfSchema.PanelType.CUSTOM, (0, _components.themed)({
+  dark: getPanelBackgroundDarkModeColors
+}));
 exports.panelSharedStyles = panelSharedStyles;

package/dist/cjs/styles/shared/table.js

@@ -54,7 +54,7 @@ var TableSharedCssClassName = {
   TABLE_CELL_WRAPPER: _adfSchema.tableCellSelector
 };
 exports.TableSharedCssClassName = TableSharedCssClassName;
-var tableSharedStyle = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    position: relative;\n    margin: 0 auto ", "px;\n    box-sizing: border-box;\n\n    /**\n     * Fix block top alignment inside table cells.\n     */\n    .decisionItemView-content-wrap:first-child > div {\n      margin-top: 0;\n    }\n  }\n  .", "[data-number-column='true'] {\n    padding-left: ", "px;\n  }\n  /* avoid applying styles to nested tables (possible via extensions) */\n  .", " > table,\n  .", " > table,\n  .", " > table {\n    border-collapse: collapse;\n    margin: ", "px ", "px 0 0;\n    border: ", "px solid\n      ", ";\n    table-layout: fixed;\n    font-size: 1em;\n    width: 100%;\n\n    &[data-autosize='true'] {\n      table-layout: auto;\n    }\n\n    & {\n      * {\n        box-sizing: border-box;\n      }\n      hr {\n        box-sizing: content-box;\n      }\n\n      tbody {\n        border-bottom: none;\n      }\n      th td {\n        background-color: white;\n      }\n      th,\n      td {\n        min-width: ", "px;\n        font-weight: normal;\n        vertical-align: top;\n        border: 1px solid\n          ", ";\n        border-right-width: 0;\n        border-bottom-width: 0;\n        padding: ", "px;\n        /* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */\n        ", "\n\n        ", ";\n\n        > *:first-child {\n          margin-top: 0;\n        }\n\n        > .ProseMirror-gapcursor.-right:first-child + * {\n          margin-top: 0;\n        }\n\n        > .ProseMirror-gapcursor:first-child + span + * {\n          margin-top: 0;\n        }\n\n        th p:not(:first-of-type),\n        td p:not(:first-of-type) {\n          margin-top: 12px;\n        }\n      }\n      th {\n        background-color: ", ";\n        text-align: left;\n\n        /* only apply this styling to codeblocks in default background headercells */\n        /* TODO this needs to be overhauled as it relies on unsafe selectors */\n        &:not([style]) {\n          .code-block {\n            background-image: ", ";\n            background-attachment: local, scroll, scroll;\n            background-position: 100% 0, 100% 0, 0 0;\n            background-color: ", ";\n\n            .line-number-gutter {\n              background-color: ", ";\n            }\n\n            /* this is only relevant to the element taken care of by renderer */\n            > [data-ds--code--code-block] {\n              background-image: ", "!important;\n\n              background-color: ", "!important;\n\n              // selector lives inside @atlaskit/code\n              --ds--code--line-number-bg-color: ", ";\n            }\n          }\n        }\n      }\n    }\n  }\n"])), TableSharedCssClassName.TABLE_CONTAINER, tableMarginBottom, TableSharedCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth - 1, TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, tableMarginTop, tableMarginSides, tableCellBorderWidth, (0, _components.themed)({
+var tableSharedStyle = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    position: relative;\n    margin: 0 auto ", "px;\n    box-sizing: border-box;\n\n    /**\n     * Fix block top alignment inside table cells.\n     */\n    .decisionItemView-content-wrap:first-child > div {\n      margin-top: 0;\n    }\n  }\n  .", "[data-number-column='true'] {\n    padding-left: ", "px;\n    clear: both;\n  }\n  /* avoid applying styles to nested tables (possible via extensions) */\n  .", " > table,\n  .", " > table,\n  .", " > table {\n    border-collapse: collapse;\n    margin: ", "px ", "px 0 0;\n    border: ", "px solid\n      ", ";\n    table-layout: fixed;\n    font-size: 1em;\n    width: 100%;\n\n    &[data-autosize='true'] {\n      table-layout: auto;\n    }\n\n    & {\n      * {\n        box-sizing: border-box;\n      }\n      hr {\n        box-sizing: content-box;\n      }\n\n      tbody {\n        border-bottom: none;\n      }\n      th td {\n        background-color: white;\n      }\n      th,\n      td {\n        min-width: ", "px;\n        font-weight: normal;\n        vertical-align: top;\n        border: 1px solid\n          ", ";\n        border-right-width: 0;\n        border-bottom-width: 0;\n        padding: ", "px;\n        /* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */\n        ", "\n\n        ", ";\n\n        > *:first-child {\n          margin-top: 0;\n        }\n\n        > .ProseMirror-gapcursor.-right:first-child + * {\n          margin-top: 0;\n        }\n\n        > .ProseMirror-gapcursor:first-child + span + * {\n          margin-top: 0;\n        }\n\n        th p:not(:first-of-type),\n        td p:not(:first-of-type) {\n          margin-top: 12px;\n        }\n      }\n      th {\n        background-color: ", ";\n        text-align: left;\n\n        /* only apply this styling to codeblocks in default background headercells */\n        /* TODO this needs to be overhauled as it relies on unsafe selectors */\n        &:not([style]) {\n          .code-block {\n            background-image: ", ";\n            background-attachment: local, scroll, scroll;\n            background-position: 100% 0, 100% 0, 0 0;\n            background-color: ", ";\n\n            .line-number-gutter {\n              background-color: ", ";\n            }\n\n            /* this is only relevant to the element taken care of by renderer */\n            > [data-ds--code--code-block] {\n              background-image: ", "!important;\n\n              background-color: ", "!important;\n\n              // selector lives inside @atlaskit/code\n              --ds--code--line-number-bg-color: ", ";\n            }\n          }\n        }\n      }\n    }\n  }\n"])), TableSharedCssClassName.TABLE_CONTAINER, tableMarginBottom, TableSharedCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth - 1, TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, tableMarginTop, tableMarginSides, tableCellBorderWidth, (0, _components.themed)({
   light: _editorSharedStyles.akEditorTableBorder,
   dark: _editorSharedStyles.akEditorTableBorderDark
 }), tableCellMinWidth, (0, _components.themed)({

package/dist/cjs/ufo/experience-store.js

@@ -30,6 +30,7 @@ exports.EditorExperience = EditorExperience;
   EditorExperience["loadEditor"] = "load";
   EditorExperience["typing"] = "type";
   EditorExperience["interaction"] = "interact";
+  EditorExperience["editSession"] = "editSession";
 })(EditorExperience || (exports.EditorExperience = EditorExperience = {}));
 
 var RELIABILITY_INTERVAL = 30000;
@@ -92,7 +93,7 @@ var ExperienceStore = /*#__PURE__*/function () {
     value: function success(experienceId, metadata) {
       var _this$getActive;
 
-      (_this$getActive = this.getActive(experienceId)) === null || _this$getActive === void 0 ? void 0 : _this$getActive.success({
+      return (_this$getActive = this.getActive(experienceId)) === null || _this$getActive === void 0 ? void 0 : _this$getActive.success({
         metadata: metadata
       });
     }

package/dist/cjs/utils/compareNodes.js

@@ -146,6 +146,12 @@ function compareValue(valueA, valueB) {
     return 0;
   }
 
+  if (typeof valueA === 'string' && typeof valueB === 'string') {
+    return valueA.localeCompare(valueB, window.navigator.language, {
+      caseFirst: 'upper'
+    });
+  }
+
   return valueA > valueB ? 1 : -1;
 }
 /**

package/dist/cjs/utils/index.js

@@ -341,6 +341,18 @@ Object.defineProperty(exports, "RenderCountProfiler", {
     return _renderCount.RenderCountProfiler;
   }
 });
+Object.defineProperty(exports, "validateADFEntity", {
+  enumerable: true,
+  get: function get() {
+    return _validateUsingSpec.validateADFEntity;
+  }
+});
+Object.defineProperty(exports, "validationErrorHandler", {
+  enumerable: true,
+  get: function get() {
+    return _validateUsingSpec.validationErrorHandler;
+  }
+});
 
 var _annotation = require("./annotation");
 
@@ -390,4 +402,6 @@ var _getModeFromTheme = require("./getModeFromTheme");
 
 var _browserExtensions = require("./browser-extensions");
 
-var _renderCount = require("./profiler/render-count");
+var _renderCount = require("./profiler/render-count");
+
+var _validateUsingSpec = require("./validate-using-spec");

package/dist/cjs/utils/validator.js

@@ -27,7 +27,7 @@ exports.ADFStages = ADFStages;
  * It's important that this order follows the marks rank defined here:
  * https://product-fabric.atlassian.net/wiki/spaces/E/pages/11174043/Document+structure#Documentstructure-Rank
  */
-var markOrder = ['link', 'em', 'strong', 'textColor', 'strike', 'subsup', 'underline', 'code', 'confluenceInlineComment', 'annotation', 'dataConsumer'];
+var markOrder = ['fragment', 'link', 'em', 'strong', 'textColor', 'strike', 'subsup', 'underline', 'code', 'confluenceInlineComment', 'annotation', 'dataConsumer'];
 exports.markOrder = markOrder;
 
 var isSubSupType = function isSubSupType(type) {
@@ -377,7 +377,7 @@ var getValidNode = function getValidNode(originalNode) {
 
       case 'caption':
         {
-          if (content && adfStage === 'stage0') {
+          if (content) {
             return {
               type: type,
               content: content
@@ -669,23 +669,12 @@ var getValidNode = function getValidNode(originalNode) {
       case 'panel':
         {
           if (attrs && content) {
-            var panelType = attrs.panelType,
-                panelIcon = attrs.panelIcon,
-                panelColor = attrs.panelColor;
+            var panelType = attrs.panelType;
 
             if (Object.values(_adfSchema.PanelType).includes(panelType)) {
-              // TODO: ED-10445 remove stage0 check
-              var _attrs = adfStage === 'stage0' ? {
-                panelType: panelType,
-                panelIcon: panelIcon,
-                panelColor: panelColor
-              } : {
-                panelType: panelType
-              };
-
               return {
                 type: type,
-                attrs: _attrs,
+                attrs: attrs,
                 content: content
               };
             }
@@ -1023,6 +1012,14 @@ var getValidMark = function getValidMark(mark) {
             attrs: attrs
           };
         }
+
+      case 'fragment':
+        {
+          return {
+            type: type,
+            attrs: attrs
+          };
+        }
     }
   }
 

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "60.3.0",
+	"version": "61.0.0",
 	"sideEffects": false
 }

package/dist/es2019/card/cardOptions.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/emoji.js

@@ -0,0 +1,2 @@
+export { default as Emoji } from './ui/Emoji';
+export { EmojiSharedCssClassName } from './styles/shared/emoji';

package/dist/es2019/extensions/index.js

@@ -1,4 +1,4 @@
-export { isFieldset, isTabGroup, isExpand, isDateRange } from './types';
+export { isFieldset, isTabGroup, isTabField, isExpand, isDateRange } from './types';
 export { getExtensionKeyAndNodeKey, resolveImport } from './manifest-helpers';
 export { default as DefaultExtensionProvider } from './default-extension-provider';
 export { createAutoConverterRunner, getExtensionAutoConvertersFromProvider, getQuickInsertItemsFromModule, getContextualToolbarItemsFromModule, buildMenuItem } from './module-helpers';

package/dist/es2019/extensions/types/field-definitions.js

@@ -8,6 +8,9 @@ export const isFieldset = field => {
 export const isTabGroup = field => {
   return field.type === 'tab-group';
 };
+export const isTabField = field => {
+  return 'type' in field && field.type === 'tab';
+};
 export const isExpand = field => {
   return field.type === 'expand';
 };

package/dist/es2019/extensions/types/index.js

@@ -1 +1 @@
-export { isFieldset, isTabGroup, isExpand, isDateRange } from './field-definitions';
+export { isFieldset, isTabGroup, isTabField, isExpand, isDateRange } from './field-definitions';

package/dist/es2019/extensions.js

@@ -1 +1 @@
-export { DefaultExtensionProvider, combineExtensionProviders, createAutoConverterRunner, getExtensionAutoConvertersFromProvider, getExtensionKeyAndNodeKey, getExtensionModuleNode, getQuickInsertItemsFromModule, getNodeRenderer, getExtensionModuleNodePrivateProps, getContextualToolbarItemsFromModule, resolveImport, getCustomFieldResolver, getFieldSerializer, getFieldDeserializer, isFieldset, isTabGroup, isExpand, isDateRange, getUserFieldContextProvider, buildMenuItem } from './extensions/index';
+export { DefaultExtensionProvider, combineExtensionProviders, createAutoConverterRunner, getExtensionAutoConvertersFromProvider, getExtensionKeyAndNodeKey, getExtensionModuleNode, getQuickInsertItemsFromModule, getNodeRenderer, getExtensionModuleNodePrivateProps, getContextualToolbarItemsFromModule, resolveImport, getCustomFieldResolver, getFieldSerializer, getFieldDeserializer, isFieldset, isTabGroup, isTabField, isExpand, isDateRange, getUserFieldContextProvider, buildMenuItem } from './extensions/index';

package/dist/es2019/index.js

@@ -1,9 +1,27 @@
-export { ADFTraversor, ErrorReporter, ZERO_WIDTH_SPACE, absoluteBreakoutWidth, browser, calcBreakoutWidth, breakoutConsts, calcTableColumnWidths, calcWideWidth, clearMeasure, compose, convertProsemirrorTableNodeToArrayOfRows, createCompareNodes, findAndTrackUnsupportedContentNodes, getAnalyticsAppearance, analyticsEventKey, getAnalyticsEventSeverity, getUnsupportedContentLevelData, UNSUPPORTED_CONTENT_LEVEL_SEVERITY_THRESHOLD_DEFAULTS, getExtensionLozengeData, getExtensionRenderer, getMarksByOrder, getModeFromTheme, getResponseEndTime, getValidContent, getValidDocument, getValidMark, getValidNode, getValidUnknownNode, hasMergedCell, isPastDate, isPerformanceAPIAvailable, isPerformanceObserverAvailable, isSameMark, isSubSupType, markOrder, measureRender, startMeasure, stopMeasure, measureTTI, getTTISeverity, TTI_SEVERITY_THRESHOLD_DEFAULTS, TTI_FROM_INVOCATION_SEVERITY_THRESHOLD_DEFAULTS, timestampToIsoFormat, timestampToString, timestampToTaskContext, timestampToUTCDate, todayTimestampInUTC, withImageLoader, canApplyAnnotationOnRange, getAnnotationIdsFromRange, SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, shouldForceTracking, sniffUserBrowserExtensions, RenderCountProfiler } from './utils';
-export { SortOrder, AnnotationUpdateEmitter, AnnotationUpdateEvent } from './types';
-export { DefaultExtensionProvider, combineExtensionProviders, getExtensionKeyAndNodeKey, getExtensionModuleNode, getExtensionModuleNodePrivateProps, getQuickInsertItemsFromModule, getNodeRenderer, getContextualToolbarItemsFromModule, buildMenuItem, resolveImport } from './extensions';
-export { ProviderFactory, WithProviders } from './provider-factory';
-export { combineProviders } from './provider-helpers';
-export { TableSharedCssClassName, blockMarksSharedStyles, blockquoteSharedStyles, calcTableWidth, codeMarkSharedStyles, columnLayoutSharedStyle, dateSharedStyle, DateSharedCssClassName, annotationSharedStyles, AnnotationSharedCSSByState, AnnotationSharedClassNames, headingsSharedStyles, indentationSharedStyles, inlineNodeSharedStyle, linkSharedStyle, listsSharedStyles, richMediaClassName, mediaSingleSharedStyle, getPanelTypeBackground, panelSharedStyles, PanelSharedCssClassName, PanelSharedSelectors, paragraphSharedStyles, ruleSharedStyles, shadowSharedStyle, tableCellBorderWidth, tableCellMinWidth, tableCellPadding, tableMarginBottom, tableMarginSides, tableMarginTop, tableNewColumnMinWidth, tableResizeHandleWidth, tableSharedStyle, tasksAndDecisionsStyles, TaskDecisionSharedCssClassName, whitespaceSharedStyles, MentionSharedCssClassName, EmojiSharedCssClassName, StatusSharedCssClassName, smartCardSharedStyles, SmartCardSharedCssClassName } from './styles';
-export { BaseTheme, Caption, ClearNextSiblingMarginTop, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH, Emoji, ErrorMessage, ExpandIconWrapper, ExpandLayoutWrapper, HelperMessage, MediaSingle, MediaSingleDimensionHelper, Mention, Popup, UnsupportedBlock, UnsupportedInline, ValidMessage, WidthConsumer, WidthProvider, WithCreateAnalyticsEvent, calcColumnsFromPx, calcPctFromPx, calcPxFromColumns, calcPxFromPct, expandMessages, findOverflowScrollParent, getBreakpoint, layoutSupportsWidth, mapBreakpointToLayoutMaxWidth, overflowShadow, shadowClassNames, sharedExpandStyles, snapToGrid, withOuterListeners, MediaLink, wrappedLayouts, shouldAddDefaultWrappedWidth } from './ui';
-export { linkMessages } from './messages/link';
+// new child entry point ./utils/index.ts
+export { ADFTraversor, ErrorReporter, ZERO_WIDTH_SPACE, absoluteBreakoutWidth, browser, calcBreakoutWidth, breakoutConsts, calcTableColumnWidths, calcWideWidth, clearMeasure, compose, convertProsemirrorTableNodeToArrayOfRows, createCompareNodes, findAndTrackUnsupportedContentNodes, getAnalyticsAppearance, analyticsEventKey, getAnalyticsEventSeverity, getUnsupportedContentLevelData, UNSUPPORTED_CONTENT_LEVEL_SEVERITY_THRESHOLD_DEFAULTS, getExtensionLozengeData, getExtensionRenderer, getMarksByOrder, getModeFromTheme, getResponseEndTime, getValidContent, getValidDocument, getValidMark, getValidNode, getValidUnknownNode, hasMergedCell, isPastDate, isPerformanceAPIAvailable, isPerformanceObserverAvailable, isSameMark, isSubSupType, markOrder, measureRender, startMeasure, stopMeasure, measureTTI, getTTISeverity, TTI_SEVERITY_THRESHOLD_DEFAULTS, TTI_FROM_INVOCATION_SEVERITY_THRESHOLD_DEFAULTS, timestampToIsoFormat, timestampToString, timestampToTaskContext, timestampToUTCDate, todayTimestampInUTC, withImageLoader, canApplyAnnotationOnRange, getAnnotationIdsFromRange, SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, shouldForceTracking, sniffUserBrowserExtensions, RenderCountProfiler } from './utils'; // new child entry point ./utils/index.ts
+
+// new child entry point ./types/index.ts
+export { SortOrder, AnnotationUpdateEmitter, AnnotationUpdateEvent } from './types'; // new child entry point ./types/index.ts
+
+// already exported by ./extensions.ts
+export { DefaultExtensionProvider, combineExtensionProviders, getExtensionKeyAndNodeKey, getExtensionModuleNode, getExtensionModuleNodePrivateProps, getQuickInsertItemsFromModule, getNodeRenderer, getContextualToolbarItemsFromModule, buildMenuItem, resolveImport } from './extensions'; // already exported by ./extensions.ts
+
+// already exported by ./provider-factory.ts
+export { ProviderFactory, WithProviders } from './provider-factory'; // already exported by ./provider-factory.ts
+
+// new child entry point ./provider-helpers/index.ts
+export { combineProviders } from './provider-helpers'; // already exported by ./styles/index.ts
+
+export { TableSharedCssClassName, blockMarksSharedStyles, blockquoteSharedStyles, calcTableWidth, codeMarkSharedStyles, columnLayoutSharedStyle, dateSharedStyle, DateSharedCssClassName, annotationSharedStyles, AnnotationSharedCSSByState, AnnotationSharedClassNames, headingsSharedStyles, indentationSharedStyles, inlineNodeSharedStyle, linkSharedStyle, listsSharedStyles, richMediaClassName, mediaSingleSharedStyle, getPanelTypeBackground, getPanelBackgroundDarkModeColors, panelSharedStyles, PanelSharedCssClassName, PanelSharedSelectors, paragraphSharedStyles, ruleSharedStyles, shadowSharedStyle, tableCellBorderWidth, tableCellMinWidth, tableCellPadding, tableMarginBottom, tableMarginSides, tableMarginTop, tableNewColumnMinWidth, tableResizeHandleWidth, tableSharedStyle, tasksAndDecisionsStyles, TaskDecisionSharedCssClassName, whitespaceSharedStyles, MentionSharedCssClassName, //exported from ./src/mention.ts
+EmojiSharedCssClassName, //exported from ./src/emoji.ts
+StatusSharedCssClassName, smartCardSharedStyles, SmartCardSharedCssClassName } from './styles'; // new child entry point ./ui/index.tsx
+
+export { BaseTheme, Caption, ClearNextSiblingMarginTop, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH, Emoji, //exported from ./src/emoji.ts
+ErrorMessage, ExpandIconWrapper, ExpandLayoutWrapper, HelperMessage, MediaSingle, MediaSingleDimensionHelper, Mention, //exported from ./src/mention.ts
+Popup, UnsupportedBlock, UnsupportedInline, ValidMessage, WidthConsumer, WidthProvider, WithCreateAnalyticsEvent, calcColumnsFromPx, calcPctFromPx, calcPxFromColumns, calcPxFromPct, expandMessages, findOverflowScrollParent, getBreakpoint, layoutSupportsWidth, mapBreakpointToLayoutMaxWidth, overflowShadow, shadowClassNames, sharedExpandStyles, snapToGrid, withOuterListeners, MediaLink, wrappedLayouts, shouldAddDefaultWrappedWidth } from './ui'; // new child entry point ./ui/index.tsx
+
+// already exported by ./messages/index.ts
+export { linkMessages } from './messages/link'; // new child entry point in ./utils/index.ts
+
 export { validateADFEntity, validationErrorHandler } from './utils/validate-using-spec';

package/dist/es2019/mention.js

@@ -0,0 +1,2 @@
+export { default as Mention } from './ui/Mention';
+export { MentionSharedCssClassName } from './styles/shared/mention';