@atlaskit/editor-common 78.11.5 → 78.11.7

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/extensibility/Extension/Extension/index.js

@@ -29,7 +29,9 @@ function ExtensionWithPluginState(props) {
     hideFrame = props.hideFrame,
     editorAppearance = props.editorAppearance,
     showMacroInteractionDesignUpdates = props.showMacroInteractionDesignUpdates,
-    isNodeSelected = props.isNodeSelected;
+    isNodeSelected = props.isNodeSelected,
+    isNodeHovered = props.isNodeHovered,
+    setIsNodeHovered = props.setIsNodeHovered;
   var hasBody = ['bodiedExtension', 'multiBodiedExtension'].includes(node.type.name);
   var isMobile = editorAppearance === 'mobile';
   var hasChildren = !!children;
@@ -75,8 +77,14 @@ function ExtensionWithPluginState(props) {
     customContainerStyles = breakoutStyles;
   }
   newContentStyles = _objectSpread(_objectSpread({}, newContentStyles), contentWrapper);
+  var handleMouseEvent = function handleMouseEvent(didHover) {
+    if (setIsNodeHovered) {
+      setIsNodeHovered(didHover);
+    }
+  };
   return jsx(Fragment, null, showMacroInteractionDesignUpdates && jsx(ExtensionLozenge, {
     isNodeSelected: isNodeSelected,
+    isNodeHovered: isNodeHovered,
     node: node,
     showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates,
     customContainerStyles: customContainerStyles
@@ -85,7 +93,13 @@ function ExtensionWithPluginState(props) {
     "data-layout": node.attrs.layout,
     className: classNames,
     css: wrapperStyle,
-    style: customContainerStyles
+    style: customContainerStyles,
+    onMouseOver: function onMouseOver() {
+      return handleMouseEvent(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return handleMouseEvent(false);
+    }
   }, jsx("div", {
     className: "extension-overflow-wrapper ".concat(hasBody ? 'with-body' : '')
   }, jsx("div", {

package/dist/esm/extensibility/Extension/Lozenge.js

@@ -41,6 +41,7 @@ var ExtensionLozenge = /*#__PURE__*/function (_Component) {
       var _this$props = _this.props,
         showMacroInteractionDesignUpdates = _this$props.showMacroInteractionDesignUpdates,
         isNodeSelected = _this$props.isNodeSelected,
+        isNodeHovered = _this$props.isNodeHovered,
         customContainerStyles = _this$props.customContainerStyles;
       var _this$props$node$attr = _this.props.node.attrs,
         parameters = _this$props$node$attr.parameters,
@@ -50,6 +51,7 @@ var ExtensionLozenge = /*#__PURE__*/function (_Component) {
       var title = parameters && parameters.extensionTitle || parameters && parameters.macroMetadata && parameters.macroMetadata.title || extensionKey;
       var isBlockExtension = name === 'extension';
       return jsx(LozengeComponent, {
+        isNodeHovered: isNodeHovered,
         isNodeSelected: isNodeSelected,
         showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates,
         isBlockExtension: isBlockExtension,

package/dist/esm/extensibility/Extension/LozengeComponent.js

@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 /** @jsx jsx */
 
 import { jsx } from '@emotion/react';
+import classnames from 'classnames';
 import EditorFileIcon from '@atlaskit/icon/glyph/editor/file';
 import { SimpleTag as Tag } from '@atlaskit/tag';
 import { lozengeWrapper, placeholderFallback, placeholderFallbackParams } from './styles';
@@ -19,12 +20,15 @@ export var LozengeComponent = function LozengeComponent(_ref) {
     renderImage = _ref.renderImage,
     isNodeSelected = _ref.isNodeSelected,
     showMacroInteractionDesignUpdates = _ref.showMacroInteractionDesignUpdates,
-    customContainerStyles = _ref.customContainerStyles;
+    customContainerStyles = _ref.customContainerStyles,
+    isNodeHovered = _ref.isNodeHovered;
   var capitalizedTitle = capitalizeFirstLetter(title);
-  // TODO: only show on lozenge on hover: https://product-fabric.atlassian.net/browse/PGXT-4945
   if (showMacroInteractionDesignUpdates) {
+    var lozengeClassNames = classnames('extension-title', {
+      'show-lozenge': isNodeHovered || isNodeSelected
+    });
     return jsx("div", {
-      className: "extension-title",
+      className: lozengeClassNames,
       css: lozengeWrapper,
       "data-testid": "new-lozenge",
       style: customContainerStyles
@@ -32,20 +36,21 @@ export var LozengeComponent = function LozengeComponent(_ref) {
       text: capitalizedTitle,
       color: isNodeSelected ? 'blueLight' : 'greyLight'
     }));
+  } else {
+    return jsx("div", {
+      "data-testid": "lozenge-fallback",
+      css: placeholderFallback
+    }, lozengeData && !isBlockExtension ? renderImage(_objectSpread({
+      height: ICON_SIZE,
+      width: ICON_SIZE
+    }, lozengeData)) : jsx(EditorFileIcon, {
+      label: title
+    }), jsx("span", {
+      className: "extension-title"
+    }, capitalizedTitle), params && !isBlockExtension && jsx("span", {
+      css: placeholderFallbackParams
+    }, Object.keys(params).map(function (key) {
+      return key && " | ".concat(key, " = ").concat(params[key].value);
+    })));
   }
-  return jsx("div", {
-    "data-testid": "lozenge-fallback",
-    css: placeholderFallback
-  }, lozengeData && !isBlockExtension ? renderImage(_objectSpread({
-    height: ICON_SIZE,
-    width: ICON_SIZE
-  }, lozengeData)) : jsx(EditorFileIcon, {
-    label: title
-  }), jsx("span", {
-    className: "extension-title"
-  }, capitalizedTitle), params && !isBlockExtension && jsx("span", {
-    css: placeholderFallbackParams
-  }, Object.keys(params).map(function (key) {
-    return key && " | ".concat(key, " = ").concat(params[key].value);
-  })));
 };

package/dist/esm/extensibility/Extension/styles.js

@@ -60,6 +60,14 @@ export var lozengeWrapper = css({
   display: 'flex',
   justifyContent: 'left',
   width: '100%',
+  /* -0.75rem neutralizes the margin top coming from extensionView-content-wrap.
+   The lozenge takes up space so we don't need the extra padding anymore. */
+  marginTop: "var(--ds-space-negative-150, -0.75rem)",
   marginLeft: "var(--ds-space-050, 4px)",
-  marginBottom: "var(--ds-space-negative-050, -4px)"
+  marginBottom: "var(--ds-space-negative-050, -4px)",
+  // Using opacity so that lozenge takes up space and doesn't cause shift on render
+  opacity: '0',
+  '&.show-lozenge': {
+    opacity: '1'
+  }
 });

package/dist/esm/extensibility/ExtensionComponent.js

@@ -33,6 +33,11 @@ export var ExtensionComponent = /*#__PURE__*/function (_Component) {
     // memoized to avoid rerender on extension state changes
     _defineProperty(_assertThisInitialized(_this), "getNodeRenderer", memoizeOne(getNodeRenderer));
     _defineProperty(_assertThisInitialized(_this), "getExtensionModuleNodePrivateProps", memoizeOne(getExtensionModuleNodePrivateProps));
+    _defineProperty(_assertThisInitialized(_this), "setIsNodeHovered", function (isHovered) {
+      _this.setState({
+        isNodeHovered: isHovered
+      });
+    });
     _defineProperty(_assertThisInitialized(_this), "setStateFromPromise", function (stateKey, promise) {
       promise && promise.then(function (p) {
         if (!_this.mounted) {
@@ -199,7 +204,9 @@ export var ExtensionComponent = /*#__PURE__*/function (_Component) {
           pluginInjectionApi: pluginInjectionApi,
           editorAppearance: editorAppearance,
           showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates,
-          isNodeSelected: selectedNode === node
+          isNodeSelected: selectedNode === node,
+          isNodeHovered: this.state.isNodeHovered,
+          setIsNodeHovered: this.setIsNodeHovered
         });
       }
       var extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -217,7 +224,9 @@ export var ExtensionComponent = /*#__PURE__*/function (_Component) {
             hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame,
             pluginInjectionApi: pluginInjectionApi,
             showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates,
-            isNodeSelected: selectedNode === node
+            isNodeSelected: selectedNode === node,
+            isNodeHovered: this.state.isNodeHovered,
+            setIsNodeHovered: this.setIsNodeHovered
           }, extensionHandlerResult);
         case 'inlineExtension':
           return /*#__PURE__*/React.createElement(InlineExtension, {

package/dist/esm/extensibility/MultiBodiedExtension/index.js

@@ -55,7 +55,9 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
     widthState = _ref.widthState,
     editorAppearance = _ref.editorAppearance,
     showMacroInteractionDesignUpdates = _ref.showMacroInteractionDesignUpdates,
-    isNodeSelected = _ref.isNodeSelected;
+    isNodeSelected = _ref.isNodeSelected,
+    isNodeHovered = _ref.isNodeHovered,
+    setIsNodeHovered = _ref.setIsNodeHovered;
   var _node$attrs = node.attrs,
     parameters = _node$attrs.parameters,
     extensionKey = _node$attrs.extensionKey;
@@ -115,16 +117,28 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
   var navigationClassNames = classnames('multiBodiedExtension--navigation', {
     'remove-margins': showMacroInteractionDesignUpdates
   });
+  var handleMouseEvent = function handleMouseEvent(didHover) {
+    if (setIsNodeHovered) {
+      setIsNodeHovered(didHover);
+    }
+  };
   return jsx(Fragment, null, showMacroInteractionDesignUpdates && jsx(ExtensionLozenge, {
     isNodeSelected: isNodeSelected,
     node: node,
     showMacroInteractionDesignUpdates: true,
-    customContainerStyles: mbeWrapperStyles
+    customContainerStyles: mbeWrapperStyles,
+    isNodeHovered: isNodeHovered
   }), jsx("div", {
     className: wrapperClassNames,
     css: mbeExtensionWrapperCSS,
     "data-testid": "multiBodiedExtension--wrapper",
-    style: mbeWrapperStyles
+    style: mbeWrapperStyles,
+    onMouseOver: function onMouseOver() {
+      return handleMouseEvent(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return handleMouseEvent(false);
+    }
   }, getWrapperTitleContent(imageData, title, showMacroInteractionDesignUpdates), jsx("div", {
     className: containerClassNames,
     css: containerCssExtended,

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

package/dist/esm/preset/plugin-injection-api.js

@@ -292,10 +292,6 @@ export var EditorPluginInjectionAPI = /*#__PURE__*/function () {
           }
           var plugin = getPluginByName(prop);
           if (!plugin) {
-            if (process.env.NODE_ENV === 'development') {
-              // eslint-disable-next-line
-              console.warn("Plugin: ".concat(prop, " does not exist"));
-            }
             return undefined;
           }
           var sharedState = sharedStateAPI.createAPI(plugin);

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,