@atlaskit/editor-common 78.11.5 → 78.11.6

package/dist/es2019/styles/shared/unsupported-content.js

@@ -6,6 +6,8 @@ export const UnsupportedSharedCssClassName = {
 };
 const inlineUnsupportedSelector = `.${UnsupportedSharedCssClassName.INLINE_CONTAINER} > span:nth-of-type(2)`;
 const blockUnsupportedSelector = `.${UnsupportedSharedCssClassName.BLOCK_CONTAINER} > div`;
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Nested `getSelectionStyles` would need a rebuild to autofix
 export const unsupportedStyles = css`
   ${blockUnsupportedSelector}, ${inlineUnsupportedSelector} {
     cursor: pointer;

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

@@ -1,6 +1,6 @@
 import { css } from '@emotion/react';
-const whitespaceSharedStyles = css`
-  word-wrap: break-word;
-  white-space: pre-wrap;
-`;
+const whitespaceSharedStyles = css({
+  wordWrap: 'break-word',
+  whiteSpace: 'pre-wrap'
+});
 export { whitespaceSharedStyles };

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

@@ -7,7 +7,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "78.11.5";
+const packageVersion = "78.11.6";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/es2019/ui/MediaSingle/styled.js

@@ -135,27 +135,29 @@ export const MediaSingleDimensionHelper = ({
   isExtendedResizeExperienceOn,
   isNestedNode = false,
   isInsideOfInlineExtension = false
-}) => css`
-  /* For nested rich media items, set max-width to 100% */
-  tr &,
-  [data-layout-column] &,
-  [data-node-type='expand'] &,
-  [data-panel-type] &,
-  li & {
-    max-width: 100%;
-  }
+}) =>
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
+css`
+    /* For nested rich media items, set max-width to 100% */
+    tr &,
+    [data-layout-column] &,
+    [data-node-type='expand'] &,
+    [data-panel-type] &,
+    li & {
+      max-width: 100%;
+    }
 
-  width: ${isExtendedResizeExperienceOn ? `${mediaSingleWidth || width}px` : mediaSingleWidth ? calcResizedWidth(layout, width || 0, containerWidth) : calcLegacyWidth(layout, width || 0, containerWidth, fullWidthMode, isResized, isInsideOfInlineExtension)};
-  ${layout === 'full-width' &&
+    width: ${isExtendedResizeExperienceOn ? `${mediaSingleWidth || width}px` : mediaSingleWidth ? calcResizedWidth(layout, width || 0, containerWidth) : calcLegacyWidth(layout, width || 0, containerWidth, fullWidthMode, isResized, isInsideOfInlineExtension)};
+    ${layout === 'full-width' &&
 /* This causes issues for new experience where we don't strip layout attributes
- when copying top-level node and pasting into a table/layout,
- because full-width layout will remain, causing node to be edge-to-edge */
-!isExtendedResizeExperienceOn && css`
-    min-width: 100%;
-  `}
-  max-width: ${isExtendedResizeExperienceOn ? `${containerWidth}px` : calcMaxWidth(layout, containerWidth)};
+when copying top-level node and pasting into a table/layout,
+because full-width layout will remain, causing node to be edge-to-edge */
+!isExtendedResizeExperienceOn && css({
+  minWidth: '100%'
+})}
+    max-width: ${isExtendedResizeExperienceOn ? `${containerWidth}px` : calcMaxWidth(layout, containerWidth)};
 
-  ${isExtendedResizeExperienceOn && `&[class*='is-resizing'] {
+    ${isExtendedResizeExperienceOn && `&[class*='is-resizing'] {
     .new-file-experience-wrapper {
       box-shadow: none !important;
     }
@@ -164,27 +166,29 @@ export const MediaSingleDimensionHelper = ({
       transform: translateX(-50%);`}
   }`}
 
-  &:not(.is-resizing) {
-    transition: width 100ms ease-in;
-  }
+    &:not(.is-resizing) {
+      transition: width 100ms ease-in;
+    }
 
-  float: ${float(layout)};
-  margin: ${calcMargin(layout)};
+    float: ${float(layout)};
+    margin: ${calcMargin(layout)};
 
-  &[class*='not-resizing'] {
-    ${isNestedNode ? /* Make nested node appear responsive when resizing table cell */
+    &[class*='not-resizing'] {
+      ${isNestedNode ? /* Make nested node appear responsive when resizing table cell */
 `max-width: 100%;` : nonWrappedLayouts.includes(layout) && `margin-left: 50%;
         transform: translateX(-50%);`}
-  }
+    }
 
-  ${isImageAligned(layout)};
-`;
+    ${isImageAligned(layout)};
+  `;
 const RenderFallbackContainer = ({
   hasFallbackContainer,
   paddingBottom,
   height
-}) => css`
-  ${hasFallbackContainer ? `
+}) =>
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
+css`
+    ${hasFallbackContainer ? `
   &::after {
     content: '';
     display: block;
@@ -195,7 +199,9 @@ const RenderFallbackContainer = ({
     line-height: 0;
   }
   ` : ''}
-`;
+  `;
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
 export const mediaWrapperStyle = props => css`
   position: relative;
 

package/dist/es2019/ui/ResizerLegacy/styled.js

@@ -1,5 +1,7 @@
 import { css } from '@emotion/react';
 import { MediaSingleDimensionHelper } from '../MediaSingle/styled';
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
 export const wrapperStyle = props => css`
   & > div {
     ${MediaSingleDimensionHelper(props)};

package/dist/es2019/ui/clear-next-sibling-margin-top.js

@@ -1,16 +1,18 @@
 import { css } from '@emotion/react';
 
 // We use !important to ensure next sibling gets the margin reset no matter what
-const marginTopReset = `margin-top: 0 !important;`;
-export const clearNextSiblingMarginTopStyle = css`
-  & + * {
-    ${marginTopReset}
+
+export const clearNextSiblingMarginTopStyle = css({
+  '& + *': {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+    marginTop: '0 !important'
   }
-`;
+});
 const textElements = ['p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
 const nextSiblingBlockMarkContentSelectors = textElements.map(elem => `+ .fabric-editor-block-mark > ${elem}`).join(',');
-export const clearNextSiblingBlockMarkMarginTopStyle = css`
-  ${nextSiblingBlockMarkContentSelectors} {
-    ${marginTopReset}
+export const clearNextSiblingBlockMarkMarginTopStyle = css({
+  [`${nextSiblingBlockMarkContentSelectors}`]: {
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+    marginTop: '0 !important'
   }
-`;
+});

