@atlaskit/editor-core 190.2.2 → 191.0.0

package/dist/es2019/plugins/collab-edit/utils.js

@@ -1,141 +0,0 @@
-import { Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { Decoration } from '@atlaskit/editor-prosemirror/view';
-import * as themeColors from '@atlaskit/theme/colors';
-import { hexToRgba } from '@atlaskit/adf-schema';
-import { ZERO_WIDTH_JOINER } from '@atlaskit/editor-common/utils';
-import { EVENT_TYPE, ACTION, ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
-// TODO: https://product-fabric.atlassian.net/browse/DSP-7269
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-export const colors = [themeColors.R100, themeColors.R300, themeColors.R500, themeColors.Y100, themeColors.Y300, themeColors.Y500, themeColors.G100, themeColors.G300, themeColors.G500, themeColors.T100, themeColors.T300, themeColors.T500, themeColors.B100, themeColors.B300, themeColors.B500, themeColors.P100, themeColors.P300, themeColors.P500, themeColors.N70, themeColors.N200, themeColors.N800].map(solid => ({
-  solid,
-  selection: hexToRgba(solid, 0.2)
-}));
-/* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
-
-export const getAvatarColor = str => {
-  let hash = 0;
-  for (let i = 0; i < str.length; i++) {
-    /* eslint-disable no-bitwise */
-    hash = (hash << 5) - hash + str.charCodeAt(i);
-    hash = hash & hash;
-    /* eslint-enable no-bitwise */
-  }
-
-  const index = Math.abs(hash) % colors.length;
-  return {
-    index,
-    color: colors[index]
-  };
-};
-export const findPointers = (id, decorations) => decorations.find().reduce((arr, deco) => deco.spec.pointer.sessionId === id ? arr.concat(deco) : arr, []);
-function style(options) {
-  const color = options && options.color || 'black';
-  return `border-left: 1px solid ${color}; border-right: 1px solid ${color}; margin-right: -2px;`;
-}
-export const createTelepointers = (from, to, sessionId, isSelection, initial) => {
-  let decorations = [];
-  const avatarColor = getAvatarColor(sessionId);
-  const color = avatarColor.index.toString();
-  if (isSelection) {
-    const className = `telepointer color-${color} telepointer-selection`;
-    decorations.push(Decoration.inline(from, to, {
-      class: className,
-      'data-initial': initial
-    }, {
-      pointer: {
-        sessionId
-      }
-    }));
-  }
-  const spaceJoinerBefore = document.createElement('span');
-  spaceJoinerBefore.textContent = ZERO_WIDTH_JOINER;
-  const spaceJoinerAfter = document.createElement('span');
-  spaceJoinerAfter.textContent = ZERO_WIDTH_JOINER;
-  const cursor = document.createElement('span');
-  cursor.textContent = ZERO_WIDTH_JOINER;
-  cursor.className = `telepointer color-${color} telepointer-selection-badge`;
-  cursor.style.cssText = `${style({
-    color: avatarColor.color.solid
-  })};`;
-  cursor.setAttribute('data-initial', initial);
-  return decorations.concat(Decoration.widget(to, spaceJoinerAfter, {
-    pointer: {
-      sessionId
-    },
-    key: `telepointer-${sessionId}-zero`
-  })).concat(Decoration.widget(to, cursor, {
-    pointer: {
-      sessionId
-    },
-    key: `telepointer-${sessionId}`
-  })).concat(Decoration.widget(to, spaceJoinerBefore, {
-    pointer: {
-      sessionId
-    },
-    key: `telepointer-${sessionId}-zero`
-  }));
-};
-export const replaceDocument = (doc, state, version, options, reserveCursor) => {
-  const {
-    schema,
-    tr
-  } = state;
-  let content = (doc.content || []).map(child => schema.nodeFromJSON(child));
-  let hasContent = !!content.length;
-  if (hasContent) {
-    tr.setMeta('addToHistory', false);
-    tr.replaceWith(0, state.doc.nodeSize - 2, content);
-    const selection = state.selection;
-    if (reserveCursor) {
-      // If the cursor is still in the range of the new document,
-      // keep where it was.
-      if (selection.to < tr.doc.content.size - 2) {
-        const $from = tr.doc.resolve(selection.from);
-        const $to = tr.doc.resolve(selection.to);
-        const newselection = new TextSelection($from, $to);
-        tr.setSelection(newselection);
-      }
-    } else {
-      tr.setSelection(Selection.atStart(tr.doc));
-    }
-    tr.setMeta('replaceDocument', true);
-    if (typeof version !== undefined && options && options.useNativePlugin) {
-      const collabState = {
-        version,
-        unconfirmed: []
-      };
-      tr.setMeta('collab$', collabState);
-    }
-  }
-  return tr;
-};
-export const scrollToCollabCursor = (editorView, participants, sessionId, index, editorAnalyticsAPI) => {
-  const selectedUser = participants[index];
-  if (selectedUser && selectedUser.cursorPos !== undefined && selectedUser.sessionId !== sessionId) {
-    const {
-      state
-    } = editorView;
-    let tr = state.tr;
-    const analyticsPayload = {
-      action: ACTION.MATCHED,
-      actionSubject: ACTION_SUBJECT.SELECTION,
-      eventType: EVENT_TYPE.TRACK
-    };
-    tr.setSelection(Selection.near(tr.doc.resolve(selectedUser.cursorPos)));
-    editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent(analyticsPayload)(tr);
-    tr.scrollIntoView();
-    editorView.dispatch(tr);
-    if (!editorView.hasFocus()) {
-      editorView.focus();
-    }
-  }
-};
-export const getPositionOfTelepointer = (sessionId, decorationSet) => {
-  let scrollPosition;
-  decorationSet.find().forEach(deco => {
-    if (deco.type.spec.pointer.sessionId === sessionId) {
-      scrollPosition = deco.from;
-    }
-  });
-  return scrollPosition;
-};

