@atlaskit/editor-common 103.12.1 → 103.14.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @atlaskit/editor-common
 
+## 103.14.0
+
+### Minor Changes
+
+- [#144699](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/144699)
+  [`5fdd28b98ea91`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5fdd28b98ea91) -
+  [ux] ED-25977 add underline to links in edit mode to fix a11y violation
+- [#144182](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/144182)
+  [`7da4b8d7e7d1b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7da4b8d7e7d1b) -
+  A11Y-9934: Add aria labels to i18n messages for media dropdowns in the floating toolbar.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 103.13.0
+
+### Minor Changes
+
+- [#144829](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/144829)
+  [`14b488c2295de`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/14b488c2295de) -
+  [ux] ED27537 Update alignment dropdown in media and embed card floating toolbar
+
 ## 103.12.1
 
 ### Patch Changes

package/dist/cjs/card/MediaAndEmbedsToolbar/index.js

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.wrappingIcons = exports.layoutToMessages = exports.default = exports.alignmentIcons = void 0;
+exports.wrappingIcons = exports.layoutToMessages = exports.default = exports.buildLayoutDropdown = exports.alignmentIcons = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
@@ -15,6 +15,9 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _alignImageCenter = _interopRequireDefault(require("@atlaskit/icon/core/align-image-center"));
 var _alignImageLeft = _interopRequireDefault(require("@atlaskit/icon/core/align-image-left"));
 var _alignImageRight = _interopRequireDefault(require("@atlaskit/icon/core/align-image-right"));
+var _alignTextCenter = _interopRequireDefault(require("@atlaskit/icon/core/align-text-center"));
+var _alignTextLeft = _interopRequireDefault(require("@atlaskit/icon/core/align-text-left"));
+var _alignTextRight = _interopRequireDefault(require("@atlaskit/icon/core/align-text-right"));
 var _contentWrapLeft = _interopRequireDefault(require("@atlaskit/icon/core/content-wrap-left"));
 var _contentWrapRight = _interopRequireDefault(require("@atlaskit/icon/core/content-wrap-right"));
 var _contentWidthWideEditorMediaWide = _interopRequireDefault(require("@atlaskit/icon/core/migration/content-width-wide--editor-media-wide"));
@@ -26,7 +29,9 @@ var _mediaWrapLeft = _interopRequireDefault(require("@atlaskit/icon/glyph/editor
 var _mediaWrapRight = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/media-wrap-right"));
 var _analytics = require("../../analytics");
 var _coreUtils = require("../../core-utils");
+var _keymaps = require("../../keymaps");
 var _messages = _interopRequireWildcard(require("../../messages"));
+var _ui = require("../../ui");
 var _utils2 = require("../../utils");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -69,6 +74,40 @@ var alignmentIcons = exports.alignmentIcons = [{
     });
   }
 }];
+var alignmentIconsControls = [{
+  id: 'editor.media.alignLeft',
+  value: 'align-start',
+  icon: function icon() {
+    return /*#__PURE__*/_react.default.createElement(_alignTextLeft.default, {
+      color: "currentColor",
+      spacing: "spacious",
+      label: ""
+    });
+  },
+  keyboardShortcut: _keymaps.alignLeft
+}, {
+  id: 'editor.media.alignCenter',
+  value: 'center',
+  icon: function icon() {
+    return /*#__PURE__*/_react.default.createElement(_alignTextCenter.default, {
+      color: "currentColor",
+      spacing: "spacious",
+      label: ""
+    });
+  },
+  keyboardShortcut: _keymaps.alignCenter
+}, {
+  id: 'editor.media.alignRight',
+  value: 'align-end',
+  icon: function icon() {
+    return /*#__PURE__*/_react.default.createElement(_alignTextRight.default, {
+      color: "currentColor",
+      spacing: "spacious",
+      label: ""
+    });
+  },
+  keyboardShortcut: _keymaps.alignRight
+}];
 var wrappingIcons = exports.wrappingIcons = [{
   id: 'editor.media.wrapLeft',
   value: 'wrap-left',
@@ -186,8 +225,35 @@ var mapIconsToToolbarItem = function mapIconsToToolbarItem(icons, layout, intl,
     });
   });
 };
-var shouldHideLayoutToolbar = function shouldHideLayoutToolbar(selection, _ref2, allowResizingInTables) {
-  var nodes = _ref2.nodes;
+var mapIconsToDropdownOptions = function mapIconsToDropdownOptions(_ref2) {
+  var icons = _ref2.icons,
+    layout = _ref2.layout,
+    intl = _ref2.intl,
+    nodeType = _ref2.nodeType,
+    widthPluginDependencyApi = _ref2.widthPluginDependencyApi,
+    analyticsApi = _ref2.analyticsApi,
+    isChangingLayoutDisabled = _ref2.isChangingLayoutDisabled,
+    allowPixelResizing = _ref2.allowPixelResizing;
+  return icons.map(function (layoutOption) {
+    var id = layoutOption.id,
+      value = layoutOption.value;
+    return _objectSpread(_objectSpread({
+      id: id,
+      icon: /*#__PURE__*/_react.default.createElement(layoutOption.icon, {
+        label: ""
+      }),
+      title: intl.formatMessage(layoutToMessages[value]),
+      selected: getToolbarLayout(layout, allowPixelResizing) === value,
+      onClick: makeAlign(value, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing)
+    }, layoutOption.keyboardShortcut && {
+      elemAfter: /*#__PURE__*/_react.default.createElement(_ui.Shortcut, null, (0, _keymaps.tooltip)(layoutOption.keyboardShortcut))
+    }), isChangingLayoutDisabled && {
+      disabled: value !== 'center'
+    });
+  });
+};
+var shouldHideLayoutToolbar = function shouldHideLayoutToolbar(selection, _ref3, allowResizingInTables) {
+  var nodes = _ref3.nodes;
   return (0, _utils.hasParentNodeOfType)([nodes.bodiedExtension, nodes.extensionFrame, nodes.listItem, nodes.expand, nodes.nestedExpand].concat((0, _toConsumableArray2.default)(allowResizingInTables ? [] : [nodes.table])).filter(Boolean))(selection);
 };
 var buildLayoutButtons = function buildLayoutButtons(state, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowResizing, allowResizingInTables) {
@@ -206,6 +272,54 @@ var buildLayoutButtons = function buildLayoutButtons(state, intl, nodeType, widt
   var items = [].concat((0, _toConsumableArray2.default)(alignmentToolbarItems), (0, _toConsumableArray2.default)(getSeparatorBetweenAlignmentAndWrapping(allowAlignment, allowWrapping)), (0, _toConsumableArray2.default)(wrappingToolbarItems), (0, _toConsumableArray2.default)(getSeparatorBeforeBreakoutItems(allowAlignment, allowWrapping, allowResizing)), (0, _toConsumableArray2.default)(breakOutToolbarItems));
   return items;
 };
+var buildLayoutDropdown = exports.buildLayoutDropdown = function buildLayoutDropdown(state, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowResizing, allowResizingInTables) {
+  var allowWrapping = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : true;
+  var allowAlignment = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : true;
+  var isChangingLayoutDisabled = arguments.length > 9 ? arguments[9] : undefined;
+  var allowPixelResizing = arguments.length > 10 ? arguments[10] : undefined;
+  var selection = state.selection;
+  if (!(selection instanceof _state.NodeSelection) || !selection.node || !nodeType || shouldHideLayoutToolbar(selection, state.schema, allowResizingInTables)) {
+    return [];
+  }
+  var layout = selection.node.attrs.layout;
+  var icons = [];
+  if (allowAlignment) {
+    icons.push.apply(icons, alignmentIconsControls);
+  }
+  if (allowWrapping) {
+    icons.push.apply(icons, wrappingIcons);
+  }
+  if (!allowResizing) {
+    icons.push.apply(icons, breakoutIcons);
+  }
+  if (icons.length === 0) {
+    return [];
+  }
+  var selectedLayout = getSelectedLayoutIcon(icons, selection.node) || icons[0];
+  var alignmentDropdownOptions = mapIconsToDropdownOptions({
+    icons: icons,
+    layout: layout,
+    intl: intl,
+    nodeType: nodeType,
+    widthPluginDependencyApi: widthPluginDependencyApi,
+    analyticsApi: analyticsApi,
+    isChangingLayoutDisabled: isChangingLayoutDisabled,
+    allowPixelResizing: allowPixelResizing
+  });
+  return [{
+    type: 'dropdown',
+    title: intl.formatMessage(layoutToMessages[selectedLayout.value]),
+    icon: selectedLayout.icon,
+    options: alignmentDropdownOptions,
+    testId: "".concat(nodeType.name, "-layout-dropdown-trigger-button")
+  }];
+};
+var getSelectedLayoutIcon = function getSelectedLayoutIcon(layoutIcons, selectedNode) {
+  var selectedLayout = selectedNode.attrs.layout;
+  return layoutIcons.find(function (icon) {
+    return icon.value === (_utils2.nonWrappedLayouts.includes(selectedLayout) ? 'center' : selectedLayout);
+  });
+};
 var getSeparatorBetweenAlignmentAndWrapping = function getSeparatorBetweenAlignmentAndWrapping(allowAlignment, allowWrapping) {
   return allowAlignment && allowWrapping ? [{
     type: 'separator'

package/dist/cjs/card/index.js

@@ -59,6 +59,12 @@ Object.defineProperty(exports, "buildLayoutButtons", {
     return _MediaAndEmbedsToolbar.default;
   }
 });
+Object.defineProperty(exports, "buildLayoutDropdown", {
+  enumerable: true,
+  get: function get() {
+    return _MediaAndEmbedsToolbar.buildLayoutDropdown;
+  }
+});
 Object.defineProperty(exports, "commandWithMetadata", {
   enumerable: true,
   get: function get() {

package/dist/cjs/hooks/usePluginStateEffect.js

@@ -9,6 +9,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = require("react");
 var _debounce = _interopRequireDefault(require("lodash/debounce"));
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 // Ignored via go/ees005
@@ -105,8 +106,17 @@ function usePluginStateEffectInternal(externalPlugins, effect) {
 
   // We should store the latest effect in a reference so it is more intuitive to the user
   // and we are not causing a memory leak by having references to old state.
+  (0, _react.useLayoutEffect)(function () {
+    if (options.disabled || (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)) {
+      return;
+    }
+    latestEffect.current = (0, _debounce.default)(effect);
+    return function () {
+      latestEffect.current = undefined;
+    };
+  }, [effect, options.disabled]);
   (0, _react.useEffect)(function () {
-    if (options.disabled) {
+    if (options.disabled || (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)) {
       return;
     }
     latestEffect.current = (0, _debounce.default)(effect);

package/dist/cjs/media/messages/imageBorder.js

@@ -11,11 +11,21 @@ var imageBorderMessages = exports.imageBorderMessages = (0, _reactIntlNext.defin
     defaultMessage: 'Color',
     description: 'Change the border color of an image.'
   },
+  borderColorDropdownAriaLabel: {
+    id: 'fabric.editor.imageBorderColor.dropdownAriaLabel',
+    defaultMessage: 'Image border options Color dropdown',
+    description: 'ARIA label for the dropdown to change the border color of an image.'
+  },
   borderSize: {
     id: 'fabric.editor.imageBorderSize',
     defaultMessage: 'Size',
     description: 'Change the border size of an image.'
   },
+  borderSizeDropdownAriaLabel: {
+    id: 'fabric.editor.imageBorderSize.dropdownAriaLabel',
+    defaultMessage: 'Image border options Size dropdown',
+    description: 'ARIA label for the dropdown to change the border size of an image.'
+  },
   addBorder: {
     id: 'fabric.editor.addImageBorder',
     defaultMessage: 'Add border',

package/dist/cjs/monitoring/error.js

@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "103.12.1";
+var packageVersion = "103.14.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

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

@@ -5,13 +5,28 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.linkSharedStyle = void 0;
 var _react = require("@emotion/react");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
-var linkSharedStyle = exports.linkSharedStyle = (0, _react.css)({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  'a.blockLink': {
-    display: 'block'
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var linkSharedStyle = exports.linkSharedStyle = function linkSharedStyle() {
+  return (0, _platformFeatureFlags.fg)('platform_editor_hyperlink_underline') ? (0, _react.css)({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a.blockLink': {
+      display: 'block'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a[data-prosemirror-mark-name="link"]': {
+      textDecoration: 'underline'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a[data-prosemirror-mark-name="link"]:hover': {
+      textDecoration: 'none'
+    }
+  }) : (0, _react.css)({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a.blockLink': {
+      display: 'block'
+    }
+  });
+};

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

@@ -23,7 +23,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * @jsx jsx
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "103.12.1";
+var packageVersion = "103.14.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/es2019/card/MediaAndEmbedsToolbar/index.js

@@ -5,6 +5,9 @@ import { DEFAULT_EMBED_CARD_WIDTH } from '@atlaskit/editor-shared-styles';
 import AlignImageCenterIcon from '@atlaskit/icon/core/align-image-center';
 import AlignImageLeftIcon from '@atlaskit/icon/core/align-image-left';
 import AlignImageRightIcon from '@atlaskit/icon/core/align-image-right';
+import AlignTextCenterIcon from '@atlaskit/icon/core/align-text-center';
+import AlignTextLeftIcon from '@atlaskit/icon/core/align-text-left';
+import AlignTextRightIcon from '@atlaskit/icon/core/align-text-right';
 import ContentWrapLeftIcon from '@atlaskit/icon/core/content-wrap-left';
 import ContentWrapRightIcon from '@atlaskit/icon/core/content-wrap-right';
 import ContentWidthWide from '@atlaskit/icon/core/migration/content-width-wide--editor-media-wide';
@@ -16,7 +19,9 @@ import WrapLeftIcon from '@atlaskit/icon/glyph/editor/media-wrap-left';
 import WrapRightIcon from '@atlaskit/icon/glyph/editor/media-wrap-right';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '../../analytics';
 import { insideTable } from '../../core-utils';
+import { alignCenter, alignLeft, alignRight, tooltip } from '../../keymaps';
 import commonMessages, { mediaAndEmbedToolbarMessages as toolbarMessages } from '../../messages';
+import { Shortcut } from '../../ui';
 import { alignAttributes, isInLayoutColumn, nonWrappedLayouts } from '../../utils';
 
 // Workaround as we don't want to import this package into `editor-common`
@@ -50,6 +55,34 @@ export const alignmentIcons = [{
     LEGACY_fallbackIcon: EditorAlignImageRight
   })
 }];
+const alignmentIconsControls = [{
+  id: 'editor.media.alignLeft',
+  value: 'align-start',
+  icon: () => /*#__PURE__*/React.createElement(AlignTextLeftIcon, {
+    color: "currentColor",
+    spacing: "spacious",
+    label: ""
+  }),
+  keyboardShortcut: alignLeft
+}, {
+  id: 'editor.media.alignCenter',
+  value: 'center',
+  icon: () => /*#__PURE__*/React.createElement(AlignTextCenterIcon, {
+    color: "currentColor",
+    spacing: "spacious",
+    label: ""
+  }),
+  keyboardShortcut: alignCenter
+}, {
+  id: 'editor.media.alignRight',
+  value: 'align-end',
+  icon: () => /*#__PURE__*/React.createElement(AlignTextRightIcon, {
+    color: "currentColor",
+    spacing: "spacious",
+    label: ""
+  }),
+  keyboardShortcut: alignRight
+}];
 export const wrappingIcons = [{
   id: 'editor.media.wrapLeft',
   value: 'wrap-left',
@@ -183,6 +216,36 @@ const mapIconsToToolbarItem = (icons, layout, intl, nodeType, widthPluginDepende
     })
   };
 });
+const mapIconsToDropdownOptions = ({
+  icons,
+  layout,
+  intl,
+  nodeType,
+  widthPluginDependencyApi,
+  analyticsApi,
+  isChangingLayoutDisabled,
+  allowPixelResizing
+}) => icons.map(layoutOption => {
+  const {
+    id,
+    value
+  } = layoutOption;
+  return {
+    id: id,
+    icon: /*#__PURE__*/React.createElement(layoutOption.icon, {
+      label: ""
+    }),
+    title: intl.formatMessage(layoutToMessages[value]),
+    selected: getToolbarLayout(layout, allowPixelResizing) === value,
+    onClick: makeAlign(value, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing),
+    ...(layoutOption.keyboardShortcut && {
+      elemAfter: /*#__PURE__*/React.createElement(Shortcut, null, tooltip(layoutOption.keyboardShortcut))
+    }),
+    ...(isChangingLayoutDisabled && {
+      disabled: value !== 'center'
+    })
+  };
+});
 const shouldHideLayoutToolbar = (selection, {
   nodes
 }, allowResizingInTables) => {
@@ -204,6 +267,52 @@ const buildLayoutButtons = (state, intl, nodeType, widthPluginDependencyApi, ana
   const items = [...alignmentToolbarItems, ...getSeparatorBetweenAlignmentAndWrapping(allowAlignment, allowWrapping), ...wrappingToolbarItems, ...getSeparatorBeforeBreakoutItems(allowAlignment, allowWrapping, allowResizing), ...breakOutToolbarItems];
   return items;
 };
+export const buildLayoutDropdown = (state, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowResizing, allowResizingInTables, allowWrapping = true, allowAlignment = true, isChangingLayoutDisabled, allowPixelResizing) => {
+  const {
+    selection
+  } = state;
+  if (!(selection instanceof NodeSelection) || !selection.node || !nodeType || shouldHideLayoutToolbar(selection, state.schema, allowResizingInTables)) {
+    return [];
+  }
+  const {
+    layout
+  } = selection.node.attrs;
+  const icons = [];
+  if (allowAlignment) {
+    icons.push(...alignmentIconsControls);
+  }
+  if (allowWrapping) {
+    icons.push(...wrappingIcons);
+  }
+  if (!allowResizing) {
+    icons.push(...breakoutIcons);
+  }
+  if (icons.length === 0) {
+    return [];
+  }
+  const selectedLayout = getSelectedLayoutIcon(icons, selection.node) || icons[0];
+  const alignmentDropdownOptions = mapIconsToDropdownOptions({
+    icons,
+    layout,
+    intl,
+    nodeType,
+    widthPluginDependencyApi,
+    analyticsApi,
+    isChangingLayoutDisabled,
+    allowPixelResizing
+  });
+  return [{
+    type: 'dropdown',
+    title: intl.formatMessage(layoutToMessages[selectedLayout.value]),
+    icon: selectedLayout.icon,
+    options: alignmentDropdownOptions,
+    testId: `${nodeType.name}-layout-dropdown-trigger-button`
+  }];
+};
+const getSelectedLayoutIcon = (layoutIcons, selectedNode) => {
+  const selectedLayout = selectedNode.attrs.layout;
+  return layoutIcons.find(icon => icon.value === (nonWrappedLayouts.includes(selectedLayout) ? 'center' : selectedLayout));
+};
 const getSeparatorBetweenAlignmentAndWrapping = (allowAlignment, allowWrapping) => allowAlignment && allowWrapping ? [{
   type: 'separator'
 }] : [];

package/dist/es2019/card/index.js

@@ -2,7 +2,7 @@
 /* eslint-disable @atlaskit/editor/no-re-export */
 
 export { addLinkMetadata, getLinkMetadataFromTransaction, commandWithMetadata } from './utils';
-export { default as buildLayoutButtons, alignmentIcons, wrappingIcons, layoutToMessages } from './MediaAndEmbedsToolbar';
+export { default as buildLayoutButtons, alignmentIcons, wrappingIcons, layoutToMessages, buildLayoutDropdown } from './MediaAndEmbedsToolbar';
 export { LinkToolbarButtonGroup } from './LinkToolbarButtonGroup';
 export { appearancePropsMap, getButtonGroupOption } from './link-toolbar-button-group-options';
 export { getDropdownOption } from './link-toolbar-dropdown-options';

package/dist/es2019/hooks/usePluginStateEffect.js

@@ -1,5 +1,6 @@
 import { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
 import debounce from 'lodash/debounce';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 
 // Ignored via go/ees005
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -88,8 +89,17 @@ function usePluginStateEffectInternal(externalPlugins, effect, options = {}) {
 
   // We should store the latest effect in a reference so it is more intuitive to the user
   // and we are not causing a memory leak by having references to old state.
+  useLayoutEffect(() => {
+    if (options.disabled || editorExperiment('platform_editor_usesharedpluginstateselector', false)) {
+      return;
+    }
+    latestEffect.current = debounce(effect);
+    return () => {
+      latestEffect.current = undefined;
+    };
+  }, [effect, options.disabled]);
   useEffect(() => {
-    if (options.disabled) {
+    if (options.disabled || editorExperiment('platform_editor_usesharedpluginstateselector', true)) {
       return;
     }
     latestEffect.current = debounce(effect);

package/dist/es2019/media/messages/imageBorder.js

@@ -5,11 +5,21 @@ export const imageBorderMessages = defineMessages({
     defaultMessage: 'Color',
     description: 'Change the border color of an image.'
   },
+  borderColorDropdownAriaLabel: {
+    id: 'fabric.editor.imageBorderColor.dropdownAriaLabel',
+    defaultMessage: 'Image border options Color dropdown',
+    description: 'ARIA label for the dropdown to change the border color of an image.'
+  },
   borderSize: {
     id: 'fabric.editor.imageBorderSize',
     defaultMessage: 'Size',
     description: 'Change the border size of an image.'
   },
+  borderSizeDropdownAriaLabel: {
+    id: 'fabric.editor.imageBorderSize.dropdownAriaLabel',
+    defaultMessage: 'Image border options Size dropdown',
+    description: 'ARIA label for the dropdown to change the border size of an image.'
+  },
   addBorder: {
     id: 'fabric.editor.addImageBorder',
     defaultMessage: 'Add border',

package/dist/es2019/monitoring/error.js

@@ -1,7 +1,7 @@
 import { isFedRamp } from './environment';
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "103.12.1";
+const packageVersion = "103.14.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/es2019/styles/shared/link.js

@@ -1,11 +1,26 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
-const linkSharedStyle = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  'a.blockLink': {
-    display: 'block'
-  }
-});
+import { fg } from '@atlaskit/platform-feature-flags';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export { linkSharedStyle };
+export const linkSharedStyle = () => {
+  return fg('platform_editor_hyperlink_underline') ? css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a.blockLink': {
+      display: 'block'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a[data-prosemirror-mark-name="link"]': {
+      textDecoration: 'underline'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a[data-prosemirror-mark-name="link"]:hover': {
+      textDecoration: 'none'
+    }
+  }) : css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a.blockLink': {
+      display: 'block'
+    }
+  });
+};

package/dist/es2019/ui/DropList/index.js

@@ -13,7 +13,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "103.12.1";
+const packageVersion = "103.14.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/esm/card/MediaAndEmbedsToolbar/index.js

@@ -9,6 +9,9 @@ import { DEFAULT_EMBED_CARD_WIDTH } from '@atlaskit/editor-shared-styles';
 import AlignImageCenterIcon from '@atlaskit/icon/core/align-image-center';
 import AlignImageLeftIcon from '@atlaskit/icon/core/align-image-left';
 import AlignImageRightIcon from '@atlaskit/icon/core/align-image-right';
+import AlignTextCenterIcon from '@atlaskit/icon/core/align-text-center';
+import AlignTextLeftIcon from '@atlaskit/icon/core/align-text-left';
+import AlignTextRightIcon from '@atlaskit/icon/core/align-text-right';
 import ContentWrapLeftIcon from '@atlaskit/icon/core/content-wrap-left';
 import ContentWrapRightIcon from '@atlaskit/icon/core/content-wrap-right';
 import ContentWidthWide from '@atlaskit/icon/core/migration/content-width-wide--editor-media-wide';
@@ -20,7 +23,9 @@ import WrapLeftIcon from '@atlaskit/icon/glyph/editor/media-wrap-left';
 import WrapRightIcon from '@atlaskit/icon/glyph/editor/media-wrap-right';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '../../analytics';
 import { insideTable } from '../../core-utils';
+import { alignCenter, alignLeft, alignRight, tooltip } from '../../keymaps';
 import commonMessages, { mediaAndEmbedToolbarMessages as toolbarMessages } from '../../messages';
+import { Shortcut } from '../../ui';
 import { alignAttributes, isInLayoutColumn, nonWrappedLayouts } from '../../utils';
 
 // Workaround as we don't want to import this package into `editor-common`
@@ -60,6 +65,40 @@ export var alignmentIcons = [{
     });
   }
 }];
+var alignmentIconsControls = [{
+  id: 'editor.media.alignLeft',
+  value: 'align-start',
+  icon: function icon() {
+    return /*#__PURE__*/React.createElement(AlignTextLeftIcon, {
+      color: "currentColor",
+      spacing: "spacious",
+      label: ""
+    });
+  },
+  keyboardShortcut: alignLeft
+}, {
+  id: 'editor.media.alignCenter',
+  value: 'center',
+  icon: function icon() {
+    return /*#__PURE__*/React.createElement(AlignTextCenterIcon, {
+      color: "currentColor",
+      spacing: "spacious",
+      label: ""
+    });
+  },
+  keyboardShortcut: alignCenter
+}, {
+  id: 'editor.media.alignRight',
+  value: 'align-end',
+  icon: function icon() {
+    return /*#__PURE__*/React.createElement(AlignTextRightIcon, {
+      color: "currentColor",
+      spacing: "spacious",
+      label: ""
+    });
+  },
+  keyboardShortcut: alignRight
+}];
 export var wrappingIcons = [{
   id: 'editor.media.wrapLeft',
   value: 'wrap-left',
@@ -177,8 +216,35 @@ var mapIconsToToolbarItem = function mapIconsToToolbarItem(icons, layout, intl,
     });
   });
 };
-var shouldHideLayoutToolbar = function shouldHideLayoutToolbar(selection, _ref2, allowResizingInTables) {
-  var nodes = _ref2.nodes;
+var mapIconsToDropdownOptions = function mapIconsToDropdownOptions(_ref2) {
+  var icons = _ref2.icons,
+    layout = _ref2.layout,
+    intl = _ref2.intl,
+    nodeType = _ref2.nodeType,
+    widthPluginDependencyApi = _ref2.widthPluginDependencyApi,
+    analyticsApi = _ref2.analyticsApi,
+    isChangingLayoutDisabled = _ref2.isChangingLayoutDisabled,
+    allowPixelResizing = _ref2.allowPixelResizing;
+  return icons.map(function (layoutOption) {
+    var id = layoutOption.id,
+      value = layoutOption.value;
+    return _objectSpread(_objectSpread({
+      id: id,
+      icon: /*#__PURE__*/React.createElement(layoutOption.icon, {
+        label: ""
+      }),
+      title: intl.formatMessage(layoutToMessages[value]),
+      selected: getToolbarLayout(layout, allowPixelResizing) === value,
+      onClick: makeAlign(value, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing)
+    }, layoutOption.keyboardShortcut && {
+      elemAfter: /*#__PURE__*/React.createElement(Shortcut, null, tooltip(layoutOption.keyboardShortcut))
+    }), isChangingLayoutDisabled && {
+      disabled: value !== 'center'
+    });
+  });
+};
+var shouldHideLayoutToolbar = function shouldHideLayoutToolbar(selection, _ref3, allowResizingInTables) {
+  var nodes = _ref3.nodes;
   return hasParentNodeOfType([nodes.bodiedExtension, nodes.extensionFrame, nodes.listItem, nodes.expand, nodes.nestedExpand].concat(_toConsumableArray(allowResizingInTables ? [] : [nodes.table])).filter(Boolean))(selection);
 };
 var buildLayoutButtons = function buildLayoutButtons(state, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowResizing, allowResizingInTables) {
@@ -197,6 +263,54 @@ var buildLayoutButtons = function buildLayoutButtons(state, intl, nodeType, widt
   var items = [].concat(_toConsumableArray(alignmentToolbarItems), _toConsumableArray(getSeparatorBetweenAlignmentAndWrapping(allowAlignment, allowWrapping)), _toConsumableArray(wrappingToolbarItems), _toConsumableArray(getSeparatorBeforeBreakoutItems(allowAlignment, allowWrapping, allowResizing)), _toConsumableArray(breakOutToolbarItems));
   return items;
 };
+export var buildLayoutDropdown = function buildLayoutDropdown(state, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowResizing, allowResizingInTables) {
+  var allowWrapping = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : true;
+  var allowAlignment = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : true;
+  var isChangingLayoutDisabled = arguments.length > 9 ? arguments[9] : undefined;
+  var allowPixelResizing = arguments.length > 10 ? arguments[10] : undefined;
+  var selection = state.selection;
+  if (!(selection instanceof NodeSelection) || !selection.node || !nodeType || shouldHideLayoutToolbar(selection, state.schema, allowResizingInTables)) {
+    return [];
+  }
+  var layout = selection.node.attrs.layout;
+  var icons = [];
+  if (allowAlignment) {
+    icons.push.apply(icons, alignmentIconsControls);
+  }
+  if (allowWrapping) {
+    icons.push.apply(icons, wrappingIcons);
+  }
+  if (!allowResizing) {
+    icons.push.apply(icons, breakoutIcons);
+  }
+  if (icons.length === 0) {
+    return [];
+  }
+  var selectedLayout = getSelectedLayoutIcon(icons, selection.node) || icons[0];
+  var alignmentDropdownOptions = mapIconsToDropdownOptions({
+    icons: icons,
+    layout: layout,
+    intl: intl,
+    nodeType: nodeType,
+    widthPluginDependencyApi: widthPluginDependencyApi,
+    analyticsApi: analyticsApi,
+    isChangingLayoutDisabled: isChangingLayoutDisabled,
+    allowPixelResizing: allowPixelResizing
+  });
+  return [{
+    type: 'dropdown',
+    title: intl.formatMessage(layoutToMessages[selectedLayout.value]),
+    icon: selectedLayout.icon,
+    options: alignmentDropdownOptions,
+    testId: "".concat(nodeType.name, "-layout-dropdown-trigger-button")
+  }];
+};
+var getSelectedLayoutIcon = function getSelectedLayoutIcon(layoutIcons, selectedNode) {
+  var selectedLayout = selectedNode.attrs.layout;
+  return layoutIcons.find(function (icon) {
+    return icon.value === (nonWrappedLayouts.includes(selectedLayout) ? 'center' : selectedLayout);
+  });
+};
 var getSeparatorBetweenAlignmentAndWrapping = function getSeparatorBetweenAlignmentAndWrapping(allowAlignment, allowWrapping) {
   return allowAlignment && allowWrapping ? [{
     type: 'separator'

package/dist/esm/card/index.js

@@ -2,7 +2,7 @@
 /* eslint-disable @atlaskit/editor/no-re-export */
 
 export { addLinkMetadata, getLinkMetadataFromTransaction, commandWithMetadata } from './utils';
-export { default as buildLayoutButtons, alignmentIcons, wrappingIcons, layoutToMessages } from './MediaAndEmbedsToolbar';
+export { default as buildLayoutButtons, alignmentIcons, wrappingIcons, layoutToMessages, buildLayoutDropdown } from './MediaAndEmbedsToolbar';
 export { LinkToolbarButtonGroup } from './LinkToolbarButtonGroup';
 export { appearancePropsMap, getButtonGroupOption } from './link-toolbar-button-group-options';
 export { getDropdownOption } from './link-toolbar-dropdown-options';

package/dist/esm/hooks/usePluginStateEffect.js

@@ -4,6 +4,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
 import debounce from 'lodash/debounce';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 
 // Ignored via go/ees005
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -99,8 +100,17 @@ function usePluginStateEffectInternal(externalPlugins, effect) {
 
   // We should store the latest effect in a reference so it is more intuitive to the user
   // and we are not causing a memory leak by having references to old state.
+  useLayoutEffect(function () {
+    if (options.disabled || editorExperiment('platform_editor_usesharedpluginstateselector', false)) {
+      return;
+    }
+    latestEffect.current = debounce(effect);
+    return function () {
+      latestEffect.current = undefined;
+    };
+  }, [effect, options.disabled]);
   useEffect(function () {
-    if (options.disabled) {
+    if (options.disabled || editorExperiment('platform_editor_usesharedpluginstateselector', true)) {
       return;
     }
     latestEffect.current = debounce(effect);

package/dist/esm/media/messages/imageBorder.js

@@ -5,11 +5,21 @@ export var imageBorderMessages = defineMessages({
     defaultMessage: 'Color',
     description: 'Change the border color of an image.'
   },
+  borderColorDropdownAriaLabel: {
+    id: 'fabric.editor.imageBorderColor.dropdownAriaLabel',
+    defaultMessage: 'Image border options Color dropdown',
+    description: 'ARIA label for the dropdown to change the border color of an image.'
+  },
   borderSize: {
     id: 'fabric.editor.imageBorderSize',
     defaultMessage: 'Size',
     description: 'Change the border size of an image.'
   },
+  borderSizeDropdownAriaLabel: {
+    id: 'fabric.editor.imageBorderSize.dropdownAriaLabel',
+    defaultMessage: 'Image border options Size dropdown',
+    description: 'ARIA label for the dropdown to change the border size of an image.'
+  },
   addBorder: {
     id: 'fabric.editor.addImageBorder',
     defaultMessage: 'Add border',

package/dist/esm/monitoring/error.js

@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { isFedRamp } from './environment';
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "103.12.1";
+var packageVersion = "103.14.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/esm/styles/shared/link.js

@@ -1,11 +1,26 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
-var linkSharedStyle = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  'a.blockLink': {
-    display: 'block'
-  }
-});
+import { fg } from '@atlaskit/platform-feature-flags';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export { linkSharedStyle };
+export var linkSharedStyle = function linkSharedStyle() {
+  return fg('platform_editor_hyperlink_underline') ? css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a.blockLink': {
+      display: 'block'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a[data-prosemirror-mark-name="link"]': {
+      textDecoration: 'underline'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a[data-prosemirror-mark-name="link"]:hover': {
+      textDecoration: 'none'
+    }
+  }) : css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    'a.blockLink': {
+      display: 'block'
+    }
+  });
+};

package/dist/esm/ui/DropList/index.js

@@ -20,7 +20,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "103.12.1";
+var packageVersion = "103.14.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/types/card/MediaAndEmbedsToolbar/index.d.ts

@@ -1,7 +1,9 @@
 import type { IntlShape } from 'react-intl-next';
+import type { RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
 import type { NodeType } from '@atlaskit/editor-prosemirror/model';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
 import type { EditorAnalyticsAPI } from '../../analytics';
+import { Keymap } from '../../keymaps';
 import type { Command, EditorContainerWidth, FloatingToolbarItem, Icon, NextEditorPlugin, PluginDependenciesAPI } from '../../types';
 type WidthPluginType = NextEditorPlugin<'width', {
     sharedState: EditorContainerWidth | undefined;
@@ -9,8 +11,9 @@ type WidthPluginType = NextEditorPlugin<'width', {
 type WidthPluginDependencyApi = PluginDependenciesAPI<WidthPluginType> | undefined;
 export type LayoutIcon = {
     id?: string;
-    value: string;
+    value: MediaSingleLayout;
     icon: Icon;
+    keyboardShortcut?: Keymap;
 };
 export type IconMap = Array<LayoutIcon | {
     value: 'separator';
@@ -19,4 +22,5 @@ export declare const alignmentIcons: LayoutIcon[];
 export declare const wrappingIcons: LayoutIcon[];
 export declare const layoutToMessages: Record<string, any>;
 declare const buildLayoutButtons: (state: EditorState, intl: IntlShape, nodeType: NodeType, widthPluginDependencyApi: WidthPluginDependencyApi, analyticsApi: EditorAnalyticsAPI | undefined, allowResizing?: boolean, allowResizingInTables?: boolean, allowWrapping?: boolean, allowAlignment?: boolean, isChangingLayoutDisabled?: boolean, allowPixelResizing?: boolean) => FloatingToolbarItem<Command>[];
+export declare const buildLayoutDropdown: (state: EditorState, intl: IntlShape, nodeType: NodeType, widthPluginDependencyApi: WidthPluginDependencyApi, analyticsApi: EditorAnalyticsAPI | undefined, allowResizing?: boolean, allowResizingInTables?: boolean, allowWrapping?: boolean, allowAlignment?: boolean, isChangingLayoutDisabled?: boolean, allowPixelResizing?: boolean) => FloatingToolbarItem<Command>[];
 export default buildLayoutButtons;

package/dist/types/card/index.d.ts

@@ -1,6 +1,6 @@
 export type { CardOptions, OnClickCallback } from './cardOptions';
 export { addLinkMetadata, getLinkMetadataFromTransaction, commandWithMetadata } from './utils';
-export { default as buildLayoutButtons, alignmentIcons, wrappingIcons, layoutToMessages, } from './MediaAndEmbedsToolbar';
+export { default as buildLayoutButtons, alignmentIcons, wrappingIcons, layoutToMessages, buildLayoutDropdown, } from './MediaAndEmbedsToolbar';
 export type { IconMap, LayoutIcon } from './MediaAndEmbedsToolbar';
 export type { OptionConfig, CardPluginActions, QueueCardsFromTransactionAction, HideLinkToolbarAction, ChangeSelectedCardToLink, SetSelectedCardAppearance, CardReplacementInputMethod, } from './types';
 export { LinkToolbarButtonGroup } from './LinkToolbarButtonGroup';

package/dist/types/media/messages/imageBorder.d.ts

@@ -4,11 +4,21 @@ export declare const imageBorderMessages: {
         defaultMessage: string;
         description: string;
     };
+    borderColorDropdownAriaLabel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
     borderSize: {
         id: string;
         defaultMessage: string;
         description: string;
     };
+    borderSizeDropdownAriaLabel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
     addBorder: {
         id: string;
         defaultMessage: string;

package/dist/types/styles/shared/link.d.ts

@@ -1,2 +1 @@
-declare const linkSharedStyle: import("@emotion/react").SerializedStyles;
-export { linkSharedStyle };
+export declare const linkSharedStyle: () => import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/card/MediaAndEmbedsToolbar/index.d.ts

@@ -1,7 +1,9 @@
 import type { IntlShape } from 'react-intl-next';
+import type { RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
 import type { NodeType } from '@atlaskit/editor-prosemirror/model';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
 import type { EditorAnalyticsAPI } from '../../analytics';
+import { Keymap } from '../../keymaps';
 import type { Command, EditorContainerWidth, FloatingToolbarItem, Icon, NextEditorPlugin, PluginDependenciesAPI } from '../../types';
 type WidthPluginType = NextEditorPlugin<'width', {
     sharedState: EditorContainerWidth | undefined;
@@ -9,8 +11,9 @@ type WidthPluginType = NextEditorPlugin<'width', {
 type WidthPluginDependencyApi = PluginDependenciesAPI<WidthPluginType> | undefined;
 export type LayoutIcon = {
     id?: string;
-    value: string;
+    value: MediaSingleLayout;
     icon: Icon;
+    keyboardShortcut?: Keymap;
 };
 export type IconMap = Array<LayoutIcon | {
     value: 'separator';
@@ -19,4 +22,5 @@ export declare const alignmentIcons: LayoutIcon[];
 export declare const wrappingIcons: LayoutIcon[];
 export declare const layoutToMessages: Record<string, any>;
 declare const buildLayoutButtons: (state: EditorState, intl: IntlShape, nodeType: NodeType, widthPluginDependencyApi: WidthPluginDependencyApi, analyticsApi: EditorAnalyticsAPI | undefined, allowResizing?: boolean, allowResizingInTables?: boolean, allowWrapping?: boolean, allowAlignment?: boolean, isChangingLayoutDisabled?: boolean, allowPixelResizing?: boolean) => FloatingToolbarItem<Command>[];
+export declare const buildLayoutDropdown: (state: EditorState, intl: IntlShape, nodeType: NodeType, widthPluginDependencyApi: WidthPluginDependencyApi, analyticsApi: EditorAnalyticsAPI | undefined, allowResizing?: boolean, allowResizingInTables?: boolean, allowWrapping?: boolean, allowAlignment?: boolean, isChangingLayoutDisabled?: boolean, allowPixelResizing?: boolean) => FloatingToolbarItem<Command>[];
 export default buildLayoutButtons;

package/dist/types-ts4.5/card/index.d.ts

@@ -1,6 +1,6 @@
 export type { CardOptions, OnClickCallback } from './cardOptions';
 export { addLinkMetadata, getLinkMetadataFromTransaction, commandWithMetadata } from './utils';
-export { default as buildLayoutButtons, alignmentIcons, wrappingIcons, layoutToMessages, } from './MediaAndEmbedsToolbar';
+export { default as buildLayoutButtons, alignmentIcons, wrappingIcons, layoutToMessages, buildLayoutDropdown, } from './MediaAndEmbedsToolbar';
 export type { IconMap, LayoutIcon } from './MediaAndEmbedsToolbar';
 export type { OptionConfig, CardPluginActions, QueueCardsFromTransactionAction, HideLinkToolbarAction, ChangeSelectedCardToLink, SetSelectedCardAppearance, CardReplacementInputMethod, } from './types';
 export { LinkToolbarButtonGroup } from './LinkToolbarButtonGroup';

package/dist/types-ts4.5/media/messages/imageBorder.d.ts

@@ -4,11 +4,21 @@ export declare const imageBorderMessages: {
         defaultMessage: string;
         description: string;
     };
+    borderColorDropdownAriaLabel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
     borderSize: {
         id: string;
         defaultMessage: string;
         description: string;
     };
+    borderSizeDropdownAriaLabel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
     addBorder: {
         id: string;
         defaultMessage: string;

package/dist/types-ts4.5/styles/shared/link.d.ts

@@ -1,2 +1 @@
-declare const linkSharedStyle: import("@emotion/react").SerializedStyles;
-export { linkSharedStyle };
+export declare const linkSharedStyle: () => import("@emotion/react").SerializedStyles;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "103.12.1",
+	"version": "103.14.0",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -136,7 +136,7 @@
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/editor-shared-styles": "^3.4.0",
 		"@atlaskit/editor-tables": "^2.9.0",
-		"@atlaskit/emoji": "^69.0.0",
+		"@atlaskit/emoji": "^69.1.0",
 		"@atlaskit/icon": "^25.6.0",
 		"@atlaskit/icon-object": "^7.1.0",
 		"@atlaskit/link-datasource": "^4.5.0",
@@ -163,7 +163,7 @@
 		"@atlaskit/task-decision": "^19.1.0",
 		"@atlaskit/textfield": "^8.0.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^4.12.0",
+		"@atlaskit/tmp-editor-statsig": "^4.13.0",
 		"@atlaskit/tokens": "^4.8.0",
 		"@atlaskit/tooltip": "^20.0.0",
 		"@atlaskit/width-detector": "^5.0.0",
@@ -345,6 +345,9 @@
 		},
 		"platform_editor_controls_table_picker": {
 			"type": "boolean"
+		},
+		"platform_editor_hyperlink_underline": {
+			"type": "boolean"
 		}
 	}
 }