@atlaskit/editor-core 188.3.0 → 188.4.0

package/dist/cjs/plugins/media/toolbar/linking.js

@@ -1,96 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getLinkingToolbar = void 0;
-exports.shouldShowMediaLinkToolbar = shouldShowMediaLinkToolbar;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
-var _ui = require("@atlaskit/editor-common/ui");
-var _linking = require("../commands/linking");
-var _linking2 = require("../pm-plugins/linking");
-var _MediaLinkingToolbar = _interopRequireDefault(require("../ui/MediaLinkingToolbar"));
-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) { (0, _defineProperty2.default)(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 FORCE_FOCUS_SELECTOR = '[data-testid="add-link-button"],[data-testid="edit-link-button"]';
-function shouldShowMediaLinkToolbar(editorState) {
-  var mediaLinkingState = (0, _linking2.getMediaLinkingState)(editorState);
-  if (!mediaLinkingState || mediaLinkingState.mediaPos === null) {
-    return false;
-  }
-  var _editorState$schema = editorState.schema,
-    media = _editorState$schema.nodes.media,
-    link = _editorState$schema.marks.link;
-  var node = editorState.doc.nodeAt(mediaLinkingState.mediaPos);
-  if (!node || node.type !== media) {
-    return false;
-  }
-  var _editorState$doc$reso = editorState.doc.resolve(mediaLinkingState.mediaPos),
-    parent = _editorState$doc$reso.parent;
-  return parent && parent.type.allowsMarkType(link);
-}
-var getLinkingToolbar = exports.getLinkingToolbar = function getLinkingToolbar(toolbarBaseConfig, mediaLinkingState, state, intl, pluginInjectionApi, providerFactory) {
-  var link = mediaLinkingState.link,
-    visible = mediaLinkingState.visible,
-    editing = mediaLinkingState.editable,
-    mediaPos = mediaLinkingState.mediaPos;
-  if (visible && mediaPos !== null) {
-    var node = state.doc.nodeAt(mediaPos);
-    if (node) {
-      return _objectSpread(_objectSpread({}, toolbarBaseConfig), {}, {
-        height: _ui.RECENT_SEARCH_HEIGHT_IN_PX,
-        width: _ui.RECENT_SEARCH_WIDTH_IN_PX,
-        forcePlacement: true,
-        items: [{
-          type: 'custom',
-          fallback: [],
-          disableArrowNavigation: true,
-          render: function render(view, idx) {
-            if (!view || !providerFactory) {
-              return null;
-            }
-            return /*#__PURE__*/_react.default.createElement(_MediaLinkingToolbar.default, {
-              key: idx,
-              displayUrl: link,
-              providerFactory: providerFactory,
-              intl: intl,
-              editing: editing,
-              onUnlink: function onUnlink() {
-                var _pluginInjectionApi$a;
-                return (0, _linking.unlink)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions)(view.state, view.dispatch, view);
-              },
-              onBack: function onBack(href, meta) {
-                if (href.trim() && meta.inputMethod) {
-                  var _pluginInjectionApi$a2;
-                  (0, _linking.setUrlToMedia)(href, meta.inputMethod, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions)(view.state, view.dispatch, view);
-                }
-                (0, _linking.hideLinkingToolbar)(view.state, view.dispatch, view);
-              },
-              onCancel: function onCancel() {
-                var _pluginInjectionApi$f;
-                (0, _linking.hideLinkingToolbar)(view.state, view.dispatch, view, true);
-                /** Focus should move to the 'Add link' button when the toolbar closes
-                 * and not close the floating toolbar.
-                 */
-                var tr = view.state.tr,
-                  dispatch = view.dispatch;
-                pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar.actions) === null || _pluginInjectionApi$f === void 0 || _pluginInjectionApi$f.forceFocusSelector(FORCE_FOCUS_SELECTOR)(tr);
-                dispatch(tr);
-              },
-              onSubmit: function onSubmit(href, meta) {
-                var _pluginInjectionApi$a3;
-                (0, _linking.setUrlToMedia)(href, meta.inputMethod, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.actions)(view.state, view.dispatch, view);
-                (0, _linking.hideLinkingToolbar)(view.state, view.dispatch, view);
-              },
-              onBlur: function onBlur() {
-                (0, _linking.hideLinkingToolbar)(view.state, view.dispatch, view);
-              }
-            });
-          }
-        }]
-      });
-    }
-  }
-};

