@atlaskit/editor-core 168.0.0 → 169.1.1

package/CHANGELOG.md

@@ -1,5 +1,43 @@
 # @atlaskit/editor-core
 
+## 169.1.1
+
+### Patch Changes
+
+- [`ebe16f97977`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ebe16f97977) - [ux] ED-15292 adjusted weights for the quickinsert search to match weighting system used in newer version of fuse.js (library that we use for fuzzy search)
+
+## 169.1.0
+
+### Minor Changes
+
+- [`ceb3d47ff02`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ceb3d47ff02) - [ux] ED-15074 Adds indentation buttons to the Editor toolbar. Buttons are disabled by default and also behind indentationButtonsInTheToolbar feature flag.
+- [`8ff3031db06`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8ff3031db06) - Introduce new optional argument to CardProvider.resolve
+- [`e7659ee829a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e7659ee829a) - ED-15074 Moved list toolbar UI into toolbarListsIndentation plugin to share logic with indentation toolbar buttons.
+- [`54079156b5a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/54079156b5a) - ED-15092 Added floatingToolbarCopyButton feature flag
+- [`07c8b0b4504`](https://bitbucket.org/atlassian/atlassian-frontend/commits/07c8b0b4504) - [ux] ED-15102 adds a copy button to nodes with floating toolbars
+- [`2d979ce9877`](https://bitbucket.org/atlassian/atlassian-frontend/commits/2d979ce9877) - [ux] ED-14945: Add windowed codeblock support in renderer (This feature sits behind a flag in the featureFlags prop 'allow-windowed-code-block')
+- [`46ddfdc949b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/46ddfdc949b) - [ux] Removing deprecated `@atlaskit/item` package and replacing with new DS component
+- [`04746af08f6`](https://bitbucket.org/atlassian/atlassian-frontend/commits/04746af08f6) - [ux] ED-15097 added floating toolbar copy button to table
+- [`9de4b38fdd6`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9de4b38fdd6) - ED-15073 Added indentationButtonsInTheToolbar feature flag ready for feature development.
+
+### Patch Changes
+
+- [`cf63e4add85`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cf63e4add85) - Removes extraneous padding from around the floating toolbar when editing a link.
+- [`450a17a332a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/450a17a332a) - [ux] ED-14654: Lower z-index values on editor elements so they do not stick out of the editor and interfere with consuming products
+- [`215256ec669`](https://bitbucket.org/atlassian/atlassian-frontend/commits/215256ec669) - [ED-15023] Remove typescript override in text formatting toolbar utils
+- [`30c74c32783`](https://bitbucket.org/atlassian/atlassian-frontend/commits/30c74c32783) - [ux] ED-15234: reverts ED-14654 because causing header zindex issues
+- [`86b38a65f7f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/86b38a65f7f) - Add integration test for non image files upload
+- [`e4dba654a71`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e4dba654a71) - [ux] ED-15233: Fix breakout button positioning for breakout supported nodes in scenarios where editor disabled props changes while Editor is visually hidden and redisplayed.
+  Fixed by skipping breakout width update work when the editorView dom element is width 0 (hidden) and deferring LayoutButton position updates to second animation frame (on window
+  and editor resizes).
+- Updated dependencies
+
+## 169.0.0
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 168.0.0
 
 ### Patch Changes

package/dist/cjs/create-editor/create-plugins-list.js

@@ -383,6 +383,9 @@ function createPluginsList(props, prevProps, createAnalyticsEvent) {
   } // UI only plugins
 
 
+  preset.add([_plugins.toolbarListsIndentationPlugin, {
+    showIndentationButtons: !!featureFlags.indentationButtonsInTheToolbar
+  }]);
   preset.add([_plugins.insertBlockPlugin, {
     allowTables: !!props.allowTables,
     allowExpand: (0, _plugins.isExpandInsertionEnabled)(props),
@@ -435,6 +438,10 @@ function createPluginsList(props, prevProps, createAnalyticsEvent) {
     }]);
   }
 
+  if (featureFlags.floatingToolbarCopyButton) {
+    preset.add(_plugins.copyButtonPlugin);
+  }
+
   var excludes = new Set();
 
   if (!isCodeBlockAllowed({

package/dist/cjs/plugins/analytics/types/toolbar-button.js

@@ -21,4 +21,6 @@ exports.TOOLBAR_ACTION_SUBJECT_ID = TOOLBAR_ACTION_SUBJECT_ID;
   TOOLBAR_ACTION_SUBJECT_ID["TEXT_FORMATTING_ITALIC"] = "italic";
   TOOLBAR_ACTION_SUBJECT_ID["UNDO"] = "undo";
   TOOLBAR_ACTION_SUBJECT_ID["REDO"] = "redo";
+  TOOLBAR_ACTION_SUBJECT_ID["INDENT"] = "indent";
+  TOOLBAR_ACTION_SUBJECT_ID["OUTDENT"] = "outdent";
 })(TOOLBAR_ACTION_SUBJECT_ID || (exports.TOOLBAR_ACTION_SUBJECT_ID = TOOLBAR_ACTION_SUBJECT_ID = {}));

package/dist/cjs/plugins/breakout/index.js

@@ -45,6 +45,13 @@ var BreakoutView = /*#__PURE__*/function () {
 
     (0, _classCallCheck2.default)(this, BreakoutView);
     (0, _defineProperty2.default)(this, "updateWidth", function (widthState) {
+      // we skip updating the width of breakout nodes if the editorView dom
+      // element was hidden (to avoid breakout width and button thrashing
+      // when an editor is hidden, re-rendered and unhidden).
+      if (widthState.width === 0) {
+        return;
+      }
+
       var width = (0, _utils.calcBreakoutWidth)(_this.node.attrs.mode, widthState.width);
       var newStyle = "width: ".concat(width, "; ");
       var lineLength = widthState.lineLength;

package/dist/cjs/plugins/breakout/ui/LayoutButton.js

@@ -179,7 +179,9 @@ var LayoutButton = /*#__PURE__*/function (_React$Component) {
         boundariesElement: boundariesElement,
         scrollableElement: scrollableElement,
         stick: true,
-        forcePlacement: true
+        forcePlacement: true,
+        scheduleExtraLayoutUpdates: true,
+        waitForExtraLayoutUpdates: true
       }, (0, _react2.jsx)("div", {
         css: toolbarButtonWrapper
       }, (0, _react2.jsx)(_ToolbarButton.default, {

package/dist/cjs/plugins/card/pm-plugins/util/resolve.js

@@ -15,7 +15,12 @@ var _doc = require("../doc");
 // Used for all interactions with the EditorCardProvider.
 // ============================================================================ //
 var resolveWithProvider = function resolveWithProvider(view, outstandingRequests, provider, request, options) {
-  var handleResolve = provider.resolve(request.url, request.appearance).then(function (resolvedCard) {
+  // When user manually changes appearance from blue link to smart link, we should respect that,
+  var shouldForceAppearance = // This flag is set to true only in one place atm:
+  // packages/editor/editor-core/src/plugins/card/pm-plugins/doc.ts @ convertHyperlinkToSmartCard
+  // Which is used when user switching from URL to smart link appearance.
+  !!request.shouldReplaceLink;
+  var handleResolve = provider.resolve(request.url, request.appearance, shouldForceAppearance).then(function (resolvedCard) {
     delete outstandingRequests[request.url];
     return resolvedCard;
   }).then(handleResolved(view, request, options), handleRejected(view, request));

package/dist/cjs/plugins/card/styles.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.smartCardStyles = void 0;
+exports.smartCardStyles = exports.FLOATING_TOOLBAR_LINKPICKER_CLASSNAME = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
@@ -21,5 +21,7 @@ var _tokens = require("@atlaskit/tokens");
 
 var _templateObject;
 
-var smartCardStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    max-width: calc(100% - 20px);\n    vertical-align: top;\n    word-break: break-all;\n\n    .card {\n      padding-left: 2px;\n      padding-right: 2px;\n      padding-top: 0.5em;\n      padding-bottom: 0.5em;\n      margin-bottom: -0.5em;\n\n      .", " > a:focus {\n        ", "\n      }\n    }\n\n    &.", "\n      .", "\n      > a {\n      ", "\n    }\n    .", " > a {\n      /* EDM-1717: box-shadow Safari fix start */\n      z-index: 1;\n      position: relative;\n      /* EDM-1717: box-shadow Safari fix end */\n    }\n\n    &.danger {\n      .", " > a {\n        box-shadow: 0 0 0 1px\n          ", ";\n        /* EDM-1717: box-shadow Safari fix start */\n        z-index: 2;\n        /* EDM-1717: box-shadow Safari fix end */\n      }\n    }\n  }\n\n  .", " {\n    .", " > div {\n      cursor: pointer;\n      &:hover {\n        background-color: ", ";\n      }\n    }\n\n    &.", "\n      .", "\n      > div {\n      ", "\n    }\n\n    &.danger {\n      .", " > div {\n        box-shadow: 0 0 0 1px\n          ", " !important;\n      }\n    }\n  }\n\n  .", " {\n    .", " > div {\n      cursor: pointer;\n      &::after {\n        transition: box-shadow 0s;\n      }\n    }\n    &.", "\n      .", "\n      > div {\n      ", "\n    }\n\n    &.", "\n      .", "\n      > div::after {\n      ", "\n    }\n\n    &.danger {\n      .media-card-frame::after {\n        box-shadow: 0 0 0 1px\n          ", " !important;\n        background: ", " !important;\n      }\n      .richMedia-resize-handle-right::after,\n      .richMedia-resize-handle-left::after {\n        background: ", ";\n      }\n    }\n  }\n"])), _styles.SmartCardSharedCssClassName.INLINE_CARD_CONTAINER, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorSharedStyles.akEditorSelectedNodeClassName, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), _styles.SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _tokens.token)('color.background.neutral.subtle.hovered', _colors.N20), _editorSharedStyles.akEditorSelectedNodeClassName, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), _styles.SmartCardSharedCssClassName.EMBED_CARD_CONTAINER, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, _editorSharedStyles.akEditorSelectedNodeClassName, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorSharedStyles.akEditorSelectedNodeClassName, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), (0, _tokens.token)('color.background.danger', _editorSharedStyles.akEditorDeleteBackground), (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder));
+var FLOATING_TOOLBAR_LINKPICKER_CLASSNAME = 'card-floating-toolbar--link-picker';
+exports.FLOATING_TOOLBAR_LINKPICKER_CLASSNAME = FLOATING_TOOLBAR_LINKPICKER_CLASSNAME;
+var smartCardStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    max-width: calc(100% - 20px);\n    vertical-align: top;\n    word-break: break-all;\n\n    .card {\n      padding-left: 2px;\n      padding-right: 2px;\n      padding-top: 0.5em;\n      padding-bottom: 0.5em;\n      margin-bottom: -0.5em;\n\n      .", " > a:focus {\n        ", "\n      }\n    }\n\n    &.", "\n      .", "\n      > a {\n      ", "\n    }\n    .", " > a {\n      /* EDM-1717: box-shadow Safari fix start */\n      z-index: 1;\n      position: relative;\n      /* EDM-1717: box-shadow Safari fix end */\n    }\n\n    &.danger {\n      .", " > a {\n        box-shadow: 0 0 0 1px\n          ", ";\n        /* EDM-1717: box-shadow Safari fix start */\n        z-index: 2;\n        /* EDM-1717: box-shadow Safari fix end */\n      }\n    }\n  }\n\n  .", " {\n    .", " > div {\n      cursor: pointer;\n      &:hover {\n        background-color: ", ";\n      }\n    }\n\n    &.", "\n      .", "\n      > div {\n      ", "\n    }\n\n    &.danger {\n      .", " > div {\n        box-shadow: 0 0 0 1px\n          ", " !important;\n      }\n    }\n  }\n\n  .", " {\n    .", " > div {\n      cursor: pointer;\n      &::after {\n        transition: box-shadow 0s;\n      }\n    }\n    &.", "\n      .", "\n      > div {\n      ", "\n    }\n\n    &.", "\n      .", "\n      > div::after {\n      ", "\n    }\n\n    &.danger {\n      .media-card-frame::after {\n        box-shadow: 0 0 0 1px\n          ", " !important;\n        background: ", " !important;\n      }\n      .richMedia-resize-handle-right::after,\n      .richMedia-resize-handle-left::after {\n        background: ", ";\n      }\n    }\n  }\n\n  .", " {\n    padding: 0;\n  }\n"])), _styles.SmartCardSharedCssClassName.INLINE_CARD_CONTAINER, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorSharedStyles.akEditorSelectedNodeClassName, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), _styles.SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _tokens.token)('color.background.neutral.subtle.hovered', _colors.N20), _editorSharedStyles.akEditorSelectedNodeClassName, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), _styles.SmartCardSharedCssClassName.EMBED_CARD_CONTAINER, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, _editorSharedStyles.akEditorSelectedNodeClassName, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorSharedStyles.akEditorSelectedNodeClassName, _styles.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), (0, _tokens.token)('color.background.danger', _editorSharedStyles.akEditorDeleteBackground), (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), FLOATING_TOOLBAR_LINKPICKER_CLASSNAME);
 exports.smartCardStyles = smartCardStyles;

package/dist/cjs/plugins/card/toolbar.js

@@ -51,6 +51,8 @@ var _MediaAndEmbedsToolbar = _interopRequireDefault(require("../../ui/MediaAndEm
 
 var _linkingUtils = require("../../utils/linking-utils");
 
+var _styles2 = require("./styles");
+
 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; }
@@ -275,9 +277,12 @@ var floatingToolbar = function floatingToolbar(cardOptions, platform) {
 
     var toolbarOffset = isEmbedCard ? {
       offset: [0, 24]
-    } : {};
+    } : {}; // Applies padding override for when link picker is currently displayed
+
+    var className = pluginState.showLinkingToolbar ? _styles2.FLOATING_TOOLBAR_LINKPICKER_CLASSNAME : undefined;
     return _objectSpread(_objectSpread({
       title: intl.formatMessage(_messages2.messages.card),
+      className: className,
       nodeType: nodeType
     }, toolbarOffset), {}, {
       getDomRef: function getDomRef(view) {

package/dist/cjs/plugins/code-block/styles.js

@@ -2,8 +2,6 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
-var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -17,7 +15,7 @@ var _components = require("@atlaskit/theme/components");
 
 var _constants = require("@atlaskit/theme/constants");
 
-var colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
+var _colors = require("@atlaskit/theme/colors");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -25,63 +23,41 @@ var _tokens = require("@atlaskit/tokens");
 
 var _classNames = require("./ui/class-names");
 
-var _templateObject, _templateObject2;
-
-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); }
+var _styles = require("@atlaskit/editor-common/styles");
 
-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; }
+var _templateObject, _templateObject2;
 
 var highlightingCodeBlockStyles = function highlightingCodeBlockStyles(props) {
   return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .ProseMirror .code-block {\n    position: relative;\n    background-image: ", ";\n    background-repeat: no-repeat;\n    background-color: ", ";\n\n    --ds--code--bg-color: transparent;\n\n    background-attachment: local, scroll, scroll;\n    background-size: 8px 100%, 8px 100%, 8px 100%;\n    background-position: 100% 0, 100% 0, 0 0;\n    font-family: ", ";\n    border-radius: ", "px;\n    margin: ", " 0 0 0;\n    counter-reset: line;\n    display: flex;\n    min-width: ", "px;\n    cursor: pointer;\n    overflow-x: auto;\n\n    .", " {\n      /* https://bitbucket.org/atlassian/atlassian-frontend/src/develop/packages/design-system/code/src/themes/themeBuilder.ts#packages/design-system/code/src/themes/themeBuilder.ts-19:28 */\n      flex-shrink: 0;\n      text-align: right;\n      background-color: ", ";\n      padding: ", "px;\n      color: ", ";\n\n      span {\n        display: block;\n        line-height: 0;\n        font-size: 0;\n\n        &::before {\n          display: inline-block;\n          content: counter(line);\n          counter-increment: line;\n          font-size: ", ";\n          line-height: 1.5rem;\n          color: ", ";\n        }\n      }\n    }\n\n    .", " {\n      position: absolute;\n      z-index: 2;\n      width: 100%;\n      height: 100%;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      left: 0;\n      pointer-events: none;\n      overflow: hidden;\n      tab-size: 4;\n\n      & [data-ds--code--code-block] {\n        font-size: ", ";\n        line-height: 1.5rem;\n      }\n    }\n\n    .", " {\n      position: relative;\n      z-index: 1;\n      display: flex;\n      flex: 1;\n\n      > code {\n        flex-grow: 1;\n        tab-size: 4;\n        cursor: text;\n        /* https://bitbucket.org/atlassian/atlassian-frontend/src/218202daeaf527262c21841e6f88fa058d349ad4/packages/design-system/code/src/themes/themeBuilder.ts#lines-12:17 */\n        font-size: ", ";\n        line-height: 1.5rem;\n        border-radius: ", "px;\n        margin: ", "px;\n        white-space: pre;\n      }\n\n      &[data-debounce='true'] {\n        .", " {\n          display: none;\n        }\n      }\n\n      &:not([data-debounce='true']) {\n        > code:not([data-language='plaintext']):not([data-language='none']):not([data-language='']) {\n          color: transparent;\n          caret-color: ", ";\n        }\n      }\n    }\n  }\n\n  .ProseMirror li > .code-block {\n    margin: 0;\n  }\n\n  .ProseMirror .code-block.", ":not(.danger) {\n    ", "\n  }\n\n  /* Danger when top level node */\n  .ProseMirror .danger.code-block {\n    box-shadow: 0 0 0 ", "px\n      ", ";\n\n    .", " {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    .", " {\n      background-color: ", ";\n    }\n  }\n\n  /* Danger when nested node */\n  .ProseMirror .danger .code-block {\n    .", " {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    .", " {\n      background-color: ", ";\n    }\n  }\n"])), (0, _editorSharedStyles.overflowShadow)({
     // TODO: https://product-fabric.atlassian.net/browse/DSP-4118
     // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
     background: (0, _components.themed)({
-      light: colors.N20,
-      dark: colors.DN50
+      light: _colors.N20,
+      dark: _colors.DN50
     })(props),
     width: '8px'
   }), (0, _components.themed)({
-    light: (0, _tokens.token)('color.background.neutral', colors.N20),
-    dark: (0, _tokens.token)('color.background.neutral', colors.DN50)
+    light: (0, _tokens.token)('color.background.neutral', _colors.N20),
+    dark: (0, _tokens.token)('color.background.neutral', _colors.DN50)
   })(props), _editorSharedStyles.akEditorCodeFontFamily, (0, _constants.borderRadius)(), _editorSharedStyles.blockNodesVerticalMargin, _editorSharedStyles.akEditorTableCellMinWidth, _classNames.codeBlockClassNames.gutter, (0, _components.themed)({
-    light: (0, _tokens.token)('color.background.neutral', colors.N30),
-    dark: (0, _tokens.token)('color.background.neutral', colors.DN20)
+    light: (0, _tokens.token)('color.background.neutral', _colors.N30),
+    dark: (0, _tokens.token)('color.background.neutral', _colors.DN20)
   })(props), (0, _constants.gridSize)(), (0, _components.themed)({
-    light: (0, _tokens.token)('color.text.subtlest', colors.N90),
-    dark: (0, _tokens.token)('color.text.subtlest', colors.DN90)
+    light: (0, _tokens.token)('color.text.subtlest', _colors.N90),
+    dark: (0, _tokens.token)('color.text.subtlest', _colors.DN90)
   })(props), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _components.themed)({
-    light: (0, _tokens.token)('color.text.subtle', colors.N400),
-    dark: (0, _tokens.token)('color.text.subtle', colors.DN400)
+    light: (0, _tokens.token)('color.text.subtle', _colors.N400),
+    dark: (0, _tokens.token)('color.text.subtle', _colors.DN400)
   })(props), _classNames.codeBlockClassNames.highlighting, (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), _classNames.codeBlockClassNames.content, (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _constants.borderRadius)(), (0, _constants.gridSize)(), _classNames.codeBlockClassNames.highlighting, (0, _components.themed)({
-    light: (0, _tokens.token)('color.text', colors.N800),
-    dark: (0, _tokens.token)('color.text', colors.DN500)
-  })(props), _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow, _editorSharedStyles.SelectionStyle.Blanket]), _editorSharedStyles.akEditorSelectedBorderSize, (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), _classNames.codeBlockClassNames.gutter, (0, _tokens.token)('color.blanket.danger', colors.R75), (0, _tokens.token)('color.text.danger', _editorSharedStyles.akEditorDeleteIconColor), _classNames.codeBlockClassNames.content, (0, _tokens.token)('color.background.danger', _editorSharedStyles.akEditorDeleteBackground), _classNames.codeBlockClassNames.gutter, (0, _tokens.token)('color.blanket.danger', 'rgba(255, 143, 115, 0.5)'), (0, _tokens.token)('color.text.danger', _editorSharedStyles.akEditorDeleteIconColor), _classNames.codeBlockClassNames.content, (0, _tokens.token)('color.background.danger', 'rgba(255, 189, 173, 0.5)'));
+    light: (0, _tokens.token)('color.text', _colors.N800),
+    dark: (0, _tokens.token)('color.text', _colors.DN500)
+  })(props), _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow, _editorSharedStyles.SelectionStyle.Blanket]), _editorSharedStyles.akEditorSelectedBorderSize, (0, _tokens.token)('color.border.danger', _editorSharedStyles.akEditorDeleteBorder), _classNames.codeBlockClassNames.gutter, (0, _tokens.token)('color.blanket.danger', _colors.R75), (0, _tokens.token)('color.text.danger', _editorSharedStyles.akEditorDeleteIconColor), _classNames.codeBlockClassNames.content, (0, _tokens.token)('color.background.danger', _editorSharedStyles.akEditorDeleteBackground), _classNames.codeBlockClassNames.gutter, (0, _tokens.token)('color.blanket.danger', 'rgba(255, 143, 115, 0.5)'), (0, _tokens.token)('color.text.danger', _editorSharedStyles.akEditorDeleteIconColor), _classNames.codeBlockClassNames.content, (0, _tokens.token)('color.background.danger', 'rgba(255, 189, 173, 0.5)'));
 };
 
 exports.highlightingCodeBlockStyles = highlightingCodeBlockStyles;
 
 var codeBlockStyles = function codeBlockStyles(props) {
-  return (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  .ProseMirror .code-block {\n    position: relative;\n    background-image: ", ";\n\n    --ds--code--bg-color: transparent;\n\n    background-repeat: no-repeat;\n    background-color: ", ";\n    background-attachment: local, scroll, scroll;\n    background-size: 8px 100%, 8px 100%, 8px 100%;\n    background-position: 100% 0, 100% 0, 0 0;\n    font-family: ", ";\n    border-radius: ", "px;\n    margin: ", " 0 0 0;\n    counter-reset: line;\n    display: flex;\n    min-width: ", "px;\n    cursor: pointer;\n    overflow-x: auto;\n\n    .", " {\n      /* https://bitbucket.org/atlassian/atlassian-frontend/src/develop/packages/design-system/code/src/themes/themeBuilder.ts#packages/design-system/code/src/themes/themeBuilder.ts-19:28 */\n      flex-shrink: 0;\n      text-align: right;\n      background-color: ", ";\n      padding: ", "px;\n\n      span {\n        display: block;\n        line-height: 0;\n        font-size: 0;\n\n        &::before {\n          display: inline-block;\n          content: counter(line);\n          counter-increment: line;\n          font-size: ", ";\n          line-height: 1.5rem;\n          color: ", ";\n        }\n      }\n    }\n\n    .", " {\n      display: flex;\n      flex: 1;\n\n      code {\n        flex-grow: 1;\n        tab-size: 4;\n        cursor: text;\n        /* https://bitbucket.org/atlassian/atlassian-frontend/src/218202daeaf527262c21841e6f88fa058d349ad4/packages/design-system/code/src/themes/themeBuilder.ts#lines-12:17 */\n        font-size: ", ";\n        line-height: 1.5rem;\n        color: ", ";\n        border-radius: ", "px;\n        margin: ", "px;\n        white-space: pre;\n      }\n    }\n  }\n\n  .ProseMirror li > .code-block {\n    margin: 0;\n  }\n\n  .ProseMirror .code-block.", ":not(.danger) {\n    ", "\n  }\n\n  /* Danger when top level node */\n  .ProseMirror .danger.code-block {\n    box-shadow: 0 0 0 ", "px ", ";\n\n    .", " {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    .", " {\n      background-color: ", ";\n    }\n  }\n\n  /* Danger when nested node */\n  .ProseMirror .danger .code-block {\n    .", " {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    .", " {\n      background-color: ", ";\n    }\n  }\n"])), (0, _editorSharedStyles.overflowShadow)({
-    // TODO: https://product-fabric.atlassian.net/browse/DSP-4118
-    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-    background: (0, _components.themed)({
-      light: colors.N20,
-      dark: colors.DN50
-    })(props),
-    width: '8px'
-  }), (0, _components.themed)({
-    light: (0, _tokens.token)('color.background.neutral', colors.N20),
-    dark: (0, _tokens.token)('color.background.neutral', colors.DN50)
-  })(props), _editorSharedStyles.akEditorCodeFontFamily, (0, _constants.borderRadius)(), _editorSharedStyles.blockNodesVerticalMargin, _editorSharedStyles.akEditorTableCellMinWidth, _classNames.codeBlockClassNames.gutter, (0, _components.themed)({
-    light: (0, _tokens.token)('color.background.neutral', colors.N30),
-    dark: (0, _tokens.token)('color.background.neutral', colors.DN20)
-  })(props), (0, _constants.gridSize)(), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _components.themed)({
-    light: (0, _tokens.token)('color.text', colors.N400),
-    dark: (0, _tokens.token)('color.text', colors.DN400)
-  })(props), _classNames.codeBlockClassNames.content, (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _components.themed)({
-    light: (0, _tokens.token)('color.text', colors.N800),
-    dark: (0, _tokens.token)('color.text', colors.DN800)
-  })(props), (0, _constants.borderRadius)(), (0, _constants.gridSize)(), _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow, _editorSharedStyles.SelectionStyle.Blanket]), _editorSharedStyles.akEditorSelectedBorderSize, _editorSharedStyles.akEditorDeleteBorder, _classNames.codeBlockClassNames.gutter, (0, _tokens.token)('color.blanket.danger', colors.R75), (0, _tokens.token)('color.text.danger', _editorSharedStyles.akEditorDeleteIconColor), _classNames.codeBlockClassNames.content, (0, _tokens.token)('color.background.danger', _editorSharedStyles.akEditorDeleteBackground), _classNames.codeBlockClassNames.gutter, (0, _tokens.token)('color.blanket.danger', 'rgba(255, 143, 115, 0.5)'), (0, _tokens.token)('color.text.danger', _editorSharedStyles.akEditorDeleteIconColor), _classNames.codeBlockClassNames.content, (0, _tokens.token)('color.background.danger', 'rgba(255, 189, 173, 0.5)'));
+  return (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  .ProseMirror {\n    ", "\n  }\n\n  .ProseMirror li > .code-block {\n    margin: 0;\n  }\n\n  .ProseMirror .code-block.", ":not(.danger) {\n    ", "\n  }\n\n  /* Danger when top level node */\n  .ProseMirror .danger.code-block {\n    box-shadow: 0 0 0 ", "px ", ";\n\n    .", " {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    .", " {\n      background-color: ", ";\n    }\n  }\n\n  /* Danger when nested node */\n  .ProseMirror .danger .code-block {\n    .", " {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    .", " {\n      background-color: ", ";\n    }\n  }\n"])), (0, _styles.codeBlockSharedStyles)(props), _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow, _editorSharedStyles.SelectionStyle.Blanket]), _editorSharedStyles.akEditorSelectedBorderSize, _editorSharedStyles.akEditorDeleteBorder, _classNames.codeBlockClassNames.gutter, (0, _tokens.token)('color.blanket.danger', _colors.R75), (0, _tokens.token)('color.text.danger', _editorSharedStyles.akEditorDeleteIconColor), _classNames.codeBlockClassNames.content, (0, _tokens.token)('color.background.danger', _editorSharedStyles.akEditorDeleteBackground), _classNames.codeBlockClassNames.gutter, (0, _tokens.token)('color.blanket.danger', 'rgba(255, 143, 115, 0.5)'), (0, _tokens.token)('color.text.danger', _editorSharedStyles.akEditorDeleteIconColor), _classNames.codeBlockClassNames.content, (0, _tokens.token)('color.background.danger', 'rgba(255, 189, 173, 0.5)'));
 };
 
 exports.codeBlockStyles = codeBlockStyles;

package/dist/cjs/plugins/code-block/ui/class-names.js

@@ -4,9 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.codeBlockClassNames = void 0;
+
+var _styles = require("@atlaskit/editor-common/styles");
+
 var codeBlockClassNames = {
-  gutter: 'line-number-gutter',
-  content: 'code-content',
+  gutter: _styles.CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER,
+  content: _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT,
   highlighting: 'code-highlighting'
 };
 exports.codeBlockClassNames = codeBlockClassNames;

package/dist/cjs/plugins/copy-button/commands.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resetCopiedState = exports.copy = void 0;
+
+var _prosemirrorUtils = require("prosemirror-utils");
+
+var _pluginKey = require("./pm-plugins/plugin-key");
+
+var _decoration = require("../base/pm-plugins/decoration");
+
+var _prosemirrorModel = require("prosemirror-model");
+
+var _clipboard = require("../../utils/clipboard");
+
+var copy = function copy(nodeType) {
+  return function (state, dispatch) {
+    var tr = state.tr,
+        schema = state.schema; // This command should only be triggered by the Copy button in the floating toolbar
+    // which is only visible when selection is inside the target node
+
+    var node = (0, _prosemirrorUtils.findSelectedNodeOfType)(nodeType)(tr.selection);
+
+    if (!node) {
+      node = (0, _prosemirrorUtils.findParentNodeOfType)(nodeType)(tr.selection);
+    }
+
+    if (!node) {
+      return false;
+    }
+
+    var domNode = _prosemirrorModel.DOMSerializer.fromSchema(schema).serializeNode(node.node);
+
+    var div = document.createElement('div');
+    div.appendChild(domNode); // The "0 0" refers to the start and end depth of the slice
+    // since we're coping the block node only, it will always be 0 0
+    // https://github.com/ProseMirror/prosemirror-view/blob/master/src/clipboard.ts#L32
+
+    div.firstChild.setAttribute('data-pm-slice', '0 0 []');
+    (0, _clipboard.copyHTMLToClipboard)(div.innerHTML);
+    var copyToClipboardTr = tr;
+    copyToClipboardTr.setMeta(_pluginKey.pluginKey, {
+      copied: true
+    });
+
+    if (dispatch) {
+      dispatch(copyToClipboardTr);
+    }
+
+    return true;
+  };
+};
+
+exports.copy = copy;
+
+var resetCopiedState = function resetCopiedState(nodeType, onMouseLeave) {
+  return function (state, dispatch) {
+    var customTr = state.tr; // Avoid multipe dispatch
+    // https://product-fabric.atlassian.net/wiki/spaces/E/pages/2241659456/All+about+dispatch+and+why+there+shouldn+t+be+multiple#How-do-I-avoid-them%3F
+
+    var customDispatch = function customDispatch(tr) {
+      customTr = tr;
+    };
+
+    onMouseLeave ? onMouseLeave(state, customDispatch) : (0, _decoration.hoverDecoration)(nodeType, false)(state, customDispatch);
+
+    var copyButtonState = _pluginKey.pluginKey.getState(state);
+
+    if (copyButtonState !== null && copyButtonState !== void 0 && copyButtonState.copied) {
+      customTr.setMeta(_pluginKey.pluginKey, {
+        copied: false
+      });
+    }
+
+    if (dispatch) {
+      dispatch(customTr);
+    }
+
+    return true;
+  };
+};
+
+exports.resetCopiedState = resetCopiedState;

package/dist/cjs/plugins/copy-button/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _main = _interopRequireDefault(require("./pm-plugins/main"));
+
+var copyButtonPlugin = function copyButtonPlugin() {
+  return {
+    name: 'copyButton',
+    pmPlugins: function pmPlugins() {
+      return [{
+        name: 'copyButton',
+        plugin: function plugin() {
+          return (0, _main.default)();
+        }
+      }];
+    }
+  };
+};
+
+var _default = copyButtonPlugin;
+exports.default = _default;

package/dist/cjs/plugins/copy-button/pm-plugins/main.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.copyButtonPlugin = copyButtonPlugin;
+exports.default = void 0;
+
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+
+var _pluginKey = require("./plugin-key");
+
+function copyButtonPlugin() {
+  return new _safePlugin.SafePlugin({
+    state: {
+      init: function init() {
+        return {
+          copied: false
+        };
+      },
+      apply: function apply(tr, pluginState) {
+        var meta = tr.getMeta(_pluginKey.pluginKey);
+
+        if ((meta === null || meta === void 0 ? void 0 : meta.copied) !== undefined) {
+          return {
+            copied: meta.copied
+          };
+        }
+
+        return pluginState;
+      }
+    },
+    key: _pluginKey.pluginKey
+  });
+}
+
+var _default = copyButtonPlugin;
+exports.default = _default;

package/dist/cjs/plugins/copy-button/pm-plugins/plugin-key.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.pluginKey = void 0;
+
+var _prosemirrorState = require("prosemirror-state");
+
+var pluginKey = new _prosemirrorState.PluginKey('copyButtonPlugin');
+exports.pluginKey = pluginKey;

package/dist/cjs/plugins/copy-button/utils.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.showCopyButton = exports.getCopyButtonConfig = void 0;
+
+var _copy = _interopRequireDefault(require("@atlaskit/icon/glyph/copy"));
+
+var _messages = _interopRequireDefault(require("../../messages"));
+
+var _decoration = require("../base/pm-plugins/decoration");
+
+var _commands = require("./commands");
+
+var _pluginKey = require("./pm-plugins/plugin-key");
+
+var getCopyButtonConfig = function getCopyButtonConfig(state, formatMessage, nodeType, onMouseEnter, onMouseLeave) {
+  var copyButtonState = _pluginKey.pluginKey.getState(state);
+
+  return {
+    id: 'editor.floatingToolbar.copy',
+    type: 'button',
+    appearance: 'subtle',
+    icon: _copy.default,
+    onClick: (0, _commands.copy)(nodeType),
+    title: formatMessage(copyButtonState !== null && copyButtonState !== void 0 && copyButtonState.copied ? _messages.default.copiedToClipboard : _messages.default.copyToClipboard),
+    onMouseEnter: onMouseEnter || (0, _decoration.hoverDecoration)(nodeType, true, 'ak-editor-selected-node'),
+    onMouseLeave: (0, _commands.resetCopiedState)(nodeType, onMouseLeave),
+    onFocus: (0, _decoration.hoverDecoration)(nodeType, true, 'ak-editor-selected-node'),
+    onBlur: (0, _decoration.hoverDecoration)(nodeType, false),
+    hideTooltipOnClick: false,
+    tabIndex: null // TODO select and delete styling needs to be removed when keyboard cursor moves away
+    // problem already exist with delete as well
+
+  };
+};
+
+exports.getCopyButtonConfig = getCopyButtonConfig;
+
+var showCopyButton = function showCopyButton(state) {
+  return state && // Check if the Copy button plugin is enabled
+  // @ts-ignore pluginKey.key
+  state.plugins.find(function (p) {
+    return p.key === _pluginKey.pluginKey.key;
+  });
+};
+
+exports.showCopyButton = showCopyButton;

package/dist/cjs/plugins/feature-flags-context/feature-flags-from-props.js

@@ -30,7 +30,7 @@ var safeNumberFeatureFlag = function safeNumberFeatureFlag(value) {
 
 
 function createFeatureFlagsFromProps(props) {
-  var _props$allowTextColor, _props$allowLayouts, _props$performanceTra, _props$performanceTra2, _props$featureFlags, _props$featureFlags2, _props$allowTables, _props$featureFlags3, _props$featureFlags4, _props$allowTables2, _props$featureFlags5, _props$featureFlags6, _props$allowTables3, _props$featureFlags7, _props$featureFlags8, _props$allowTables4, _props$featureFlags9, _props$featureFlags10, _props$allowTables5, _props$allowExtension, _props$featureFlags11, _props$featureFlags12, _props$featureFlags13, _props$featureFlags14, _props$featureFlags15, _props$featureFlags16, _props$featureFlags17, _props$featureFlags18, _props$featureFlags19, _props$featureFlags20, _props$featureFlags21, _props$featureFlags22, _props$featureFlags23, _props$featureFlags24, _props$featureFlags25, _props$featureFlags26, _props$featureFlags27, _props$featureFlags28, _props$featureFlags29, _props$featureFlags30, _props$featureFlags31, _props$featureFlags32, _props$featureFlags33, _props$collabEdit, _props$collabEdit2, _props$featureFlags34, _props$featureFlags35, _props$featureFlags36, _props$featureFlags37;
+  var _props$allowTextColor, _props$allowLayouts, _props$performanceTra, _props$performanceTra2, _props$featureFlags, _props$featureFlags2, _props$allowTables, _props$featureFlags3, _props$featureFlags4, _props$allowTables2, _props$featureFlags5, _props$featureFlags6, _props$allowTables3, _props$featureFlags7, _props$featureFlags8, _props$allowTables4, _props$featureFlags9, _props$featureFlags10, _props$allowTables5, _props$allowExtension, _props$featureFlags11, _props$featureFlags12, _props$featureFlags13, _props$featureFlags14, _props$featureFlags15, _props$featureFlags16, _props$featureFlags17, _props$featureFlags18, _props$featureFlags19, _props$featureFlags20, _props$featureFlags21, _props$featureFlags22, _props$featureFlags23, _props$featureFlags24, _props$featureFlags25, _props$featureFlags26, _props$featureFlags27, _props$featureFlags28, _props$featureFlags29, _props$featureFlags30, _props$featureFlags31, _props$featureFlags32, _props$featureFlags33, _props$collabEdit, _props$collabEdit2, _props$featureFlags34, _props$featureFlags35, _props$featureFlags36, _props$featureFlags37, _props$featureFlags38, _props$featureFlags39, _props$featureFlags40, _props$featureFlags41;
 
   var normalizedFeatureFlags = (0, _normalizeFeatureFlags.normalizeFeatureFlags)(props.featureFlags);
   return _objectSpread(_objectSpread({}, normalizedFeatureFlags), {}, {
@@ -68,6 +68,8 @@ function createFeatureFlagsFromProps(props) {
     useNativeCollabPlugin: Boolean(typeof ((_props$collabEdit = props.collabEdit) === null || _props$collabEdit === void 0 ? void 0 : _props$collabEdit.useNativePlugin) === 'boolean' ? !!((_props$collabEdit2 = props.collabEdit) !== null && _props$collabEdit2 !== void 0 && _props$collabEdit2.useNativePlugin) : false),
     chromeCursorHandlerFixedVersion: typeof ((_props$featureFlags34 = props.featureFlags) === null || _props$featureFlags34 === void 0 ? void 0 : _props$featureFlags34.chromeCursorHandlerFixedVersion) === 'string' ? Number(props.featureFlags.chromeCursorHandlerFixedVersion) || undefined : undefined,
     viewChangingExperimentToolbarStyle: typeof ((_props$featureFlags35 = props.featureFlags) === null || _props$featureFlags35 === void 0 ? void 0 : _props$featureFlags35['view-changing-experiment-toolbar-style']) === 'string' ? props.featureFlags['view-changing-experiment-toolbar-style'] || undefined : undefined,
-    showHoverPreview: Boolean(typeof ((_props$featureFlags36 = props.featureFlags) === null || _props$featureFlags36 === void 0 ? void 0 : _props$featureFlags36.showHoverPreview) === 'boolean' ? !!((_props$featureFlags37 = props.featureFlags) !== null && _props$featureFlags37 !== void 0 && _props$featureFlags37.showHoverPreview) : false)
+    showHoverPreview: Boolean(typeof ((_props$featureFlags36 = props.featureFlags) === null || _props$featureFlags36 === void 0 ? void 0 : _props$featureFlags36.showHoverPreview) === 'boolean' ? !!((_props$featureFlags37 = props.featureFlags) !== null && _props$featureFlags37 !== void 0 && _props$featureFlags37.showHoverPreview) : false),
+    indentationButtonsInTheToolbar: Boolean(typeof ((_props$featureFlags38 = props.featureFlags) === null || _props$featureFlags38 === void 0 ? void 0 : _props$featureFlags38['indentation-buttons-in-the-toolbar']) === 'boolean' ? !!((_props$featureFlags39 = props.featureFlags) !== null && _props$featureFlags39 !== void 0 && _props$featureFlags39['indentation-buttons-in-the-toolbar']) : false),
+    floatingToolbarCopyButton: Boolean(typeof ((_props$featureFlags40 = props.featureFlags) === null || _props$featureFlags40 === void 0 ? void 0 : _props$featureFlags40.floatingToolbarCopyButton) === 'boolean' ? !!((_props$featureFlags41 = props.featureFlags) !== null && _props$featureFlags41 !== void 0 && _props$featureFlags41.floatingToolbarCopyButton) : false)
   });
 }

package/dist/cjs/plugins/indentation/messages.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.messages = void 0;
+
+var _reactIntlNext = require("react-intl-next");
+
+// Common Translations will live here
+var messages = (0, _reactIntlNext.defineMessages)({
+  indent: {
+    id: 'fabric.editor.indent',
+    defaultMessage: 'Indent',
+    description: 'Indent a list item, paragraph or heading'
+  },
+  outdent: {
+    id: 'fabric.editor.outdent',
+    defaultMessage: 'Outdent',
+    description: 'Outdent a list item, paragraph or heading'
+  }
+});
+exports.messages = messages;

package/dist/cjs/plugins/index.js

@@ -109,6 +109,12 @@ Object.defineProperty(exports, "contextPanelPlugin", {
     return _contextPanel.default;
   }
 });
+Object.defineProperty(exports, "copyButtonPlugin", {
+  enumerable: true,
+  get: function get() {
+    return _copyButton.default;
+  }
+});
 Object.defineProperty(exports, "customAutoformatPlugin", {
   enumerable: true,
   get: function get() {
@@ -379,6 +385,12 @@ Object.defineProperty(exports, "textFormattingPlugin", {
     return _textFormatting.default;
   }
 });
+Object.defineProperty(exports, "toolbarListsIndentationPlugin", {
+  enumerable: true,
+  get: function get() {
+    return _toolbarListsIndentation.default;
+  }
+});
 Object.defineProperty(exports, "typeAheadPlugin", {
   enumerable: true,
   get: function get() {
@@ -442,6 +454,8 @@ var _layout = _interopRequireDefault(require("./layout"));
 
 var _list = _interopRequireDefault(require("./list"));
 
+var _toolbarListsIndentation = _interopRequireDefault(require("./toolbar-lists-indentation"));
+
 var _macro = _interopRequireDefault(require("./macro"));
 
 var _maxContentSize = _interopRequireDefault(require("./max-content-size"));
@@ -540,6 +554,8 @@ var _beforePrimaryToolbar = _interopRequireDefault(require("./before-primaryTool
 
 var _codeBidiWarning = _interopRequireDefault(require("./code-bidi-warning"));
 
+var _copyButton = _interopRequireDefault(require("./copy-button"));
+
 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; }