package/dist/esm/collab/index.js

@@ -1,5 +1,5 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import { css } from '@emotion/react';
 import { hexToRgba } from '@atlaskit/adf-schema';
 import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
@@ -136,16 +136,43 @@ export var colors = [themeColors.R100, themeColors.R300, themeColors.R500, theme
     selection: hexToRgba(solid, 0.2)
   };
 });
-var telepointerColorStyle = function telepointerColorStyle(color, index) {
-  return "\n  &.color-".concat(index, " {\n    background-color: ").concat(color.selection, ";\n    &::after {\n      background-color: ").concat(color.solid, ";\n      color: ", "var(--ds-text-inverse, #fff)", ";\n      border-color: ").concat(color.solid, ";\n    }\n  }\n");
-};
 export var TELEPOINTER_DIM_CLASS = 'telepointer-dim';
-
-// Disable top: -14px since it is necessary to align to cursor
-// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-export var telepointerStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ProseMirror .telepointer {\n    position: relative;\n    transition: opacity 200ms;\n\n    &.telepointer-selection {\n      line-height: 1.2;\n      pointer-events: none;\n      user-select: none;\n    }\n\n    &.telepointer-selection-badge::after {\n      content: attr(data-initial);\n      position: absolute;\n      display: block;\n      top: -14px;\n      font-size: ", ";\n      padding: ", ";\n      color: ", ";\n      left: 0px;\n      border-radius: 2px 2px 2px 0;\n      line-height: initial;\n    }\n\n    &.", " {\n      opacity: 0.2;\n    }\n\n    ", ";\n  }\n"])), relativeFontSizeToBase16(9), "var(--ds-space-025, 2px)", "var(--ds-text-inverse, white)", TELEPOINTER_DIM_CLASS, colors.map(function (color, index) {
-  return telepointerColorStyle(color, index);
-}));
+export var telepointerStyle = css.apply(void 0, [{
+  '.ProseMirror .telepointer': _defineProperty({
+    position: 'relative',
+    transition: 'opacity 200ms',
+    '&.telepointer-selection': {
+      lineHeight: 1.2,
+      pointerEvents: 'none',
+      userSelect: 'none'
+    },
+    '&.telepointer-selection-badge::after': {
+      content: 'attr(data-initial)',
+      position: 'absolute',
+      display: 'block',
+      // Disable top: -14px since it is necessary to align to cursor
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      top: '-14px',
+      fontSize: relativeFontSizeToBase16(9),
+      padding: "var(--ds-space-025, 2px)",
+      color: "var(--ds-text-inverse, white)",
+      left: '0px',
+      borderRadius: '2px 2px 2px 0',
+      lineHeight: 'initial'
+    }
+  }, "&.".concat(TELEPOINTER_DIM_CLASS), {
+    opacity: 0.2
+  })
+}].concat(_toConsumableArray(colors.map(function (color, index) {
+  return _defineProperty({}, "&.color-".concat(index), {
+    backgroundColor: color.selection,
+    '&::after': {
+      backgroundColor: color.solid,
+      color: "var(--ds-text-inverse, #fff)",
+      borderColor: color.solid
+    }
+  });
+}))));
 var tintKey = 'collab:isDirtyTransaction';
 export var isDirtyTransaction = function isDirtyTransaction(tr) {
   return Boolean(tr.getMeta(tintKey));

package/dist/esm/keymaps/index.js

@@ -1,6 +1,4 @@
 import _typeof from "@babel/runtime/helpers/typeof";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
 /** @jsx jsx */
 import React, { Fragment } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -93,9 +91,13 @@ var arrowKeysMap = {
   ARROWUP: "\u2191",
   ARROWDOWN: "\u2193"
 };
-var tooltipShortcutStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  border-radius: 2px;\n  background-color: ", ";\n  padding: 0 ", ";\n\n  /* TODO: fix in develop: https://atlassian.slack.com/archives/CFG3PSQ9E/p1647395052443259?thread_ts=1647394572.556029&cid=CFG3PSQ9E */\n  /* stylelint-disable-next-line */\n  label: tooltip-shortcut;\n"])), "var(--ds-background-inverse-subtle, ".concat(N400, ")"), "var(--ds-space-025, 2px)");
-/* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
-
+var tooltipShortcutStyle = css({
+  borderRadius: '2px',
+  backgroundColor: "var(--ds-background-inverse-subtle, ".concat(N400, ")"),
+  padding: "0 ".concat("var(--ds-space-025, 2px)"),
+  // NOTE: This might not actually do anything: https://atlassian.slack.com/archives/CFG3PSQ9E/p1647395052443259?thread_ts=1647394572.556029&cid=CFG3PSQ9E
+  label: 'tooltip-shortcut'
+});
 function formatShortcut(keymap) {
   var shortcut;
   if (browser.mac) {

package/dist/esm/media-inline/media-inline-image-card.js

@@ -3,7 +3,6 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 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) { _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; }
 /** @jsx jsx */
-
 import { Fragment, useCallback, useEffect, useMemo, useState } from 'react';
 import { jsx } from '@emotion/react';
 import ReactDOM from 'react-dom';

package/dist/esm/media-inline/styles.js

@@ -9,6 +9,7 @@ export var INLINE_IMAGE_BORDER_SIZE_CSS_VAR_KEY = '--editor-media-inline-image-b
 export var INLINE_IMAGE_BORDER_COLOR_CSS_VAR_KEY = '--editor-media-inline-image-border-color';
 
 // We implemented such selectors to ensure specificity:
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Nested and dynamic css calls are violations, needs manual remediation
 var inlineImageHeight = function inlineImageHeight(height) {
   var margin = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  /* Editor style */\n  > .mediaInlineView-content-wrap > .", ",\n  > :is(a, span[data-mark-type='border']) .mediaInlineView-content-wrap > .", ",\n  /* Renderer style */\n  > .", ",\n  > :is(a, span[data-mark-type='border']) .", " {\n    height: ", "px;\n    transform: translateY(", "px);\n  }\n"])), INLINE_IMAGE_WRAPPER_CLASS_NAME, INLINE_IMAGE_WRAPPER_CLASS_NAME, INLINE_IMAGE_WRAPPER_CLASS_NAME, INLINE_IMAGE_WRAPPER_CLASS_NAME, height, margin);
@@ -20,6 +21,7 @@ var inlineImageHeight = function inlineImageHeight(height) {
  * shift in top and bottom and size adjustments to make up for lack of 1to1 size
  * mapping
  */
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Nested and dynamic css calls are violations, needs manual remediation
 export var mediaInlineImageStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  // p, h3, and action items\n  .", " {\n    height: ", "px;\n    transform: translateY(-2px);\n  }\n\n  h1 {\n    ", "\n  }\n\n  h2 {\n    ", "\n  }\n\n  h3 {\n    ", "\n  }\n\n  h4 {\n    ", "\n  }\n\n  h5 {\n    ", "\n  }\n\n  h6 {\n    ", "\n  }\n"])), INLINE_IMAGE_WRAPPER_CLASS_NAME, referenceHeights['p'], inlineImageHeight(referenceHeights['h1'], -3), inlineImageHeight(referenceHeights['h2'], -3), inlineImageHeight(referenceHeights['h3'], -2), inlineImageHeight(referenceHeights['h4'], -2), inlineImageHeight(referenceHeights['h5'], -2), inlineImageHeight(referenceHeights['h6'], -2));
 export var wrapperStyle = css({
   display: 'inline-flex',

package/dist/esm/media-inline/views/icon-wrapper.js

@@ -1,5 +1,4 @@
 /** @jsx jsx */
-
 import { css, jsx } from '@emotion/react';
 var wrapperStyle = css({
   display: 'flex',

package/dist/esm/monitoring/error.js

@@ -6,7 +6,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; }
 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 = "78.11.5";
+var packageVersion = "78.11.6";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/esm/selection/gap-cursor/styles.js

@@ -1,10 +1,19 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2;
+var _templateObject;
 import { css, keyframes } from '@emotion/react';
-var gapCursorBlink = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  from, to {\n    opacity: 0;\n  }\n  50% {\n    opacity: 1;\n  }\n"])));
+var gapCursorBlink = keyframes({
+  'from, to': {
+    opacity: 0
+  },
+  '50%': {
+    opacity: 1
+  }
+});
 export var hideCaretModifier = 'ProseMirror-hide-gapcursor';
 var gapCursor = '.ProseMirror-gapcursor';
 var prosemirrorwidget = '.ProseMirror-widget';
 var wrapLeft = '[layout="wrap-left"]';
 var wrapRight = '[layout="wrap-right"]';
-export var gapCursorStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  /* =============== GAP CURSOR ================== */\n  .ProseMirror {\n    &.", " {\n      caret-color: transparent;\n    }\n\n    ", " {\n      display: none;\n      pointer-events: none;\n      position: relative;\n\n      & span {\n        caret-color: transparent;\n        position: absolute;\n        height: 100%;\n        width: 100%;\n        display: block;\n      }\n\n      & span::after {\n        animation: 1s ", " step-end infinite;\n        border-left: 1px solid;\n        content: '';\n        display: block;\n        position: absolute;\n        top: 0;\n        height: 100%;\n      }\n      &.-left span::after {\n        left: ", ";\n      }\n      &.-right span::after {\n        right: ", ";\n      }\n      & span[layout='full-width'],\n      & span[layout='wide'],\n      & span[layout='fixed-width'] {\n        margin-left: 50%;\n        transform: translateX(-50%);\n      }\n      &", " {\n        float: right;\n      }\n\n      /* fix vertical alignment of gap cursor */\n      &:first-of-type + ul,\n      &:first-of-type + span + ul,\n      &:first-of-type + ol,\n      &:first-of-type + span + ol,\n      &:first-of-type + pre,\n      &:first-of-type + span + pre,\n      &:first-of-type + blockquote,\n      &:first-of-type + span + blockquote {\n        margin-top: 0;\n      }\n    }\n    &.ProseMirror-focused ", " {\n      display: block;\n      border-color: transparent;\n    }\n  }\n\n  /* This hack below is for two images aligned side by side */\n  ", "", " + span + ", ",\n  ", "", " + span + ", ",\n  ", " + ", " + ", ",\n  ", " + ", " + span + ", ",\n  ", " + ", " + ", ",\n  ", " + ", " + span + ", ",\n  ", " + ", " + ", ",\n  ", " + ", " + span ", ",\n  ", " + ", " + ", ",\n  ", " + ", " + span + ", ",\n  ", " + ", " {\n    clear: none;\n  }\n\n  ", " + ", " + ", " > div,\n  ", " + ", " + span + ", " > div,\n  ", " + ", " + ", " > div,\n  ", " + ", " + span + ", " > div,\n  ", " + ", " + ", " > div,\n  ", " + ", " + span + ", " > div,\n  ", " + ", " + ", " > div,\n  ", " + ", " + span + ", " > div {\n    margin-right: 0;\n    margin-left: 0;\n    margin-bottom: 0;\n  }\n\n  ", " + ", ",\n  ", " + ", " {\n    float: left;\n  }\n\n  ", " + ", " + span + ", "::after,\n  ", " + ", " + span + ", "::after,\n  ", " + ", " + ", "::after,\n  ", " + ", " + span + ", "::after,\n  ", " + ", " + ", "::after,\n  ", " + ", " + span + ", "::after {\n    visibility: hidden;\n    display: block;\n    font-size: 0;\n    content: ' ';\n    clear: both;\n    height: 0;\n  }\n\n  ", " + ", " + ", " + *,\n  ", " + ", " + ", " + span + *,\n  ", " + ", " + ", " + *,\n  ", " + ", " + ", " + span + *,\n  ", " + ", " + span + ", " + *,\n  ", " + ", " + span + ", " + *,\n  ", " + ", " + span + ", " + *,\n  ", " + ", " + span + ", " + *,\n  ", " + ", " + ", " + * > *,\n  ", " + ", " + ", " + span + * > *,\n  ", " + ", " + ", " + * > *,\n  ", " + ", " + ", " + span + * > *,\n  ", " + ", " + span + ", " + * > *,\n  ", " + ", " + span + ", " + * > *,\n  ", " + ", " + span + ", " + * > *,\n  ", " + ", " + span + ", " + * > *,\n  ", " + ", " + *,\n  ", " + ", " + span + * {\n    margin-top: 0;\n  }\n"])), hideCaretModifier, gapCursor, gapCursorBlink, "var(--ds-space-negative-050, -4px)", "var(--ds-space-negative-050, -4px)", wrapRight, gapCursor, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapRight, wrapLeft, gapCursor, wrapRight, gapCursor, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, prosemirrorwidget, gapCursor, prosemirrorwidget, gapCursor);
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- This needs manual remediation, it autofixes seemingly safely, but the code style and readability is destroyed.
+export var gapCursorStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  /* =============== GAP CURSOR ================== */\n  .ProseMirror {\n    &.", " {\n      caret-color: transparent;\n    }\n\n    ", " {\n      display: none;\n      pointer-events: none;\n      position: relative;\n\n      & span {\n        caret-color: transparent;\n        position: absolute;\n        height: 100%;\n        width: 100%;\n        display: block;\n      }\n\n      & span::after {\n        animation: 1s ", " step-end infinite;\n        border-left: 1px solid;\n        content: '';\n        display: block;\n        position: absolute;\n        top: 0;\n        height: 100%;\n      }\n      &.-left span::after {\n        left: ", ";\n      }\n      &.-right span::after {\n        right: ", ";\n      }\n      & span[layout='full-width'],\n      & span[layout='wide'],\n      & span[layout='fixed-width'] {\n        margin-left: 50%;\n        transform: translateX(-50%);\n      }\n      &", " {\n        float: right;\n      }\n\n      /* fix vertical alignment of gap cursor */\n      &:first-of-type + ul,\n      &:first-of-type + span + ul,\n      &:first-of-type + ol,\n      &:first-of-type + span + ol,\n      &:first-of-type + pre,\n      &:first-of-type + span + pre,\n      &:first-of-type + blockquote,\n      &:first-of-type + span + blockquote {\n        margin-top: 0;\n      }\n    }\n    &.ProseMirror-focused ", " {\n      display: block;\n      border-color: transparent;\n    }\n  }\n\n  /* This hack below is for two images aligned side by side */\n  ", "", " + span + ", ",\n  ", "", " + span + ", ",\n  ", " + ", " + ", ",\n  ", " + ", " + span + ", ",\n  ", " + ", " + ", ",\n  ", " + ", " + span + ", ",\n  ", " + ", " + ", ",\n  ", " + ", " + span ", ",\n  ", " + ", " + ", ",\n  ", " + ", " + span + ", ",\n  ", " + ", " {\n    clear: none;\n  }\n\n  ", " + ", " + ", " > div,\n  ", " + ", " + span + ", " > div,\n  ", " + ", " + ", " > div,\n  ", " + ", " + span + ", " > div,\n  ", " + ", " + ", " > div,\n  ", " + ", " + span + ", " > div,\n  ", " + ", " + ", " > div,\n  ", " + ", " + span + ", " > div {\n    margin-right: 0;\n    margin-left: 0;\n    margin-bottom: 0;\n  }\n\n  ", " + ", ",\n  ", " + ", " {\n    float: left;\n  }\n\n  ", " + ", " + span + ", "::after,\n  ", " + ", " + span + ", "::after,\n  ", " + ", " + ", "::after,\n  ", " + ", " + span + ", "::after,\n  ", " + ", " + ", "::after,\n  ", " + ", " + span + ", "::after {\n    visibility: hidden;\n    display: block;\n    font-size: 0;\n    content: ' ';\n    clear: both;\n    height: 0;\n  }\n\n  ", " + ", " + ", " + *,\n  ", " + ", " + ", " + span + *,\n  ", " + ", " + ", " + *,\n  ", " + ", " + ", " + span + *,\n  ", " + ", " + span + ", " + *,\n  ", " + ", " + span + ", " + *,\n  ", " + ", " + span + ", " + *,\n  ", " + ", " + span + ", " + *,\n  ", " + ", " + ", " + * > *,\n  ", " + ", " + ", " + span + * > *,\n  ", " + ", " + ", " + * > *,\n  ", " + ", " + ", " + span + * > *,\n  ", " + ", " + span + ", " + * > *,\n  ", " + ", " + span + ", " + * > *,\n  ", " + ", " + span + ", " + * > *,\n  ", " + ", " + span + ", " + * > *,\n  ", " + ", " + *,\n  ", " + ", " + span + * {\n    margin-top: 0;\n  }\n"])), hideCaretModifier, gapCursor, gapCursorBlink, "var(--ds-space-negative-050, -4px)", "var(--ds-space-negative-050, -4px)", wrapRight, gapCursor, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapRight, wrapLeft, gapCursor, wrapRight, gapCursor, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, prosemirrorwidget, gapCursor, prosemirrorwidget, gapCursor);

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

@@ -1,5 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3;
+var _templateObject;
 import { css } from '@emotion/react';
 import { N60A, Y300, Y75 } from '@atlaskit/theme/colors';
 export var annotationPrefix = 'ak-editor-annotation';
@@ -12,10 +12,24 @@ var Y75a = 'rgba(255, 240, 179, 0.5)';
 var Y200a = 'rgba(255, 196, 0, 0.82)';
 export var AnnotationSharedCSSByState = function AnnotationSharedCSSByState() {
   return {
-    focus: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    // Background is not coming through in confluence, suspecting to be caused by some specific combination of\n    // emotion and token look up\n\n    background: ", ";\n    border-bottom: 2px solid ", ";\n    // TODO: https://product-fabric.atlassian.net/browse/DSP-4147\n    box-shadow: ", ";\n    cursor: pointer;\n  "])), "var(--ds-background-accent-yellow-subtler, ".concat(Y75, ")"), "var(--ds-border-accent-yellow, ".concat(Y300, ")"), "var(--ds-shadow-overlay, ".concat("1px 2px 3px ".concat(N60A, ", -1px 2px 3px ").concat(N60A), ")")),
-    blur: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    background: ", ";\n    border-bottom: 2px solid ", ";\n    cursor: pointer;\n  "])), "var(--ds-background-accent-yellow-subtlest, ".concat(Y75a, ")"), "var(--ds-border-accent-yellow, ".concat(Y200a, ")"))
+    focus: css({
+      // Background is not coming through in confluence, suspecting to be caused by some specific combination of
+      // emotion and token look up
+      background: "var(--ds-background-accent-yellow-subtler, ".concat(Y75, ")"),
+      borderBottom: "2px solid ".concat("var(--ds-border-accent-yellow, ".concat(Y300, ")")),
+      // TODO: https://product-fabric.atlassian.net/browse/DSP-4147
+      boxShadow: "var(--ds-shadow-overlay, ".concat("1px 2px 3px ".concat(N60A, ", -1px 2px 3px ").concat(N60A), ")"),
+      cursor: 'pointer'
+    }),
+    blur: css({
+      background: "var(--ds-background-accent-yellow-subtlest, ".concat(Y75a, ")"),
+      borderBottom: "2px solid ".concat("var(--ds-border-accent-yellow, ".concat(Y200a, ")")),
+      cursor: 'pointer'
+    })
   };
 };
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- `AnnotationSharedCSSByState()` is not safe in object syntax
 export var annotationSharedStyles = function annotationSharedStyles() {
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  .ProseMirror {\n    .", " {\n      ", ";\n    }\n\n    .", " {\n      ", ";\n      cursor: initial;\n    }\n\n    .", " {\n      ", ";\n    }\n  }\n"])), AnnotationSharedClassNames.focus, AnnotationSharedCSSByState().focus, AnnotationSharedClassNames.draft, AnnotationSharedCSSByState().focus, AnnotationSharedClassNames.blur, AnnotationSharedCSSByState().blur);
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ProseMirror {\n    .", " {\n      ", ";\n    }\n\n    .", " {\n      ", ";\n      cursor: initial;\n    }\n\n    .", " {\n      ", ";\n    }\n  }\n"])), AnnotationSharedClassNames.focus, AnnotationSharedCSSByState().focus, AnnotationSharedClassNames.draft, AnnotationSharedCSSByState().focus, AnnotationSharedClassNames.blur, AnnotationSharedCSSByState().blur);
 };

package/dist/esm/styles/shared/block-marks.js

@@ -1,4 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject;
+/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Perfectly safe to auto-fix, but leaving it up to the team to remediate as the readability only gets worse with autofixing */
 import { css } from '@emotion/react';
 export var blockMarksSharedStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  /**\n   * We need to remove margin-top from first item\n   * inside doc, tableCell, tableHeader, blockquote, etc.\n   */\n  *:not(.fabric-editor-block-mark) >,\n  /* For nested block marks apart from those with indentation mark */\n  *:not(.fabric-editor-block-mark) >\n    div.fabric-editor-block-mark:first-of-type\n    /* Do not remove the margin top for nodes inside indentation marks */\n      :not(.fabric-editor-indentation-mark)\n    /* Do not remove the margin top for nodes inside alignment marks */\n      :not(.fabric-editor-alignment),\n  // If first element inside a block node has alignment mark, then remove the margin-top\n  .fabric-editor-alignment:first-of-type:first-child,\n  // If first document element has indentation mark remove margin-top\n  .ProseMirror .fabric-editor-indentation-mark:first-of-type:first-child {\n    p,\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6,\n    .heading-wrapper {\n      :first-child:not(style),\n      style:first-child + * {\n        margin-top: 0;\n      }\n    }\n  }\n"])));

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

@@ -1,5 +1,31 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
 import { css } from '@emotion/react';
 import { akEditorBlockquoteBorderColor, blockNodesVerticalMargin } from '@atlaskit/editor-shared-styles';
-export var blockquoteSharedStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  & blockquote {\n    box-sizing: border-box;\n    padding-left: ", ";\n    border-left: 2px solid\n      ", ";\n    margin: ", " 0 0 0;\n    margin-right: 0;\n\n    [dir='rtl'] & {\n      padding-left: 0;\n      padding-right: ", ";\n    }\n\n    &:first-child {\n      margin-top: 0;\n    }\n\n    &::before {\n      content: '';\n    }\n\n    &::after {\n      content: none;\n    }\n\n    & p {\n      display: block;\n    }\n\n    & table,\n    & table:last-child {\n      display: inline-table;\n    }\n  }\n"])), "var(--ds-space-200, 16px)", "var(--ds-border, ".concat(akEditorBlockquoteBorderColor, ")"), blockNodesVerticalMargin, "var(--ds-space-200, 16px)");
+export var blockquoteSharedStyles = css({
+  '& blockquote': {
+    boxSizing: 'border-box',
+    paddingLeft: "var(--ds-space-200, 16px)",
+    borderLeft: "2px solid ".concat("var(--ds-border, ".concat(akEditorBlockquoteBorderColor, ")")),
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+    margin: "".concat(blockNodesVerticalMargin, " 0 0 0"),
+    marginRight: 0,
+    "[dir='rtl'] &": {
+      paddingLeft: 0,
+      paddingRight: "var(--ds-space-200, 16px)"
+    },
+    '&:first-child': {
+      marginTop: 0
+    },
+    '&::before': {
+      content: "''"
+    },
+    '&::after': {
+      content: 'none'
+    },
+    '& p': {
+      display: 'block'
+    },
+    '& table, & table:last-child': {
+      display: 'inline-table'
+    }
+  }
+});

package/dist/esm/styles/shared/code-block.js

@@ -1,5 +1,6 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2;
+/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Should be safe to autofix, but ignoring for now */
 import { css } from '@emotion/react';
 import { akEditorCodeFontFamily, akEditorLineHeight, akEditorTableCellMinWidth, blockNodesVerticalMargin, overflowShadow, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import { N20, N30, N400, N800 } from '@atlaskit/theme/colors';

package/dist/esm/styles/shared/code-mark.js

@@ -1,8 +1,13 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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) { _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 { css } from '@emotion/react';
 import { getCodeStyles } from '@atlaskit/code/inline';
 import { N30A } from '@atlaskit/theme/colors';
 export var codeMarkSharedStyles = function codeMarkSharedStyles() {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    .code {\n      --ds--code--bg-color: ", ";\n      ", "\n    }\n  "])), "var(--ds-background-neutral, ".concat(N30A, ")"), getCodeStyles());
+  return css({
+    '.code': _objectSpread({
+      '--ds--code--bg-color': "var(--ds-background-neutral, ".concat(N30A, ")")
+    }, getCodeStyles())
+  });
 };

package/dist/esm/styles/shared/column-layout.js

@@ -1,6 +1,20 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { css } from '@emotion/react';
 import { gridMediumMaxWidth } from '@atlaskit/editor-shared-styles';
-var columnLayoutSharedStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  [data-layout-section] {\n    position: relative;\n    display: flex;\n    flex-direction: row;\n    & > * {\n      flex: 1;\n      min-width: 0;\n    }\n\n    & > .unsupportedBlockView-content-wrap {\n      min-width: initial;\n    }\n\n    @media screen and (max-width: ", "px) {\n      flex-direction: column;\n    }\n  }\n"])), gridMediumMaxWidth);
+var columnLayoutSharedStyle = css({
+  '[data-layout-section]': _defineProperty({
+    position: 'relative',
+    display: 'flex',
+    flexDirection: 'row',
+    '& > *': {
+      flex: 1,
+      minWidth: 0
+    },
+    '& > .unsupportedBlockView-content-wrap': {
+      minWidth: 'initial'
+    }
+  }, "@media screen and (max-width: ".concat(gridMediumMaxWidth, "px)"), {
+    flexDirection: 'column'
+  })
+});
 export { columnLayoutSharedStyle };

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

@@ -1,8 +1,9 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { css } from '@emotion/react';
 export var DateSharedCssClassName = {
   DATE_WRAPPER: "date-lozenger-container",
   DATE_CONTAINER: 'dateView-content-wrap'
 };
-export var dateSharedStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " span {\n    white-space: unset;\n  }\n"])), DateSharedCssClassName.DATE_WRAPPER);
+export var dateSharedStyle = css(_defineProperty({}, ".".concat(DateSharedCssClassName.DATE_WRAPPER, " span"), {
+  whiteSpace: 'unset'
+}));

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

@@ -1,8 +1,7 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
 import { css } from '@emotion/react';
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-export var expandIconWrapperStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin-left: ", ";\n"])), "var(--ds-space-negative-100, -8px)");
+export var expandIconWrapperStyle = css({
+  marginLeft: "var(--ds-space-negative-100, -8px)"
+});
 var prefix = 'ak-editor-expand';
 export var expandClassNames = {
   prefix: prefix,

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

@@ -1,10 +1,41 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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) { _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 { css } from '@emotion/react';
 import { h100, h300, h400, h500, h600, h700 } from '@atlaskit/theme/typography';
 
 // @see typography spreadsheet: https://docs.google.com/spreadsheets/d/1iYusRGCT4PoPfvxbJ8NrgjtfFgXLm5lpDWXzjua1W2E/edit#gid=93913128
 // text sizing prototype: http://proto/fabricrender/
 export var headingsSharedStyles = function headingsSharedStyles() {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  & h1 {\n    ", ";\n    margin-bottom: 0;\n    margin-top: 1.667em;\n  }\n\n  & h2 {\n    ", ";\n    margin-top: 1.8em;\n    margin-bottom: 0;\n  }\n\n  & h3 {\n    ", ";\n    margin-top: 2em;\n    margin-bottom: 0;\n  }\n\n  & h4 {\n    ", ";\n    margin-top: 1.357em;\n  }\n\n  & h5 {\n    ", ";\n    margin-top: 1.667em;\n    text-transform: none;\n  }\n\n  & h6 {\n    ", ";\n    margin-top: 1.455em;\n    text-transform: none;\n  }\n"])), h700(), h600(), h500(), h400(), h300(), h100());
+  return css({
+    '& h1': _objectSpread(_objectSpread({}, h700()), {}, {
+      marginBottom: 0,
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginTop: '1.667em'
+    }),
+    '& h2': _objectSpread(_objectSpread({}, h600()), {}, {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginTop: '1.8em',
+      marginBottom: 0
+    }),
+    '& h3': _objectSpread(_objectSpread({}, h500()), {}, {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginTop: '2em',
+      marginBottom: 0
+    }),
+    '& h4': _objectSpread(_objectSpread({}, h400()), {}, {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginTop: '1.357em'
+    }),
+    '& h5': _objectSpread(_objectSpread({}, h300()), {}, {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginTop: '1.667em',
+      textTransform: 'none'
+    }),
+    '& h6': _objectSpread(_objectSpread({}, h100()), {}, {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginTop: '1.455em',
+      textTransform: 'none'
+    })
+  });
 };

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

@@ -1,6 +1,29 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
 import { css } from '@emotion/react';
-
-// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-export var indentationSharedStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .fabric-editor-indentation-mark {\n    &[data-level='1'] {\n      margin-left: 30px;\n    }\n    &[data-level='2'] {\n      margin-left: 60px;\n    }\n    &[data-level='3'] {\n      margin-left: 90px;\n    }\n    &[data-level='4'] {\n      margin-left: 120px;\n    }\n    &[data-level='5'] {\n      margin-left: 150px;\n    }\n    &[data-level='6'] {\n      margin-left: 180px;\n    }\n  }\n"])));
+export var indentationSharedStyles = css({
+  '.fabric-editor-indentation-mark': {
+    "&[data-level='1']": {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginLeft: '30px'
+    },
+    "&[data-level='2']": {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginLeft: '60px'
+    },
+    "&[data-level='3']": {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginLeft: '90px'
+    },
+    "&[data-level='4']": {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginLeft: '120px'
+    },
+    "&[data-level='5']": {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginLeft: '150px'
+    },
+    "&[data-level='6']": {
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+      marginLeft: '180px'
+    }
+  }
+});

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

@@ -1,5 +1,7 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
 import { css } from '@emotion/react';
-var linkSharedStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  a.blockLink {\n    display: block;\n  }\n"])));
+var linkSharedStyle = css({
+  'a.blockLink': {
+    display: 'block'
+  }
+});
 export { linkSharedStyle };