package/dist/cjs/plugins/media/toolbar/utils.js

@@ -1,110 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.removeMediaGroupNode = exports.getSelectedMediaSingle = exports.getSelectedMediaContainerNodeAttrs = exports.getPixelWidthOfElement = exports.getMaxToolbarWidth = exports.downloadMedia = exports.calcNewLayout = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _mediaSingle = require("@atlaskit/editor-common/media-single");
-var _utils = require("@atlaskit/editor-prosemirror/utils");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _mediaClient = require("@atlaskit/media-client");
-var getSelectedMediaContainerNodeAttrs = exports.getSelectedMediaContainerNodeAttrs = function getSelectedMediaContainerNodeAttrs(mediaPluginState) {
-  var selectedNode = mediaPluginState.selectedMediaContainerNode();
-  if (selectedNode && selectedNode.attrs) {
-    return selectedNode.attrs;
-  }
-  return null;
-};
-var downloadMedia = exports.downloadMedia = /*#__PURE__*/function () {
-  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(mediaPluginState) {
-    var selectedNodeAttrs, id, _selectedNodeAttrs$co, collection, mediaClient, fileState, fileName;
-    return _regenerator.default.wrap(function _callee$(_context) {
-      while (1) switch (_context.prev = _context.next) {
-        case 0:
-          _context.prev = 0;
-          selectedNodeAttrs = getSelectedMediaContainerNodeAttrs(mediaPluginState);
-          if (!(selectedNodeAttrs && mediaPluginState.mediaClientConfig)) {
-            _context.next = 10;
-            break;
-          }
-          id = selectedNodeAttrs.id, _selectedNodeAttrs$co = selectedNodeAttrs.collection, collection = _selectedNodeAttrs$co === void 0 ? '' : _selectedNodeAttrs$co;
-          mediaClient = (0, _mediaClient.getMediaClient)(mediaPluginState.mediaClientConfig);
-          _context.next = 7;
-          return mediaClient.file.getCurrentState(id, {
-            collectionName: collection
-          });
-        case 7:
-          fileState = _context.sent;
-          fileName = fileState.status === 'error' ? undefined : fileState.name;
-          mediaClient.file.downloadBinary(id, fileName, collection);
-        case 10:
-          return _context.abrupt("return", true);
-        case 13:
-          _context.prev = 13;
-          _context.t0 = _context["catch"](0);
-          return _context.abrupt("return", false);
-        case 16:
-        case "end":
-          return _context.stop();
-      }
-    }, _callee, null, [[0, 13]]);
-  }));
-  return function downloadMedia(_x) {
-    return _ref.apply(this, arguments);
-  };
-}();
-var removeMediaGroupNode = exports.removeMediaGroupNode = function removeMediaGroupNode(state) {
-  var mediaGroup = state.schema.nodes.mediaGroup;
-  var mediaGroupParent = (0, _utils.findParentNodeOfType)(mediaGroup)(state.selection);
-  var tr = state.tr;
-  // If it is the last media group in filmstrip, remove the entire filmstrip
-  if (mediaGroupParent && mediaGroupParent.node.childCount === 1) {
-    tr = (0, _utils.removeParentNodeOfType)(mediaGroup)(tr);
-  } else {
-    tr = (0, _utils.removeSelectedNode)(tr);
-  }
-  return tr;
-};
-var getSelectedMediaSingle = exports.getSelectedMediaSingle = function getSelectedMediaSingle(state) {
-  var mediaSingle = state.schema.nodes.mediaSingle;
-  return (0, _utils.findSelectedNodeOfType)(mediaSingle)(state.selection) || (0, _utils.findParentNodeOfType)(mediaSingle)(state.selection);
-};
-var getPixelWidthOfElement = exports.getPixelWidthOfElement = function getPixelWidthOfElement(editorView, pos, mediaWidth) {
-  var domNode = editorView.nodeDOM(pos);
-  if (domNode instanceof HTMLElement) {
-    return domNode.offsetWidth;
-  }
-  return mediaWidth;
-};
-var calcNewLayout = exports.calcNewLayout = function calcNewLayout(width, layout, contentWidth) {
-  var fullWidthMode = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-  var isWrappedLayout = _mediaSingle.wrappedLayouts.indexOf(layout) > -1;
-  if (width >= _editorSharedStyles.akEditorFullWidthLayoutWidth) {
-    // If width is greater than or equal to full editor width
-    return 'full-width';
-  }
-  if (fullWidthMode) {
-    // If under editor full width mode
-    return isWrappedLayout ? layout : 'center';
-  }
-  if (width > contentWidth) {
-    // If width is greater than content length and not nested
-    return 'wide';
-  }
-  return isWrappedLayout && width !== contentWidth ? layout : 'center';
-};
-var maxToolbarFitWidth = 0;
-var getMaxToolbarWidth = exports.getMaxToolbarWidth = function getMaxToolbarWidth() {
-  var toolbar = document.querySelector("div[aria-label=\"Media floating controls\"]");
-  var toolbarWidth = toolbar === null || toolbar === void 0 ? void 0 : toolbar.getBoundingClientRect().width;
-  if (!toolbar) {
-    maxToolbarFitWidth = 0;
-  }
-  if (toolbarWidth && toolbarWidth > maxToolbarFitWidth) {
-    maxToolbarFitWidth = toolbarWidth;
-  }
-  return maxToolbarFitWidth;
-};