package/dist/es2019/plugins/extension/nodeviews/extension.js

@@ -1,62 +0,0 @@
-import React from 'react';
-import ReactNodeView from '@atlaskit/editor-common/react-node-view';
-import Extension from '../ui/Extension';
-import ExtensionNodeWrapper from '../ui/Extension/ExtensionNodeWrapper';
-// getInlineNodeViewProducer is a new api to use instead of ReactNodeView
-// when creating inline node views, however, it is difficult to test the impact
-// on selections when migrating inlineExtension to use the new api.
-// The ReactNodeView api will be visited in the second phase of the selections
-// project whilst investigating block nodes. We will revisit the Extension node view there too.
-export class ExtensionNode extends ReactNodeView {
-  ignoreMutation(mutation) {
-    // Extensions can perform async operations that will change the DOM.
-    // To avoid having their tree rebuilt, we need to ignore the mutation
-    // for atom based extensions if its not a layout, we need to give
-    // children a chance to recalc
-    return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
-  }
-  getContentDOM() {
-    if (this.node.isInline) {
-      return;
-    }
-    const dom = document.createElement('div');
-    dom.className = `${this.node.type.name}-content-dom-wrapper`;
-    return {
-      dom
-    };
-  }
-  render(props, forwardRef) {
-    var _props$extensionNodeV;
-    return /*#__PURE__*/React.createElement(ExtensionNodeWrapper, {
-      nodeType: this.node.type.name
-    }, /*#__PURE__*/React.createElement(Extension, {
-      editorView: this.view,
-      node: this.node,
-      eventDispatcher: this.eventDispatcher
-      // The getPos arg is always a function when used with nodes
-      // the version of the types we use has a union with the type
-      // for marks.
-      // This has been fixed in later versions of the definitly typed
-      // types (and also in prosmirror-views inbuilt types).
-      // https://github.com/DefinitelyTyped/DefinitelyTyped/pull/57384
-      ,
-      getPos: this.getPos,
-      providerFactory: props.providerFactory,
-      handleContentDOMRef: forwardRef,
-      extensionHandlers: props.extensionHandlers,
-      editorAppearance: (_props$extensionNodeV = props.extensionNodeViewOptions) === null || _props$extensionNodeV === void 0 ? void 0 : _props$extensionNodeV.appearance,
-      pluginInjectionApi: props.pluginInjectionApi
-    }));
-  }
-}
-export default function ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi) {
-  return (node, view, getPos) => {
-    const hasIntlContext = true;
-    return new ExtensionNode(node, view, getPos, portalProviderAPI, eventDispatcher, {
-      providerFactory,
-      extensionHandlers,
-      extensionNodeViewOptions,
-      pluginInjectionApi
-    }, undefined, undefined, undefined, hasIntlContext).init();
-  };
-}

