@atlaskit/editor-common 128.1.0 → 128.2.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/editor-common
 
+## 128.2.0
+
+### Minor Changes
+
+- [`ef6d325af58d6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ef6d325af58d6) -
+  Update i18n NPM package versions for editor,editor-extensions,activity-platform,media,elements
+  (Group 3)
+- [`375d0ca074591`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/375d0ca074591) -
+  Unify Rovo Skill quick-insert construction across product Editors and AI Chat behind
+  `platform_editor_slash_command`. Add shared menu title and preview presentation options, and reuse
+  existing extension metadata for Skill icons, descriptions, attribution and Beta labels. Export the
+  shared Editor SkillTag for reuse across menus. Preserve shared insertion and Chat-specific
+  behavior.
+
+### Patch Changes
+
+- [`bf2f598c788f8`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/bf2f598c788f8) -
+  clean up feature flag platform_editor_core_static_css
+- Updated dependencies
+
 ## 128.1.0
 
 ### Minor Changes

package/dist/cjs/extensions/buildMenuItem.js

@@ -26,6 +26,7 @@ function buildMenuItem(manifest, extensionModule) {
     }
   } : {}), {}, {
     key: key,
+    moduleKey: extensionModule.key,
     title: title,
     extensionType: manifest.type,
     extensionKey: manifest.key,

package/dist/cjs/monitoring/error.js

@@ -27,7 +27,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
 var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
 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 = "128.0.1";
+var packageVersion = "128.1.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/cjs/quick-insert/CompactQuickInsertMenuItem.js

@@ -85,10 +85,13 @@ var CompactQuickInsertMenuItem = exports.CompactQuickInsertMenuItem = function C
     isDisabled = _ref.isDisabled,
     onSelect = _ref.onSelect,
     preview = _ref.preview,
+    previewIcon = _ref.previewIcon,
     previewImageUrls = _ref.previewImageUrls,
     shortcut = _ref.shortcut,
+    titleContent = _ref.titleContent,
     _ref$shouldShowPrevie = _ref.shouldShowPreview,
     shouldShowPreview = _ref$shouldShowPrevie === void 0 ? true : _ref$shouldShowPrevie,
+    shouldClampPreview = _ref.shouldClampPreview,
     _ref$shouldWrapIcon = _ref.shouldWrapIcon,
     shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
     title = _ref.title;
@@ -138,7 +141,7 @@ var CompactQuickInsertMenuItem = exports.CompactQuickInsertMenuItem = function C
     alignBlock: "center",
     spread: "space-between",
     xcss: styles.content
-  }, /*#__PURE__*/_react.default.createElement(_compiled.Text, null, title), shortcut && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
+  }, titleContent !== null && titleContent !== void 0 ? titleContent : /*#__PURE__*/_react.default.createElement(_compiled.Text, null, title), shortcut && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     as: "span",
     xcss: styles.shortcut
   }, shortcut))), shouldRenderPreview && referenceElement && /*#__PURE__*/_react.default.createElement(_QuickInsertHoverPreview.QuickInsertHoverPreview, {
@@ -148,6 +151,8 @@ var CompactQuickInsertMenuItem = exports.CompactQuickInsertMenuItem = function C
     preview: resolvedPreview,
     popupsMountPoint: popupsMountPoint,
     referenceElement: referenceElement,
-    title: title
+    title: title,
+    icon: previewIcon,
+    shouldClampText: shouldClampPreview
   }));
 };

package/dist/cjs/quick-insert/ElementBrowserQuickInsertMenuItem.js

@@ -115,6 +115,7 @@ var ElementBrowserQuickInsertMenuItem = exports.ElementBrowserQuickInsertMenuIte
     isDisabled = _ref.isDisabled,
     onSelect = _ref.onSelect,
     shortcut = _ref.shortcut,
+    titleContent = _ref.titleContent,
     _ref$shouldWrapIcon = _ref.shouldWrapIcon,
     shouldWrapIcon = _ref$shouldWrapIcon === void 0 ? true : _ref$shouldWrapIcon,
     title = _ref.title;
@@ -155,7 +156,7 @@ var ElementBrowserQuickInsertMenuItem = exports.ElementBrowserQuickInsertMenuIte
     alignBlock: "center",
     spread: "space-between",
     space: "space.100"
-  }, /*#__PURE__*/_react.default.createElement(_primitives.Text, {
+  }, titleContent !== null && titleContent !== void 0 ? titleContent : /*#__PURE__*/_react.default.createElement(_primitives.Text, {
     color: "color.text",
     maxLines: 1,
     size: "medium",

package/dist/cjs/quick-insert/QuickInsertHoverPreview.compiled.css

@@ -8,6 +8,7 @@
 ._18zrutpp{padding-inline:var(--ds-space-150,9pt)}
 ._1rjcutpp{padding-block:var(--ds-space-150,9pt)}
 ._16jlidpf{flex-grow:0}
+._16jlkb7n{flex-grow:1}
 ._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
 ._18m915vq{overflow-y:hidden}
 ._1bah1h6o{justify-content:center}
@@ -20,8 +21,10 @@
 ._1e0ccj1k{display:-webkit-box}
 ._1i4qfg65{overflow-wrap:anywhere}
 ._1o9zidpf{flex-shrink:0}
+._1o9zkb7n{flex-shrink:1}
 ._1pby16oo{z-index:510}
 ._1reo15vq{overflow-x:hidden}
+._1ul9idpf{min-width:0}
 ._1yyjcs5v{-webkit-line-clamp:2}
 ._1yyjegat{-webkit-line-clamp:4}
 ._2lx21bp4{flex-direction:column}
@@ -36,7 +39,9 @@
 ._bfhkhfxm{background-color:var(--ds-surface-sunken,#f8f8f8)}
 ._c71l1kw7{max-height:inherit}
 ._c71lk6is{max-height:calc(100vh - 1pc)}
+._i0dl1wug{flex-basis:auto}
 ._i0dlexct{flex-basis:16px}
+._k48pwu06{font-weight:var(--ds-font-weight-bold,653)}
 ._p12f1oec{max-width:calc(100vw - 1pc)}
 ._p12f1osq{max-width:100%}
 ._sudp1e54{-webkit-box-orient:vertical}

package/dist/cjs/quick-insert/QuickInsertHoverPreview.js

@@ -8,14 +8,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.QuickInsertHoverPreview = void 0;
 require("./QuickInsertHoverPreview.compiled.css");
-var _react = _interopRequireWildcard(require("react"));
-var React = _react;
 var _runtime = require("@compiled/react/runtime");
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
 var _reactDom = require("react-dom");
 var _bindEventListener = require("bind-event-listener");
 var _reactIntl = require("react-intl");
 var _reactPopper = require("@atlaskit/popper/react-popper");
+var _box = require("@atlaskit/primitives/compiled/box");
+var _inline = require("@atlaskit/primitives/compiled/inline");
 var _text = require("@atlaskit/primitives/compiled/text");
 var _useThemeObserver2 = require("@atlaskit/tokens/use-theme-observer");
 var _messages = require("./messages");
@@ -46,33 +47,44 @@ var PREVIEW_MODIFIERS = [{
     rootBoundary: 'viewport'
   }
 }];
+var layoutStyles = {
+  titleRow: "_1ul9idpf",
+  titleIcon: "_4cvr1h6o _1e0c1txw _1o9zidpf _1bah1h6o",
+  attributionText: "_16jlkb7n _1o9zkb7n _i0dl1wug _1ul9idpf _1i4qfg65"
+};
 var styles = {
   positioner: "_c71lk6is _p12f1oec _1pby16oo",
   panel: "_2rko1qi0 _1reo15vq _18m915vq _1rjcutpp _18zrutpp _vchhusvi _bfhk1bhr _16qs130s _c71l1kw7 _p12f1osq _1bsbncxg",
   content: "_zulpu2gc _1e0c1txw _2lx21bp4",
-  title: "_11c81qyo _1reo15vq _18m915vq _syazazsu _1i4qfg65 _1e0ccj1k _sudp1e54 _1yyjcs5v",
+  title: "_11c81qyo _16jlkb7n _1o9zkb7n _i0dl1wug _1reo15vq _18m915vq _syazazsu _1ul9idpf _1i4qfg65 _1e0ccj1k _sudp1e54 _1yyjcs5v",
+  unclampedTitle: "_11c8fhey _16jlkb7n _1o9zkb7n _i0dl1wug _syazi7uo _k48pwu06 _1ul9idpf _1i4qfg65",
   description: "_11c8fhey _1reo15vq _18m915vq _syazi7uo _1e0ccj1k _1i4qfg65 _sudp1e54 _1yyjegat",
+  unclampedDescription: "_11c8fhey _syazi7uo _1i4qfg65",
   imageArea: "_2rko12b0 _1reo15vq _18m915vq _bfhkhfxm _4t3i68cl _6rthu2gc _p12f1osq _1bsbp3fh",
   image: "_1e0c1ule _4t3i1osq _5ral1f51 _1bsb1osq",
   imageHidden: "_3um015vq",
-  attribution: "_11c8wadc _zulp1b66 _4cvr1h6o _syazazsu _1e0c1txw _1i4qfg65",
+  attribution: "_zulp1b66 _4cvr1h6o _syazazsu _1e0c1txw _1i4qfg65",
+  compactAttribution: "_11c8wadc",
   attributionIcon: "_16jlidpf _1o9zidpf _i0dlexct _4cvr1h6o _1e0c1txw _4t3i7vkz _1bah1h6o _1bsb7vkz"
 };
 
 /** The selected item's description and attribution are announced through its aria-describedby. */
 var QuickInsertHoverPreview = exports.QuickInsertHoverPreview = function QuickInsertHoverPreview(_ref) {
   var description = _ref.description,
+    icon = _ref.icon,
     id = _ref.id,
     preview = _ref.preview,
     popupsMountPoint = _ref.popupsMountPoint,
     referenceElement = _ref.referenceElement,
+    _ref$shouldClampText = _ref.shouldClampText,
+    shouldClampText = _ref$shouldClampText === void 0 ? true : _ref$shouldClampText,
     title = _ref.title;
   var _useThemeObserver = (0, _useThemeObserver2.useThemeObserver)(),
     colorMode = _useThemeObserver.colorMode;
   var imageUrl = preview.image ? colorMode === 'dark' && preview.image.dark ? preview.image.dark : preview.image.light : undefined;
   var hasAccessibleContent = Boolean(description || preview.attribution);
   var portalTarget = popupsMountPoint !== null && popupsMountPoint !== void 0 ? popupsMountPoint : referenceElement.ownerDocument.body;
-  return /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/React.createElement(_reactPopper.Popper, {
+  return /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/_react.default.createElement(_reactPopper.Popper, {
     placement: "right-start",
     referenceElement: referenceElement,
     strategy: popupsMountPoint ? 'absolute' : 'fixed',
@@ -81,17 +93,19 @@ var QuickInsertHoverPreview = exports.QuickInsertHoverPreview = function QuickIn
     var ref = _ref2.ref,
       style = _ref2.style,
       update = _ref2.update;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", {
       ref: ref,
       style: style,
       className: (0, _runtime.ax)([styles.positioner])
-    }, /*#__PURE__*/React.createElement(QuickInsertPreviewPanel, {
+    }, /*#__PURE__*/_react.default.createElement(QuickInsertPreviewPanel, {
       description: description,
+      icon: icon,
       id: hasAccessibleContent ? id : undefined,
       imageUrl: imageUrl,
       preview: preview,
       popupsMountPoint: popupsMountPoint,
       referenceElement: referenceElement,
+      shouldClampText: shouldClampText,
       title: title,
       update: update
     }));
@@ -100,11 +114,13 @@ var QuickInsertHoverPreview = exports.QuickInsertHoverPreview = function QuickIn
 var QuickInsertPreviewPanel = function QuickInsertPreviewPanel(_ref3) {
   var _preview$attribution, _preview$attribution2;
   var description = _ref3.description,
+    icon = _ref3.icon,
     id = _ref3.id,
     imageUrl = _ref3.imageUrl,
     preview = _ref3.preview,
     popupsMountPoint = _ref3.popupsMountPoint,
     referenceElement = _ref3.referenceElement,
+    shouldClampText = _ref3.shouldClampText,
     title = _ref3.title,
     update = _ref3.update;
   var _useIntl = (0, _reactIntl.useIntl)(),
@@ -145,33 +161,43 @@ var QuickInsertPreviewPanel = function QuickInsertPreviewPanel(_ref3) {
       observer.disconnect();
     };
   }, [panelElement, popupsMountPoint, referenceElement, update]);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     ref: setPanelElement,
     id: id,
     role: id ? 'tooltip' : undefined,
     "data-testid": "quick-insert-preview-panel",
     className: (0, _runtime.ax)([styles.panel])
-  }, imageUrl && /*#__PURE__*/React.createElement(PreviewImage, {
+  }, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, imageUrl && /*#__PURE__*/_react.default.createElement(PreviewImage, {
     key: imageUrl,
     imageUrl: imageUrl
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _runtime.ax)([styles.content])
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement(_inline.Inline, {
+    alignBlock: "center",
+    space: "space.100",
+    xcss: layoutStyles.titleRow,
+    "aria-hidden": "true"
+  }, icon && /*#__PURE__*/_react.default.createElement(_box.Box, {
+    as: "span",
     "aria-hidden": "true",
-    className: (0, _runtime.ax)([styles.title])
-  }, title), description && /*#__PURE__*/React.createElement("div", {
-    className: (0, _runtime.ax)([styles.description])
-  }, description), preview.attribution && /*#__PURE__*/React.createElement("div", {
-    className: (0, _runtime.ax)([styles.attribution])
-  }, AttributionIcon && /*#__PURE__*/React.createElement("span", {
+    xcss: layoutStyles.titleIcon
+  }, icon), /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _runtime.ax)([shouldClampText && styles.title, !shouldClampText && styles.unclampedTitle])
+  }, title)), description && /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _runtime.ax)([shouldClampText && styles.description, !shouldClampText && styles.unclampedDescription])
+  }, description), preview.attribution && /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _runtime.ax)([styles.attribution, shouldClampText && styles.compactAttribution])
+  }, AttributionIcon && /*#__PURE__*/_react.default.createElement("span", {
     "aria-hidden": "true",
     className: (0, _runtime.ax)([styles.attributionIcon])
-  }, /*#__PURE__*/React.createElement(AttributionIcon, null)), /*#__PURE__*/React.createElement(_text.Text, {
+  }, /*#__PURE__*/_react.default.createElement(AttributionIcon, null)), /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _runtime.ax)([layoutStyles.attributionText])
+  }, /*#__PURE__*/_react.default.createElement(_text.Text, {
     size: "small",
     color: "color.text.subtle"
   }, AttributionIcon ? formattedAttributionName : formatMessage(_messages.messages.previewAttributionBy, {
     name: formattedAttributionName
-  })))));
+  })))))));
 };
 var PreviewImage = function PreviewImage(_ref4) {
   var imageUrl = _ref4.imageUrl;
@@ -183,11 +209,11 @@ var PreviewImage = function PreviewImage(_ref4) {
     _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
     hasLoaded = _useState6[0],
     setHasLoaded = _useState6[1];
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     "aria-hidden": "true",
     "data-testid": "quick-insert-preview-image-area",
     className: (0, _runtime.ax)([styles.imageArea])
-  }, !hasFailed && /*#__PURE__*/React.createElement("img", {
+  }, !hasFailed && /*#__PURE__*/_react.default.createElement("img", {
     "aria-hidden": "true",
     "data-testid": "quick-insert-hover-preview",
     src: imageUrl,

package/dist/cjs/quick-insert/QuickInsertMenuItem.js

@@ -16,9 +16,12 @@ var QuickInsertMenuItem = exports.QuickInsertMenuItem = function QuickInsertMenu
     isDisabled = _ref.isDisabled,
     onSelect = _ref.onSelect,
     preview = _ref.preview,
+    previewIcon = _ref.previewIcon,
     previewImageUrls = _ref.previewImageUrls,
     shortcut = _ref.shortcut,
+    titleContent = _ref.titleContent,
     shouldShowPreview = _ref.shouldShowPreview,
+    shouldClampPreview = _ref.shouldClampPreview,
     shouldWrapIcon = _ref.shouldWrapIcon,
     title = _ref.title;
   var _useQuickInsertContex = (0, _useQuickInsertContext.useQuickInsertContext)(),
@@ -30,6 +33,7 @@ var QuickInsertMenuItem = exports.QuickInsertMenuItem = function QuickInsertMenu
     isDisabled: isDisabled,
     onSelect: onSelect,
     shortcut: shortcut,
+    titleContent: titleContent,
     shouldWrapIcon: shouldWrapIcon,
     title: title
   }) : /*#__PURE__*/_react.default.createElement(_CompactQuickInsertMenuItem.CompactQuickInsertMenuItem, {
@@ -39,9 +43,12 @@ var QuickInsertMenuItem = exports.QuickInsertMenuItem = function QuickInsertMenu
     isDisabled: isDisabled,
     onSelect: onSelect,
     preview: preview,
+    previewIcon: previewIcon,
     previewImageUrls: previewImageUrls,
     shortcut: shortcut,
+    titleContent: titleContent,
     shouldShowPreview: shouldShowPreview,
+    shouldClampPreview: shouldClampPreview,
     shouldWrapIcon: shouldWrapIcon,
     title: title
   });

package/dist/cjs/quick-insert/SkillTag.compiled.css

@@ -0,0 +1,9 @@
+._16d9qvcn{-webkit-box-decoration-break:clone;box-decoration-break:clone}
+._1e0c1nu9{display:inline}
+._1i4qfg65{overflow-wrap:anywhere}
+._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
+._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
+._mkrz1f6o{clip-path:polygon(20% 0,100% 0,100% 100%,0 100%)}
+._mkrz1gdk{clip-path:polygon(0 0,100% 0,80% 100%,0 100%)}
+._o5724jg8{white-space:normal}
+._y4ti1b66{padding-inline-end:var(--ds-space-050,4px)}

package/dist/cjs/quick-insert/SkillTag.js

@@ -0,0 +1,44 @@
+/* SkillTag.tsx generated by @compiled/babel-plugin v3.0.2 */
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SkillTag = void 0;
+require("./SkillTag.compiled.css");
+var _runtime = require("@compiled/react/runtime");
+var _react = _interopRequireDefault(require("react"));
+var _css = require("@atlaskit/css");
+var _box = require("@atlaskit/primitives/compiled/box");
+var _text = require("@atlaskit/primitives/compiled/text");
+var styles = {
+  highlight: "_bfhki8nm _16d9qvcn _1e0c1nu9",
+  start: "_bozg1b66 _y4ti1b66 _mkrz1f6o",
+  end: "_y4ti1b66 _mkrz1gdk",
+  wrapping: "_1i4qfg65 _o5724jg8",
+  text: "_1i4qfg65"
+};
+var SkillTag = exports.SkillTag = function SkillTag(_ref) {
+  var slug = _ref.slug,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled;
+  return /*#__PURE__*/_react.default.createElement(_box.Box, {
+    as: "span",
+    xcss: styles.wrapping
+  }, /*#__PURE__*/_react.default.createElement(_text.Text, {
+    color: isDisabled ? 'color.text.disabled' : 'color.text',
+    xcss: styles.text
+  }, /*#__PURE__*/_react.default.createElement(_box.Box, {
+    as: "span",
+    xcss: (0, _css.cx)(styles.highlight, styles.start)
+  }, /*#__PURE__*/_react.default.createElement(_text.Text, {
+    color: isDisabled ? 'color.text.disabled' : 'color.text.subtle'
+  }, "/")), /*#__PURE__*/_react.default.createElement(_box.Box, {
+    as: "span",
+    xcss: styles.highlight
+  }, slug.slice(0, -1)), slug && /*#__PURE__*/_react.default.createElement(_box.Box, {
+    as: "span",
+    xcss: (0, _css.cx)(styles.highlight, styles.end)
+  }, slug.slice(-1))));
+};

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

@@ -59,12 +59,10 @@ var firstNodeWithNotMarginTop = function firstNodeWithNotMarginTop() {
  *
  * If you are updating this, please also update the above files.
  *
- * @deprecated This Emotion-based style function is being phased out as part of the
- * `platform_editor_core_static_css` experiment migration to Compiled CSS. While the experiment
- * is running, any changes here MUST also be reflected in `EditorContentContainer-compiled.tsx`
+ * @deprecated This Emotion-based style function is being phased out in favor of Compiled CSS.
+ * Any changes here MUST also be reflected in `EditorContentContainer-compiled.tsx`
  * (look for `tableSharedStyle`, `tableSharedStyle_with_*`, `tableSharedStyle_without_*` entries
- * in the `editorContentStyles` cssMap). Failure to do so will cause visual regressions when the
- * compiled version is active.
+ * in the `editorContentStyles` cssMap) to keep the shared styles consistent.
  */
 var tableSharedStyle = exports.tableSharedStyle = function tableSharedStyle() {
   var browser = (0, _browser.getBrowserInfo)();

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

@@ -24,7 +24,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 = "128.0.1";
+var packageVersion = "128.1.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = (0, _react2.keyframes)({

package/dist/es2019/extensions/buildMenuItem.js

@@ -17,6 +17,7 @@ export function buildMenuItem(manifest, extensionModule) {
       }
     } : {}),
     key,
+    moduleKey: extensionModule.key,
     title,
     extensionType: manifest.type,
     extensionKey: manifest.key,

package/dist/es2019/monitoring/error.js

@@ -13,7 +13,7 @@ const NETWORK_FAILURE_REGEX = /^network failure/i;
 const RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
 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 = "128.0.1";
+const packageVersion = "128.1.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/es2019/quick-insert/CompactQuickInsertMenuItem.js

@@ -74,9 +74,12 @@ export const CompactQuickInsertMenuItem = ({
   isDisabled,
   onSelect,
   preview,
+  previewIcon,
   previewImageUrls,
   shortcut,
+  titleContent,
   shouldShowPreview = true,
+  shouldClampPreview,
   shouldWrapIcon = true,
   title
 }) => {
@@ -124,7 +127,7 @@ export const CompactQuickInsertMenuItem = ({
     alignBlock: "center",
     spread: "space-between",
     xcss: styles.content
-  }, /*#__PURE__*/React.createElement(Text, null, title), shortcut && /*#__PURE__*/React.createElement(Box, {
+  }, titleContent !== null && titleContent !== void 0 ? titleContent : /*#__PURE__*/React.createElement(Text, null, title), shortcut && /*#__PURE__*/React.createElement(Box, {
     as: "span",
     xcss: styles.shortcut
   }, shortcut))), shouldRenderPreview && referenceElement && /*#__PURE__*/React.createElement(QuickInsertHoverPreview, {
@@ -134,6 +137,8 @@ export const CompactQuickInsertMenuItem = ({
     preview: resolvedPreview,
     popupsMountPoint: popupsMountPoint,
     referenceElement: referenceElement,
-    title: title
+    title: title,
+    icon: previewIcon,
+    shouldClampText: shouldClampPreview
   }));
 };

package/dist/es2019/quick-insert/ElementBrowserQuickInsertMenuItem.js

@@ -107,6 +107,7 @@ export const ElementBrowserQuickInsertMenuItem = ({
   isDisabled,
   onSelect,
   shortcut,
+  titleContent,
   shouldWrapIcon = true,
   title
 }) => {
@@ -147,7 +148,7 @@ export const ElementBrowserQuickInsertMenuItem = ({
     alignBlock: "center",
     spread: "space-between",
     space: "space.100"
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, titleContent !== null && titleContent !== void 0 ? titleContent : /*#__PURE__*/React.createElement(Text, {
     color: "color.text",
     maxLines: 1,
     size: "medium",

package/dist/es2019/quick-insert/QuickInsertHoverPreview.compiled.css

@@ -8,6 +8,7 @@
 ._18zrutpp{padding-inline:var(--ds-space-150,9pt)}
 ._1rjcutpp{padding-block:var(--ds-space-150,9pt)}
 ._16jlidpf{flex-grow:0}
+._16jlkb7n{flex-grow:1}
 ._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
 ._18m915vq{overflow-y:hidden}
 ._1bah1h6o{justify-content:center}
@@ -20,8 +21,10 @@
 ._1e0ccj1k{display:-webkit-box}
 ._1i4qfg65{overflow-wrap:anywhere}
 ._1o9zidpf{flex-shrink:0}
+._1o9zkb7n{flex-shrink:1}
 ._1pby16oo{z-index:510}
 ._1reo15vq{overflow-x:hidden}
+._1ul9idpf{min-width:0}
 ._1yyjcs5v{-webkit-line-clamp:2}
 ._1yyjegat{-webkit-line-clamp:4}
 ._2lx21bp4{flex-direction:column}
@@ -36,7 +39,9 @@
 ._bfhkhfxm{background-color:var(--ds-surface-sunken,#f8f8f8)}
 ._c71l1kw7{max-height:inherit}
 ._c71lk6is{max-height:calc(100vh - 1pc)}
+._i0dl1wug{flex-basis:auto}
 ._i0dlexct{flex-basis:16px}
+._k48pwu06{font-weight:var(--ds-font-weight-bold,653)}
 ._p12f1oec{max-width:calc(100vw - 1pc)}
 ._p12f1osq{max-width:100%}
 ._sudp1e54{-webkit-box-orient:vertical}

package/dist/es2019/quick-insert/QuickInsertHoverPreview.js

@@ -1,17 +1,17 @@
 /* QuickInsertHoverPreview.tsx generated by @compiled/babel-plugin v3.0.2 */
 import "./QuickInsertHoverPreview.compiled.css";
-import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { useLayoutEffect, useState } from 'react';
+import React, { useLayoutEffect, useState } from 'react';
 import { createPortal } from 'react-dom';
 
 // Viewport calculations and multiline clamping require styles outside @atlaskit/css's schema.
 
 import { bind } from 'bind-event-listener';
 import { useIntl } from 'react-intl';
-
 // Viewport clamping requires modifiers, which the top-layer adapter does not support.
 import { Popper } from '@atlaskit/popper/react-popper';
+import { Box } from '@atlaskit/primitives/compiled/box';
+import { Inline } from '@atlaskit/primitives/compiled/inline';
 import { Text } from '@atlaskit/primitives/compiled/text';
 import { useThemeObserver } from '@atlaskit/tokens/use-theme-observer';
 import { messages } from './messages';
@@ -39,26 +39,36 @@ const PREVIEW_MODIFIERS = [{
     rootBoundary: 'viewport'
   }
 }];
+const layoutStyles = {
+  titleRow: "_1ul9idpf",
+  titleIcon: "_4cvr1h6o _1e0c1txw _1o9zidpf _1bah1h6o",
+  attributionText: "_16jlkb7n _1o9zkb7n _i0dl1wug _1ul9idpf _1i4qfg65"
+};
 const styles = {
   positioner: "_c71lk6is _p12f1oec _1pby16oo",
   panel: "_2rko1qi0 _1reo15vq _18m915vq _1rjcutpp _18zrutpp _vchhusvi _bfhk1bhr _16qs130s _c71l1kw7 _p12f1osq _1bsbncxg",
   content: "_zulpu2gc _1e0c1txw _2lx21bp4",
-  title: "_11c81qyo _1reo15vq _18m915vq _syazazsu _1i4qfg65 _1e0ccj1k _sudp1e54 _1yyjcs5v",
+  title: "_11c81qyo _16jlkb7n _1o9zkb7n _i0dl1wug _1reo15vq _18m915vq _syazazsu _1ul9idpf _1i4qfg65 _1e0ccj1k _sudp1e54 _1yyjcs5v",
+  unclampedTitle: "_11c8fhey _16jlkb7n _1o9zkb7n _i0dl1wug _syazi7uo _k48pwu06 _1ul9idpf _1i4qfg65",
   description: "_11c8fhey _1reo15vq _18m915vq _syazi7uo _1e0ccj1k _1i4qfg65 _sudp1e54 _1yyjegat",
+  unclampedDescription: "_11c8fhey _syazi7uo _1i4qfg65",
   imageArea: "_2rko12b0 _1reo15vq _18m915vq _bfhkhfxm _4t3i68cl _6rthu2gc _p12f1osq _1bsbp3fh",
   image: "_1e0c1ule _4t3i1osq _5ral1f51 _1bsb1osq",
   imageHidden: "_3um015vq",
-  attribution: "_11c8wadc _zulp1b66 _4cvr1h6o _syazazsu _1e0c1txw _1i4qfg65",
+  attribution: "_zulp1b66 _4cvr1h6o _syazazsu _1e0c1txw _1i4qfg65",
+  compactAttribution: "_11c8wadc",
   attributionIcon: "_16jlidpf _1o9zidpf _i0dlexct _4cvr1h6o _1e0c1txw _4t3i7vkz _1bah1h6o _1bsb7vkz"
 };
 
 /** The selected item's description and attribution are announced through its aria-describedby. */
 export const QuickInsertHoverPreview = ({
   description,
+  icon,
   id,
   preview,
   popupsMountPoint,
   referenceElement,
+  shouldClampText = true,
   title
 }) => {
   const {
@@ -82,22 +92,26 @@ export const QuickInsertHoverPreview = ({
     className: ax([styles.positioner])
   }, /*#__PURE__*/React.createElement(QuickInsertPreviewPanel, {
     description: description,
+    icon: icon,
     id: hasAccessibleContent ? id : undefined,
     imageUrl: imageUrl,
     preview: preview,
     popupsMountPoint: popupsMountPoint,
     referenceElement: referenceElement,
+    shouldClampText: shouldClampText,
     title: title,
     update: update
   }))), portalTarget);
 };
 const QuickInsertPreviewPanel = ({
   description,
+  icon,
   id,
   imageUrl,
   preview,
   popupsMountPoint,
   referenceElement,
+  shouldClampText,
   title,
   update
 }) => {
@@ -142,27 +156,37 @@ const QuickInsertPreviewPanel = ({
     role: id ? 'tooltip' : undefined,
     "data-testid": "quick-insert-preview-panel",
     className: ax([styles.panel])
-  }, imageUrl && /*#__PURE__*/React.createElement(PreviewImage, {
+  }, /*#__PURE__*/React.createElement(React.Fragment, null, imageUrl && /*#__PURE__*/React.createElement(PreviewImage, {
     key: imageUrl,
     imageUrl: imageUrl
   }), /*#__PURE__*/React.createElement("div", {
     className: ax([styles.content])
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(Inline, {
+    alignBlock: "center",
+    space: "space.100",
+    xcss: layoutStyles.titleRow,
+    "aria-hidden": "true"
+  }, icon && /*#__PURE__*/React.createElement(Box, {
+    as: "span",
     "aria-hidden": "true",
-    className: ax([styles.title])
-  }, title), description && /*#__PURE__*/React.createElement("div", {
-    className: ax([styles.description])
+    xcss: layoutStyles.titleIcon
+  }, icon), /*#__PURE__*/React.createElement("span", {
+    className: ax([shouldClampText && styles.title, !shouldClampText && styles.unclampedTitle])
+  }, title)), description && /*#__PURE__*/React.createElement("div", {
+    className: ax([shouldClampText && styles.description, !shouldClampText && styles.unclampedDescription])
   }, description), preview.attribution && /*#__PURE__*/React.createElement("div", {
-    className: ax([styles.attribution])
+    className: ax([styles.attribution, shouldClampText && styles.compactAttribution])
   }, AttributionIcon && /*#__PURE__*/React.createElement("span", {
     "aria-hidden": "true",
     className: ax([styles.attributionIcon])
-  }, /*#__PURE__*/React.createElement(AttributionIcon, null)), /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(AttributionIcon, null)), /*#__PURE__*/React.createElement("span", {
+    className: ax([layoutStyles.attributionText])
+  }, /*#__PURE__*/React.createElement(Text, {
     size: "small",
     color: "color.text.subtle"
   }, AttributionIcon ? formattedAttributionName : formatMessage(messages.previewAttributionBy, {
     name: formattedAttributionName
-  })))));
+  })))))));
 };
 const PreviewImage = ({
   imageUrl