@atlaskit/editor-plugin-floating-toolbar 0.7.28 → 0.8.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-plugin-floating-toolbar
 
+## 0.8.0
+
+### Minor Changes
+
+- [#68277](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/68277) [`fe0abf4abc01`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/fe0abf4abc01) - Enable the selection toolbar to work with live pages view mode
+
+## 0.7.29
+
+### Patch Changes
+
+- [#67948](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/67948) [`28fcdf6793a4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/28fcdf6793a4) - Expand/collapse for panel and table color pickers
+
 ## 0.7.28
 
 ### Patch Changes

package/dist/cjs/plugin.js

@@ -194,9 +194,10 @@ function ContentComponent(_ref5) {
     providerFactory = _ref5.providerFactory,
     dispatchAnalyticsEvent = _ref5.dispatchAnalyticsEvent;
   var featureFlags = (pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.featureFlags) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.sharedState.currentState()) || {};
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['floatingToolbar', 'editorDisabled']),
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['floatingToolbar', 'editorDisabled', 'editorViewMode']),
     floatingToolbarState = _useSharedPluginState.floatingToolbarState,
-    editorDisabledState = _useSharedPluginState.editorDisabledState;
+    editorDisabledState = _useSharedPluginState.editorDisabledState,
+    editorViewModeState = _useSharedPluginState.editorViewModeState;
   var _ref6 = floatingToolbarState !== null && floatingToolbarState !== void 0 ? floatingToolbarState : {},
     configWithNodeInfo = _ref6.configWithNodeInfo,
     floatingToolbarData = _ref6.floatingToolbarData;