package/dist/cjs/plugins/media/types.js

@@ -1,5 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});

package/dist/cjs/plugins/media/ui/CaptionPlaceholder/index.js

@@ -1,27 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
-var _reactIntlNext = require("react-intl-next");
-var _mediaSingle = require("@atlaskit/editor-common/media-single");
-var _colors = require("@atlaskit/theme/colors");
-var _messages = require("./messages");
-var _templateObject;
-/** @jsx jsx */
-var placeholder = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  width: 100%;\n  text-align: center;\n  margin-top: ", " !important;\n  display: block;\n"])), "var(--ds-text-subtlest, ".concat(_colors.N200, ")"), "var(--ds-space-100, 8px)");
-var _default = exports.default = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
-  var onClick = _ref.onClick;
-  return (0, _react2.jsx)("span", {
-    ref: ref,
-    css: placeholder,
-    onClick: onClick,
-    "data-id": _mediaSingle.CAPTION_PLACEHOLDER_ID,
-    "data-testid": "caption-placeholder"
-  }, (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.placeholder));
-});

package/dist/cjs/plugins/media/ui/CaptionPlaceholder/messages.js

@@ -1,14 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.messages = void 0;
-var _reactIntlNext = require("react-intl-next");
-var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
-  placeholder: {
-    id: 'fabric.editor.captionPlaceholder',
-    defaultMessage: 'Add a caption',
-    description: 'Placeholder description for an empty (new) caption in the editor'
-  }
-});

package/dist/cjs/plugins/media/ui/ImageBorder/index.js