package/dist/es2019/plugins/extension/ui/Extension/Extension/index.js

@@ -1,154 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-/** @jsx jsx */
-
-import React from 'react';
-import { jsx } from '@emotion/react';
-import { overflowShadow } from '@atlaskit/editor-common/ui';
-import { calculateBreakoutStyles } from '@atlaskit/editor-common/utils';
-import { wrapperStyle, header, content, contentWrapper, widerLayoutClassName } from './styles';
-import { overlay } from '../styles';
-import ExtensionLozenge from '../Lozenge';
-import classnames from 'classnames';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
-function ExtensionWithPluginState(props) {
-  const {
-    node,
-    handleContentDOMRef,
-    children,
-    widthState = {
-      width: 0
-    },
-    handleRef,
-    shadowClassNames,
-    hideFrame,
-    editorAppearance
-  } = props;
-  const hasBody = ['bodiedExtension', 'multiBodiedExtension'].includes(node.type.name);
-  const isMobile = editorAppearance === 'mobile';
-  const hasChildren = !!children;
-  const removeBorder = hideFrame && !isMobile && !hasBody || false;
-  const {
-    getPos,
-    view
-  } = props;
-  const isTopLevelNode = React.useMemo(() => {
-    const pos = typeof getPos === 'function' ? getPos() : undefined;
-    return typeof pos !== 'undefined' && !isNaN(pos) && view.state.doc.resolve(pos).depth === 0;
-    return false;
-  }, [view, getPos]);
-  const shouldBreakout =
-  // Extension should breakout when the layout is set to 'full-width' or 'wide'.
-  ['full-width', 'wide'].includes(node.attrs.layout) &&
-  // Extension breakout state should only be respected for top level nodes.
-  isTopLevelNode &&
-  // Extension breakout state should not be respected when the editor appearance is full-width mode
-  editorAppearance !== 'full-width';
-  const classNames = classnames('extension-container', 'block', shadowClassNames, {
-    'with-overlay': !hasBody,
-    'without-frame': removeBorder,
-    [widerLayoutClassName]: shouldBreakout
-  });
-  const headerClassNames = classnames({
-    'with-children': hasChildren,
-    'without-frame': removeBorder
-  });
-  let customContainerStyles = {
-    width: '100%'
-  };
-  let newContentStyles = {};
-  if (shouldBreakout) {
-    const {
-      type,
-      ...breakoutStyles
-    } = calculateBreakoutStyles({
-      mode: node.attrs.layout,
-      widthStateWidth: widthState.width,
-      widthStateLineLength: widthState.lineLength
-    });
-    newContentStyles = {
-      ...breakoutStyles
-    };
-    customContainerStyles = breakoutStyles;
-  }
-  newContentStyles = {
-    ...newContentStyles,
-    ...contentWrapper
-  };
-  return jsx("div", {
-    ref: handleRef,
-    "data-layout": node.attrs.layout,
-    className: classNames,
-    css: wrapperStyle,
-    style: customContainerStyles
-  }, jsx("div", {
-    className: `extension-overflow-wrapper ${hasBody ? 'with-body' : ''}`
-  }, jsx("div", {
-    css: overlay,
-    className: "extension-overlay"
-  }), jsx("div", {
-    css: header,
-    contentEditable: false,
-    className: headerClassNames
-  }, !removeBorder && jsx(ExtensionLozenge, {
-    node: node
-  }), children), hasBody && jsx("div", {
-    css: newContentStyles
-  }, jsx("div", {
-    css: content,
-    ref: handleContentDOMRef,
-    className: "extension-content block"
-  }))));
-}
-const Extension = props => {
-  // TODO: ED-17836 This code is here because confluence injects
-  // the `editor-referentiality` plugin via `dangerouslyAppendPlugins`
-  // which cannot access the `pluginInjectionApi`. When we move
-  // Confluence to using presets we can remove this workaround.
-  const {
-    pluginInjectionApi
-  } = props;
-  return pluginInjectionApi === undefined ? jsx(ExtensionDeprecated, props) : jsx(ExtensionWithSharedState, props);
-};
-const ExtensionWithSharedState = props => {
-  const {
-    pluginInjectionApi
-  } = props;
-  const {
-    widthState
-  } = useSharedPluginState(pluginInjectionApi, ['width']);
-  return jsx(ExtensionWithPluginState, _extends({
-    widthState: widthState
-  }, props));
-};
-import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
-// TODO: ED-17836 This code is here because Confluence injects
-// the `editor-referentiality` plugin via `dangerouslyAppendPlugins`
-// which cannot access the `pluginInjectionApi`. When we move
-// Confluence to using presets we can remove this workaround.
-// @ts-ignore
-const widthPluginKey = {
-  key: 'widthPlugin$',
-  getState: state => {
-    return state['widthPlugin$'];
-  }
-};
-const ExtensionDeprecated = props => {
-  return jsx(WithPluginState, {
-    editorView: props.view,
-    plugins: {
-      widthState: widthPluginKey
-    },
-    render: ({
-      widthState
-    }) => jsx(ExtensionWithPluginState, _extends({
-      widthState: widthState
-    }, props))
-  });
-};
-/**
- * End workaround
- */
-
-export default overflowShadow(Extension, {
-  overflowSelector: '.extension-overflow-wrapper'
-});

