@atlaskit/editor-plugin-toolbar-lists-indentation 3.2.4 → 3.2.6
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/pm-plugins/indentation-buttons.js +1 -1
- package/dist/cjs/toolbarListsIndentationPlugin.js +53 -22
- package/dist/cjs/ui/FloatingToolbarComponent.js +51 -22
- package/dist/es2019/pm-plugins/indentation-buttons.js +1 -1
- package/dist/es2019/toolbarListsIndentationPlugin.js +55 -23
- package/dist/es2019/ui/FloatingToolbarComponent.js +53 -23
- package/dist/esm/pm-plugins/indentation-buttons.js +1 -1
- package/dist/esm/toolbarListsIndentationPlugin.js +54 -23
- package/dist/esm/ui/FloatingToolbarComponent.js +52 -23
- package/dist/types/pm-plugins/indentation-buttons.d.ts +3 -3
- package/dist/types-ts4.5/pm-plugins/indentation-buttons.d.ts +3 -3
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,24 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-toolbar-lists-indentation
|
|
2
2
|
|
|
3
|
+
## 3.2.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#160568](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/160568)
|
|
8
|
+
[`d0ada9a83d2ed`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d0ada9a83d2ed) -
|
|
9
|
+
Re-render PrimaryToolbarComponent when decorationSet changes so the toolbar states updates
|
|
10
|
+
regularly
|
|
11
|
+
- Updated dependencies
|
|
12
|
+
|
|
13
|
+
## 3.2.5
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- [#154149](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/154149)
|
|
18
|
+
[`4b955e247c793`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4b955e247c793) -
|
|
19
|
+
[ED-27560] Migrate to useSharedPluginStateSelector for text color, toolbar lists indentation,
|
|
20
|
+
type-ahead, undo-redo plugins
|
|
21
|
+
|
|
3
22
|
## 3.2.4
|
|
4
23
|
|
|
5
24
|
### Patch Changes
|
|
@@ -45,7 +45,7 @@ function getIndentationButtonsState(editorState, allowHeadingAndParagraphIndenta
|
|
|
45
45
|
var isInLayoutNode = (0, _utils.hasParentNodeOfType)(editorState.schema.nodes.layoutColumn)(selection) &&
|
|
46
46
|
// depth of non-nested paragraphs and headings in layouts will always be 3
|
|
47
47
|
selection.$from.depth === 3;
|
|
48
|
-
if (allowHeadingAndParagraphIndentation && ((_indentationState$isI = indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed) !== null && _indentationState$isI !== void 0 ? _indentationState$isI : false) && (isTopLevelParagraphOrHeading || isInLayoutNode) && indentationState) {
|
|
48
|
+
if (allowHeadingAndParagraphIndentation && ((_indentationState$isI = indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed) !== null && _indentationState$isI !== void 0 ? _indentationState$isI : false) && (isTopLevelParagraphOrHeading || isInLayoutNode) && (indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled) !== undefined && (indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled) !== undefined) {
|
|
49
49
|
return {
|
|
50
50
|
indentDisabled: indentationState.indentDisabled,
|
|
51
51
|
outdentDisabled: indentationState.outdentDisabled,
|
|
@@ -12,6 +12,7 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
12
12
|
var _hooks = require("@atlaskit/editor-common/hooks");
|
|
13
13
|
var _types = require("@atlaskit/editor-common/types");
|
|
14
14
|
var _usePluginStateEffect = require("@atlaskit/editor-common/use-plugin-state-effect");
|
|
15
|
+
var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
|
|
15
16
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
16
17
|
var _indentationButtons = require("./pm-plugins/indentation-buttons");
|
|
17
18
|
var _types2 = require("./types");
|
|
@@ -93,6 +94,39 @@ var toolbarListsIndentationPlugin = exports.toolbarListsIndentationPlugin = func
|
|
|
93
94
|
primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined
|
|
94
95
|
};
|
|
95
96
|
};
|
|
97
|
+
var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
|
|
98
|
+
var bulletListActive = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.bulletListActive');
|
|
99
|
+
var bulletListDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.bulletListDisabled');
|
|
100
|
+
var orderedListActive = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.orderedListActive');
|
|
101
|
+
var orderedListDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.orderedListDisabled');
|
|
102
|
+
var isIndentationAllowed = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'indentation.isIndentationAllowed');
|
|
103
|
+
var indentDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'indentation.indentDisabled');
|
|
104
|
+
var outdentDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'indentation.outdentDisabled');
|
|
105
|
+
// decorationSet is required to re-render PrimaryToolbarComponent component, so that the toolbar states updates regularly
|
|
106
|
+
(0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.decorationSet');
|
|
107
|
+
return {
|
|
108
|
+
bulletListActive: bulletListActive,
|
|
109
|
+
bulletListDisabled: bulletListDisabled,
|
|
110
|
+
orderedListActive: orderedListActive,
|
|
111
|
+
orderedListDisabled: orderedListDisabled,
|
|
112
|
+
isIndentationAllowed: isIndentationAllowed,
|
|
113
|
+
indentDisabled: indentDisabled,
|
|
114
|
+
outdentDisabled: outdentDisabled
|
|
115
|
+
};
|
|
116
|
+
}, function (api) {
|
|
117
|
+
var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['list', 'indentation']),
|
|
118
|
+
listState = _useSharedPluginState.listState,
|
|
119
|
+
indentationState = _useSharedPluginState.indentationState;
|
|
120
|
+
return {
|
|
121
|
+
bulletListActive: listState === null || listState === void 0 ? void 0 : listState.bulletListActive,
|
|
122
|
+
bulletListDisabled: listState === null || listState === void 0 ? void 0 : listState.bulletListDisabled,
|
|
123
|
+
orderedListActive: listState === null || listState === void 0 ? void 0 : listState.orderedListActive,
|
|
124
|
+
orderedListDisabled: listState === null || listState === void 0 ? void 0 : listState.orderedListDisabled,
|
|
125
|
+
isIndentationAllowed: indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed,
|
|
126
|
+
indentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled,
|
|
127
|
+
outdentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled
|
|
128
|
+
};
|
|
129
|
+
});
|
|
96
130
|
function PrimaryToolbarComponent(_ref4) {
|
|
97
131
|
var _pluginInjectionApi$l;
|
|
98
132
|
var featureFlags = _ref4.featureFlags,
|
|
@@ -106,9 +140,14 @@ function PrimaryToolbarComponent(_ref4) {
|
|
|
106
140
|
showIndentationButtons = _ref4.showIndentationButtons,
|
|
107
141
|
pluginInjectionApi = _ref4.pluginInjectionApi,
|
|
108
142
|
allowHeadingAndParagraphIndentation = _ref4.allowHeadingAndParagraphIndentation;
|
|
109
|
-
var
|
|
110
|
-
|
|
111
|
-
|
|
143
|
+
var _useSharedState = useSharedState(pluginInjectionApi),
|
|
144
|
+
bulletListActive = _useSharedState.bulletListActive,
|
|
145
|
+
bulletListDisabled = _useSharedState.bulletListDisabled,
|
|
146
|
+
orderedListActive = _useSharedState.orderedListActive,
|
|
147
|
+
orderedListDisabled = _useSharedState.orderedListDisabled,
|
|
148
|
+
isIndentationAllowed = _useSharedState.isIndentationAllowed,
|
|
149
|
+
indentDisabled = _useSharedState.indentDisabled,
|
|
150
|
+
outdentDisabled = _useSharedState.outdentDisabled;
|
|
112
151
|
var _useState = (0, _react.useState)(),
|
|
113
152
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
114
153
|
taskDecisionState = _useState2[0],
|
|
@@ -123,8 +162,12 @@ function PrimaryToolbarComponent(_ref4) {
|
|
|
123
162
|
});
|
|
124
163
|
}
|
|
125
164
|
});
|
|
126
|
-
var toolbarListsIndentationState = (0, _indentationButtons.getIndentationButtonsState)(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState,
|
|
127
|
-
|
|
165
|
+
var toolbarListsIndentationState = (0, _indentationButtons.getIndentationButtonsState)(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState, {
|
|
166
|
+
isIndentationAllowed: isIndentationAllowed,
|
|
167
|
+
indentDisabled: indentDisabled,
|
|
168
|
+
outdentDisabled: outdentDisabled
|
|
169
|
+
}, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.list) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.isInsideListItem);
|
|
170
|
+
if (bulletListActive === undefined || bulletListDisabled === undefined || orderedListActive === undefined || orderedListDisabled === undefined) {
|
|
128
171
|
return null;
|
|
129
172
|
}
|
|
130
173
|
return /*#__PURE__*/_react.default.createElement(_ui.default, {
|
|
@@ -135,23 +178,11 @@ function PrimaryToolbarComponent(_ref4) {
|
|
|
135
178
|
editorView: editorView,
|
|
136
179
|
popupsMountPoint: popupsMountPoint,
|
|
137
180
|
popupsBoundariesElement: popupsBoundariesElement,
|
|
138
|
-
popupsScrollableElement: popupsScrollableElement
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
,
|
|
142
|
-
|
|
143
|
-
// Ignored via go/ees005
|
|
144
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
145
|
-
,
|
|
146
|
-
bulletListDisabled: listState.bulletListDisabled
|
|
147
|
-
// Ignored via go/ees005
|
|
148
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
149
|
-
,
|
|
150
|
-
orderedListActive: listState.orderedListActive
|
|
151
|
-
// Ignored via go/ees005
|
|
152
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
153
|
-
,
|
|
154
|
-
orderedListDisabled: listState.orderedListDisabled,
|
|
181
|
+
popupsScrollableElement: popupsScrollableElement,
|
|
182
|
+
bulletListActive: bulletListActive,
|
|
183
|
+
bulletListDisabled: bulletListDisabled,
|
|
184
|
+
orderedListActive: orderedListActive,
|
|
185
|
+
orderedListDisabled: orderedListDisabled,
|
|
155
186
|
showIndentationButtons: !!showIndentationButtons
|
|
156
187
|
// Ignored via go/ees005
|
|
157
188
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
@@ -10,6 +10,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
11
|
var _hooks = require("@atlaskit/editor-common/hooks");
|
|
12
12
|
var _usePluginStateEffect = require("@atlaskit/editor-common/use-plugin-state-effect");
|
|
13
|
+
var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
|
|
13
14
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
14
15
|
var _indentationButtons = require("../pm-plugins/indentation-buttons");
|
|
15
16
|
var _types = require("../types");
|
|
@@ -21,6 +22,37 @@ var FloatingToolbarSettings = {
|
|
|
21
22
|
isToolbarReducedSpacing: true,
|
|
22
23
|
isSmall: true
|
|
23
24
|
};
|
|
25
|
+
var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
|
|
26
|
+
var bulletListActive = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.bulletListActive');
|
|
27
|
+
var bulletListDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.bulletListDisabled');
|
|
28
|
+
var orderedListActive = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.orderedListActive');
|
|
29
|
+
var orderedListDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.orderedListDisabled');
|
|
30
|
+
var isIndentationAllowed = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'indentation.isIndentationAllowed');
|
|
31
|
+
var indentDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'indentation.indentDisabled');
|
|
32
|
+
var outdentDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'indentation.outdentDisabled');
|
|
33
|
+
return {
|
|
34
|
+
bulletListActive: bulletListActive,
|
|
35
|
+
bulletListDisabled: bulletListDisabled,
|
|
36
|
+
orderedListActive: orderedListActive,
|
|
37
|
+
orderedListDisabled: orderedListDisabled,
|
|
38
|
+
isIndentationAllowed: isIndentationAllowed,
|
|
39
|
+
indentDisabled: indentDisabled,
|
|
40
|
+
outdentDisabled: outdentDisabled
|
|
41
|
+
};
|
|
42
|
+
}, function (api) {
|
|
43
|
+
var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['list', 'indentation']),
|
|
44
|
+
listState = _useSharedPluginState.listState,
|
|
45
|
+
indentationState = _useSharedPluginState.indentationState;
|
|
46
|
+
return {
|
|
47
|
+
bulletListActive: listState === null || listState === void 0 ? void 0 : listState.bulletListActive,
|
|
48
|
+
bulletListDisabled: listState === null || listState === void 0 ? void 0 : listState.bulletListDisabled,
|
|
49
|
+
orderedListActive: listState === null || listState === void 0 ? void 0 : listState.orderedListActive,
|
|
50
|
+
orderedListDisabled: listState === null || listState === void 0 ? void 0 : listState.orderedListDisabled,
|
|
51
|
+
isIndentationAllowed: indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed,
|
|
52
|
+
indentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled,
|
|
53
|
+
outdentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled
|
|
54
|
+
};
|
|
55
|
+
});
|
|
24
56
|
function FloatingToolbarComponent(_ref) {
|
|
25
57
|
var _pluginInjectionApi$l;
|
|
26
58
|
var featureFlags = _ref.featureFlags,
|
|
@@ -28,9 +60,14 @@ function FloatingToolbarComponent(_ref) {
|
|
|
28
60
|
showIndentationButtons = _ref.showIndentationButtons,
|
|
29
61
|
pluginInjectionApi = _ref.pluginInjectionApi,
|
|
30
62
|
allowHeadingAndParagraphIndentation = _ref.allowHeadingAndParagraphIndentation;
|
|
31
|
-
var
|
|
32
|
-
|
|
33
|
-
|
|
63
|
+
var _useSharedState = useSharedState(pluginInjectionApi),
|
|
64
|
+
bulletListActive = _useSharedState.bulletListActive,
|
|
65
|
+
bulletListDisabled = _useSharedState.bulletListDisabled,
|
|
66
|
+
orderedListActive = _useSharedState.orderedListActive,
|
|
67
|
+
orderedListDisabled = _useSharedState.orderedListDisabled,
|
|
68
|
+
isIndentationAllowed = _useSharedState.isIndentationAllowed,
|
|
69
|
+
indentDisabled = _useSharedState.indentDisabled,
|
|
70
|
+
outdentDisabled = _useSharedState.outdentDisabled;
|
|
34
71
|
var _useState = (0, _react.useState)(),
|
|
35
72
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
36
73
|
taskDecisionState = _useState2[0],
|
|
@@ -45,8 +82,12 @@ function FloatingToolbarComponent(_ref) {
|
|
|
45
82
|
});
|
|
46
83
|
}
|
|
47
84
|
});
|
|
48
|
-
var toolbarListsIndentationState = (0, _indentationButtons.getIndentationButtonsState)(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState,
|
|
49
|
-
|
|
85
|
+
var toolbarListsIndentationState = (0, _indentationButtons.getIndentationButtonsState)(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState, {
|
|
86
|
+
isIndentationAllowed: isIndentationAllowed,
|
|
87
|
+
indentDisabled: indentDisabled,
|
|
88
|
+
outdentDisabled: outdentDisabled
|
|
89
|
+
}, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.list) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.isInsideListItem);
|
|
90
|
+
if (bulletListActive === undefined || bulletListDisabled === undefined || orderedListActive === undefined || orderedListDisabled === undefined) {
|
|
50
91
|
return null;
|
|
51
92
|
}
|
|
52
93
|
return /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
@@ -54,23 +95,11 @@ function FloatingToolbarComponent(_ref) {
|
|
|
54
95
|
isSmall: FloatingToolbarSettings.isSmall,
|
|
55
96
|
isReducedSpacing: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? false : FloatingToolbarSettings.isToolbarReducedSpacing,
|
|
56
97
|
disabled: FloatingToolbarSettings.disabled,
|
|
57
|
-
editorView: editorView
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
,
|
|
61
|
-
|
|
62
|
-
// Ignored via go/ees005
|
|
63
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
64
|
-
,
|
|
65
|
-
bulletListDisabled: listState.bulletListDisabled
|
|
66
|
-
// Ignored via go/ees005
|
|
67
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
68
|
-
,
|
|
69
|
-
orderedListActive: listState.orderedListActive
|
|
70
|
-
// Ignored via go/ees005
|
|
71
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
72
|
-
,
|
|
73
|
-
orderedListDisabled: listState.orderedListDisabled,
|
|
98
|
+
editorView: editorView,
|
|
99
|
+
bulletListActive: bulletListActive,
|
|
100
|
+
bulletListDisabled: bulletListDisabled,
|
|
101
|
+
orderedListActive: orderedListActive,
|
|
102
|
+
orderedListDisabled: orderedListDisabled,
|
|
74
103
|
showIndentationButtons: !!showIndentationButtons
|
|
75
104
|
// Ignored via go/ees005
|
|
76
105
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
@@ -42,7 +42,7 @@ export function getIndentationButtonsState(editorState, allowHeadingAndParagraph
|
|
|
42
42
|
const isInLayoutNode = hasParentNodeOfType(editorState.schema.nodes.layoutColumn)(selection) &&
|
|
43
43
|
// depth of non-nested paragraphs and headings in layouts will always be 3
|
|
44
44
|
selection.$from.depth === 3;
|
|
45
|
-
if (allowHeadingAndParagraphIndentation && ((_indentationState$isI = indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed) !== null && _indentationState$isI !== void 0 ? _indentationState$isI : false) && (isTopLevelParagraphOrHeading || isInLayoutNode) && indentationState) {
|
|
45
|
+
if (allowHeadingAndParagraphIndentation && ((_indentationState$isI = indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed) !== null && _indentationState$isI !== void 0 ? _indentationState$isI : false) && (isTopLevelParagraphOrHeading || isInLayoutNode) && (indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled) !== undefined && (indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled) !== undefined) {
|
|
46
46
|
return {
|
|
47
47
|
indentDisabled: indentationState.indentDisabled,
|
|
48
48
|
outdentDisabled: indentationState.outdentDisabled,
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import React, { useState } from 'react';
|
|
2
|
-
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
2
|
+
import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
|
|
3
3
|
import { ToolbarSize } from '@atlaskit/editor-common/types';
|
|
4
4
|
import { usePluginStateEffect } from '@atlaskit/editor-common/use-plugin-state-effect';
|
|
5
|
+
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
5
6
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
6
7
|
import { getIndentationButtonsState } from './pm-plugins/indentation-buttons';
|
|
7
8
|
import { ToolbarType } from './types';
|
|
@@ -82,6 +83,40 @@ export const toolbarListsIndentationPlugin = ({
|
|
|
82
83
|
primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined
|
|
83
84
|
};
|
|
84
85
|
};
|
|
86
|
+
const useSharedState = sharedPluginStateHookMigratorFactory(api => {
|
|
87
|
+
const bulletListActive = useSharedPluginStateSelector(api, 'list.bulletListActive');
|
|
88
|
+
const bulletListDisabled = useSharedPluginStateSelector(api, 'list.bulletListDisabled');
|
|
89
|
+
const orderedListActive = useSharedPluginStateSelector(api, 'list.orderedListActive');
|
|
90
|
+
const orderedListDisabled = useSharedPluginStateSelector(api, 'list.orderedListDisabled');
|
|
91
|
+
const isIndentationAllowed = useSharedPluginStateSelector(api, 'indentation.isIndentationAllowed');
|
|
92
|
+
const indentDisabled = useSharedPluginStateSelector(api, 'indentation.indentDisabled');
|
|
93
|
+
const outdentDisabled = useSharedPluginStateSelector(api, 'indentation.outdentDisabled');
|
|
94
|
+
// decorationSet is required to re-render PrimaryToolbarComponent component, so that the toolbar states updates regularly
|
|
95
|
+
useSharedPluginStateSelector(api, 'list.decorationSet');
|
|
96
|
+
return {
|
|
97
|
+
bulletListActive,
|
|
98
|
+
bulletListDisabled,
|
|
99
|
+
orderedListActive,
|
|
100
|
+
orderedListDisabled,
|
|
101
|
+
isIndentationAllowed,
|
|
102
|
+
indentDisabled,
|
|
103
|
+
outdentDisabled
|
|
104
|
+
};
|
|
105
|
+
}, api => {
|
|
106
|
+
const {
|
|
107
|
+
listState,
|
|
108
|
+
indentationState
|
|
109
|
+
} = useSharedPluginState(api, ['list', 'indentation']);
|
|
110
|
+
return {
|
|
111
|
+
bulletListActive: listState === null || listState === void 0 ? void 0 : listState.bulletListActive,
|
|
112
|
+
bulletListDisabled: listState === null || listState === void 0 ? void 0 : listState.bulletListDisabled,
|
|
113
|
+
orderedListActive: listState === null || listState === void 0 ? void 0 : listState.orderedListActive,
|
|
114
|
+
orderedListDisabled: listState === null || listState === void 0 ? void 0 : listState.orderedListDisabled,
|
|
115
|
+
isIndentationAllowed: indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed,
|
|
116
|
+
indentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled,
|
|
117
|
+
outdentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled
|
|
118
|
+
};
|
|
119
|
+
});
|
|
85
120
|
export function PrimaryToolbarComponent({
|
|
86
121
|
featureFlags,
|
|
87
122
|
popupsMountPoint,
|
|
@@ -97,9 +132,14 @@ export function PrimaryToolbarComponent({
|
|
|
97
132
|
}) {
|
|
98
133
|
var _pluginInjectionApi$l;
|
|
99
134
|
const {
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
135
|
+
bulletListActive,
|
|
136
|
+
bulletListDisabled,
|
|
137
|
+
orderedListActive,
|
|
138
|
+
orderedListDisabled,
|
|
139
|
+
isIndentationAllowed,
|
|
140
|
+
indentDisabled,
|
|
141
|
+
outdentDisabled
|
|
142
|
+
} = useSharedState(pluginInjectionApi);
|
|
103
143
|
const [taskDecisionState, setTaskDecisionState] = useState();
|
|
104
144
|
usePluginStateEffect(pluginInjectionApi, ['taskDecision'], ({
|
|
105
145
|
taskDecisionState: newTaskDecisionState
|
|
@@ -112,8 +152,12 @@ export function PrimaryToolbarComponent({
|
|
|
112
152
|
});
|
|
113
153
|
}
|
|
114
154
|
});
|
|
115
|
-
const toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState,
|
|
116
|
-
|
|
155
|
+
const toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState, {
|
|
156
|
+
isIndentationAllowed,
|
|
157
|
+
indentDisabled,
|
|
158
|
+
outdentDisabled
|
|
159
|
+
}, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$l = pluginInjectionApi.list) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.isInsideListItem);
|
|
160
|
+
if (bulletListActive === undefined || bulletListDisabled === undefined || orderedListActive === undefined || orderedListDisabled === undefined) {
|
|
117
161
|
return null;
|
|
118
162
|
}
|
|
119
163
|
return /*#__PURE__*/React.createElement(ToolbarListsIndentation, {
|
|
@@ -124,23 +168,11 @@ export function PrimaryToolbarComponent({
|
|
|
124
168
|
editorView: editorView,
|
|
125
169
|
popupsMountPoint: popupsMountPoint,
|
|
126
170
|
popupsBoundariesElement: popupsBoundariesElement,
|
|
127
|
-
popupsScrollableElement: popupsScrollableElement
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
,
|
|
131
|
-
|
|
132
|
-
// Ignored via go/ees005
|
|
133
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
134
|
-
,
|
|
135
|
-
bulletListDisabled: listState.bulletListDisabled
|
|
136
|
-
// Ignored via go/ees005
|
|
137
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
138
|
-
,
|
|
139
|
-
orderedListActive: listState.orderedListActive
|
|
140
|
-
// Ignored via go/ees005
|
|
141
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
142
|
-
,
|
|
143
|
-
orderedListDisabled: listState.orderedListDisabled,
|
|
171
|
+
popupsScrollableElement: popupsScrollableElement,
|
|
172
|
+
bulletListActive: bulletListActive,
|
|
173
|
+
bulletListDisabled: bulletListDisabled,
|
|
174
|
+
orderedListActive: orderedListActive,
|
|
175
|
+
orderedListDisabled: orderedListDisabled,
|
|
144
176
|
showIndentationButtons: !!showIndentationButtons
|
|
145
177
|
// Ignored via go/ees005
|
|
146
178
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React, { useState } from 'react';
|
|
2
|
-
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
2
|
+
import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
|
|
3
3
|
import { usePluginStateEffect } from '@atlaskit/editor-common/use-plugin-state-effect';
|
|
4
|
+
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
4
5
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
5
6
|
import { getIndentationButtonsState } from '../pm-plugins/indentation-buttons';
|
|
6
7
|
import { ToolbarType } from '../types';
|
|
@@ -10,6 +11,38 @@ const FloatingToolbarSettings = {
|
|
|
10
11
|
isToolbarReducedSpacing: true,
|
|
11
12
|
isSmall: true
|
|
12
13
|
};
|
|
14
|
+
const useSharedState = sharedPluginStateHookMigratorFactory(api => {
|
|
15
|
+
const bulletListActive = useSharedPluginStateSelector(api, 'list.bulletListActive');
|
|
16
|
+
const bulletListDisabled = useSharedPluginStateSelector(api, 'list.bulletListDisabled');
|
|
17
|
+
const orderedListActive = useSharedPluginStateSelector(api, 'list.orderedListActive');
|
|
18
|
+
const orderedListDisabled = useSharedPluginStateSelector(api, 'list.orderedListDisabled');
|
|
19
|
+
const isIndentationAllowed = useSharedPluginStateSelector(api, 'indentation.isIndentationAllowed');
|
|
20
|
+
const indentDisabled = useSharedPluginStateSelector(api, 'indentation.indentDisabled');
|
|
21
|
+
const outdentDisabled = useSharedPluginStateSelector(api, 'indentation.outdentDisabled');
|
|
22
|
+
return {
|
|
23
|
+
bulletListActive,
|
|
24
|
+
bulletListDisabled,
|
|
25
|
+
orderedListActive,
|
|
26
|
+
orderedListDisabled,
|
|
27
|
+
isIndentationAllowed,
|
|
28
|
+
indentDisabled,
|
|
29
|
+
outdentDisabled
|
|
30
|
+
};
|
|
31
|
+
}, api => {
|
|
32
|
+
const {
|
|
33
|
+
listState,
|
|
34
|
+
indentationState
|
|
35
|
+
} = useSharedPluginState(api, ['list', 'indentation']);
|
|
36
|
+
return {
|
|
37
|
+
bulletListActive: listState === null || listState === void 0 ? void 0 : listState.bulletListActive,
|
|
38
|
+
bulletListDisabled: listState === null || listState === void 0 ? void 0 : listState.bulletListDisabled,
|
|
39
|
+
orderedListActive: listState === null || listState === void 0 ? void 0 : listState.orderedListActive,
|
|
40
|
+
orderedListDisabled: listState === null || listState === void 0 ? void 0 : listState.orderedListDisabled,
|
|
41
|
+
isIndentationAllowed: indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed,
|
|
42
|
+
indentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled,
|
|
43
|
+
outdentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled
|
|
44
|
+
};
|
|
45
|
+
});
|
|
13
46
|
export function FloatingToolbarComponent({
|
|
14
47
|
featureFlags,
|
|
15
48
|
editorView,
|
|
@@ -19,9 +52,14 @@ export function FloatingToolbarComponent({
|
|
|
19
52
|
}) {
|
|
20
53
|
var _pluginInjectionApi$l;
|
|
21
54
|
const {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
55
|
+
bulletListActive,
|
|
56
|
+
bulletListDisabled,
|
|
57
|
+
orderedListActive,
|
|
58
|
+
orderedListDisabled,
|
|
59
|
+
isIndentationAllowed,
|
|
60
|
+
indentDisabled,
|
|
61
|
+
outdentDisabled
|
|
62
|
+
} = useSharedState(pluginInjectionApi);
|
|
25
63
|
const [taskDecisionState, setTaskDecisionState] = useState();
|
|
26
64
|
usePluginStateEffect(pluginInjectionApi, ['taskDecision'], ({
|
|
27
65
|
taskDecisionState: newTaskDecisionState
|
|
@@ -34,8 +72,12 @@ export function FloatingToolbarComponent({
|
|
|
34
72
|
});
|
|
35
73
|
}
|
|
36
74
|
});
|
|
37
|
-
const toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState,
|
|
38
|
-
|
|
75
|
+
const toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState, {
|
|
76
|
+
isIndentationAllowed,
|
|
77
|
+
indentDisabled,
|
|
78
|
+
outdentDisabled
|
|
79
|
+
}, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$l = pluginInjectionApi.list) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.isInsideListItem);
|
|
80
|
+
if (bulletListActive === undefined || bulletListDisabled === undefined || orderedListActive === undefined || orderedListDisabled === undefined) {
|
|
39
81
|
return null;
|
|
40
82
|
}
|
|
41
83
|
return /*#__PURE__*/React.createElement(ToolbarListsIndentation, {
|
|
@@ -43,23 +85,11 @@ export function FloatingToolbarComponent({
|
|
|
43
85
|
isSmall: FloatingToolbarSettings.isSmall,
|
|
44
86
|
isReducedSpacing: editorExperiment('platform_editor_controls', 'variant1') ? false : FloatingToolbarSettings.isToolbarReducedSpacing,
|
|
45
87
|
disabled: FloatingToolbarSettings.disabled,
|
|
46
|
-
editorView: editorView
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
,
|
|
50
|
-
|
|
51
|
-
// Ignored via go/ees005
|
|
52
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
53
|
-
,
|
|
54
|
-
bulletListDisabled: listState.bulletListDisabled
|
|
55
|
-
// Ignored via go/ees005
|
|
56
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
57
|
-
,
|
|
58
|
-
orderedListActive: listState.orderedListActive
|
|
59
|
-
// Ignored via go/ees005
|
|
60
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
61
|
-
,
|
|
62
|
-
orderedListDisabled: listState.orderedListDisabled,
|
|
88
|
+
editorView: editorView,
|
|
89
|
+
bulletListActive: bulletListActive,
|
|
90
|
+
bulletListDisabled: bulletListDisabled,
|
|
91
|
+
orderedListActive: orderedListActive,
|
|
92
|
+
orderedListDisabled: orderedListDisabled,
|
|
63
93
|
showIndentationButtons: !!showIndentationButtons
|
|
64
94
|
// Ignored via go/ees005
|
|
65
95
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
@@ -39,7 +39,7 @@ export function getIndentationButtonsState(editorState, allowHeadingAndParagraph
|
|
|
39
39
|
var isInLayoutNode = hasParentNodeOfType(editorState.schema.nodes.layoutColumn)(selection) &&
|
|
40
40
|
// depth of non-nested paragraphs and headings in layouts will always be 3
|
|
41
41
|
selection.$from.depth === 3;
|
|
42
|
-
if (allowHeadingAndParagraphIndentation && ((_indentationState$isI = indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed) !== null && _indentationState$isI !== void 0 ? _indentationState$isI : false) && (isTopLevelParagraphOrHeading || isInLayoutNode) && indentationState) {
|
|
42
|
+
if (allowHeadingAndParagraphIndentation && ((_indentationState$isI = indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed) !== null && _indentationState$isI !== void 0 ? _indentationState$isI : false) && (isTopLevelParagraphOrHeading || isInLayoutNode) && (indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled) !== undefined && (indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled) !== undefined) {
|
|
43
43
|
return {
|
|
44
44
|
indentDisabled: indentationState.indentDisabled,
|
|
45
45
|
outdentDisabled: indentationState.outdentDisabled,
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
2
|
import React, { useState } from 'react';
|
|
3
|
-
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
3
|
+
import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
|
|
4
4
|
import { ToolbarSize } from '@atlaskit/editor-common/types';
|
|
5
5
|
import { usePluginStateEffect } from '@atlaskit/editor-common/use-plugin-state-effect';
|
|
6
|
+
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
6
7
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
7
8
|
import { getIndentationButtonsState } from './pm-plugins/indentation-buttons';
|
|
8
9
|
import { ToolbarType } from './types';
|
|
@@ -82,6 +83,39 @@ export var toolbarListsIndentationPlugin = function toolbarListsIndentationPlugi
|
|
|
82
83
|
primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined
|
|
83
84
|
};
|
|
84
85
|
};
|
|
86
|
+
var useSharedState = sharedPluginStateHookMigratorFactory(function (api) {
|
|
87
|
+
var bulletListActive = useSharedPluginStateSelector(api, 'list.bulletListActive');
|
|
88
|
+
var bulletListDisabled = useSharedPluginStateSelector(api, 'list.bulletListDisabled');
|
|
89
|
+
var orderedListActive = useSharedPluginStateSelector(api, 'list.orderedListActive');
|
|
90
|
+
var orderedListDisabled = useSharedPluginStateSelector(api, 'list.orderedListDisabled');
|
|
91
|
+
var isIndentationAllowed = useSharedPluginStateSelector(api, 'indentation.isIndentationAllowed');
|
|
92
|
+
var indentDisabled = useSharedPluginStateSelector(api, 'indentation.indentDisabled');
|
|
93
|
+
var outdentDisabled = useSharedPluginStateSelector(api, 'indentation.outdentDisabled');
|
|
94
|
+
// decorationSet is required to re-render PrimaryToolbarComponent component, so that the toolbar states updates regularly
|
|
95
|
+
useSharedPluginStateSelector(api, 'list.decorationSet');
|
|
96
|
+
return {
|
|
97
|
+
bulletListActive: bulletListActive,
|
|
98
|
+
bulletListDisabled: bulletListDisabled,
|
|
99
|
+
orderedListActive: orderedListActive,
|
|
100
|
+
orderedListDisabled: orderedListDisabled,
|
|
101
|
+
isIndentationAllowed: isIndentationAllowed,
|
|
102
|
+
indentDisabled: indentDisabled,
|
|
103
|
+
outdentDisabled: outdentDisabled
|
|
104
|
+
};
|
|
105
|
+
}, function (api) {
|
|
106
|
+
var _useSharedPluginState = useSharedPluginState(api, ['list', 'indentation']),
|
|
107
|
+
listState = _useSharedPluginState.listState,
|
|
108
|
+
indentationState = _useSharedPluginState.indentationState;
|
|
109
|
+
return {
|
|
110
|
+
bulletListActive: listState === null || listState === void 0 ? void 0 : listState.bulletListActive,
|
|
111
|
+
bulletListDisabled: listState === null || listState === void 0 ? void 0 : listState.bulletListDisabled,
|
|
112
|
+
orderedListActive: listState === null || listState === void 0 ? void 0 : listState.orderedListActive,
|
|
113
|
+
orderedListDisabled: listState === null || listState === void 0 ? void 0 : listState.orderedListDisabled,
|
|
114
|
+
isIndentationAllowed: indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed,
|
|
115
|
+
indentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled,
|
|
116
|
+
outdentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled
|
|
117
|
+
};
|
|
118
|
+
});
|
|
85
119
|
export function PrimaryToolbarComponent(_ref4) {
|
|
86
120
|
var _pluginInjectionApi$l;
|
|
87
121
|
var featureFlags = _ref4.featureFlags,
|
|
@@ -95,9 +129,14 @@ export function PrimaryToolbarComponent(_ref4) {
|
|
|
95
129
|
showIndentationButtons = _ref4.showIndentationButtons,
|
|
96
130
|
pluginInjectionApi = _ref4.pluginInjectionApi,
|
|
97
131
|
allowHeadingAndParagraphIndentation = _ref4.allowHeadingAndParagraphIndentation;
|
|
98
|
-
var
|
|
99
|
-
|
|
100
|
-
|
|
132
|
+
var _useSharedState = useSharedState(pluginInjectionApi),
|
|
133
|
+
bulletListActive = _useSharedState.bulletListActive,
|
|
134
|
+
bulletListDisabled = _useSharedState.bulletListDisabled,
|
|
135
|
+
orderedListActive = _useSharedState.orderedListActive,
|
|
136
|
+
orderedListDisabled = _useSharedState.orderedListDisabled,
|
|
137
|
+
isIndentationAllowed = _useSharedState.isIndentationAllowed,
|
|
138
|
+
indentDisabled = _useSharedState.indentDisabled,
|
|
139
|
+
outdentDisabled = _useSharedState.outdentDisabled;
|
|
101
140
|
var _useState = useState(),
|
|
102
141
|
_useState2 = _slicedToArray(_useState, 2),
|
|
103
142
|
taskDecisionState = _useState2[0],
|
|
@@ -112,8 +151,12 @@ export function PrimaryToolbarComponent(_ref4) {
|
|
|
112
151
|
});
|
|
113
152
|
}
|
|
114
153
|
});
|
|
115
|
-
var toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState,
|
|
116
|
-
|
|
154
|
+
var toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState, {
|
|
155
|
+
isIndentationAllowed: isIndentationAllowed,
|
|
156
|
+
indentDisabled: indentDisabled,
|
|
157
|
+
outdentDisabled: outdentDisabled
|
|
158
|
+
}, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.list) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.isInsideListItem);
|
|
159
|
+
if (bulletListActive === undefined || bulletListDisabled === undefined || orderedListActive === undefined || orderedListDisabled === undefined) {
|
|
117
160
|
return null;
|
|
118
161
|
}
|
|
119
162
|
return /*#__PURE__*/React.createElement(ToolbarListsIndentation, {
|
|
@@ -124,23 +167,11 @@ export function PrimaryToolbarComponent(_ref4) {
|
|
|
124
167
|
editorView: editorView,
|
|
125
168
|
popupsMountPoint: popupsMountPoint,
|
|
126
169
|
popupsBoundariesElement: popupsBoundariesElement,
|
|
127
|
-
popupsScrollableElement: popupsScrollableElement
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
,
|
|
131
|
-
|
|
132
|
-
// Ignored via go/ees005
|
|
133
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
134
|
-
,
|
|
135
|
-
bulletListDisabled: listState.bulletListDisabled
|
|
136
|
-
// Ignored via go/ees005
|
|
137
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
138
|
-
,
|
|
139
|
-
orderedListActive: listState.orderedListActive
|
|
140
|
-
// Ignored via go/ees005
|
|
141
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
142
|
-
,
|
|
143
|
-
orderedListDisabled: listState.orderedListDisabled,
|
|
170
|
+
popupsScrollableElement: popupsScrollableElement,
|
|
171
|
+
bulletListActive: bulletListActive,
|
|
172
|
+
bulletListDisabled: bulletListDisabled,
|
|
173
|
+
orderedListActive: orderedListActive,
|
|
174
|
+
orderedListDisabled: orderedListDisabled,
|
|
144
175
|
showIndentationButtons: !!showIndentationButtons
|
|
145
176
|
// Ignored via go/ees005
|
|
146
177
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
2
|
import React, { useState } from 'react';
|
|
3
|
-
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
3
|
+
import { useSharedPluginState, sharedPluginStateHookMigratorFactory } from '@atlaskit/editor-common/hooks';
|
|
4
4
|
import { usePluginStateEffect } from '@atlaskit/editor-common/use-plugin-state-effect';
|
|
5
|
+
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
5
6
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
6
7
|
import { getIndentationButtonsState } from '../pm-plugins/indentation-buttons';
|
|
7
8
|
import { ToolbarType } from '../types';
|
|
@@ -11,6 +12,37 @@ var FloatingToolbarSettings = {
|
|
|
11
12
|
isToolbarReducedSpacing: true,
|
|
12
13
|
isSmall: true
|
|
13
14
|
};
|
|
15
|
+
var useSharedState = sharedPluginStateHookMigratorFactory(function (api) {
|
|
16
|
+
var bulletListActive = useSharedPluginStateSelector(api, 'list.bulletListActive');
|
|
17
|
+
var bulletListDisabled = useSharedPluginStateSelector(api, 'list.bulletListDisabled');
|
|
18
|
+
var orderedListActive = useSharedPluginStateSelector(api, 'list.orderedListActive');
|
|
19
|
+
var orderedListDisabled = useSharedPluginStateSelector(api, 'list.orderedListDisabled');
|
|
20
|
+
var isIndentationAllowed = useSharedPluginStateSelector(api, 'indentation.isIndentationAllowed');
|
|
21
|
+
var indentDisabled = useSharedPluginStateSelector(api, 'indentation.indentDisabled');
|
|
22
|
+
var outdentDisabled = useSharedPluginStateSelector(api, 'indentation.outdentDisabled');
|
|
23
|
+
return {
|
|
24
|
+
bulletListActive: bulletListActive,
|
|
25
|
+
bulletListDisabled: bulletListDisabled,
|
|
26
|
+
orderedListActive: orderedListActive,
|
|
27
|
+
orderedListDisabled: orderedListDisabled,
|
|
28
|
+
isIndentationAllowed: isIndentationAllowed,
|
|
29
|
+
indentDisabled: indentDisabled,
|
|
30
|
+
outdentDisabled: outdentDisabled
|
|
31
|
+
};
|
|
32
|
+
}, function (api) {
|
|
33
|
+
var _useSharedPluginState = useSharedPluginState(api, ['list', 'indentation']),
|
|
34
|
+
listState = _useSharedPluginState.listState,
|
|
35
|
+
indentationState = _useSharedPluginState.indentationState;
|
|
36
|
+
return {
|
|
37
|
+
bulletListActive: listState === null || listState === void 0 ? void 0 : listState.bulletListActive,
|
|
38
|
+
bulletListDisabled: listState === null || listState === void 0 ? void 0 : listState.bulletListDisabled,
|
|
39
|
+
orderedListActive: listState === null || listState === void 0 ? void 0 : listState.orderedListActive,
|
|
40
|
+
orderedListDisabled: listState === null || listState === void 0 ? void 0 : listState.orderedListDisabled,
|
|
41
|
+
isIndentationAllowed: indentationState === null || indentationState === void 0 ? void 0 : indentationState.isIndentationAllowed,
|
|
42
|
+
indentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.indentDisabled,
|
|
43
|
+
outdentDisabled: indentationState === null || indentationState === void 0 ? void 0 : indentationState.outdentDisabled
|
|
44
|
+
};
|
|
45
|
+
});
|
|
14
46
|
export function FloatingToolbarComponent(_ref) {
|
|
15
47
|
var _pluginInjectionApi$l;
|
|
16
48
|
var featureFlags = _ref.featureFlags,
|
|
@@ -18,9 +50,14 @@ export function FloatingToolbarComponent(_ref) {
|
|
|
18
50
|
showIndentationButtons = _ref.showIndentationButtons,
|
|
19
51
|
pluginInjectionApi = _ref.pluginInjectionApi,
|
|
20
52
|
allowHeadingAndParagraphIndentation = _ref.allowHeadingAndParagraphIndentation;
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
53
|
+
var _useSharedState = useSharedState(pluginInjectionApi),
|
|
54
|
+
bulletListActive = _useSharedState.bulletListActive,
|
|
55
|
+
bulletListDisabled = _useSharedState.bulletListDisabled,
|
|
56
|
+
orderedListActive = _useSharedState.orderedListActive,
|
|
57
|
+
orderedListDisabled = _useSharedState.orderedListDisabled,
|
|
58
|
+
isIndentationAllowed = _useSharedState.isIndentationAllowed,
|
|
59
|
+
indentDisabled = _useSharedState.indentDisabled,
|
|
60
|
+
outdentDisabled = _useSharedState.outdentDisabled;
|
|
24
61
|
var _useState = useState(),
|
|
25
62
|
_useState2 = _slicedToArray(_useState, 2),
|
|
26
63
|
taskDecisionState = _useState2[0],
|
|
@@ -35,8 +72,12 @@ export function FloatingToolbarComponent(_ref) {
|
|
|
35
72
|
});
|
|
36
73
|
}
|
|
37
74
|
});
|
|
38
|
-
var toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState,
|
|
39
|
-
|
|
75
|
+
var toolbarListsIndentationState = getIndentationButtonsState(editorView.state, allowHeadingAndParagraphIndentation, taskDecisionState, {
|
|
76
|
+
isIndentationAllowed: isIndentationAllowed,
|
|
77
|
+
indentDisabled: indentDisabled,
|
|
78
|
+
outdentDisabled: outdentDisabled
|
|
79
|
+
}, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$l = pluginInjectionApi.list) === null || _pluginInjectionApi$l === void 0 ? void 0 : _pluginInjectionApi$l.actions.isInsideListItem);
|
|
80
|
+
if (bulletListActive === undefined || bulletListDisabled === undefined || orderedListActive === undefined || orderedListDisabled === undefined) {
|
|
40
81
|
return null;
|
|
41
82
|
}
|
|
42
83
|
return /*#__PURE__*/React.createElement(ToolbarListsIndentation, {
|
|
@@ -44,23 +85,11 @@ export function FloatingToolbarComponent(_ref) {
|
|
|
44
85
|
isSmall: FloatingToolbarSettings.isSmall,
|
|
45
86
|
isReducedSpacing: editorExperiment('platform_editor_controls', 'variant1') ? false : FloatingToolbarSettings.isToolbarReducedSpacing,
|
|
46
87
|
disabled: FloatingToolbarSettings.disabled,
|
|
47
|
-
editorView: editorView
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
,
|
|
51
|
-
|
|
52
|
-
// Ignored via go/ees005
|
|
53
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
54
|
-
,
|
|
55
|
-
bulletListDisabled: listState.bulletListDisabled
|
|
56
|
-
// Ignored via go/ees005
|
|
57
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
58
|
-
,
|
|
59
|
-
orderedListActive: listState.orderedListActive
|
|
60
|
-
// Ignored via go/ees005
|
|
61
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
62
|
-
,
|
|
63
|
-
orderedListDisabled: listState.orderedListDisabled,
|
|
88
|
+
editorView: editorView,
|
|
89
|
+
bulletListActive: bulletListActive,
|
|
90
|
+
bulletListDisabled: bulletListDisabled,
|
|
91
|
+
orderedListActive: orderedListActive,
|
|
92
|
+
orderedListDisabled: orderedListDisabled,
|
|
64
93
|
showIndentationButtons: !!showIndentationButtons
|
|
65
94
|
// Ignored via go/ees005
|
|
66
95
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
@@ -11,9 +11,9 @@ export interface TaskDecisionState {
|
|
|
11
11
|
outdentDisabled: boolean;
|
|
12
12
|
}
|
|
13
13
|
interface IndentationState {
|
|
14
|
-
isIndentationAllowed
|
|
15
|
-
indentDisabled
|
|
16
|
-
outdentDisabled
|
|
14
|
+
isIndentationAllowed?: boolean;
|
|
15
|
+
indentDisabled?: boolean;
|
|
16
|
+
outdentDisabled?: boolean;
|
|
17
17
|
}
|
|
18
18
|
export declare function getIndentationButtonsState(editorState: EditorState, allowHeadingAndParagraphIndentation: boolean, taskDecisionState: TaskDecisionState | undefined, indentationState: IndentationState | undefined, isInsideListItem: ((tr: Transaction) => boolean | undefined) | undefined): IndentationButtons;
|
|
19
19
|
export {};
|
|
@@ -11,9 +11,9 @@ export interface TaskDecisionState {
|
|
|
11
11
|
outdentDisabled: boolean;
|
|
12
12
|
}
|
|
13
13
|
interface IndentationState {
|
|
14
|
-
isIndentationAllowed
|
|
15
|
-
indentDisabled
|
|
16
|
-
outdentDisabled
|
|
14
|
+
isIndentationAllowed?: boolean;
|
|
15
|
+
indentDisabled?: boolean;
|
|
16
|
+
outdentDisabled?: boolean;
|
|
17
17
|
}
|
|
18
18
|
export declare function getIndentationButtonsState(editorState: EditorState, allowHeadingAndParagraphIndentation: boolean, taskDecisionState: TaskDecisionState | undefined, indentationState: IndentationState | undefined, isInsideListItem: ((tr: Transaction) => boolean | undefined) | undefined): IndentationButtons;
|
|
19
19
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-toolbar-lists-indentation",
|
|
3
|
-
"version": "3.2.
|
|
3
|
+
"version": "3.2.6",
|
|
4
4
|
"description": "Toolbar lists and indentation plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -34,8 +34,8 @@
|
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
36
|
"@atlaskit/css": "^0.10.0",
|
|
37
|
-
"@atlaskit/editor-common": "^105.
|
|
38
|
-
"@atlaskit/editor-plugin-analytics": "^2.
|
|
37
|
+
"@atlaskit/editor-common": "^105.8.0",
|
|
38
|
+
"@atlaskit/editor-plugin-analytics": "^2.3.0",
|
|
39
39
|
"@atlaskit/editor-plugin-block-type": "^5.1.0",
|
|
40
40
|
"@atlaskit/editor-plugin-feature-flags": "^1.4.0",
|
|
41
41
|
"@atlaskit/editor-plugin-indentation": "^2.1.0",
|
|
@@ -45,10 +45,10 @@
|
|
|
45
45
|
"@atlaskit/editor-plugin-tasks-and-decisions": "^5.1.0",
|
|
46
46
|
"@atlaskit/editor-prosemirror": "7.0.0",
|
|
47
47
|
"@atlaskit/editor-shared-styles": "^3.4.0",
|
|
48
|
-
"@atlaskit/icon": "^26.
|
|
48
|
+
"@atlaskit/icon": "^26.1.0",
|
|
49
49
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
50
|
-
"@atlaskit/tmp-editor-statsig": "^4.
|
|
51
|
-
"@atlaskit/tokens": "^4.
|
|
50
|
+
"@atlaskit/tmp-editor-statsig": "^4.25.0",
|
|
51
|
+
"@atlaskit/tokens": "^4.9.0",
|
|
52
52
|
"@babel/runtime": "^7.0.0"
|
|
53
53
|
},
|
|
54
54
|
"peerDependencies": {
|