@atlaskit/editor-plugin-toolbar 7.0.16 → 7.1.0
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 +20 -0
- package/dist/cjs/toolbarPlugin.js +37 -17
- package/dist/cjs/ui/Section.js +8 -2
- package/dist/cjs/ui/SelectionToolbar/index.js +13 -9
- package/dist/es2019/toolbarPlugin.js +36 -14
- package/dist/es2019/ui/Section.js +8 -2
- package/dist/es2019/ui/SelectionToolbar/index.js +8 -4
- package/dist/esm/toolbarPlugin.js +37 -17
- package/dist/esm/ui/Section.js +8 -2
- package/dist/esm/ui/SelectionToolbar/index.js +13 -9
- package/dist/types/toolbarPluginType.d.ts +23 -1
- package/dist/types-ts4.5/toolbarPluginType.d.ts +23 -1
- package/package.json +6 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,25 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-toolbar
|
|
2
2
|
|
|
3
|
+
## 7.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`5184c3aa86e89`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5184c3aa86e89) -
|
|
8
|
+
Pin the primary toolbar to the top while in Markdown Mode source or preview view, where the
|
|
9
|
+
floating toolbar would be useless (no PM selection to anchor to). Behind the new
|
|
10
|
+
`platform_editor_toolbar_mode_override` feature gate.
|
|
11
|
+
- `editor-plugin-toolbar`: adds `commands.setContextualFormattingModeOverride` and a
|
|
12
|
+
`contextualFormattingModeOverride` field on shared state. Any plugin can compose the command
|
|
13
|
+
onto its own transaction to push a runtime override.
|
|
14
|
+
- `editor-plugin-markdown-mode`: pushes the override on `setView` and on initial mount; uses the
|
|
15
|
+
current view to short-circuit `useIsToolbarDockedToTop` so the in-toolbar toggle renders in the
|
|
16
|
+
correct slot.
|
|
17
|
+
- `editor-plugin-selection-toolbar`: `PinButton` hides when the override forces `'always-pinned'`
|
|
18
|
+
(the toggle is meaningless in that state).
|
|
19
|
+
- `editor-core` (`FullPage.tsx`, `FullPageToolbarNext.tsx`): the primary-toolbar mount gate
|
|
20
|
+
consults the runtime override so the toolbar still mounts when the override is
|
|
21
|
+
`'always-pinned'`, even if the user's docking preference is `'none'`.
|
|
22
|
+
|
|
3
23
|
## 7.0.16
|
|
4
24
|
|
|
5
25
|
### Patch Changes
|
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.toolbarPlugin = void 0;
|
|
8
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
8
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
10
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
10
11
|
var _react = _interopRequireDefault(require("react"));
|
|
@@ -21,6 +22,7 @@ var _consts = require("./ui/consts");
|
|
|
21
22
|
var _SelectionToolbar = require("./ui/SelectionToolbar");
|
|
22
23
|
var _toolbarComponents = require("./ui/toolbar-components");
|
|
23
24
|
var _toolbar = require("./ui/utils/toolbar");
|
|
25
|
+
var _excluded = ["contextualFormattingModeOverride"];
|
|
24
26
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
25
27
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
26
28
|
function getSelectedNode(editorState) {
|
|
@@ -104,23 +106,31 @@ var toolbarPlugin = exports.toolbarPlugin = function toolbarPlugin(_ref) {
|
|
|
104
106
|
return config !== null && config !== void 0 && config.componentFilter ? registry.components.filter(config.componentFilter) : registry.components;
|
|
105
107
|
},
|
|
106
108
|
contextualFormattingMode: function contextualFormattingMode() {
|
|
107
|
-
var _config$contextualFor2;
|
|
108
|
-
//
|
|
109
|
-
//
|
|
110
|
-
//
|
|
111
|
-
//
|
|
112
|
-
// `always-pinned`
|
|
113
|
-
//
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
return override;
|
|
117
|
-
}
|
|
118
|
-
return contextualFormattingEnabled !== null && contextualFormattingEnabled !== void 0 ? contextualFormattingEnabled : 'always-pinned';
|
|
109
|
+
var _ref2, _config$contextualFor2, _config$contextualFor3;
|
|
110
|
+
// Returns the config-time mode only. The runtime override
|
|
111
|
+
// (`EditorToolbarPluginState.contextualFormattingModeOverride`)
|
|
112
|
+
// lives in PM state and must be merged in by the React render
|
|
113
|
+
// site — see SelectionToolbar / Section / FullPageToolbarNext for
|
|
114
|
+
// the `runtimeOverride ?? action() ?? 'always-pinned'` pattern.
|
|
115
|
+
// Doing the merge here would require closure-capturing `editorView`,
|
|
116
|
+
// which races with StrictMode double-mount.
|
|
117
|
+
return (_ref2 = (_config$contextualFor2 = config === null || config === void 0 || (_config$contextualFor3 = config.contextualFormattingModeOverride) === null || _config$contextualFor3 === void 0 ? void 0 : _config$contextualFor3.call(config)) !== null && _config$contextualFor2 !== void 0 ? _config$contextualFor2 : contextualFormattingEnabled) !== null && _ref2 !== void 0 ? _ref2 : 'always-pinned';
|
|
119
118
|
},
|
|
120
119
|
getBreakpointPreset: function getBreakpointPreset() {
|
|
121
120
|
return breakpointPreset;
|
|
122
121
|
}
|
|
123
122
|
},
|
|
123
|
+
commands: {
|
|
124
|
+
setContextualFormattingModeOverride: function setContextualFormattingModeOverride(mode) {
|
|
125
|
+
return function (_ref3) {
|
|
126
|
+
var tr = _ref3.tr;
|
|
127
|
+
tr.setMeta(_pluginKey.editorToolbarPluginKey, {
|
|
128
|
+
contextualFormattingModeOverride: mode
|
|
129
|
+
});
|
|
130
|
+
return tr;
|
|
131
|
+
};
|
|
132
|
+
}
|
|
133
|
+
},
|
|
124
134
|
getSharedState: function getSharedState(editorState) {
|
|
125
135
|
if (!editorState) {
|
|
126
136
|
return undefined;
|
|
@@ -142,7 +152,8 @@ var toolbarPlugin = exports.toolbarPlugin = function toolbarPlugin(_ref) {
|
|
|
142
152
|
init: function init(_, editorState) {
|
|
143
153
|
return {
|
|
144
154
|
shouldShowToolbar: false,
|
|
145
|
-
selectedNode: getSelectedNode(editorState)
|
|
155
|
+
selectedNode: getSelectedNode(editorState),
|
|
156
|
+
contextualFormattingModeOverride: undefined
|
|
146
157
|
};
|
|
147
158
|
},
|
|
148
159
|
apply: function apply(tr, pluginState, _, newState) {
|
|
@@ -158,7 +169,16 @@ var toolbarPlugin = exports.toolbarPlugin = function toolbarPlugin(_ref) {
|
|
|
158
169
|
}
|
|
159
170
|
}
|
|
160
171
|
if (meta) {
|
|
161
|
-
|
|
172
|
+
var contextualFormattingModeOverride = meta.contextualFormattingModeOverride,
|
|
173
|
+
rest = (0, _objectWithoutProperties2.default)(meta, _excluded);
|
|
174
|
+
// Only forward the override when the meta actually carries
|
|
175
|
+
// the key — unrelated metas (mouseup / focus / mousedown
|
|
176
|
+
// from the view() listeners) destructure it as `undefined`
|
|
177
|
+
// and would otherwise wipe a previously-set override on
|
|
178
|
+
// every interaction.
|
|
179
|
+
newPluginState = _objectSpread(_objectSpread(_objectSpread({}, newPluginState), rest), 'contextualFormattingModeOverride' in meta && (0, _platformFeatureFlags.fg)('platform_editor_toolbar_mode_override') ? {
|
|
180
|
+
contextualFormattingModeOverride: contextualFormattingModeOverride
|
|
181
|
+
} : {});
|
|
162
182
|
}
|
|
163
183
|
return newPluginState;
|
|
164
184
|
}
|
|
@@ -229,9 +249,9 @@ var toolbarPlugin = exports.toolbarPlugin = function toolbarPlugin(_ref) {
|
|
|
229
249
|
}
|
|
230
250
|
}] : []));
|
|
231
251
|
},
|
|
232
|
-
contentComponent: !disableSelectionToolbar ? function (
|
|
233
|
-
var editorView =
|
|
234
|
-
popupsMountPoint =
|
|
252
|
+
contentComponent: !disableSelectionToolbar ? function (_ref4) {
|
|
253
|
+
var editorView = _ref4.editorView,
|
|
254
|
+
popupsMountPoint = _ref4.popupsMountPoint;
|
|
235
255
|
refs.popupsMountPoint = popupsMountPoint || undefined;
|
|
236
256
|
if (!editorView) {
|
|
237
257
|
return null;
|
package/dist/cjs/ui/Section.js
CHANGED
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.Section = void 0;
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _hooks = require("@atlaskit/editor-common/hooks");
|
|
9
10
|
var _toolbar = require("@atlaskit/editor-common/toolbar");
|
|
10
11
|
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
11
12
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
@@ -42,7 +43,7 @@ var usePluginState = function usePluginState(_api) {
|
|
|
42
43
|
};
|
|
43
44
|
};
|
|
44
45
|
var Section = exports.Section = function Section(_ref) {
|
|
45
|
-
var
|
|
46
|
+
var _ref2, _api$toolbar;
|
|
46
47
|
var children = _ref.children,
|
|
47
48
|
parents = _ref.parents,
|
|
48
49
|
api = _ref.api,
|
|
@@ -54,10 +55,15 @@ var Section = exports.Section = function Section(_ref) {
|
|
|
54
55
|
editorViewMode = _usePluginState.editorViewMode,
|
|
55
56
|
editorToolbarDockingPreference = _usePluginState.editorToolbarDockingPreference,
|
|
56
57
|
editorAppearance = _usePluginState.editorAppearance;
|
|
58
|
+
var runtimeOverride = (0, _hooks.useSharedPluginStateWithSelector)(api, ['toolbar'], function (states) {
|
|
59
|
+
var _states$toolbarState;
|
|
60
|
+
return (_states$toolbarState = states.toolbarState) === null || _states$toolbarState === void 0 ? void 0 : _states$toolbarState.contextualFormattingModeOverride;
|
|
61
|
+
});
|
|
57
62
|
var toolbar = parents.find(function (parent) {
|
|
58
63
|
return parent.type === 'toolbar';
|
|
59
64
|
});
|
|
60
|
-
var
|
|
65
|
+
var effectiveRuntimeOverride = runtimeOverride !== undefined && (0, _platformFeatureFlags.fg)('platform_editor_toolbar_mode_override') ? runtimeOverride : undefined;
|
|
66
|
+
var contextualFormattingEnabled = (_ref2 = effectiveRuntimeOverride !== null && effectiveRuntimeOverride !== void 0 ? effectiveRuntimeOverride : api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.contextualFormattingMode()) !== null && _ref2 !== void 0 ? _ref2 : 'always-pinned';
|
|
61
67
|
if (isSharedSection && !shouldShowSection(editorViewMode, toolbar, editorToolbarDockingPreference, contextualFormattingEnabled)) {
|
|
62
68
|
return null;
|
|
63
69
|
}
|
|
@@ -20,6 +20,7 @@ var _state = require("@atlaskit/editor-prosemirror/state");
|
|
|
20
20
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
21
21
|
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
22
22
|
var _editorToolbarModel = require("@atlaskit/editor-toolbar-model");
|
|
23
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
23
24
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
24
25
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
25
26
|
var _consts = require("../consts");
|
|
@@ -31,12 +32,13 @@ var isToolbarComponent = function isToolbarComponent(component) {
|
|
|
31
32
|
};
|
|
32
33
|
var usePluginState = function usePluginState(api) {
|
|
33
34
|
return (0, _hooks.useSharedPluginStateWithSelector)(api, ['connectivity', 'userPreferences', 'toolbar', 'selection', 'userIntent', 'editorViewMode'], function (state) {
|
|
34
|
-
var _state$connectivitySt, _state$userPreference, _state$toolbarState, _state$toolbarState2, _state$selectionState, _state$userIntentStat, _state$editorViewMode;
|
|
35
|
+
var _state$connectivitySt, _state$userPreference, _state$toolbarState, _state$toolbarState2, _state$toolbarState3, _state$selectionState, _state$userIntentStat, _state$editorViewMode;
|
|
35
36
|
return {
|
|
36
37
|
connectivityStateMode: (_state$connectivitySt = state.connectivityState) === null || _state$connectivitySt === void 0 ? void 0 : _state$connectivitySt.mode,
|
|
37
38
|
editorToolbarDockingPreference: (_state$userPreference = state.userPreferencesState) === null || _state$userPreference === void 0 || (_state$userPreference = _state$userPreference.preferences) === null || _state$userPreference === void 0 ? void 0 : _state$userPreference.toolbarDockingPosition,
|
|
38
39
|
shouldShowToolbar: (_state$toolbarState = state.toolbarState) === null || _state$toolbarState === void 0 ? void 0 : _state$toolbarState.shouldShowToolbar,
|
|
39
40
|
selectedNode: (_state$toolbarState2 = state.toolbarState) === null || _state$toolbarState2 === void 0 ? void 0 : _state$toolbarState2.selectedNode,
|
|
41
|
+
contextualFormattingModeOverride: (_state$toolbarState3 = state.toolbarState) === null || _state$toolbarState3 === void 0 ? void 0 : _state$toolbarState3.contextualFormattingModeOverride,
|
|
40
42
|
selection: (_state$selectionState = state.selectionState) === null || _state$selectionState === void 0 ? void 0 : _state$selectionState.selection,
|
|
41
43
|
currentUserIntent: (_state$userIntentStat = state.userIntentState) === null || _state$userIntentStat === void 0 ? void 0 : _state$userIntentStat.currentUserIntent,
|
|
42
44
|
editorViewMode: (_state$editorViewMode = state.editorViewModeState) === null || _state$editorViewMode === void 0 ? void 0 : _state$editorViewMode.mode
|
|
@@ -63,7 +65,7 @@ var useOnPositionCalculated = function useOnPositionCalculated(editorView) {
|
|
|
63
65
|
return onPositionCalculated;
|
|
64
66
|
};
|
|
65
67
|
var SelectionToolbar = exports.SelectionToolbar = function SelectionToolbar(_ref) {
|
|
66
|
-
var
|
|
68
|
+
var _ref2, _api$toolbar, _api$toolbar2;
|
|
67
69
|
var api = _ref.api,
|
|
68
70
|
editorView = _ref.editorView,
|
|
69
71
|
mountPoint = _ref.mountPoint,
|
|
@@ -73,8 +75,10 @@ var SelectionToolbar = exports.SelectionToolbar = function SelectionToolbar(_ref
|
|
|
73
75
|
editorToolbarDockingPreference = _usePluginState.editorToolbarDockingPreference,
|
|
74
76
|
currentUserIntent = _usePluginState.currentUserIntent,
|
|
75
77
|
shouldShowToolbar = _usePluginState.shouldShowToolbar,
|
|
76
|
-
editorViewMode = _usePluginState.editorViewMode
|
|
77
|
-
|
|
78
|
+
editorViewMode = _usePluginState.editorViewMode,
|
|
79
|
+
contextualFormattingModeOverride = _usePluginState.contextualFormattingModeOverride;
|
|
80
|
+
var effectiveRuntimeOverride = contextualFormattingModeOverride !== undefined && (0, _platformFeatureFlags.fg)('platform_editor_toolbar_mode_override') ? contextualFormattingModeOverride : undefined;
|
|
81
|
+
var contextualFormattingEnabled = (_ref2 = effectiveRuntimeOverride !== null && effectiveRuntimeOverride !== void 0 ? effectiveRuntimeOverride : api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.contextualFormattingMode()) !== null && _ref2 !== void 0 ? _ref2 : 'always-pinned';
|
|
78
82
|
var selectionToolbarConfigEnabled = (0, _toolbar.shouldShowSelectionToolbar)(contextualFormattingEnabled, editorToolbarDockingPreference);
|
|
79
83
|
var intl = (0, _reactIntl.useIntl)();
|
|
80
84
|
var components = api === null || api === void 0 || (_api$toolbar2 = api.toolbar) === null || _api$toolbar2 === void 0 ? void 0 : _api$toolbar2.actions.getComponents();
|
|
@@ -134,12 +138,12 @@ var SelectionToolbar = exports.SelectionToolbar = function SelectionToolbar(_ref
|
|
|
134
138
|
}
|
|
135
139
|
}))));
|
|
136
140
|
};
|
|
137
|
-
var SelectionToolbarWithErrorBoundary = exports.SelectionToolbarWithErrorBoundary = function SelectionToolbarWithErrorBoundary(
|
|
141
|
+
var SelectionToolbarWithErrorBoundary = exports.SelectionToolbarWithErrorBoundary = function SelectionToolbarWithErrorBoundary(_ref3) {
|
|
138
142
|
var _api$analytics2;
|
|
139
|
-
var api =
|
|
140
|
-
editorView =
|
|
141
|
-
mountPoint =
|
|
142
|
-
disableSelectionToolbarWhenPinned =
|
|
143
|
+
var api = _ref3.api,
|
|
144
|
+
editorView = _ref3.editorView,
|
|
145
|
+
mountPoint = _ref3.mountPoint,
|
|
146
|
+
disableSelectionToolbarWhenPinned = _ref3.disableSelectionToolbarWhenPinned;
|
|
143
147
|
return /*#__PURE__*/_react.default.createElement(_errorBoundary.ErrorBoundary, {
|
|
144
148
|
component: _analytics.ACTION_SUBJECT.TOOLBAR,
|
|
145
149
|
componentId: _analytics.ACTION_SUBJECT_ID.SELECTION_TOOLBAR,
|
|
@@ -89,23 +89,32 @@ export const toolbarPlugin = ({
|
|
|
89
89
|
return config !== null && config !== void 0 && config.componentFilter ? registry.components.filter(config.componentFilter) : registry.components;
|
|
90
90
|
},
|
|
91
91
|
contextualFormattingMode: () => {
|
|
92
|
-
var _config$contextualFor;
|
|
93
|
-
//
|
|
94
|
-
//
|
|
95
|
-
//
|
|
96
|
-
//
|
|
97
|
-
// `always-pinned`
|
|
98
|
-
//
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
return override;
|
|
102
|
-
}
|
|
103
|
-
return contextualFormattingEnabled !== null && contextualFormattingEnabled !== void 0 ? contextualFormattingEnabled : 'always-pinned';
|
|
92
|
+
var _ref, _config$contextualFor, _config$contextualFor2;
|
|
93
|
+
// Returns the config-time mode only. The runtime override
|
|
94
|
+
// (`EditorToolbarPluginState.contextualFormattingModeOverride`)
|
|
95
|
+
// lives in PM state and must be merged in by the React render
|
|
96
|
+
// site — see SelectionToolbar / Section / FullPageToolbarNext for
|
|
97
|
+
// the `runtimeOverride ?? action() ?? 'always-pinned'` pattern.
|
|
98
|
+
// Doing the merge here would require closure-capturing `editorView`,
|
|
99
|
+
// which races with StrictMode double-mount.
|
|
100
|
+
return (_ref = (_config$contextualFor = config === null || config === void 0 ? void 0 : (_config$contextualFor2 = config.contextualFormattingModeOverride) === null || _config$contextualFor2 === void 0 ? void 0 : _config$contextualFor2.call(config)) !== null && _config$contextualFor !== void 0 ? _config$contextualFor : contextualFormattingEnabled) !== null && _ref !== void 0 ? _ref : 'always-pinned';
|
|
104
101
|
},
|
|
105
102
|
getBreakpointPreset: () => {
|
|
106
103
|
return breakpointPreset;
|
|
107
104
|
}
|
|
108
105
|
},
|
|
106
|
+
commands: {
|
|
107
|
+
setContextualFormattingModeOverride: mode => {
|
|
108
|
+
return ({
|
|
109
|
+
tr
|
|
110
|
+
}) => {
|
|
111
|
+
tr.setMeta(editorToolbarPluginKey, {
|
|
112
|
+
contextualFormattingModeOverride: mode
|
|
113
|
+
});
|
|
114
|
+
return tr;
|
|
115
|
+
};
|
|
116
|
+
}
|
|
117
|
+
},
|
|
109
118
|
getSharedState(editorState) {
|
|
110
119
|
if (!editorState) {
|
|
111
120
|
return undefined;
|
|
@@ -127,7 +136,8 @@ export const toolbarPlugin = ({
|
|
|
127
136
|
init(_, editorState) {
|
|
128
137
|
return {
|
|
129
138
|
shouldShowToolbar: false,
|
|
130
|
-
selectedNode: getSelectedNode(editorState)
|
|
139
|
+
selectedNode: getSelectedNode(editorState),
|
|
140
|
+
contextualFormattingModeOverride: undefined
|
|
131
141
|
};
|
|
132
142
|
},
|
|
133
143
|
apply(tr, pluginState, _, newState) {
|
|
@@ -145,9 +155,21 @@ export const toolbarPlugin = ({
|
|
|
145
155
|
}
|
|
146
156
|
}
|
|
147
157
|
if (meta) {
|
|
158
|
+
const {
|
|
159
|
+
contextualFormattingModeOverride,
|
|
160
|
+
...rest
|
|
161
|
+
} = meta;
|
|
162
|
+
// Only forward the override when the meta actually carries
|
|
163
|
+
// the key — unrelated metas (mouseup / focus / mousedown
|
|
164
|
+
// from the view() listeners) destructure it as `undefined`
|
|
165
|
+
// and would otherwise wipe a previously-set override on
|
|
166
|
+
// every interaction.
|
|
148
167
|
newPluginState = {
|
|
149
168
|
...newPluginState,
|
|
150
|
-
...
|
|
169
|
+
...rest,
|
|
170
|
+
...('contextualFormattingModeOverride' in meta && fg('platform_editor_toolbar_mode_override') ? {
|
|
171
|
+
contextualFormattingModeOverride
|
|
172
|
+
} : {})
|
|
151
173
|
};
|
|
152
174
|
}
|
|
153
175
|
return newPluginState;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
|
|
2
3
|
import { TOOLBARS, useEditorToolbar } from '@atlaskit/editor-common/toolbar';
|
|
3
4
|
import { ToolbarSection, SeparatorPosition } from '@atlaskit/editor-toolbar';
|
|
4
5
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
@@ -43,14 +44,19 @@ export const Section = ({
|
|
|
43
44
|
showSeparatorInFullPagePrimaryToolbar,
|
|
44
45
|
isSharedSection = true
|
|
45
46
|
}) => {
|
|
46
|
-
var
|
|
47
|
+
var _ref, _api$toolbar;
|
|
47
48
|
const {
|
|
48
49
|
editorViewMode,
|
|
49
50
|
editorToolbarDockingPreference,
|
|
50
51
|
editorAppearance
|
|
51
52
|
} = usePluginState(api);
|
|
53
|
+
const runtimeOverride = useSharedPluginStateWithSelector(api, ['toolbar'], states => {
|
|
54
|
+
var _states$toolbarState;
|
|
55
|
+
return (_states$toolbarState = states.toolbarState) === null || _states$toolbarState === void 0 ? void 0 : _states$toolbarState.contextualFormattingModeOverride;
|
|
56
|
+
});
|
|
52
57
|
const toolbar = parents.find(parent => parent.type === 'toolbar');
|
|
53
|
-
const
|
|
58
|
+
const effectiveRuntimeOverride = runtimeOverride !== undefined && fg('platform_editor_toolbar_mode_override') ? runtimeOverride : undefined;
|
|
59
|
+
const contextualFormattingEnabled = (_ref = effectiveRuntimeOverride !== null && effectiveRuntimeOverride !== void 0 ? effectiveRuntimeOverride : api === null || api === void 0 ? void 0 : (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.contextualFormattingMode()) !== null && _ref !== void 0 ? _ref : 'always-pinned';
|
|
54
60
|
if (isSharedSection && !shouldShowSection(editorViewMode, toolbar, editorToolbarDockingPreference, contextualFormattingEnabled)) {
|
|
55
61
|
return null;
|
|
56
62
|
}
|
|
@@ -13,6 +13,7 @@ import { AllSelection, TextSelection } from '@atlaskit/editor-prosemirror/state'
|
|
|
13
13
|
import { akEditorFloatingDialogZIndex } from '@atlaskit/editor-shared-styles';
|
|
14
14
|
import { ToolbarSection, ToolbarButtonGroup, ToolbarDropdownItemSection, useToolbarUI } from '@atlaskit/editor-toolbar';
|
|
15
15
|
import { ToolbarModelRenderer } from '@atlaskit/editor-toolbar-model';
|
|
16
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
16
17
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
17
18
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
18
19
|
import { SELECTION_TOOLBAR_LABEL } from '../consts';
|
|
@@ -23,12 +24,13 @@ const isToolbarComponent = component => {
|
|
|
23
24
|
};
|
|
24
25
|
const usePluginState = api => {
|
|
25
26
|
return useSharedPluginStateWithSelector(api, ['connectivity', 'userPreferences', 'toolbar', 'selection', 'userIntent', 'editorViewMode'], state => {
|
|
26
|
-
var _state$connectivitySt, _state$userPreference, _state$userPreference2, _state$toolbarState, _state$toolbarState2, _state$selectionState, _state$userIntentStat, _state$editorViewMode;
|
|
27
|
+
var _state$connectivitySt, _state$userPreference, _state$userPreference2, _state$toolbarState, _state$toolbarState2, _state$toolbarState3, _state$selectionState, _state$userIntentStat, _state$editorViewMode;
|
|
27
28
|
return {
|
|
28
29
|
connectivityStateMode: (_state$connectivitySt = state.connectivityState) === null || _state$connectivitySt === void 0 ? void 0 : _state$connectivitySt.mode,
|
|
29
30
|
editorToolbarDockingPreference: (_state$userPreference = state.userPreferencesState) === null || _state$userPreference === void 0 ? void 0 : (_state$userPreference2 = _state$userPreference.preferences) === null || _state$userPreference2 === void 0 ? void 0 : _state$userPreference2.toolbarDockingPosition,
|
|
30
31
|
shouldShowToolbar: (_state$toolbarState = state.toolbarState) === null || _state$toolbarState === void 0 ? void 0 : _state$toolbarState.shouldShowToolbar,
|
|
31
32
|
selectedNode: (_state$toolbarState2 = state.toolbarState) === null || _state$toolbarState2 === void 0 ? void 0 : _state$toolbarState2.selectedNode,
|
|
33
|
+
contextualFormattingModeOverride: (_state$toolbarState3 = state.toolbarState) === null || _state$toolbarState3 === void 0 ? void 0 : _state$toolbarState3.contextualFormattingModeOverride,
|
|
32
34
|
selection: (_state$selectionState = state.selectionState) === null || _state$selectionState === void 0 ? void 0 : _state$selectionState.selection,
|
|
33
35
|
currentUserIntent: (_state$userIntentStat = state.userIntentState) === null || _state$userIntentStat === void 0 ? void 0 : _state$userIntentStat.currentUserIntent,
|
|
34
36
|
editorViewMode: (_state$editorViewMode = state.editorViewModeState) === null || _state$editorViewMode === void 0 ? void 0 : _state$editorViewMode.mode
|
|
@@ -60,15 +62,17 @@ export const SelectionToolbar = ({
|
|
|
60
62
|
mountPoint,
|
|
61
63
|
disableSelectionToolbarWhenPinned
|
|
62
64
|
}) => {
|
|
63
|
-
var
|
|
65
|
+
var _ref, _api$toolbar, _api$toolbar2;
|
|
64
66
|
const {
|
|
65
67
|
connectivityStateMode,
|
|
66
68
|
editorToolbarDockingPreference,
|
|
67
69
|
currentUserIntent,
|
|
68
70
|
shouldShowToolbar,
|
|
69
|
-
editorViewMode
|
|
71
|
+
editorViewMode,
|
|
72
|
+
contextualFormattingModeOverride
|
|
70
73
|
} = usePluginState(api);
|
|
71
|
-
const
|
|
74
|
+
const effectiveRuntimeOverride = contextualFormattingModeOverride !== undefined && fg('platform_editor_toolbar_mode_override') ? contextualFormattingModeOverride : undefined;
|
|
75
|
+
const contextualFormattingEnabled = (_ref = effectiveRuntimeOverride !== null && effectiveRuntimeOverride !== void 0 ? effectiveRuntimeOverride : api === null || api === void 0 ? void 0 : (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.contextualFormattingMode()) !== null && _ref !== void 0 ? _ref : 'always-pinned';
|
|
72
76
|
const selectionToolbarConfigEnabled = shouldShowSelectionToolbar(contextualFormattingEnabled, editorToolbarDockingPreference);
|
|
73
77
|
const intl = useIntl();
|
|
74
78
|
const components = api === null || api === void 0 ? void 0 : (_api$toolbar2 = api.toolbar) === null || _api$toolbar2 === void 0 ? void 0 : _api$toolbar2.actions.getComponents();
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
1
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
3
|
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
4
|
+
var _excluded = ["contextualFormattingModeOverride"];
|
|
3
5
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
6
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
7
|
import React from 'react';
|
|
@@ -97,23 +99,31 @@ export var toolbarPlugin = function toolbarPlugin(_ref) {
|
|
|
97
99
|
return config !== null && config !== void 0 && config.componentFilter ? registry.components.filter(config.componentFilter) : registry.components;
|
|
98
100
|
},
|
|
99
101
|
contextualFormattingMode: function contextualFormattingMode() {
|
|
100
|
-
var _config$contextualFor2;
|
|
101
|
-
//
|
|
102
|
-
//
|
|
103
|
-
//
|
|
104
|
-
//
|
|
105
|
-
// `always-pinned`
|
|
106
|
-
//
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
return override;
|
|
110
|
-
}
|
|
111
|
-
return contextualFormattingEnabled !== null && contextualFormattingEnabled !== void 0 ? contextualFormattingEnabled : 'always-pinned';
|
|
102
|
+
var _ref2, _config$contextualFor2, _config$contextualFor3;
|
|
103
|
+
// Returns the config-time mode only. The runtime override
|
|
104
|
+
// (`EditorToolbarPluginState.contextualFormattingModeOverride`)
|
|
105
|
+
// lives in PM state and must be merged in by the React render
|
|
106
|
+
// site — see SelectionToolbar / Section / FullPageToolbarNext for
|
|
107
|
+
// the `runtimeOverride ?? action() ?? 'always-pinned'` pattern.
|
|
108
|
+
// Doing the merge here would require closure-capturing `editorView`,
|
|
109
|
+
// which races with StrictMode double-mount.
|
|
110
|
+
return (_ref2 = (_config$contextualFor2 = config === null || config === void 0 || (_config$contextualFor3 = config.contextualFormattingModeOverride) === null || _config$contextualFor3 === void 0 ? void 0 : _config$contextualFor3.call(config)) !== null && _config$contextualFor2 !== void 0 ? _config$contextualFor2 : contextualFormattingEnabled) !== null && _ref2 !== void 0 ? _ref2 : 'always-pinned';
|
|
112
111
|
},
|
|
113
112
|
getBreakpointPreset: function getBreakpointPreset() {
|
|
114
113
|
return breakpointPreset;
|
|
115
114
|
}
|
|
116
115
|
},
|
|
116
|
+
commands: {
|
|
117
|
+
setContextualFormattingModeOverride: function setContextualFormattingModeOverride(mode) {
|
|
118
|
+
return function (_ref3) {
|
|
119
|
+
var tr = _ref3.tr;
|
|
120
|
+
tr.setMeta(editorToolbarPluginKey, {
|
|
121
|
+
contextualFormattingModeOverride: mode
|
|
122
|
+
});
|
|
123
|
+
return tr;
|
|
124
|
+
};
|
|
125
|
+
}
|
|
126
|
+
},
|
|
117
127
|
getSharedState: function getSharedState(editorState) {
|
|
118
128
|
if (!editorState) {
|
|
119
129
|
return undefined;
|
|
@@ -135,7 +145,8 @@ export var toolbarPlugin = function toolbarPlugin(_ref) {
|
|
|
135
145
|
init: function init(_, editorState) {
|
|
136
146
|
return {
|
|
137
147
|
shouldShowToolbar: false,
|
|
138
|
-
selectedNode: getSelectedNode(editorState)
|
|
148
|
+
selectedNode: getSelectedNode(editorState),
|
|
149
|
+
contextualFormattingModeOverride: undefined
|
|
139
150
|
};
|
|
140
151
|
},
|
|
141
152
|
apply: function apply(tr, pluginState, _, newState) {
|
|
@@ -151,7 +162,16 @@ export var toolbarPlugin = function toolbarPlugin(_ref) {
|
|
|
151
162
|
}
|
|
152
163
|
}
|
|
153
164
|
if (meta) {
|
|
154
|
-
|
|
165
|
+
var contextualFormattingModeOverride = meta.contextualFormattingModeOverride,
|
|
166
|
+
rest = _objectWithoutProperties(meta, _excluded);
|
|
167
|
+
// Only forward the override when the meta actually carries
|
|
168
|
+
// the key — unrelated metas (mouseup / focus / mousedown
|
|
169
|
+
// from the view() listeners) destructure it as `undefined`
|
|
170
|
+
// and would otherwise wipe a previously-set override on
|
|
171
|
+
// every interaction.
|
|
172
|
+
newPluginState = _objectSpread(_objectSpread(_objectSpread({}, newPluginState), rest), 'contextualFormattingModeOverride' in meta && fg('platform_editor_toolbar_mode_override') ? {
|
|
173
|
+
contextualFormattingModeOverride: contextualFormattingModeOverride
|
|
174
|
+
} : {});
|
|
155
175
|
}
|
|
156
176
|
return newPluginState;
|
|
157
177
|
}
|
|
@@ -222,9 +242,9 @@ export var toolbarPlugin = function toolbarPlugin(_ref) {
|
|
|
222
242
|
}
|
|
223
243
|
}] : []));
|
|
224
244
|
},
|
|
225
|
-
contentComponent: !disableSelectionToolbar ? function (
|
|
226
|
-
var editorView =
|
|
227
|
-
popupsMountPoint =
|
|
245
|
+
contentComponent: !disableSelectionToolbar ? function (_ref4) {
|
|
246
|
+
var editorView = _ref4.editorView,
|
|
247
|
+
popupsMountPoint = _ref4.popupsMountPoint;
|
|
228
248
|
refs.popupsMountPoint = popupsMountPoint || undefined;
|
|
229
249
|
if (!editorView) {
|
|
230
250
|
return null;
|
package/dist/esm/ui/Section.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
|
|
2
3
|
import { TOOLBARS, useEditorToolbar } from '@atlaskit/editor-common/toolbar';
|
|
3
4
|
import { ToolbarSection, SeparatorPosition } from '@atlaskit/editor-toolbar';
|
|
4
5
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
@@ -35,7 +36,7 @@ var usePluginState = function usePluginState(_api) {
|
|
|
35
36
|
};
|
|
36
37
|
};
|
|
37
38
|
export var Section = function Section(_ref) {
|
|
38
|
-
var
|
|
39
|
+
var _ref2, _api$toolbar;
|
|
39
40
|
var children = _ref.children,
|
|
40
41
|
parents = _ref.parents,
|
|
41
42
|
api = _ref.api,
|
|
@@ -47,10 +48,15 @@ export var Section = function Section(_ref) {
|
|
|
47
48
|
editorViewMode = _usePluginState.editorViewMode,
|
|
48
49
|
editorToolbarDockingPreference = _usePluginState.editorToolbarDockingPreference,
|
|
49
50
|
editorAppearance = _usePluginState.editorAppearance;
|
|
51
|
+
var runtimeOverride = useSharedPluginStateWithSelector(api, ['toolbar'], function (states) {
|
|
52
|
+
var _states$toolbarState;
|
|
53
|
+
return (_states$toolbarState = states.toolbarState) === null || _states$toolbarState === void 0 ? void 0 : _states$toolbarState.contextualFormattingModeOverride;
|
|
54
|
+
});
|
|
50
55
|
var toolbar = parents.find(function (parent) {
|
|
51
56
|
return parent.type === 'toolbar';
|
|
52
57
|
});
|
|
53
|
-
var
|
|
58
|
+
var effectiveRuntimeOverride = runtimeOverride !== undefined && fg('platform_editor_toolbar_mode_override') ? runtimeOverride : undefined;
|
|
59
|
+
var contextualFormattingEnabled = (_ref2 = effectiveRuntimeOverride !== null && effectiveRuntimeOverride !== void 0 ? effectiveRuntimeOverride : api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.contextualFormattingMode()) !== null && _ref2 !== void 0 ? _ref2 : 'always-pinned';
|
|
54
60
|
if (isSharedSection && !shouldShowSection(editorViewMode, toolbar, editorToolbarDockingPreference, contextualFormattingEnabled)) {
|
|
55
61
|
return null;
|
|
56
62
|
}
|
|
@@ -13,6 +13,7 @@ import { AllSelection, TextSelection } from '@atlaskit/editor-prosemirror/state'
|
|
|
13
13
|
import { akEditorFloatingDialogZIndex } from '@atlaskit/editor-shared-styles';
|
|
14
14
|
import { ToolbarSection, ToolbarButtonGroup, ToolbarDropdownItemSection, useToolbarUI } from '@atlaskit/editor-toolbar';
|
|
15
15
|
import { ToolbarModelRenderer } from '@atlaskit/editor-toolbar-model';
|
|
16
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
16
17
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
17
18
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
18
19
|
import { SELECTION_TOOLBAR_LABEL } from '../consts';
|
|
@@ -23,12 +24,13 @@ var isToolbarComponent = function isToolbarComponent(component) {
|
|
|
23
24
|
};
|
|
24
25
|
var usePluginState = function usePluginState(api) {
|
|
25
26
|
return useSharedPluginStateWithSelector(api, ['connectivity', 'userPreferences', 'toolbar', 'selection', 'userIntent', 'editorViewMode'], function (state) {
|
|
26
|
-
var _state$connectivitySt, _state$userPreference, _state$toolbarState, _state$toolbarState2, _state$selectionState, _state$userIntentStat, _state$editorViewMode;
|
|
27
|
+
var _state$connectivitySt, _state$userPreference, _state$toolbarState, _state$toolbarState2, _state$toolbarState3, _state$selectionState, _state$userIntentStat, _state$editorViewMode;
|
|
27
28
|
return {
|
|
28
29
|
connectivityStateMode: (_state$connectivitySt = state.connectivityState) === null || _state$connectivitySt === void 0 ? void 0 : _state$connectivitySt.mode,
|
|
29
30
|
editorToolbarDockingPreference: (_state$userPreference = state.userPreferencesState) === null || _state$userPreference === void 0 || (_state$userPreference = _state$userPreference.preferences) === null || _state$userPreference === void 0 ? void 0 : _state$userPreference.toolbarDockingPosition,
|
|
30
31
|
shouldShowToolbar: (_state$toolbarState = state.toolbarState) === null || _state$toolbarState === void 0 ? void 0 : _state$toolbarState.shouldShowToolbar,
|
|
31
32
|
selectedNode: (_state$toolbarState2 = state.toolbarState) === null || _state$toolbarState2 === void 0 ? void 0 : _state$toolbarState2.selectedNode,
|
|
33
|
+
contextualFormattingModeOverride: (_state$toolbarState3 = state.toolbarState) === null || _state$toolbarState3 === void 0 ? void 0 : _state$toolbarState3.contextualFormattingModeOverride,
|
|
32
34
|
selection: (_state$selectionState = state.selectionState) === null || _state$selectionState === void 0 ? void 0 : _state$selectionState.selection,
|
|
33
35
|
currentUserIntent: (_state$userIntentStat = state.userIntentState) === null || _state$userIntentStat === void 0 ? void 0 : _state$userIntentStat.currentUserIntent,
|
|
34
36
|
editorViewMode: (_state$editorViewMode = state.editorViewModeState) === null || _state$editorViewMode === void 0 ? void 0 : _state$editorViewMode.mode
|
|
@@ -55,7 +57,7 @@ var useOnPositionCalculated = function useOnPositionCalculated(editorView) {
|
|
|
55
57
|
return onPositionCalculated;
|
|
56
58
|
};
|
|
57
59
|
export var SelectionToolbar = function SelectionToolbar(_ref) {
|
|
58
|
-
var
|
|
60
|
+
var _ref2, _api$toolbar, _api$toolbar2;
|
|
59
61
|
var api = _ref.api,
|
|
60
62
|
editorView = _ref.editorView,
|
|
61
63
|
mountPoint = _ref.mountPoint,
|
|
@@ -65,8 +67,10 @@ export var SelectionToolbar = function SelectionToolbar(_ref) {
|
|
|
65
67
|
editorToolbarDockingPreference = _usePluginState.editorToolbarDockingPreference,
|
|
66
68
|
currentUserIntent = _usePluginState.currentUserIntent,
|
|
67
69
|
shouldShowToolbar = _usePluginState.shouldShowToolbar,
|
|
68
|
-
editorViewMode = _usePluginState.editorViewMode
|
|
69
|
-
|
|
70
|
+
editorViewMode = _usePluginState.editorViewMode,
|
|
71
|
+
contextualFormattingModeOverride = _usePluginState.contextualFormattingModeOverride;
|
|
72
|
+
var effectiveRuntimeOverride = contextualFormattingModeOverride !== undefined && fg('platform_editor_toolbar_mode_override') ? contextualFormattingModeOverride : undefined;
|
|
73
|
+
var contextualFormattingEnabled = (_ref2 = effectiveRuntimeOverride !== null && effectiveRuntimeOverride !== void 0 ? effectiveRuntimeOverride : api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.contextualFormattingMode()) !== null && _ref2 !== void 0 ? _ref2 : 'always-pinned';
|
|
70
74
|
var selectionToolbarConfigEnabled = shouldShowSelectionToolbar(contextualFormattingEnabled, editorToolbarDockingPreference);
|
|
71
75
|
var intl = useIntl();
|
|
72
76
|
var components = api === null || api === void 0 || (_api$toolbar2 = api.toolbar) === null || _api$toolbar2 === void 0 ? void 0 : _api$toolbar2.actions.getComponents();
|
|
@@ -126,12 +130,12 @@ export var SelectionToolbar = function SelectionToolbar(_ref) {
|
|
|
126
130
|
}
|
|
127
131
|
}))));
|
|
128
132
|
};
|
|
129
|
-
export var SelectionToolbarWithErrorBoundary = function SelectionToolbarWithErrorBoundary(
|
|
133
|
+
export var SelectionToolbarWithErrorBoundary = function SelectionToolbarWithErrorBoundary(_ref3) {
|
|
130
134
|
var _api$analytics2;
|
|
131
|
-
var api =
|
|
132
|
-
editorView =
|
|
133
|
-
mountPoint =
|
|
134
|
-
disableSelectionToolbarWhenPinned =
|
|
135
|
+
var api = _ref3.api,
|
|
136
|
+
editorView = _ref3.editorView,
|
|
137
|
+
mountPoint = _ref3.mountPoint,
|
|
138
|
+
disableSelectionToolbarWhenPinned = _ref3.disableSelectionToolbarWhenPinned;
|
|
135
139
|
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
136
140
|
component: ACTION_SUBJECT.TOOLBAR,
|
|
137
141
|
componentId: ACTION_SUBJECT_ID.SELECTION_TOOLBAR,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { ContextualFormattingEnabledOptions } from '@atlaskit/editor-common/toolbar';
|
|
2
|
-
import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
|
|
3
3
|
import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
|
|
4
4
|
import type { ConnectivityPlugin } from '@atlaskit/editor-plugin-connectivity';
|
|
5
5
|
import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
|
|
@@ -11,6 +11,18 @@ import type { BreakpointPreset } from '@atlaskit/editor-toolbar';
|
|
|
11
11
|
import type { RegisterComponent } from '@atlaskit/editor-toolbar-model';
|
|
12
12
|
import type { RegisterComponentsAction, ToolbarPluginOptions } from './types';
|
|
13
13
|
export type EditorToolbarPluginState = {
|
|
14
|
+
/**
|
|
15
|
+
* Runtime override for the contextual-formatting mode. When set, callers
|
|
16
|
+
* should treat it as taking precedence over `contextualFormattingMode()`.
|
|
17
|
+
* Lives in PM state so React subscribers re-render on flip. Updated via
|
|
18
|
+
* the `setContextualFormattingModeOverride` command; consumers must read
|
|
19
|
+
* it via `useSharedPluginStateWithSelector(api, ['toolbar'], ...)` and
|
|
20
|
+
* merge it themselves — see SelectionToolbar / Section / FullPageToolbarNext
|
|
21
|
+
* for the merge pattern. Used by Markdown Mode to pin the primary toolbar
|
|
22
|
+
* while source / preview view is active (no PM selection to anchor a
|
|
23
|
+
* floating toolbar to).
|
|
24
|
+
*/
|
|
25
|
+
contextualFormattingModeOverride?: ContextualFormattingEnabledOptions;
|
|
14
26
|
selectedNode?: {
|
|
15
27
|
marks: string[];
|
|
16
28
|
node: PMNode;
|
|
@@ -46,6 +58,16 @@ export type ToolbarPlugin = NextEditorPlugin<'toolbar', {
|
|
|
46
58
|
getComponents: () => Array<RegisterComponent>;
|
|
47
59
|
registerComponents: RegisterComponentsAction;
|
|
48
60
|
};
|
|
61
|
+
commands: {
|
|
62
|
+
/**
|
|
63
|
+
* Sets (or clears) the runtime override for `contextualFormattingMode`.
|
|
64
|
+
* Pass `undefined` to clear and fall back to config / user preference.
|
|
65
|
+
* Used by Markdown Mode to pin the toolbar while the source / preview
|
|
66
|
+
* view is active. Exposed as a command (not an action) so callers can
|
|
67
|
+
* compose the meta onto an existing transaction and dispatch once.
|
|
68
|
+
*/
|
|
69
|
+
setContextualFormattingModeOverride: (mode: ContextualFormattingEnabledOptions | undefined) => EditorCommand;
|
|
70
|
+
};
|
|
49
71
|
dependencies: [
|
|
50
72
|
OptionalPlugin<UserIntentPlugin>,
|
|
51
73
|
OptionalPlugin<SelectionPlugin>,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { ContextualFormattingEnabledOptions } from '@atlaskit/editor-common/toolbar';
|
|
2
|
-
import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
|
|
3
3
|
import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
|
|
4
4
|
import type { ConnectivityPlugin } from '@atlaskit/editor-plugin-connectivity';
|
|
5
5
|
import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
|
|
@@ -11,6 +11,18 @@ import type { BreakpointPreset } from '@atlaskit/editor-toolbar';
|
|
|
11
11
|
import type { RegisterComponent } from '@atlaskit/editor-toolbar-model';
|
|
12
12
|
import type { RegisterComponentsAction, ToolbarPluginOptions } from './types';
|
|
13
13
|
export type EditorToolbarPluginState = {
|
|
14
|
+
/**
|
|
15
|
+
* Runtime override for the contextual-formatting mode. When set, callers
|
|
16
|
+
* should treat it as taking precedence over `contextualFormattingMode()`.
|
|
17
|
+
* Lives in PM state so React subscribers re-render on flip. Updated via
|
|
18
|
+
* the `setContextualFormattingModeOverride` command; consumers must read
|
|
19
|
+
* it via `useSharedPluginStateWithSelector(api, ['toolbar'], ...)` and
|
|
20
|
+
* merge it themselves — see SelectionToolbar / Section / FullPageToolbarNext
|
|
21
|
+
* for the merge pattern. Used by Markdown Mode to pin the primary toolbar
|
|
22
|
+
* while source / preview view is active (no PM selection to anchor a
|
|
23
|
+
* floating toolbar to).
|
|
24
|
+
*/
|
|
25
|
+
contextualFormattingModeOverride?: ContextualFormattingEnabledOptions;
|
|
14
26
|
selectedNode?: {
|
|
15
27
|
marks: string[];
|
|
16
28
|
node: PMNode;
|
|
@@ -46,6 +58,16 @@ export type ToolbarPlugin = NextEditorPlugin<'toolbar', {
|
|
|
46
58
|
getComponents: () => Array<RegisterComponent>;
|
|
47
59
|
registerComponents: RegisterComponentsAction;
|
|
48
60
|
};
|
|
61
|
+
commands: {
|
|
62
|
+
/**
|
|
63
|
+
* Sets (or clears) the runtime override for `contextualFormattingMode`.
|
|
64
|
+
* Pass `undefined` to clear and fall back to config / user preference.
|
|
65
|
+
* Used by Markdown Mode to pin the toolbar while the source / preview
|
|
66
|
+
* view is active. Exposed as a command (not an action) so callers can
|
|
67
|
+
* compose the meta onto an existing transaction and dispatch once.
|
|
68
|
+
*/
|
|
69
|
+
setContextualFormattingModeOverride: (mode: ContextualFormattingEnabledOptions | undefined) => EditorCommand;
|
|
70
|
+
};
|
|
49
71
|
dependencies: [
|
|
50
72
|
OptionalPlugin<UserIntentPlugin>,
|
|
51
73
|
OptionalPlugin<SelectionPlugin>,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-toolbar",
|
|
3
|
-
"version": "7.0
|
|
3
|
+
"version": "7.1.0",
|
|
4
4
|
"description": "Toolbar plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -40,12 +40,12 @@
|
|
|
40
40
|
"@atlaskit/editor-toolbar": "^1.0.0",
|
|
41
41
|
"@atlaskit/editor-toolbar-model": "^0.4.0",
|
|
42
42
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
43
|
-
"@atlaskit/tmp-editor-statsig": "^77.
|
|
43
|
+
"@atlaskit/tmp-editor-statsig": "^77.3.0",
|
|
44
44
|
"@babel/runtime": "^7.0.0",
|
|
45
45
|
"bind-event-listener": "^3.0.0"
|
|
46
46
|
},
|
|
47
47
|
"peerDependencies": {
|
|
48
|
-
"@atlaskit/editor-common": "^114.
|
|
48
|
+
"@atlaskit/editor-common": "^114.26.0",
|
|
49
49
|
"react": "^18.2.0",
|
|
50
50
|
"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
|
|
51
51
|
},
|
|
@@ -56,6 +56,9 @@
|
|
|
56
56
|
"platform_editor_toolbar_aifc_placement_overridden": {
|
|
57
57
|
"type": "boolean"
|
|
58
58
|
},
|
|
59
|
+
"platform_editor_toolbar_mode_override": {
|
|
60
|
+
"type": "boolean"
|
|
61
|
+
},
|
|
59
62
|
"platform_editor_toolbar_open_experience_fix": {
|
|
60
63
|
"type": "boolean"
|
|
61
64
|
}
|