package/dist/es2019/plugins/extension/ui/Extension/Extension/styles.js

@@ -1,50 +0,0 @@
-import { css } from '@emotion/react';
-import { themed } from '@atlaskit/theme/components';
-import { borderRadius } from '@atlaskit/theme/constants';
-import { DN30, DN900, N30 } from '@atlaskit/theme/colors';
-import { wrapperDefault, padding } from '../styles';
-export const widerLayoutClassName = 'wider-layout';
-export const wrapperStyle = theme => css`
-  ${wrapperDefault(theme)}
-
-  &.without-frame {
-    background: transparent;
-  }
-  cursor: pointer;
-  width: 100%;
-
-  .extension-overflow-wrapper:not(.with-body) {
-    overflow-x: auto;
-  }
-`;
-export const header = css`
-  padding: ${padding / 2}px ${padding / 2}px 0px;
-  vertical-align: middle;
-
-  &.with-children:not(.without-frame) {
-    padding: ${"var(--ds-space-050, 4px)"} ${"var(--ds-space-100, 8px)"}
-      ${"var(--ds-space-100, 8px)"};
-  }
-  &.without-frame {
-    padding: 0;
-  }
-`;
-export const content = theme => css`
-  padding: ${padding}px;
-  background: ${themed({
-  light: "var(--ds-surface, white)",
-  dark: `var(--ds-surface, ${DN30})`
-})(theme)};
-  color: ${themed({
-  dark: `var(--ds-text, ${DN900})`
-})(theme)};
-  border: 1px solid ${`var(--ds-border, ${N30})`};
-  border-radius: ${borderRadius()}px;
-  cursor: initial;
-  width: 100%;
-`;
-export const contentWrapper = css`
-  padding: 0 ${padding}px ${padding}px;
-  display: flex;
-  justify-content: center;
-`;

package/dist/es2019/plugins/extension/ui/Extension/ExtensionComponent.js

