@atlaskit/editor-plugin-breakout 1.0.6 → 1.0.8

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/editor-plugin-breakout
 
+## 1.0.8
+
+### Patch Changes
+
+- [#91106](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/91106) [`b6ffa30186b9`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b6ffa30186b9) - Bump ADF-schema package to version 35.0.0
+- Updated dependencies
+
+## 1.0.7
+
+### Patch Changes
+
+- [#88938](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/88938) [`db547827ee45`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/db547827ee45) - [ux] Don't render LayoutButton when editor in 'view' mode
+- Updated dependencies
+
 ## 1.0.6
 
 ### Patch Changes

package/dist/cjs/plugin.js

@@ -156,15 +156,17 @@ var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
     scrollableElement = _ref3.scrollableElement,
     mountPoint = _ref3.mountPoint;
   // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['width', 'breakout']),
-    breakoutState = _useSharedPluginState.breakoutState;
-  return /*#__PURE__*/_react.default.createElement(_LayoutButton.default, {
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['width', 'breakout', 'editorViewMode']),
+    breakoutState = _useSharedPluginState.breakoutState,
+    editorViewModeState = _useSharedPluginState.editorViewModeState;
+  var isViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  return !isViewMode ? /*#__PURE__*/_react.default.createElement(_LayoutButton.default, {
     editorView: editorView,
     mountPoint: mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement,
     node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
-  });
+  }) : null;
 };
 var breakoutPlugin = exports.breakoutPlugin = function breakoutPlugin(_ref4) {
   var options = _ref4.config,
@@ -205,7 +207,7 @@ var breakoutPlugin = exports.breakoutPlugin = function breakoutPlugin(_ref4) {
         popupsBoundariesElement = _ref5.popupsBoundariesElement,
         popupsScrollableElement = _ref5.popupsScrollableElement;
       // This is a bit crappy, but should be resolved once we move to a static schema.
-      if (options && !options.allowBreakoutButton) {
+      if (options && !options.allowBreakoutButton || !editorView.editable) {
         return null;
       }
       return /*#__PURE__*/_react.default.createElement(LayoutButtonWrapper, {

package/dist/es2019/plugin.js

@@ -147,15 +147,17 @@ const LayoutButtonWrapper = ({
   var _breakoutState$breako, _breakoutState$breako2;
   // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
   const {
-    breakoutState
-  } = useSharedPluginState(api, ['width', 'breakout']);
-  return /*#__PURE__*/React.createElement(LayoutButton, {
+    breakoutState,
+    editorViewModeState
+  } = useSharedPluginState(api, ['width', 'breakout', 'editorViewMode']);
+  const isViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  return !isViewMode ? /*#__PURE__*/React.createElement(LayoutButton, {
     editorView: editorView,
     mountPoint: mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement,
     node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
-  });
+  }) : null;
 };
 export const breakoutPlugin = ({
   config: options,
@@ -195,7 +197,7 @@ export const breakoutPlugin = ({
     popupsScrollableElement
   }) {
     // This is a bit crappy, but should be resolved once we move to a static schema.
-    if (options && !options.allowBreakoutButton) {
+    if (options && !options.allowBreakoutButton || !editorView.editable) {
       return null;
     }
     return /*#__PURE__*/React.createElement(LayoutButtonWrapper, {

package/dist/esm/plugin.js

@@ -149,15 +149,17 @@ var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
     scrollableElement = _ref3.scrollableElement,
     mountPoint = _ref3.mountPoint;
   // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
-  var _useSharedPluginState = useSharedPluginState(api, ['width', 'breakout']),
-    breakoutState = _useSharedPluginState.breakoutState;
-  return /*#__PURE__*/React.createElement(LayoutButton, {
+  var _useSharedPluginState = useSharedPluginState(api, ['width', 'breakout', 'editorViewMode']),
+    breakoutState = _useSharedPluginState.breakoutState,
+    editorViewModeState = _useSharedPluginState.editorViewModeState;
+  var isViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  return !isViewMode ? /*#__PURE__*/React.createElement(LayoutButton, {
     editorView: editorView,
     mountPoint: mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement,
     node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
-  });
+  }) : null;
 };
 export var breakoutPlugin = function breakoutPlugin(_ref4) {
   var options = _ref4.config,
@@ -198,7 +200,7 @@ export var breakoutPlugin = function breakoutPlugin(_ref4) {
         popupsBoundariesElement = _ref5.popupsBoundariesElement,
         popupsScrollableElement = _ref5.popupsScrollableElement;
       // This is a bit crappy, but should be resolved once we move to a static schema.
-      if (options && !options.allowBreakoutButton) {
+      if (options && !options.allowBreakoutButton || !editorView.editable) {
         return null;
       }
       return /*#__PURE__*/React.createElement(LayoutButtonWrapper, {

package/dist/types/plugin.d.ts

@@ -1,4 +1,5 @@
-import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
+import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { BreakoutPluginState } from './types';
 export interface BreakoutPluginOptions {
@@ -6,7 +7,7 @@ export interface BreakoutPluginOptions {
 }
 export type BreakoutPlugin = NextEditorPlugin<'breakout', {
     pluginConfiguration: BreakoutPluginOptions | undefined;
-    dependencies: [WidthPlugin];
+    dependencies: [WidthPlugin, OptionalPlugin<EditorViewModePlugin>];
     sharedState: Partial<BreakoutPluginState>;
 }>;
 export declare const breakoutPlugin: BreakoutPlugin;

package/dist/types-ts4.5/plugin.d.ts

@@ -1,4 +1,5 @@
-import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
+import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { BreakoutPluginState } from './types';
 export interface BreakoutPluginOptions {
@@ -7,7 +8,8 @@ export interface BreakoutPluginOptions {
 export type BreakoutPlugin = NextEditorPlugin<'breakout', {
     pluginConfiguration: BreakoutPluginOptions | undefined;
     dependencies: [
-        WidthPlugin
+        WidthPlugin,
+        OptionalPlugin<EditorViewModePlugin>
     ];
     sharedState: Partial<BreakoutPluginState>;
 }>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-breakout",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "description": "Breakout plugin for @atlaskit/editor-core",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -31,14 +31,15 @@
     ".": "./src/index.ts"
   },
   "dependencies": {
-    "@atlaskit/adf-schema": "^35.8.0",
-    "@atlaskit/editor-common": "^78.22.0",
+    "@atlaskit/adf-schema": "^35.9.0",
+    "@atlaskit/editor-common": "^78.28.0",
+    "@atlaskit/editor-plugin-editor-viewmode": "^1.0.0",
     "@atlaskit/editor-plugin-width": "^1.0.0",
     "@atlaskit/editor-prosemirror": "3.0.0",
     "@atlaskit/editor-shared-styles": "^2.9.0",
     "@atlaskit/icon": "^22.1.0",
     "@atlaskit/theme": "^12.7.0",
-    "@atlaskit/tokens": "^1.42.0",
+    "@atlaskit/tokens": "^1.43.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1"
   },