@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 +19 -0
- package/dist/cjs/nodeviews/index.js +16 -3
- package/dist/cjs/ui/toolbar.js +5 -0
- package/dist/es2019/nodeviews/index.js +18 -4
- package/dist/es2019/ui/toolbar.js +5 -0
- package/dist/esm/nodeviews/index.js +17 -4
- package/dist/esm/ui/toolbar.js +5 -0
- package/package.json +7 -4
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
|
|
57
|
-
|
|
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:
|
|
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,
|
package/dist/cjs/ui/toolbar.js
CHANGED
|
@@ -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
|
-
|
|
42
|
-
} =
|
|
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:
|
|
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
|
|
47
|
-
|
|
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:
|
|
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,
|
package/dist/esm/ui/toolbar.js
CHANGED
|
@@ -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.
|
|
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": "^
|
|
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": "^
|
|
46
|
+
"@atlaskit/icon": "^26.0.0",
|
|
47
47
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
48
|
-
"@atlaskit/tmp-editor-statsig": "^4.
|
|
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
|
}
|