@@ -1,202 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { Component } from 'react';
-import memoizeOne from 'memoize-one';
-import { getNodeRenderer, getExtensionModuleNodePrivateProps } from '@atlaskit/editor-common/extensions';
-import { getExtensionRenderer } from '@atlaskit/editor-common/utils';
-import Extension from './Extension';
-import InlineExtension from './InlineExtension';
-import MultiBodiedExtension from './MultiBodiedExtension';
-export default class ExtensionComponent extends Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "privatePropsParsed", false);
-    _defineProperty(this, "state", {});
-    _defineProperty(this, "mounted", false);
-    // memoized to avoid rerender on extension state changes
-    _defineProperty(this, "getNodeRenderer", memoizeOne(getNodeRenderer));
-    _defineProperty(this, "getExtensionModuleNodePrivateProps", memoizeOne(getExtensionModuleNodePrivateProps));
-    _defineProperty(this, "setStateFromPromise", (stateKey, promise) => {
-      promise && promise.then(p => {
-        if (!this.mounted) {
-          return;
-        }
-        this.setState({
-          [stateKey]: p
-        });
-      });
-    });
-    /**
-     * Parses any private nodes once an extension provider is available.
-     *
-     * We do this separately from resolving a node renderer component since the
-     * private props come from extension provider, rather than an extension
-     * handler which only handles `render`/component concerns.
-     */
-    _defineProperty(this, "parsePrivateNodePropsIfNeeded", async () => {
-      if (this.privatePropsParsed || !this.state.extensionProvider) {
-        return;
-      }
-      this.privatePropsParsed = true;
-      const {
-        extensionType,
-        extensionKey
-      } = this.props.node.attrs;
-
-      /**
-       * getExtensionModuleNodePrivateProps can throw if there are issues in the
-       * manifest
-       */
-      try {
-        const privateProps = await this.getExtensionModuleNodePrivateProps(this.state.extensionProvider, extensionType, extensionKey);
-        this.setState({
-          _privateProps: privateProps
-        });
-      } catch (e) {
-        // eslint-disable-next-line no-console
-        console.error('Provided extension handler has thrown an error\n', e);
-        /** We don't want this error to block renderer */
-        /** We keep rendering the default content */
-      }
-    });
-    _defineProperty(this, "handleExtension", (pmNode, actions) => {
-      var _pmNode$marks, _pmNode$marks$find, _pmNode$marks$find$at;
-      const {
-        extensionHandlers,
-        editorView
-      } = this.props;
-      const {
-        extensionType,
-        extensionKey,
-        parameters,
-        text
-      } = pmNode.attrs;
-      const isBodiedExtension = pmNode.type.name === 'bodiedExtension';
-      if (isBodiedExtension) {
-        return;
-      }
-      const fragmentLocalId = pmNode === null || pmNode === void 0 ? void 0 : (_pmNode$marks = pmNode.marks) === null || _pmNode$marks === void 0 ? void 0 : (_pmNode$marks$find = _pmNode$marks.find(m => m.type.name === 'fragment')) === null || _pmNode$marks$find === void 0 ? void 0 : (_pmNode$marks$find$at = _pmNode$marks$find.attrs) === null || _pmNode$marks$find$at === void 0 ? void 0 : _pmNode$marks$find$at.localId;
-      const node = {
-        type: pmNode.type.name,
-        extensionType,
-        extensionKey,
-        parameters,
-        content: text,
-        localId: pmNode.attrs.localId,
-        fragmentLocalId
-      };
-      let result;
-      if (extensionHandlers && extensionHandlers[extensionType]) {
-        const render = getExtensionRenderer(extensionHandlers[extensionType]);
-        result = render(node, editorView.state.doc, actions);
-      }
-      if (!result) {
-        const extensionHandlerFromProvider = this.state.extensionProvider && this.getNodeRenderer(this.state.extensionProvider, extensionType, extensionKey);
-        if (extensionHandlerFromProvider) {
-          const NodeRenderer = extensionHandlerFromProvider;
-          if (node.type === 'multiBodiedExtension') {
-            return /*#__PURE__*/React.createElement(NodeRenderer, {
-              node: node,
-              references: this.props.references,
-              actions: actions
-            });
-          } else {
-            return /*#__PURE__*/React.createElement(NodeRenderer, {
-              node: node,
-              references: this.props.references
-            });
-          }
-        }
-      }
-      return result;
-    });
-  }
-  UNSAFE_componentWillMount() {
-    this.mounted = true;
-  }
-  componentDidMount() {
-    const {
-      extensionProvider
-    } = this.props;
-    if (extensionProvider) {
-      this.setStateFromPromise('extensionProvider', extensionProvider);
-    }
-  }
-  componentDidUpdate() {
-    this.parsePrivateNodePropsIfNeeded();
-  }
-  componentWillUnmount() {
-    this.mounted = false;
-  }
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    const {
-      extensionProvider
-    } = nextProps;
-    if (extensionProvider && this.props.extensionProvider !== extensionProvider) {
-      this.setStateFromPromise('extensionProvider', extensionProvider);
-    }
-  }
-  render() {
-    var _this$state$_privateP;
-    const {
-      node,
-      handleContentDOMRef,
-      editorView,
-      references,
-      editorAppearance,
-      pluginInjectionApi,
-      getPos,
-      eventDispatcher
-    } = this.props;
-    if (node.type.name === 'multiBodiedExtension') {
-      return /*#__PURE__*/React.createElement(MultiBodiedExtension, {
-        node: node,
-        editorView: editorView,
-        getPos: getPos,
-        handleContentDOMRef: handleContentDOMRef,
-        tryExtensionHandler: this.tryExtensionHandler.bind(this),
-        eventDispatcher: eventDispatcher
-      });
-    }
-    const extensionHandlerResult = this.tryExtensionHandler(undefined);
-    switch (node.type.name) {
-      case 'extension':
-      case 'bodiedExtension':
-        return /*#__PURE__*/React.createElement(Extension, {
-          node: node,
-          getPos: this.props.getPos,
-          references: references,
-          extensionProvider: this.state.extensionProvider,
-          handleContentDOMRef: handleContentDOMRef,
-          view: editorView,
-          editorAppearance: editorAppearance,
-          hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame,
-          pluginInjectionApi: pluginInjectionApi
-        }, extensionHandlerResult);
-      case 'inlineExtension':
-        return /*#__PURE__*/React.createElement(InlineExtension, {
-          node: node
-        }, extensionHandlerResult);
-      default:
-        return null;
-    }
-  }
-  tryExtensionHandler(actions) {
-    const {
-      node
-    } = this.props;
-    try {
-      const extensionContent = this.handleExtension(node, actions);
-      if (extensionContent && /*#__PURE__*/React.isValidElement(extensionContent)) {
-        return extensionContent;
-      }
-    } catch (e) {
-      // eslint-disable-next-line no-console
-      console.error('Provided extension handler has thrown an error\n', e);
-      /** We don't want this error to block renderer */
-      /** We keep rendering the default content */
-    }
-
-    return null;
-  }
-}