@@ -1,226 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = require("react");
-var _react2 = require("@emotion/react");
-var _icons = require("@atlaskit/editor-common/icons");
-var _styles = require("@atlaskit/editor-common/styles");
-var _ui = require("@atlaskit/editor-common/ui");
-var _uiColor = require("@atlaskit/editor-common/ui-color");
-var _uiMenu = require("@atlaskit/editor-common/ui-menu");
-var _editorPalette = require("@atlaskit/editor-palette");
-var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
-var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-var _messages = require("./messages");
-var _styles2 = require("./styles");
-/** @jsx jsx */
-
-var ImageBorder = function ImageBorder(_ref) {
-  var formatMessage = _ref.intl.formatMessage,
-    toggleBorder = _ref.toggleBorder,
-    borderMark = _ref.borderMark,
-    setBorder = _ref.setBorder;
-  var popupTarget = (0, _react.useRef)(null);
-  var enabled = !!borderMark;
-  var color = borderMark === null || borderMark === void 0 ? void 0 : borderMark.color;
-  var size = borderMark === null || borderMark === void 0 ? void 0 : borderMark.size;
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    isOpen = _useState2[0],
-    setIsOpen = _useState2[1];
-  var _useState3 = (0, _react.useState)(false),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    isColorSubmenuOpen = _useState4[0],
-    setIsColorSubmenuOpen = _useState4[1];
-  var _useState5 = (0, _react.useState)(false),
-    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    isSizeSubmenuOpen = _useState6[0],
-    setIsSizeSubmenuOpen = _useState6[1];
-  var handleSubMenuRef = function handleSubMenuRef(ref) {
-    if (!ref) {
-      return;
-    }
-    var rect = ref.getBoundingClientRect();
-    if (rect.left + rect.width > window.innerWidth) {
-      ref.style.left = "-".concat(rect.width, "px");
-    }
-  };
-  var borderSizeOptions = [{
-    name: formatMessage(_messages.messages.borderSizeSubtle),
-    value: 1
-  }, {
-    name: formatMessage(_messages.messages.borderSizeMedium),
-    value: 2
-  }, {
-    name: formatMessage(_messages.messages.borderSizeBold),
-    value: 3
-  }];
-  var items = [{
-    content: formatMessage(_messages.messages.borderColor),
-    value: {
-      name: 'color'
-    },
-    elemAfter: (0, _react2.jsx)("div", {
-      className: _styles.DropdownMenuSharedCssClassName.SUBMENU
-    }, (0, _react2.jsx)("div", {
-      css: (0, _styles2.contextualMenuColorIcon)(color && (0, _editorPalette.hexToEditorBorderPaletteColor)(color))
-    }), isColorSubmenuOpen && (0, _react2.jsx)("div", {
-      css: (0, _styles2.contextualSubMenu)(0),
-      ref: handleSubMenuRef
-    }, (0, _react2.jsx)(_uiColor.ColorPalette, {
-      onClick: function onClick(color) {
-        setBorder({
-          color: color
-        });
-        setIsOpen(!isOpen);
-      },
-      selectedColor: color !== null && color !== void 0 ? color : null,
-      paletteOptions: {
-        palette: _uiColor.borderColorPalette,
-        paletteColorTooltipMessages: _uiColor.borderPaletteTooltipMessages,
-        hexToPaletteColor: _editorPalette.hexToEditorBorderPaletteColor
-      }
-    })))
-  }, {
-    content: formatMessage(_messages.messages.borderSize),
-    value: {
-      name: 'size'
-    },
-    elemAfter: (0, _react2.jsx)("div", {
-      className: _styles.DropdownMenuSharedCssClassName.SUBMENU
-    }, (0, _react2.jsx)("div", {
-      css: _styles2.contextualMenuArrow
-    }), isSizeSubmenuOpen && (0, _react2.jsx)("div", {
-      css: (0, _styles2.contextualSubMenu)(1),
-      ref: handleSubMenuRef
-    }, borderSizeOptions.map(function (_ref2, idx) {
-      var name = _ref2.name,
-        value = _ref2.value;
-      return (0, _react2.jsx)(_tooltip.default, {
-        key: idx,
-        content: name
-      }, (0, _react2.jsx)("span", {
-        css: _styles2.buttonWrapperStyle
-      }, (0, _react2.jsx)("button", {
-        css: (0, _styles2.buttonStyle)(value === size),
-        "aria-label": name,
-        role: "radio",
-        "aria-checked": value === size,
-        onClick: function onClick() {
-          setBorder({
-            size: value
-          });
-          setIsOpen(false);
-        },
-        onMouseDown: function onMouseDown(e) {
-          e.preventDefault();
-        }
-      }, (0, _react2.jsx)("div", {
-        css: (0, _styles2.line)(value, value === size),
-        role: "presentation"
-      }))));
-    })))
-  }];
-
-  /**
-   * We want to change direction of our dropdowns a bit early,
-   * not exactly when it hits the boundary.
-   */
-  var fitTolerance = 10;
-  var fitWidth = _styles2.menuItemDimensions.width;
-  var fitHeight = items.length * (_styles2.menuItemDimensions.height + _styles2.itemSpacing);
-  return (0, _react2.jsx)("div", null, (0, _react2.jsx)("div", {
-    css: (0, _styles2.toolbarButtonWrapper)({
-      enabled: enabled,
-      isOpen: isOpen
-    })
-  }, (0, _react2.jsx)(_uiMenu.ToolbarButton, {
-    className: "image-border-toolbar-btn",
-    selected: enabled,
-    onClick: toggleBorder,
-    spacing: "compact",
-    "aria-label": enabled ? formatMessage(_messages.messages.removeBorder) : formatMessage(_messages.messages.addBorder),
-    iconBefore: (0, _react2.jsx)(_icons.BorderIcon, {
-      label: ""
-    }),
-    title: enabled ? formatMessage(_messages.messages.removeBorder) : formatMessage(_messages.messages.addBorder)
-  }), (0, _react2.jsx)("div", {
-    ref: popupTarget
-  }, (0, _react2.jsx)(_uiMenu.ToolbarButton, {
-    className: "image-border-toolbar-dropdown",
-    selected: enabled || isOpen,
-    "aria-label": formatMessage(_messages.messages.borderOptions),
-    title: formatMessage(_messages.messages.borderOptions),
-    spacing: "compact",
-    iconBefore: (0, _react2.jsx)(_chevronDown.default, {
-      label: ""
-    }),
-    onClick: function onClick() {
-      setIsOpen(!isOpen);
-    }
-  }))), (0, _react2.jsx)(_ui.Popup, {
-    target: popupTarget.current ? popupTarget.current : undefined,
-    fitWidth: fitWidth + fitTolerance,
-    fitHeight: fitHeight + fitTolerance,
-    forcePlacement: true,
-    stick: true
-  }, (0, _react2.jsx)("div", {
-    onMouseLeave: function onMouseLeave() {
-      setIsColorSubmenuOpen(false);
-      setIsSizeSubmenuOpen(false);
-    }
-  }, (0, _react2.jsx)(_uiMenu.DropdownMenu
-  //This needs be removed when the a11y is completely handled
-  //Disabling key navigation now as it works only partially
-  //Same with packages/editor/editor-plugin-table/src/plugins/table/ui/FloatingContextualMenu/ContextualMenu.tsx
-  , {
-    arrowKeyNavigationProviderOptions: {
-      type: _uiMenu.ArrowKeyNavigationType.MENU,
-      disableArrowKeyNavigation: true
-    },
-    items: [{
-      items: items
-    }],
-    isOpen: isOpen,
-    onOpenChange: function onOpenChange() {
-      setIsOpen(false);
-      setIsColorSubmenuOpen(false);
-      setIsSizeSubmenuOpen(false);
-    },
-    onItemActivated: function onItemActivated(_ref3) {
-      var item = _ref3.item;
-      if (item.value.name === 'color') {
-        setIsColorSubmenuOpen(!isColorSubmenuOpen);
-      }
-      if (item.value.name === 'size') {
-        setIsSizeSubmenuOpen(!isSizeSubmenuOpen);
-      }
-    },
-    onMouseEnter: function onMouseEnter(_ref4) {
-      var item = _ref4.item;
-      if (item.value.name === 'color') {
-        setIsColorSubmenuOpen(true);
-      }
-      if (item.value.name === 'size') {
-        setIsSizeSubmenuOpen(true);
-      }
-    },
-    onMouseLeave: function onMouseLeave(_ref5) {
-      var item = _ref5.item;
-      if (item.value.name === 'color') {
-        setIsColorSubmenuOpen(false);
-      }
-      if (item.value.name === 'size') {
-        setIsSizeSubmenuOpen(false);
-      }
-    },
-    fitWidth: fitWidth + fitTolerance,
-    fitHeight: fitHeight + fitTolerance
-  }))));
-};
-var _default = exports.default = ImageBorder;

