@atlaskit/editor-plugin-layout 2.7.1 → 2.7.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/editor-plugin-layout
2
2
 
3
+ ## 2.7.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [#153256](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/153256)
8
+ [`3644fbe36073d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3644fbe36073d) -
9
+ [ux] When ViewAll dropdown closes via ESC key press or submenus close via ESC or Enter, the focus
10
+ is set on ViewAll button.
11
+ - [#152768](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/152768)
12
+ [`2e80bc703b181`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2e80bc703b181) -
13
+ [ED-27555] Migrate to useSharedPluginStateSelector for insert-block, layout, loom plugins
14
+ - Updated dependencies
15
+
16
+ ## 2.7.2
17
+
18
+ ### Patch Changes
19
+
20
+ - Updated dependencies
21
+
3
22
  ## 2.7.1
4
23
 
5
24
  ### Patch Changes
@@ -15,6 +15,7 @@ var _react = _interopRequireWildcard(require("react"));
15
15
  var _hooks = require("@atlaskit/editor-common/hooks");
16
16
  var _reactNodeView = _interopRequireDefault(require("@atlaskit/editor-common/react-node-view"));
17
17
  var _resizer = require("@atlaskit/editor-common/resizer");
18
+ var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
18
19
  var _model = require("@atlaskit/editor-prosemirror/model");
19
20
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
20
21
  var _utils = require("../pm-plugins/utils");
@@ -46,6 +47,18 @@ var isEmptyLayout = function isEmptyLayout(node) {
46
47
  });
47
48
  return isEmpty;
48
49
  };
50
+ var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
51
+ var editorDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'editorDisabled.editorDisabled');
52
+ return {
53
+ editorDisabled: editorDisabled
54
+ };
55
+ }, function (api) {
56
+ var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['editorDisabled']),
57
+ editorDisabledState = _useSharedPluginState.editorDisabledState;
58
+ return {
59
+ editorDisabled: editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled
60
+ };
61
+ });
49
62
  var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
50
63
  var _pluginInjectionApi$a;
51
64
  var pluginInjectionApi = _ref.pluginInjectionApi,
@@ -53,8 +66,8 @@ var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
53
66
  getPos = _ref.getPos,
54
67
  view = _ref.view,
55
68
  parentRef = _ref.parentRef;
56
- var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['editorDisabled']),
57
- editorDisabledState = _useSharedPluginState.editorDisabledState;
69
+ var _useSharedState = useSharedState(pluginInjectionApi),
70
+ editorDisabled = _useSharedState.editorDisabled;
58
71
  var getEditorWidth = function getEditorWidth() {
59
72
  var _pluginInjectionApi$w;
60
73
  return pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$w = pluginInjectionApi.width) === null || _pluginInjectionApi$w === void 0 ? void 0 : _pluginInjectionApi$w.sharedState.currentState();
@@ -86,7 +99,7 @@ var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
86
99
  editorView: view,
87
100
  nodeType: "layoutSection",
88
101
  getEditorWidth: getEditorWidth,
89
- disabled: (editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled) === true || !isBreakoutAvailable(view.state.schema),
102
+ disabled: editorDisabled === true || !isBreakoutAvailable(view.state.schema),
90
103
  parentRef: parentRef,
91
104
  editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
92
105
  displayGuidelines: (0, _experiments.editorExperiment)('single_column_layouts', true) ? displayGuidelines : undefined,
@@ -21,6 +21,7 @@ var _layoutThreeColumnsSidebarsEditorLayoutThreeWithSidebars = _interopRequireDe
21
21
  var _layoutTwoColumnsEditorLayoutTwoEqual = _interopRequireDefault(require("@atlaskit/icon/core/migration/layout-two-columns--editor-layout-two-equal"));
22
22
  var _layoutTwoColumnsSidebarLeftEditorLayoutTwoLeftSidebar = _interopRequireDefault(require("@atlaskit/icon/core/migration/layout-two-columns-sidebar-left--editor-layout-two-left-sidebar"));
23
23
  var _layoutTwoColumnsSidebarRightEditorLayoutTwoRightSidebar = _interopRequireDefault(require("@atlaskit/icon/core/migration/layout-two-columns-sidebar-right--editor-layout-two-right-sidebar"));
24
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
24
25
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
25
26
  var _actions = require("../pm-plugins/actions");
26
27
  var _LayoutThreeWithLeftSidebars = require("./icons/LayoutThreeWithLeftSidebars");
@@ -235,8 +236,12 @@ var buildToolbar = exports.buildToolbar = function buildToolbar(state, intl, pos
235
236
  onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className)
236
237
  };
237
238
  };
239
+ // testId is required to show focus on trigger button on ESC key press
240
+ // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
241
+ var testId = (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_8') ? 'layout-overflow-dropdown-trigger' : undefined;
238
242
  var overflowMenu = {
239
243
  type: 'overflow-dropdown',
244
+ testId: testId,
240
245
  options: [_objectSpread({
241
246
  title: intl.formatMessage(_messages.default.copyToClipboard),
242
247
  onClick: function onClick() {
@@ -1,7 +1,8 @@
1
1
  import React, { useCallback } from 'react';
2
- import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
2
+ import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
3
3
  import ReactNodeView from '@atlaskit/editor-common/react-node-view';
4
4
  import { BreakoutResizer, ignoreResizerMutations } from '@atlaskit/editor-common/resizer';
5
+ import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
5
6
  import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
6
7
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
7
8
  import { selectIntoLayout } from '../pm-plugins/utils';
@@ -29,6 +30,19 @@ const isEmptyLayout = node => {
29
30
  });
30
31
  return isEmpty;
31
32
  };
33
+ const useSharedState = sharedPluginStateHookMigratorFactory(api => {
34
+ const editorDisabled = useSharedPluginStateSelector(api, 'editorDisabled.editorDisabled');
35
+ return {
36
+ editorDisabled
37
+ };
38
+ }, api => {
39
+ const {
40
+ editorDisabledState
41
+ } = useSharedPluginState(api, ['editorDisabled']);
42
+ return {
43
+ editorDisabled: editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled
44
+ };
45
+ });
32
46
  const LayoutBreakoutResizer = ({
33
47
  pluginInjectionApi,
34
48
  forwardRef,
@@ -38,8 +52,8 @@ const LayoutBreakoutResizer = ({
38
52
  }) => {
39
53
  var _pluginInjectionApi$a;
40
54
  const {
41
- editorDisabledState
42
- } = useSharedPluginState(pluginInjectionApi, ['editorDisabled']);
55
+ editorDisabled
56
+ } = useSharedState(pluginInjectionApi);
43
57
  const getEditorWidth = () => {
44
58
  var _pluginInjectionApi$w;
45
59
  return pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$w = pluginInjectionApi.width) === null || _pluginInjectionApi$w === void 0 ? void 0 : _pluginInjectionApi$w.sharedState.currentState();
@@ -71,7 +85,7 @@ const LayoutBreakoutResizer = ({
71
85
  editorView: view,
72
86
  nodeType: "layoutSection",
73
87
  getEditorWidth: getEditorWidth,
74
- disabled: (editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled) === true || !isBreakoutAvailable(view.state.schema),
88
+ disabled: editorDisabled === true || !isBreakoutAvailable(view.state.schema),
75
89
  parentRef: parentRef,
76
90
  editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
77
91
  displayGuidelines: editorExperiment('single_column_layouts', true) ? displayGuidelines : undefined,
@@ -11,6 +11,7 @@ import LayoutThreeColumnsSidebarsIcon from '@atlaskit/icon/core/migration/layout
11
11
  import LayoutTwoColumnsIcon from '@atlaskit/icon/core/migration/layout-two-columns--editor-layout-two-equal';
12
12
  import LayoutTwoColumnsSidebarLeftIcon from '@atlaskit/icon/core/migration/layout-two-columns-sidebar-left--editor-layout-two-left-sidebar';
13
13
  import LayoutTwoColumnsSidebarRightIcon from '@atlaskit/icon/core/migration/layout-two-columns-sidebar-right--editor-layout-two-right-sidebar';
14
+ import { fg } from '@atlaskit/platform-feature-flags';
14
15
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
15
16
  import { deleteActiveLayoutNode, getPresetLayout, setPresetLayout } from '../pm-plugins/actions';
16
17
  import { LayoutThreeWithLeftSidebarsIcon } from './icons/LayoutThreeWithLeftSidebars';
@@ -217,8 +218,12 @@ export const buildToolbar = (state, intl, pos, _allowBreakout, addSidebarLayouts
217
218
  onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true, className),
218
219
  onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className)
219
220
  });
221
+ // testId is required to show focus on trigger button on ESC key press
222
+ // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
223
+ const testId = fg('platform_editor_controls_patch_8') ? 'layout-overflow-dropdown-trigger' : undefined;
220
224
  const overflowMenu = {
221
225
  type: 'overflow-dropdown',
226
+ testId,
222
227
  options: [{
223
228
  title: intl.formatMessage(commonMessages.copyToClipboard),
224
229
  onClick: () => {
@@ -6,9 +6,10 @@ import _inherits from "@babel/runtime/helpers/inherits";
6
6
  function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
7
7
  function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
8
8
  import React, { useCallback } from 'react';
9
- import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
9
+ import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
10
10
  import ReactNodeView from '@atlaskit/editor-common/react-node-view';
11
11
  import { BreakoutResizer, ignoreResizerMutations } from '@atlaskit/editor-common/resizer';
12
+ import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
12
13
  import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
13
14
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
14
15
  import { selectIntoLayout } from '../pm-plugins/utils';
@@ -36,6 +37,18 @@ var isEmptyLayout = function isEmptyLayout(node) {
36
37
  });
37
38
  return isEmpty;
38
39
  };
40
+ var useSharedState = sharedPluginStateHookMigratorFactory(function (api) {
41
+ var editorDisabled = useSharedPluginStateSelector(api, 'editorDisabled.editorDisabled');
42
+ return {
43
+ editorDisabled: editorDisabled
44
+ };
45
+ }, function (api) {
46
+ var _useSharedPluginState = useSharedPluginState(api, ['editorDisabled']),
47
+ editorDisabledState = _useSharedPluginState.editorDisabledState;
48
+ return {
49
+ editorDisabled: editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled
50
+ };
51
+ });
39
52
  var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
40
53
  var _pluginInjectionApi$a;
41
54
  var pluginInjectionApi = _ref.pluginInjectionApi,
@@ -43,8 +56,8 @@ var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
43
56
  getPos = _ref.getPos,
44
57
  view = _ref.view,
45
58
  parentRef = _ref.parentRef;
46
- var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['editorDisabled']),
47
- editorDisabledState = _useSharedPluginState.editorDisabledState;
59
+ var _useSharedState = useSharedState(pluginInjectionApi),
60
+ editorDisabled = _useSharedState.editorDisabled;
48
61
  var getEditorWidth = function getEditorWidth() {
49
62
  var _pluginInjectionApi$w;
50
63
  return pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$w = pluginInjectionApi.width) === null || _pluginInjectionApi$w === void 0 ? void 0 : _pluginInjectionApi$w.sharedState.currentState();
@@ -76,7 +89,7 @@ var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
76
89
  editorView: view,
77
90
  nodeType: "layoutSection",
78
91
  getEditorWidth: getEditorWidth,
79
- disabled: (editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled) === true || !isBreakoutAvailable(view.state.schema),
92
+ disabled: editorDisabled === true || !isBreakoutAvailable(view.state.schema),
80
93
  parentRef: parentRef,
81
94
  editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
82
95
  displayGuidelines: editorExperiment('single_column_layouts', true) ? displayGuidelines : undefined,
@@ -15,6 +15,7 @@ import LayoutThreeColumnsSidebarsIcon from '@atlaskit/icon/core/migration/layout
15
15
  import LayoutTwoColumnsIcon from '@atlaskit/icon/core/migration/layout-two-columns--editor-layout-two-equal';
16
16
  import LayoutTwoColumnsSidebarLeftIcon from '@atlaskit/icon/core/migration/layout-two-columns-sidebar-left--editor-layout-two-left-sidebar';
17
17
  import LayoutTwoColumnsSidebarRightIcon from '@atlaskit/icon/core/migration/layout-two-columns-sidebar-right--editor-layout-two-right-sidebar';
18
+ import { fg } from '@atlaskit/platform-feature-flags';
18
19
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
19
20
  import { deleteActiveLayoutNode, getPresetLayout, setPresetLayout } from '../pm-plugins/actions';
20
21
  import { LayoutThreeWithLeftSidebarsIcon } from './icons/LayoutThreeWithLeftSidebars';
@@ -225,8 +226,12 @@ export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout
225
226
  onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className)
226
227
  };
227
228
  };
229
+ // testId is required to show focus on trigger button on ESC key press
230
+ // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
231
+ var testId = fg('platform_editor_controls_patch_8') ? 'layout-overflow-dropdown-trigger' : undefined;
228
232
  var overflowMenu = {
229
233
  type: 'overflow-dropdown',
234
+ testId: testId,
230
235
  options: [_objectSpread({
231
236
  title: intl.formatMessage(commonMessages.copyToClipboard),
232
237
  onClick: function onClick() {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-layout",
3
- "version": "2.7.1",
3
+ "version": "2.7.3",
4
4
  "description": "Layout plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -34,7 +34,7 @@
34
34
  },
35
35
  "dependencies": {
36
36
  "@atlaskit/adf-schema": "^47.6.0",
37
- "@atlaskit/editor-common": "^104.0.0",
37
+ "@atlaskit/editor-common": "^105.0.0",
38
38
  "@atlaskit/editor-plugin-analytics": "^2.2.0",
39
39
  "@atlaskit/editor-plugin-decorations": "^2.0.0",
40
40
  "@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
@@ -43,9 +43,9 @@
43
43
  "@atlaskit/editor-plugin-width": "^3.0.0",
44
44
  "@atlaskit/editor-prosemirror": "7.0.0",
45
45
  "@atlaskit/editor-shared-styles": "^3.4.0",
46
- "@atlaskit/icon": "^25.6.0",
46
+ "@atlaskit/icon": "^26.0.0",
47
47
  "@atlaskit/platform-feature-flags": "^1.1.0",
48
- "@atlaskit/tmp-editor-statsig": "^4.16.0",
48
+ "@atlaskit/tmp-editor-statsig": "^4.19.0",
49
49
  "@atlaskit/tokens": "^4.8.0",
50
50
  "@babel/runtime": "^7.0.0",
51
51
  "@emotion/react": "^11.7.1"
@@ -110,6 +110,9 @@
110
110
  },
111
111
  "platform_editor_controls_patch_analytics_2": {
112
112
  "type": "boolean"
113
+ },
114
+ "platform_editor_controls_patch_8": {
115
+ "type": "boolean"
113
116
  }
114
117
  }
115
118
  }