package/dist/es2019/plugins/extension/ui/Extension/ExtensionNodeWrapper.js

@@ -1,14 +0,0 @@
-import React from 'react';
-import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/utils';
-/**
- * If inlineExtension, add zero width space to the end of the nodes and wrap with span;
- * else wrap with a div (for multi bodied extensions)
- *
- * @param param0
- * @returns
- */
-const ExtensionNodeWrapper = ({
-  children,
-  nodeType
-}) => /*#__PURE__*/React.createElement("span", null, children, nodeType === 'inlineExtension' && ZERO_WIDTH_SPACE);
-export default ExtensionNodeWrapper;

package/dist/es2019/plugins/extension/ui/Extension/InlineExtension/index.js

@@ -1,26 +0,0 @@
-/** @jsx jsx */
-import React from 'react';
-import { jsx } from '@emotion/react';
-import { Component } from 'react';
-import { overlay } from '../styles';
-import ExtensionLozenge from '../Lozenge';
-import { wrapperStyle } from './styles';
-export default class InlineExtension extends Component {
-  render() {
-    const {
-      node,
-      children
-    } = this.props;
-    const hasChildren = !!children;
-    const className = hasChildren ? 'with-overlay with-children' : 'with-overlay';
-    return jsx("div", {
-      css: wrapperStyle,
-      className: `extension-container inline ${className}`
-    }, jsx("div", {
-      css: overlay,
-      className: "extension-overlay"
-    }), children ? children : jsx(ExtensionLozenge, {
-      node: node
-    }));
-  }
-}

package/dist/es2019/plugins/extension/ui/Extension/InlineExtension/styles.js

@@ -1,27 +0,0 @@
-import { css } from '@emotion/react';
-import { borderRadius } from '@atlaskit/theme/constants';
-import { wrapperDefault } from '../styles';
-export const wrapperStyle = theme => css`
-  ${wrapperDefault(theme)}
-
-  cursor: pointer;
-  display: inline-flex;
-  margin: 1px 1px ${"var(--ds-space-050, 4px)"};
-
-  > img {
-    border-radius: ${borderRadius()}px;
-  }
-
-  &::after,
-  &::before {
-    vertical-align: text-top;
-    display: inline-block;
-    width: 1px;
-    content: '';
-  }
-
-  &.with-children {
-    padding: 0;
-    background: ${"var(--ds-background-neutral-subtle, white)"};
-  }
-`;