@@ -232,7 +233,9 @@ function ContentComponent(_ref5) {
     _config$mediaAssistiv = config.mediaAssistiveMessage,
     mediaAssistiveMessage = _config$mediaAssistiv === void 0 ? '' : _config$mediaAssistiv;
   var targetRef = getDomRef(editorView, dispatchAnalyticsEvent);
-  if (!targetRef || editorDisabledState && editorDisabledState.editorDisabled) {
+  var isEditorDisabled = editorDisabledState && editorDisabledState.editorDisabled;
+  var isInViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  if (!targetRef || isEditorDisabled && !isInViewMode) {
     return null;
   }
   var customPositionCalculation;

package/dist/cjs/ui/Toolbar.js

@@ -175,6 +175,7 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
           return (0, _react2.jsx)(_uiMenu.ColorPickerButton, {
             skipFocusButtonAfterPick: true,
             key: idx,
+            isAriaExpanded: item.isAriaExpanded,
             title: item.title,
             onChange: function onChange(selected) {
               dispatchCommand(item.onChange(selected));

package/dist/es2019/plugin.js

@@ -184,8 +184,9 @@ function ContentComponent({
   const featureFlags = (pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f = pluginInjectionApi.featureFlags) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.sharedState.currentState()) || {};
   const {
     floatingToolbarState,
-    editorDisabledState
-  } = useSharedPluginState(pluginInjectionApi, ['floatingToolbar', 'editorDisabled']);
+    editorDisabledState,
+    editorViewModeState
+  } = useSharedPluginState(pluginInjectionApi, ['floatingToolbar', 'editorDisabled', 'editorViewMode']);
   const {
     configWithNodeInfo,
     floatingToolbarData
@@ -220,7 +221,9 @@ function ContentComponent({
     mediaAssistiveMessage = ''
   } = config;
   const targetRef = getDomRef(editorView, dispatchAnalyticsEvent);
-  if (!targetRef || editorDisabledState && editorDisabledState.editorDisabled) {
+  const isEditorDisabled = editorDisabledState && editorDisabledState.editorDisabled;
+  const isInViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  if (!targetRef || isEditorDisabled && !isInViewMode) {
     return null;
   }
   let customPositionCalculation;

package/dist/es2019/ui/Toolbar.js

@@ -141,6 +141,7 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
           return jsx(ColorPickerButton, {
             skipFocusButtonAfterPick: true,
             key: idx,
+            isAriaExpanded: item.isAriaExpanded,
             title: item.title,
             onChange: selected => {
               dispatchCommand(item.onChange(selected));

package/dist/esm/plugin.js

@@ -185,9 +185,10 @@ function ContentComponent(_ref5) {
     providerFactory = _ref5.providerFactory,
     dispatchAnalyticsEvent = _ref5.dispatchAnalyticsEvent;
   var featureFlags = (pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.featureFlags) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.sharedState.currentState()) || {};
-  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['floatingToolbar', 'editorDisabled']),
+  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['floatingToolbar', 'editorDisabled', 'editorViewMode']),
     floatingToolbarState = _useSharedPluginState.floatingToolbarState,
-    editorDisabledState = _useSharedPluginState.editorDisabledState;
+    editorDisabledState = _useSharedPluginState.editorDisabledState,
+    editorViewModeState = _useSharedPluginState.editorViewModeState;
   var _ref6 = floatingToolbarState !== null && floatingToolbarState !== void 0 ? floatingToolbarState : {},
     configWithNodeInfo = _ref6.configWithNodeInfo,
     floatingToolbarData = _ref6.floatingToolbarData;
@@ -223,7 +224,9 @@ function ContentComponent(_ref5) {
     _config$mediaAssistiv = config.mediaAssistiveMessage,
     mediaAssistiveMessage = _config$mediaAssistiv === void 0 ? '' : _config$mediaAssistiv;
   var targetRef = getDomRef(editorView, dispatchAnalyticsEvent);
-  if (!targetRef || editorDisabledState && editorDisabledState.editorDisabled) {
+  var isEditorDisabled = editorDisabledState && editorDisabledState.editorDisabled;
+  var isInViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  if (!targetRef || isEditorDisabled && !isInViewMode) {
     return null;
   }
   var customPositionCalculation;

package/dist/esm/ui/Toolbar.js

@@ -166,6 +166,7 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
           return jsx(ColorPickerButton, {
             skipFocusButtonAfterPick: true,
             key: idx,
+            isAriaExpanded: item.isAriaExpanded,
             title: item.title,
             onChange: function onChange(selected) {
               dispatchCommand(item.onChange(selected));

package/dist/types/types.d.ts

@@ -3,6 +3,7 @@ import type { ContextPanelPlugin } from '@atlaskit/editor-plugin-context-panel';
 import type { CopyButtonPlugin } from '@atlaskit/editor-plugin-copy-button';
 import type { DecorationsPlugin } from '@atlaskit/editor-plugin-decorations';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
 import type { ExtensionPlugin } from '@atlaskit/editor-plugin-extension';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { Node } from '@atlaskit/editor-prosemirror/model';
@@ -30,7 +31,8 @@ export type FloatingToolbarPlugin = NextEditorPlugin<'floatingToolbar', {
         OptionalPlugin<ContextPanelPlugin>,
         OptionalPlugin<ExtensionPlugin>,
         CopyButtonPlugin,
-        EditorDisabledPlugin
+        EditorDisabledPlugin,
+        OptionalPlugin<EditorViewModePlugin>
     ];
     actions: {
         forceFocusSelector: ForceFocusSelector;

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

@@ -3,6 +3,7 @@ import type { ContextPanelPlugin } from '@atlaskit/editor-plugin-context-panel';
 import type { CopyButtonPlugin } from '@atlaskit/editor-plugin-copy-button';
 import type { DecorationsPlugin } from '@atlaskit/editor-plugin-decorations';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
 import type { ExtensionPlugin } from '@atlaskit/editor-plugin-extension';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { Node } from '@atlaskit/editor-prosemirror/model';
@@ -30,7 +31,8 @@ export type FloatingToolbarPlugin = NextEditorPlugin<'floatingToolbar', {
         OptionalPlugin<ContextPanelPlugin>,
         OptionalPlugin<ExtensionPlugin>,
         CopyButtonPlugin,
-        EditorDisabledPlugin
+        EditorDisabledPlugin,
+        OptionalPlugin<EditorViewModePlugin>
     ];
     actions: {
         forceFocusSelector: ForceFocusSelector;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-floating-toolbar",
-  "version": "0.7.28",
+  "version": "0.8.0",
   "description": "Floating toolbar plugin for @atlaskit/editor-core",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -34,6 +34,7 @@
     "@atlaskit/editor-plugin-copy-button": "^1.0.0",
     "@atlaskit/editor-plugin-decorations": "^0.2.0",
     "@atlaskit/editor-plugin-editor-disabled": "^0.2.0",
+    "@atlaskit/editor-plugin-editor-viewmode": "^0.1.0",
     "@atlaskit/editor-plugin-extension": "^0.6.0",
     "@atlaskit/editor-plugin-feature-flags": "^1.0.0",
     "@atlaskit/editor-plugin-table": "^7.0.0",