package/dist/cjs/plugins/media/ui/ImageBorder/messages.js

@@ -1,49 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.messages = void 0;
-var _reactIntlNext = require("react-intl-next");
-var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
-  borderColor: {
-    id: 'fabric.editor.imageBorderColor',
-    defaultMessage: 'Color',
-    description: 'Change the border color of an image.'
-  },
-  borderSize: {
-    id: 'fabric.editor.imageBorderSize',
-    defaultMessage: 'Size',
-    description: 'Change the border size of an image.'
-  },
-  addBorder: {
-    id: 'fabric.editor.addImageBorder',
-    defaultMessage: 'Add border',
-    description: 'Add a border to an image.'
-  },
-  removeBorder: {
-    id: 'fabric.editor.removeImageBorder',
-    defaultMessage: 'Remove border',
-    description: 'Remove the border of an image.'
-  },
-  borderOptions: {
-    id: 'fabric.editor.imageBorderOptions',
-    defaultMessage: 'Border options',
-    description: 'Display options available for customizing the border of an image.'
-  },
-  borderSizeSubtle: {
-    id: 'fabric.editor.imageBorderSubtle',
-    defaultMessage: 'Subtle',
-    description: 'Name of a border size.'
-  },
-  borderSizeMedium: {
-    id: 'fabric.editor.imageBorderMedium',
-    defaultMessage: 'Medium',
-    description: 'Name of a border size.'
-  },
-  borderSizeBold: {
-    id: 'fabric.editor.imageBorderBold',
-    defaultMessage: 'Bold',
-    description: 'Name of a border size.'
-  }
-});

