@atlaskit/editor-common 94.3.0 → 94.4.0

package/dist/es2019/element-browser/components/ElementList/ElementList.js

@@ -14,6 +14,8 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import { shortcutStyle } from '@atlaskit/editor-shared-styles/shortcut';
 import { ButtonItem } from '@atlaskit/menu';
+import { Stack, Text } from '@atlaskit/primitives';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import Tooltip from '@atlaskit/tooltip';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent } from '../../../analytics';
 import { IconFallback } from '../../../quick-insert';
@@ -276,8 +278,7 @@ const itemStyleOverrides = {
   alignItems: 'flex-start'
 };
 const ElementBefore = /*#__PURE__*/memo(({
-  icon,
-  title
+  icon
 }) => jsx("div", {
   css: [itemIcon, itemIconStyle]
 }, icon ? icon() : jsx(IconFallback, null)));
@@ -285,24 +286,53 @@ const ItemContent = /*#__PURE__*/memo(({
   title,
   description,
   keyshortcut
-}) =>
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-jsx("div", {
-  css: itemBody,
-  className: "item-body"
-}, jsx("div", {
-  css: itemText
-}, jsx("div", {
-  css: itemTitleWrapper
-}, jsx("p", {
-  css: itemTitle
-}, title), jsx("div", {
-  css: itemAfter
-}, keyshortcut && jsx("div", {
-  css: shortcutStyle
-}, keyshortcut))), description && jsx("p", {
-  css: itemDescription
-}, description))));
+}) => {
+  if (editorExperiment('typography_migration_ugc', true)) {
+    return (
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      jsx("div", {
+        css: itemBody,
+        className: "item-body"
+      }, jsx("div", {
+        css: itemText
+      }, jsx(Stack, {
+        space: "space.025"
+      }, jsx("div", {
+        css: itemTitleWrapper
+      }, jsx(Text, {
+        maxLines: 1
+      }, title), jsx("div", {
+        css: itemAfter
+      }, keyshortcut && jsx("div", {
+        css: shortcutStyle
+      }, keyshortcut))), description && jsx(Text, {
+        color: "color.text.subtle",
+        size: "small",
+        maxLines: 2
+      }, description))))
+    );
+  } else {
+    return (
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      jsx("div", {
+        css: itemBody,
+        className: "item-body"
+      }, jsx("div", {
+        css: itemText
+      }, jsx("div", {
+        css: itemTitleWrapper
+      }, jsx("p", {
+        css: itemTitle
+      }, title), jsx("div", {
+        css: itemAfter
+      }, keyshortcut && jsx("div", {
+        css: shortcutStyle
+      }, keyshortcut))), description && jsx("p", {
+        css: itemDescription
+      }, description)))
+    );
+  }
+});
 const elementItemsWrapper = css({
   flex: 1,
   flexFlow: 'row wrap',

package/dist/es2019/element-browser/components/ElementList/EmptyState.js

@@ -6,7 +6,7 @@
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import { LinkButton } from '@atlaskit/button/new';
-import { Box, xcss } from '@atlaskit/primitives';
+import { Box, Text, xcss } from '@atlaskit/primitives';
 import NotFoundIllustration from './NotFoundIllustration';
 export default function EmptyState({
   onExternalLinkClick
@@ -22,7 +22,7 @@ export default function EmptyState({
     description: "Empty state heading"
   })), jsx("div", {
     css: emptyStateSubHeading
-  }, jsx("p", null, jsx(FormattedMessage, {
+  }, jsx(Text, null, jsx(FormattedMessage, {
     id: "fabric.editor.elementbrowser.search.empty-state.sub-heading",
     defaultMessage: "Try searching with a different term or discover new apps for Atlassian products.",
     description: "Empty state sub-heading"

package/dist/es2019/element-browser/components/StatelessElementBrowser.js

@@ -11,6 +11,7 @@ import { FormattedMessage } from 'react-intl-next';
 import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext';
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent } from '../../analytics';
+import editorUGCToken from '../../ugc-tokens/get-editor-ugc-token';
 import { DEVICE_BREAKPOINT_NUMBERS, ELEMENT_BROWSER_ID, GRID_SIZE, INLINE_SIDEBAR_HEIGHT, SIDEBAR_HEADING_WRAPPER_HEIGHT, SIDEBAR_WIDTH } from '../constants';
 import useContainerWidth from '../hooks/use-container-width';
 import useSelectAndFocusOnArrowNavigation from '../hooks/use-select-and-focus-on-arrow-navigation';
@@ -70,7 +71,8 @@ const sidebarHeading = css({
   display: 'inline-flex',
   alignItems: 'center',
   paddingLeft: "var(--ds-space-150, 12px)",
-  fontWeight: 700
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
+  font: editorUGCToken('editor.font.heading.h1', 'typography-modernized') // use editor h1 modernized here as the style matches
 });
 const mobileMainContent = css({
   flex: '1 1 auto',
@@ -272,51 +274,54 @@ function MobileBrowser({
   emptyStateHandler,
   viewMoreItem
 }) {
-  return jsx("div", {
-    css: mobileElementBrowserContainer,
-    onKeyDown: onKeyDown,
-    "data-testid": "mobile__element-browser"
-  }, jsx("div", {
-    css: showCategories ? [mobileSideBar, mobileSideBarShowCategories] : mobileSideBar
-  }, showSearch && jsx(ElementSearch, {
-    onSearch: onSearch,
-    onKeyDown: onKeyPress,
-    mode: mode,
-    focus: focusOnSearch,
-    onClick: setFocusOnSearch,
-    searchTerm: searchTerm,
-    items: items,
-    selectedItemIndex: selectedItemIndex
-  }), showCategories && jsx("nav", {
-    css: mobileCategoryListWrapper,
-    tabIndex: -1
-  }, jsx(CategoryList, {
-    categories: categories,
-    onSelectCategory: onSelectCategory,
-    selectedCategory: selectedCategory,
-    focusedCategoryIndex: focusedCategoryIndex,
-    setFocusedCategoryIndex: setFocusedCategoryIndex,
-    setFocusedItemIndex: setFocusedItemIndex,
-    setFocusOnSearch: setFocusOnSearch
-  }))), jsx("div", {
-    css: mobileMainContent
-  }, jsx(ElementList, {
-    items: items,
-    mode: mode,
-    onInsertItem: onInsertItem,
-    selectedItemIndex: selectedItemIndex,
-    focusedItemIndex: focusedItemIndex,
-    setFocusedItemIndex: setFocusedItemIndex,
-    columnCount: columnCount,
-    setColumnCount: setColumnCount,
-    createAnalyticsEvent: createAnalyticsEvent,
-    emptyStateHandler: emptyStateHandler,
-    selectedCategory: selectedCategory,
-    searchTerm: searchTerm
-  })), viewMoreItem && jsx(ViewMore, {
-    item: viewMoreItem,
-    focus: focusOnViewMore
-  }));
+  return (
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+    jsx("div", {
+      css: mobileElementBrowserContainer,
+      onKeyDown: onKeyDown,
+      "data-testid": "mobile__element-browser"
+    }, jsx("div", {
+      css: showCategories ? [mobileSideBar, mobileSideBarShowCategories] : mobileSideBar
+    }, showSearch && jsx(ElementSearch, {
+      onSearch: onSearch,
+      onKeyDown: onKeyPress,
+      mode: mode,
+      focus: focusOnSearch,
+      onClick: setFocusOnSearch,
+      searchTerm: searchTerm,
+      items: items,
+      selectedItemIndex: selectedItemIndex
+    }), showCategories && jsx("nav", {
+      css: mobileCategoryListWrapper,
+      tabIndex: -1
+    }, jsx(CategoryList, {
+      categories: categories,
+      onSelectCategory: onSelectCategory,
+      selectedCategory: selectedCategory,
+      focusedCategoryIndex: focusedCategoryIndex,
+      setFocusedCategoryIndex: setFocusedCategoryIndex,
+      setFocusedItemIndex: setFocusedItemIndex,
+      setFocusOnSearch: setFocusOnSearch
+    }))), jsx("div", {
+      css: mobileMainContent
+    }, jsx(ElementList, {
+      items: items,
+      mode: mode,
+      onInsertItem: onInsertItem,
+      selectedItemIndex: selectedItemIndex,
+      focusedItemIndex: focusedItemIndex,
+      setFocusedItemIndex: setFocusedItemIndex,
+      columnCount: columnCount,
+      setColumnCount: setColumnCount,
+      createAnalyticsEvent: createAnalyticsEvent,
+      emptyStateHandler: emptyStateHandler,
+      selectedCategory: selectedCategory,
+      searchTerm: searchTerm
+    })), viewMoreItem && jsx(ViewMore, {
+      item: viewMoreItem,
+      focus: focusOnViewMore
+    }))
+  );
 }
 function DesktopBrowser({
   showCategories,
@@ -349,7 +354,7 @@ function DesktopBrowser({
     "data-testid": "desktop__element-browser"
   }, showCategories && jsx("div", {
     css: showCategories ? sideBarShowCategories : sideBar
-  }, jsx("h2", {
+  }, jsx("div", {
     css: sidebarHeading,
     "data-testid": "sidebar-heading",
     id: "sidebar-heading"

package/dist/es2019/extensibility/Extension/Lozenge/ExtensionLabel.js

@@ -69,7 +69,7 @@ const buttonLabelStyles = css({
   '&.remove-nested-left-margin': {
     marginLeft: 0
   },
-  fontSize: '16px',
+  fontSize: "var(--ds-space-200, 16px)",
   fontWeight: "var(--ds-font-weight-regular, 400)"
 });
 const spacerStyles = css({
@@ -77,6 +77,9 @@ const spacerStyles = css({
   height: '10px'
 });
 const textStyles = css({
+  // cannot use font.body or editor custom font.body here as line-height need to be 1 (from sharedLabelStyles)
+  // cannot use space token as there is not token for 14px
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   fontSize: '14px',
   fontWeight: "var(--ds-font-weight-regular, 400)",
   padding: `${"var(--ds-space-025, 2px)"} ${"var(--ds-space-050, 4px)"}`
@@ -139,51 +142,56 @@ export const ExtensionLabel = ({
   const iconClassNames = classnames({
     'hide-icon': isBodiedMacro && !isNodeHovered
   });
-  return jsx("div", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    css: containerStyles
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: containerClassNames
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
-    ,
-    style: customContainerStyles,
-    onMouseOver: () => {
-      setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(true);
-    },
-    onMouseLeave: () => {
-      setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false);
-    },
-    "data-testid": "new-lozenge-container"
-  }, showMacroButtonUpdates ? jsx(Fragment, null, jsx(Tooltip, {
-    content: jsx(FormattedMessage, _extends({}, i18n.configure, {
-      values: {
-        macroName: text
-      }
-    })),
-    position: "top"
-  }, tooltipProps => jsx("span", _extends({
-    "data-testid": "new-lozenge-button"
-  }, tooltipProps, {
-    css: [sharedLabelStyles, buttonLabelStyles]
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: `${sharedLabelClassNames} ${newButtonLabelClassNames}`
-  }), text, jsx("span", {
-    css: iconStyles,
-    className: iconClassNames,
-    "data-testid": "config-icon"
-  }, jsx(PreferencesIcon, {
-    label: ""
-  })))), jsx("div", {
-    css: spacerStyles
-  })) : jsx("span", {
-    "data-testid": "new-lozenge",
-    css: [sharedLabelStyles, originalLabelStyles]
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: sharedLabelClassNames
-  }, jsx("span", {
-    css: textStyles
-  }, text)));
+  return (
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+    jsx("div", {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      css: containerStyles
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      ,
+      className: containerClassNames
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+      ,
+      style: customContainerStyles
+      // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
+      ,
+      onMouseOver: () => {
+        setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(true);
+      },
+      onMouseLeave: () => {
+        setIsNodeHovered === null || setIsNodeHovered === void 0 ? void 0 : setIsNodeHovered(false);
+      },
+      "data-testid": "new-lozenge-container"
+    }, showMacroButtonUpdates ? jsx(Fragment, null, jsx(Tooltip, {
+      content: jsx(FormattedMessage, _extends({}, i18n.configure, {
+        values: {
+          macroName: text
+        }
+      })),
+      position: "top"
+    }, tooltipProps => jsx("span", _extends({
+      "data-testid": "new-lozenge-button"
+    }, tooltipProps, {
+      css: [sharedLabelStyles, buttonLabelStyles]
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      ,
+      className: `${sharedLabelClassNames} ${newButtonLabelClassNames}`
+    }), text, jsx("span", {
+      css: iconStyles,
+      className: iconClassNames,
+      "data-testid": "config-icon"
+    }, jsx(PreferencesIcon, {
+      label: ""
+    })))), jsx("div", {
+      css: spacerStyles
+    })) : jsx("span", {
+      "data-testid": "new-lozenge",
+      css: [sharedLabelStyles, originalLabelStyles]
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      ,
+      className: sharedLabelClassNames
+    }, jsx("span", {
+      css: textStyles
+    }, text)))
+  );
 };

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 = "94.3.0";
+const packageVersion = "94.4.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/es2019/styles/index.js

@@ -3,7 +3,7 @@ export { backgroundColorStyles } from './shared/background-color';
 export { tableSharedStyle, tableMarginTop, tableMarginBottom, tableMarginSides, tableCellMinWidth, tableNewColumnMinWidth, tableCellBorderWidth, calcTableWidth, TableSharedCssClassName, tableResizeHandleWidth, tableCellPadding, tableMarginTopWithControl } from './shared/table';
 export { AnnotationSharedClassNames, BlockAnnotationSharedClassNames, AnnotationSharedCSSByState, annotationSharedStyles } from './shared/annotation';
 export { columnLayoutSharedStyle } from './shared/column-layout';
-export { mediaSingleSharedStyle, richMediaClassName } from './shared/media-single';
+export { mediaSingleSharedStyle, mediaSingleSharedStyleNew, richMediaClassName } from './shared/media-single';
 export { blockquoteSharedStyles } from './shared/blockquote';
 export { headingsSharedStyles } from './shared/headings';
 export { ruleSharedStyles } from './shared/rule';

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

@@ -1,7 +1,32 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
+import { akEditorWrappedNodeZIndex } from '@atlaskit/editor-shared-styles';
+import { fg } from '@atlaskit/platform-feature-flags';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const embedCardStyles = css({
+export const embedCardStyles = () => fg('platform_editor_element_dnd_nested_fix_patch_3') ? css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '.ProseMirror': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    ".embedCardView-content-wrap[layout^='wrap-']": {
+      maxWidth: '100%',
+      position: 'relative',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+      zIndex: akEditorWrappedNodeZIndex
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    ".embedCardView-content-wrap[layout='wrap-left']": {
+      float: 'left'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    ".embedCardView-content-wrap[layout='wrap-right']": {
+      float: 'right'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    ".embedCardView-content-wrap[layout='wrap-right'] + .embedCardView-content-wrap[layout='wrap-left']": {
+      clear: 'both'
+    }
+  }
+}) : css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.ProseMirror': {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766

package/dist/es2019/styles/shared/media-single.js

@@ -1,5 +1,6 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
+import { akEditorWrappedNodeZIndex } from '@atlaskit/editor-shared-styles';
 const richMediaClassName = 'rich-media-item';
 const wrappedMediaBreakoutPoint = 410;
 const mediaSingleSharedStyle = css({
@@ -62,6 +63,72 @@ const mediaSingleSharedStyle = css({
     }
   }
 });
+const mediaSingleSharedStyleNew = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  [`li .${richMediaClassName}`]: {
+    margin: 0
+  },
+  // Hack for chrome to fix media single position inside a list when media is the first child
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '&.ua-chrome li > .mediaSingleView-content-wrap::before': {
+    content: "''",
+    display: 'block',
+    height: 0
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '&.ua-firefox': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    '.mediaSingleView-content-wrap': {
+      userSelect: 'none'
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    '.captionView-content-wrap': {
+      userSelect: 'text'
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  ".mediaSingleView-content-wrap[layout^='wrap-']": {
+    position: 'relative',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
+    zIndex: akEditorWrappedNodeZIndex
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  ".mediaSingleView-content-wrap[layout='center']": {
+    clear: 'both'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  [`table .${richMediaClassName}`]: {
+    marginTop: "var(--ds-space-150, 12px)",
+    marginBottom: "var(--ds-space-150, 12px)",
+    clear: 'both',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    '&.image-wrap-left[data-layout], &.image-wrap-right[data-layout]': {
+      clear: 'none',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+      '&:first-child': {
+        marginTop: "var(--ds-space-150, 12px)"
+      }
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  [`.${richMediaClassName}.image-wrap-right + .${richMediaClassName}.image-wrap-left`]: {
+    clear: 'both'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  [`.${richMediaClassName}.image-wrap-left + .${richMediaClassName}.image-wrap-right, .${richMediaClassName}.image-wrap-right + .${richMediaClassName}.image-wrap-left, .${richMediaClassName}.image-wrap-left + .${richMediaClassName}.image-wrap-left, .${richMediaClassName}.image-wrap-right + .${richMediaClassName}.image-wrap-right`]: {
+    marginRight: 0,
+    marginLeft: 0
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  [`@media all and (max-width: ${wrappedMediaBreakoutPoint}px)`]: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "div.mediaSingleView-content-wrap[layout='wrap-left'], div.mediaSingleView-content-wrap[data-layout='wrap-left'], div.mediaSingleView-content-wrap[layout='wrap-right'], div.mediaSingleView-content-wrap[data-layout='wrap-right']": {
+      float: 'none',
+      overflow: 'auto',
+      margin: `${"var(--ds-space-150, 12px)"} 0`
+    }
+  }
+});
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export { mediaSingleSharedStyle, richMediaClassName };
+export { mediaSingleSharedStyle, mediaSingleSharedStyleNew, richMediaClassName };

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

@@ -8,6 +8,7 @@ import React from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
+import { Box, Text, xcss } from '@atlaskit/primitives';
 import { messages } from './messages';
 const captionWrapperStyle = css({
   marginTop: "var(--ds-space-100, 8px)",
@@ -15,10 +16,10 @@ const captionWrapperStyle = css({
   position: 'relative',
   color: "var(--ds-text-subtle, #44546F)"
 });
-const placeholderStyle = css({
-  color: "var(--ds-text-subtlest, #626F86)",
+const placeholderStyle = xcss({
+  color: 'color.text.subtlest',
   position: 'absolute',
-  top: 0,
+  top: 'space.0',
   width: '100%'
 });
 export class CaptionComponent extends React.Component {
@@ -38,9 +39,9 @@ export class CaptionComponent extends React.Component {
       "data-testid": "media-caption"
     }, dataAttributes, {
       css: captionWrapperStyle
-    }), showPlaceholder ? jsx("p", {
-      css: placeholderStyle
-    }, formatMessage(messages.placeholder)) : null, children);
+    }), showPlaceholder ? jsx(Box, {
+      xcss: placeholderStyle
+    }, jsx(Text, null, formatMessage(messages.placeholder))) : null, children);
   }
 }
 export default injectIntl(CaptionComponent);

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 = "94.3.0";
+const packageVersion = "94.4.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/esm/analytics/types/node-events.js

@@ -5,6 +5,8 @@ export var LAYOUT_TYPE = /*#__PURE__*/function (LAYOUT_TYPE) {
   LAYOUT_TYPE["LEFT_SIDEBAR"] = "twoColumnsLeftSidebar";
   LAYOUT_TYPE["RIGHT_SIDEBAR"] = "twoColumnsRightSidebar";
   LAYOUT_TYPE["THREE_WITH_SIDEBARS"] = "threeColumnsWithSidebars ";
+  LAYOUT_TYPE["FOUR_COLS_EQUAL"] = "fourColumnsEqual";
+  LAYOUT_TYPE["FIVE_COLS_EQUAL"] = "fiveColumnsEqual";
   return LAYOUT_TYPE;
 }({});
 export var SMART_LINK_TYPE = /*#__PURE__*/function (SMART_LINK_TYPE) {

package/dist/esm/doc-utils/editor-use-only.js

@@ -1,3 +1,4 @@
+/* eslint-disable @atlaskit/design-system/use-primitives-text */
 import React from 'react';
 import SectionMessage from '@atlaskit/section-message';
 function AlternativePackagesMessage(_ref) {