package/dist/cjs/plugins/media/ui/ImageBorder/styles.js

@@ -1,52 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.toolbarButtonWrapper = exports.menuItemDimensions = exports.line = exports.itemSpacing = exports.contextualSubMenu = exports.contextualMenuColorIcon = exports.contextualMenuArrow = exports.buttonWrapperStyle = exports.buttonStyle = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = require("@emotion/react");
-var _uiColor = require("@atlaskit/editor-common/ui-color");
-var _colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
-var colors = _colors;
-var _constants = require("@atlaskit/theme/constants");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7; // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-// menuItemDimensions and itemSpacing are copied from
-// packages/editor/editor-core/src/plugins/floating-toolbar/ui/DropdownMenu.tsx
-
-var menuItemDimensions = exports.menuItemDimensions = {
-  width: 175,
-  height: 32
-};
-
-// TODO: Migrate away from gridSize
-// Recommendation: Replace directly with 4 due to itemSpacing being used in calculations
-var itemSpacing = exports.itemSpacing = (0, _constants.gridSize)() / 2;
-var contextualMenuArrow = exports.contextualMenuArrow = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  &::after {\n    content: '\u203A';\n    margin-left: ", ";\n    line-height: 20px;\n    color: ", ";\n  }\n"])), "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(_colors.N90, ")"));
-var contextualMenuColorIcon = exports.contextualMenuColorIcon = function contextualMenuColorIcon(color) {
-  return (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  &::before {\n    content: '';\n    display: block;\n    border: 1px solid ", ";\n    border-radius: ", ";\n    width: 20px;\n    height: 20px;\n    ", "\n  }\n"])), contextualMenuArrow, _uiColor.DEFAULT_BORDER_COLOR, "var(--ds-border-radius-100, 3px)", color && "background: ".concat(color));
-};
-var contextualSubMenu = exports.contextualSubMenu = function contextualSubMenu(index) {
-  return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  border-radius: ", ";\n  background: ", ";\n  box-shadow: ", ";\n  display: flex;\n  position: absolute;\n  top: ", "px;\n  left: ", "px;\n  padding: ", ";\n\n  > div {\n    padding: 0;\n  }\n"])), "var(--ds-border-radius-100, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N60A, ", 0 0 1px ").concat(_colors.N60A), ")"), index * (menuItemDimensions.height + itemSpacing * 2), menuItemDimensions.width, "var(--ds-space-100, 8px)");
-};
-var buttonStyle = exports.buttonStyle = function buttonStyle(selected) {
-  return (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  height: 26px;\n  width: 26px;\n  padding: 0;\n  border-radius: 4px;\n  background-color: ", ";\n  border: 1px solid ", ";\n  cursor: pointer;\n  display: block;\n"])), selected ? "var(--ds-text, ".concat(_colors.N800, ")") : "var(--ds-background-neutral, ".concat(_colors.N20A, ")"), _uiColor.DEFAULT_BORDER_COLOR);
-};
-
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-var buttonWrapperStyle = exports.buttonWrapperStyle = (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  border: 1px solid transparent;\n  margin: 1px;\n  font-size: 0;\n  display: flex;\n  align-items: center;\n  padding: 1px;\n  border-radius: 6px;\n  &:focus-within,\n  &:focus,\n  &:hover {\n    border-color: ", " !important;\n  }\n"])), _colors.N50);
-var line = exports.line = function line(size, selected) {
-  return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  &:before {\n    content: '';\n    display: block;\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    width: 12px;\n    height: ", "px;\n    background-color: ", ";\n    border-radius: 90px;\n    transform: translate(-50%, -50%) rotate(135deg);\n  }\n"])), size, selected ? "var(--ds-icon-inverse, ".concat(_colors.N0, ")") : "var(--ds-icon, #44546F)");
-};
-var getHoverStyles = function getHoverStyles(selector) {
-  return "&:hover ".concat(selector, " {\n    background: ", "var(--ds-background-neutral-subtle-hovered, ".concat(colors.N20A, ")"), ";\n\n    &:hover {\n      background: ", "var(--ds-background-neutral-hovered, ".concat(colors.N30A, ")"), ";\n    } \n  }");
-};
-var toolbarButtonWrapper = exports.toolbarButtonWrapper = function toolbarButtonWrapper(_ref) {
-  var enabled = _ref.enabled,
-    isOpen = _ref.isOpen;
-  return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  .image-border-toolbar-btn {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n    padding: 0;\n    & > span {\n      margin: 0;\n    }\n  }\n  .image-border-toolbar-dropdown {\n    padding: 0;\n    & > span {\n      margin: 0;\n    }\n    width: 16px !important;\n    border-top-left-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n    margin-left: 1px;\n  }\n\n  ", "\n  ", "\n"])), !enabled && getHoverStyles('.image-border-toolbar-btn'), !isOpen && !enabled && getHoverStyles('.image-border-toolbar-dropdown'));
-};

package/dist/cjs/plugins/media/ui/Media/DropPlaceholder.js

@@ -1,38 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = require("@emotion/react");
-var _reactIntlNext = require("react-intl-next");
-var _adfSchema = require("@atlaskit/adf-schema");
-var _documentFilled = _interopRequireDefault(require("@atlaskit/icon/glyph/document-filled"));
-var _colors = require("@atlaskit/theme/colors");
-var _constants = require("@atlaskit/theme/constants");
-var _media = require("../../nodeviews/mediaNodeView/media");
-var _dropPlaceholderMessages = require("./drop-placeholder-messages");
-var _templateObject, _templateObject2;
-/** @jsx jsx */
-var iconWrapper = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  background: ", ";\n  border-radius: ", "px;\n  margin: 5px 3px 25px;\n  width: ", "px;\n  min-height: ", "px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])), "var(--ds-icon-accent-blue, ".concat((0, _adfSchema.hexToRgba)(_colors.B400, 0.4) || _colors.B400, ")"), "var(--ds-background-accent-blue-subtle, ".concat((0, _adfSchema.hexToRgba)(_colors.B300, 0.6) || _colors.B300, ")"), (0, _constants.borderRadius)(), _media.FILE_WIDTH, _media.MEDIA_HEIGHT);
-var dropLine = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  border-radius: ", "px;\n  margin: ", " 0;\n  width: 100%;\n  height: 2px;\n"])), "var(--ds-border-focused, ".concat(_colors.B200, ")"), (0, _constants.borderRadius)(), "var(--ds-space-025, 2px)");
-var IconWrapperComponent = function IconWrapperComponent(props) {
-  var intl = props.intl;
-  var dropPlaceholderLabel = _dropPlaceholderMessages.dropPlaceholderMessages.dropPlaceholderLabel;
-  return (0, _react.jsx)("div", {
-    css: iconWrapper
-  }, (0, _react.jsx)(_documentFilled.default, {
-    label: intl.formatMessage(dropPlaceholderLabel),
-    size: "medium"
-  }));
-};
-var IntlIconWrapper = (0, _reactIntlNext.injectIntl)(IconWrapperComponent);
-var _default = exports.default = function _default(_ref) {
-  var _ref$type = _ref.type,
-    type = _ref$type === void 0 ? 'group' : _ref$type;
-  return type === 'single' ? (0, _react.jsx)("div", {
-    css: dropLine
-  }) : (0, _react.jsx)(IntlIconWrapper, null);
-};

package/dist/cjs/plugins/media/ui/Media/drop-placeholder-messages.js

@@ -1,14 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.dropPlaceholderMessages = void 0;
-var _reactIntlNext = require("react-intl-next");
-var dropPlaceholderMessages = exports.dropPlaceholderMessages = (0, _reactIntlNext.defineMessages)({
-  dropPlaceholderLabel: {
-    id: 'fabric.editor.dropPlaceholderLabel',
-    defaultMessage: 'Document',
-    description: 'document label for an media icon'
-  }
-});