@atlaskit/editor-core 198.6.4 → 198.6.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 +24 -0
- package/dist/cjs/composable-editor/editor-internal.js +3 -27
- package/dist/cjs/composable-editor/hooks/useProviders.js +3 -5
- package/dist/cjs/composable-editor/utils/handleProviders.js +0 -3
- package/dist/cjs/create-editor/ReactEditorView.js +13 -44
- package/dist/cjs/ui/Appearance/Chromeless.js +1 -2
- package/dist/cjs/ui/Appearance/Comment/Comment.js +1 -2
- package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js +1 -1
- package/dist/cjs/ui/ContentStyles/index.js +5 -10
- package/dist/cjs/ui/EditorContext/index.js +8 -23
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/composable-editor/editor-internal.js +4 -28
- package/dist/es2019/composable-editor/hooks/useProviders.js +3 -5
- package/dist/es2019/composable-editor/utils/handleProviders.js +0 -3
- package/dist/es2019/create-editor/ReactEditorView.js +13 -44
- package/dist/es2019/ui/Appearance/Chromeless.js +1 -2
- package/dist/es2019/ui/Appearance/Comment/Comment.js +1 -2
- package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js +1 -1
- package/dist/es2019/ui/ContentStyles/index.js +12 -16
- package/dist/es2019/ui/EditorContext/index.js +8 -23
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/composable-editor/editor-internal.js +4 -28
- package/dist/esm/composable-editor/hooks/useProviders.js +3 -5
- package/dist/esm/composable-editor/utils/handleProviders.js +0 -3
- package/dist/esm/create-editor/ReactEditorView.js +13 -44
- package/dist/esm/ui/Appearance/Chromeless.js +1 -2
- package/dist/esm/ui/Appearance/Comment/Comment.js +1 -2
- package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js +1 -1
- package/dist/esm/ui/ContentStyles/index.js +5 -10
- package/dist/esm/ui/EditorContext/index.js +8 -23
- package/dist/esm/version-wrapper.js +1 -1
- package/dist/types/create-editor/ReactEditorView.d.ts +1 -2
- package/dist/types/create-editor/create-universal-preset.d.ts +50 -22
- package/dist/types/presets/default.d.ts +44 -16
- package/dist/types/presets/universal.d.ts +50 -22
- package/dist/types/presets/useUniversalPreset.d.ts +50 -22
- package/dist/types/ui/Appearance/FullPage/StyledComponents.d.ts +1 -1
- package/dist/types/ui/ContentStyles/index.d.ts +2 -2
- package/dist/types-ts4.5/create-editor/ReactEditorView.d.ts +1 -2
- package/dist/types-ts4.5/create-editor/create-universal-preset.d.ts +54 -22
- package/dist/types-ts4.5/presets/default.d.ts +48 -16
- package/dist/types-ts4.5/presets/universal.d.ts +54 -22
- package/dist/types-ts4.5/presets/useUniversalPreset.d.ts +54 -22
- package/dist/types-ts4.5/ui/Appearance/FullPage/StyledComponents.d.ts +1 -1
- package/dist/types-ts4.5/ui/ContentStyles/index.d.ts +2 -2
- package/package.json +12 -11
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,29 @@
|
|
|
1
1
|
# @atlaskit/editor-core
|
|
2
2
|
|
|
3
|
+
## 198.6.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#152823](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/152823)
|
|
8
|
+
[`0ec705650807f`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0ec705650807f) -
|
|
9
|
+
[ux] ED-25090: ED-25090: Migrated link toolbar and panel toolbar to use the new icons
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
12
|
+
## 198.6.5
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- [#152480](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/152480)
|
|
17
|
+
[`831fe131ac081`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/831fe131ac081) -
|
|
18
|
+
Remove FF platform_editor_td_provider_from_plugin_config
|
|
19
|
+
- [#152510](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/152510)
|
|
20
|
+
[`dcf9edde7ac7b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/dcf9edde7ac7b) -
|
|
21
|
+
bump adf-schema to 42.0.1
|
|
22
|
+
- [#152434](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/152434)
|
|
23
|
+
[`446eacc8ed3b5`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/446eacc8ed3b5) -
|
|
24
|
+
Cleanup FF platform_editor_remove_use_preset_context
|
|
25
|
+
- Updated dependencies
|
|
26
|
+
|
|
3
27
|
## 198.6.4
|
|
4
28
|
|
|
5
29
|
### Patch Changes
|
|
@@ -12,12 +12,10 @@ var _react = require("react");
|
|
|
12
12
|
var _react2 = require("@emotion/react");
|
|
13
13
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
14
14
|
var _portal = require("@atlaskit/editor-common/portal");
|
|
15
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
16
15
|
var _ErrorBoundary = _interopRequireDefault(require("../create-editor/ErrorBoundary"));
|
|
17
16
|
var _featureFlagsFromProps = require("../create-editor/feature-flags-from-props");
|
|
18
17
|
var _ReactEditorView = _interopRequireDefault(require("../create-editor/ReactEditorView"));
|
|
19
18
|
var _contextAdapter = require("../nodeviews/context-adapter");
|
|
20
|
-
var _context = require("../presets/context");
|
|
21
19
|
var _EditorContext = _interopRequireDefault(require("../ui/EditorContext"));
|
|
22
20
|
var _IntlProviderIfMissingWrapper = require("../ui/IntlProviderIfMissingWrapper/IntlProviderIfMissingWrapper");
|
|
23
21
|
var _RenderTracking = require("../utils/performance/components/RenderTracking");
|
|
@@ -143,39 +141,17 @@ var EditorInternal = exports.EditorInternal = /*#__PURE__*/(0, _react.memo)(func
|
|
|
143
141
|
});
|
|
144
142
|
function ReactEditorViewContextWrapper(props) {
|
|
145
143
|
var _media, _linking;
|
|
146
|
-
//
|
|
147
|
-
var setInternalEditorAPI = (0, _context.useSetPresetContext)();
|
|
148
|
-
var presetContextEditorAPI = (0, _context.usePresetContext)();
|
|
149
|
-
|
|
150
|
-
// new way of storing the editorApi when FF platform_editor_remove_use_preset_context is enabled
|
|
144
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
151
145
|
var _useState = (0, _react.useState)(undefined),
|
|
152
146
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
153
147
|
editorAPI = _useState2[0],
|
|
154
148
|
setEditorAPI = _useState2[1];
|
|
155
149
|
|
|
156
|
-
/**
|
|
157
|
-
* We use the context to retrieve the editorAPI
|
|
158
|
-
* externally for consumers via `usePreset`.
|
|
159
|
-
*
|
|
160
|
-
* However we also may need to retrieve this value internally via context
|
|
161
|
-
* so we should also set the value for the `EditorContext` that is used in
|
|
162
|
-
* `EditorInternal`.
|
|
163
|
-
*/
|
|
164
|
-
var setPresetContextEditorAPI = (0, _react.useCallback)(
|
|
165
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
166
|
-
function (api) {
|
|
167
|
-
if ((0, _platformFeatureFlags.fg)('platform_editor_remove_use_preset_context')) {
|
|
168
|
-
setEditorAPI(api);
|
|
169
|
-
} else {
|
|
170
|
-
setInternalEditorAPI === null || setInternalEditorAPI === void 0 || setInternalEditorAPI(api);
|
|
171
|
-
}
|
|
172
|
-
}, [setInternalEditorAPI, setEditorAPI]);
|
|
173
|
-
|
|
174
150
|
// TODO: Remove these when we deprecate these props from editor-props - smartLinks is unfortunately still used in some places, we can sidestep this problem if we move everyone across to ComposableEditor and deprecate Editor
|
|
175
151
|
var UNSAFE_cards = props.editorProps.UNSAFE_cards;
|
|
176
152
|
var smartLinks = props.editorProps.smartLinks;
|
|
177
153
|
(0, _useProviders.useProviders)({
|
|
178
|
-
editorApi:
|
|
154
|
+
editorApi: editorAPI,
|
|
179
155
|
contextIdentifierProvider: props.editorProps.contextIdentifierProvider,
|
|
180
156
|
mediaProvider: (_media = props.editorProps.media) === null || _media === void 0 ? void 0 : _media.provider,
|
|
181
157
|
cardProvider: ((_linking = props.editorProps.linking) === null || _linking === void 0 || (_linking = _linking.smartLinks) === null || _linking === void 0 ? void 0 : _linking.provider) || smartLinks && smartLinks.provider || UNSAFE_cards && UNSAFE_cards.provider,
|
|
@@ -185,6 +161,6 @@ function ReactEditorViewContextWrapper(props) {
|
|
|
185
161
|
});
|
|
186
162
|
return (0, _react2.jsx)(_ReactEditorView.default, (0, _extends2.default)({}, props, {
|
|
187
163
|
editorAPI: editorAPI,
|
|
188
|
-
|
|
164
|
+
setEditorAPI: setEditorAPI
|
|
189
165
|
}));
|
|
190
166
|
}
|
|
@@ -86,11 +86,9 @@ var useProviders = exports.useProviders = function useProviders(_ref) {
|
|
|
86
86
|
}
|
|
87
87
|
}, [autoformattingProvider, editorApi]);
|
|
88
88
|
(0, _react.useEffect)(function () {
|
|
89
|
-
if (
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
editorApi === null || editorApi === void 0 || (_editorApi$taskDecisi = editorApi.taskDecision) === null || _editorApi$taskDecisi === void 0 || _editorApi$taskDecisi.actions.setProvider(taskDecisionProvider);
|
|
93
|
-
}
|
|
89
|
+
if (taskDecisionProvider) {
|
|
90
|
+
var _editorApi$taskDecisi;
|
|
91
|
+
editorApi === null || editorApi === void 0 || (_editorApi$taskDecisi = editorApi.taskDecision) === null || _editorApi$taskDecisi === void 0 || _editorApi$taskDecisi.actions.setProvider(taskDecisionProvider);
|
|
94
92
|
}
|
|
95
93
|
}, [taskDecisionProvider, editorApi]);
|
|
96
94
|
};
|
|
@@ -28,9 +28,6 @@ function handleProviders(providerFactory, _ref, extensionProvider, quickInsertPr
|
|
|
28
28
|
searchProvider = _ref.searchProvider;
|
|
29
29
|
providerFactory.setProvider('emojiProvider', emojiProvider);
|
|
30
30
|
providerFactory.setProvider('mentionProvider', mentionProvider);
|
|
31
|
-
if (!(0, _platformFeatureFlags.fg)('platform_editor_td_provider_from_plugin_config')) {
|
|
32
|
-
providerFactory.setProvider('taskDecisionProvider', taskDecisionProvider);
|
|
33
|
-
}
|
|
34
31
|
providerFactory.setProvider('contextIdentifierProvider', contextIdentifierProvider);
|
|
35
32
|
providerFactory.setProvider('imageUploadProvider', imageUploadProvider);
|
|
36
33
|
providerFactory.setProvider('collabEditProvider', collabEditProvider);
|
|
@@ -31,7 +31,6 @@ var _state2 = require("@atlaskit/editor-prosemirror/state");
|
|
|
31
31
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
32
32
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
33
33
|
var _eventDispatcher = require("../event-dispatcher");
|
|
34
|
-
var _context = require("../presets/context");
|
|
35
34
|
var _findChangedNodesFromTransaction = require("../utils/findChangedNodesFromTransaction");
|
|
36
35
|
var _getNodesCount = require("../utils/getNodesCount");
|
|
37
36
|
var _isFullPage = require("../utils/is-full-page");
|
|
@@ -94,7 +93,7 @@ var ReactEditorView = exports.ReactEditorView = /*#__PURE__*/function (_React$Co
|
|
|
94
93
|
(0, _inherits2.default)(ReactEditorView, _React$Component);
|
|
95
94
|
var _super = _createSuper(ReactEditorView);
|
|
96
95
|
function ReactEditorView(props) {
|
|
97
|
-
var _this$props$editorPro5, _props$
|
|
96
|
+
var _this$props$editorPro5, _props$setEditorAPI, _props$editorProps;
|
|
98
97
|
var _this;
|
|
99
98
|
(0, _classCallCheck2.default)(this, ReactEditorView);
|
|
100
99
|
_this = _super.call(this, props);
|
|
@@ -548,7 +547,7 @@ var ReactEditorView = exports.ReactEditorView = /*#__PURE__*/function (_React$Co
|
|
|
548
547
|
getEditorView: _this.getEditorView
|
|
549
548
|
});
|
|
550
549
|
var _api = _this.pluginInjectionAPI.api();
|
|
551
|
-
(_props$
|
|
550
|
+
(_props$setEditorAPI = props.setEditorAPI) === null || _props$setEditorAPI === void 0 || _props$setEditorAPI.call(props, _api);
|
|
552
551
|
_this.eventDispatcher = new _eventDispatcher.EventDispatcher();
|
|
553
552
|
_this.dispatch = (0, _eventDispatcher.createDispatch)(_this.eventDispatcher);
|
|
554
553
|
_this.errorReporter = (0, _createEditor.createErrorReporter)(props.editorProps.errorReporterHandler);
|
|
@@ -762,36 +761,10 @@ var ReactEditorView = exports.ReactEditorView = /*#__PURE__*/function (_React$Co
|
|
|
762
761
|
}, {
|
|
763
762
|
key: "render",
|
|
764
763
|
value: function render() {
|
|
765
|
-
var _this$props$editorPro10,
|
|
766
|
-
_this3 = this;
|
|
764
|
+
var _this$props$editorPro10, _this$props$render, _this$props$render2, _this$props;
|
|
767
765
|
var renderTracking = (_this$props$editorPro10 = this.props.editorProps.performanceTracking) === null || _this$props$editorPro10 === void 0 || (_this$props$editorPro10 = _this$props$editorPro10.renderTracking) === null || _this$props$editorPro10 === void 0 ? void 0 : _this$props$editorPro10.reactEditorView;
|
|
768
766
|
var renderTrackingEnabled = renderTracking === null || renderTracking === void 0 ? void 0 : renderTracking.enabled;
|
|
769
767
|
var useShallow = renderTracking === null || renderTracking === void 0 ? void 0 : renderTracking.useShallow;
|
|
770
|
-
if ((0, _platformFeatureFlags.fg)('platform_editor_remove_use_preset_context')) {
|
|
771
|
-
var _this$props$render, _this$props$render2, _this$props;
|
|
772
|
-
return /*#__PURE__*/_react.default.createElement(_ReactEditorViewContext.default.Provider, {
|
|
773
|
-
value: {
|
|
774
|
-
editorRef: this.editorRef,
|
|
775
|
-
editorView: this.view,
|
|
776
|
-
popupsMountPoint: this.props.editorProps.popupsMountPoint
|
|
777
|
-
}
|
|
778
|
-
}, renderTrackingEnabled && /*#__PURE__*/_react.default.createElement(_RenderTracking.RenderTracking, {
|
|
779
|
-
componentProps: this.props,
|
|
780
|
-
action: _analytics.ACTION.RE_RENDERED,
|
|
781
|
-
actionSubject: _analytics.ACTION_SUBJECT.REACT_EDITOR_VIEW,
|
|
782
|
-
handleAnalyticsEvent: this.handleAnalyticsEvent,
|
|
783
|
-
useShallow: useShallow
|
|
784
|
-
}), this.props.render ? (_this$props$render = (_this$props$render2 = (_this$props = this.props).render) === null || _this$props$render2 === void 0 ? void 0 : _this$props$render2.call(_this$props, {
|
|
785
|
-
editor: this.editor,
|
|
786
|
-
view: this.view,
|
|
787
|
-
config: this.config,
|
|
788
|
-
eventDispatcher: this.eventDispatcher,
|
|
789
|
-
transformer: this.contentTransformer,
|
|
790
|
-
dispatchAnalyticsEvent: this.dispatchAnalyticsEvent,
|
|
791
|
-
editorRef: this.editorRef,
|
|
792
|
-
editorAPI: this.props.editorAPI
|
|
793
|
-
})) !== null && _this$props$render !== void 0 ? _this$props$render : this.editor : this.editor);
|
|
794
|
-
}
|
|
795
768
|
return /*#__PURE__*/_react.default.createElement(_ReactEditorViewContext.default.Provider, {
|
|
796
769
|
value: {
|
|
797
770
|
editorRef: this.editorRef,
|
|
@@ -804,20 +777,16 @@ var ReactEditorView = exports.ReactEditorView = /*#__PURE__*/function (_React$Co
|
|
|
804
777
|
actionSubject: _analytics.ACTION_SUBJECT.REACT_EDITOR_VIEW,
|
|
805
778
|
handleAnalyticsEvent: this.handleAnalyticsEvent,
|
|
806
779
|
useShallow: useShallow
|
|
807
|
-
}), this.props.render ?
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
editorRef: _this3.editorRef,
|
|
818
|
-
editorAPI: editorApi
|
|
819
|
-
})) !== null && _this3$props$render !== void 0 ? _this3$props$render : _this3.editor;
|
|
820
|
-
}) : this.editor);
|
|
780
|
+
}), this.props.render ? (_this$props$render = (_this$props$render2 = (_this$props = this.props).render) === null || _this$props$render2 === void 0 ? void 0 : _this$props$render2.call(_this$props, {
|
|
781
|
+
editor: this.editor,
|
|
782
|
+
view: this.view,
|
|
783
|
+
config: this.config,
|
|
784
|
+
eventDispatcher: this.eventDispatcher,
|
|
785
|
+
transformer: this.contentTransformer,
|
|
786
|
+
dispatchAnalyticsEvent: this.dispatchAnalyticsEvent,
|
|
787
|
+
editorRef: this.editorRef,
|
|
788
|
+
editorAPI: this.props.editorAPI
|
|
789
|
+
})) !== null && _this$props$render !== void 0 ? _this$props$render : this.editor : this.editor);
|
|
821
790
|
}
|
|
822
791
|
}]);
|
|
823
792
|
return ReactEditorView;
|
|
@@ -17,7 +17,6 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
17
17
|
var _react2 = require("@emotion/react");
|
|
18
18
|
var _hooks = require("@atlaskit/editor-common/hooks");
|
|
19
19
|
var _scrollbar = require("@atlaskit/editor-shared-styles/scrollbar");
|
|
20
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
21
20
|
var _ContentStyles = require("../ContentStyles");
|
|
22
21
|
var _PluginSlot = _interopRequireDefault(require("../PluginSlot"));
|
|
23
22
|
var _WithFlash = _interopRequireDefault(require("../WithFlash"));
|
|
@@ -111,7 +110,7 @@ var Editor = exports.default = /*#__PURE__*/function (_React$Component) {
|
|
|
111
110
|
, {
|
|
112
111
|
className: "ak-editor-content-area",
|
|
113
112
|
featureFlags: featureFlags,
|
|
114
|
-
viewMode:
|
|
113
|
+
viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode
|
|
115
114
|
}, customContentComponents && 'before' in customContentComponents ? customContentComponents.before : customContentComponents, (0, _react2.jsx)(_PluginSlot.default, {
|
|
116
115
|
editorView: editorView,
|
|
117
116
|
editorActions: editorActions,
|
|
@@ -19,7 +19,6 @@ var _ui = require("@atlaskit/editor-common/ui");
|
|
|
19
19
|
var _uiMenu = require("@atlaskit/editor-common/ui-menu");
|
|
20
20
|
var _commonStyles = require("@atlaskit/editor-plugins/table/ui/common-styles");
|
|
21
21
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
22
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
23
22
|
var _messages = _interopRequireDefault(require("../../../messages"));
|
|
24
23
|
var _Addon = require("../../Addon");
|
|
25
24
|
var _ContentStyles = require("../../ContentStyles");
|
|
@@ -224,7 +223,7 @@ var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEdit
|
|
|
224
223
|
'less-margin': width < _editorSharedStyles.akEditorMobileBreakoutPoint
|
|
225
224
|
}),
|
|
226
225
|
featureFlags: featureFlags,
|
|
227
|
-
viewMode:
|
|
226
|
+
viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode
|
|
228
227
|
}, customContentComponents && 'before' in customContentComponents ? customContentComponents.before : customContentComponents, (0, _react2.jsx)(_PluginSlot.default, {
|
|
229
228
|
editorView: editorView,
|
|
230
229
|
editorActions: editorActions,
|
|
@@ -61,7 +61,7 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
61
61
|
className: "fabric-editor-popup-scroll-parent",
|
|
62
62
|
featureFlags: props.featureFlags,
|
|
63
63
|
ref: scrollContainerRef,
|
|
64
|
-
viewMode:
|
|
64
|
+
viewMode: props === null || props === void 0 ? void 0 : props.viewMode
|
|
65
65
|
}, (0, _react2.jsx)(_Addon.ClickAreaBlock, {
|
|
66
66
|
editorView: props.editorView,
|
|
67
67
|
editorDisabled: props.disabled
|
|
@@ -12,7 +12,6 @@ var _react2 = require("@emotion/react");
|
|
|
12
12
|
var _browser = require("@atlaskit/editor-common/browser");
|
|
13
13
|
var _collab = require("@atlaskit/editor-common/collab");
|
|
14
14
|
var _emoji = require("@atlaskit/editor-common/emoji");
|
|
15
|
-
var _hooks = require("@atlaskit/editor-common/hooks");
|
|
16
15
|
var _mention = require("@atlaskit/editor-common/mention");
|
|
17
16
|
var _panel = require("@atlaskit/editor-common/panel");
|
|
18
17
|
var _selection = require("@atlaskit/editor-common/selection");
|
|
@@ -25,7 +24,6 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
|
25
24
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
26
25
|
var _tokens = require("@atlaskit/tokens");
|
|
27
26
|
var _getInlineNodeViewProducer = require("../../nodeviews/getInlineNodeViewProducer.styles");
|
|
28
|
-
var _context = require("../../presets/context");
|
|
29
27
|
var _aiPanels = require("./ai-panels");
|
|
30
28
|
var _codeBlock = require("./code-block");
|
|
31
29
|
var _date = require("./date");
|
|
@@ -36,7 +34,7 @@ var _media = require("./media");
|
|
|
36
34
|
var _panel2 = require("./panel");
|
|
37
35
|
var _status = require("./status");
|
|
38
36
|
var _tasksAndDecisions = require("./tasks-and-decisions");
|
|
39
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
|
|
37
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
|
|
40
38
|
/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
|
|
41
39
|
/* eslint-disable react-hooks/rules-of-hooks */
|
|
42
40
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Requires manual remediation over time due to use of unsafe nested mixins */
|
|
@@ -86,9 +84,9 @@ var fixBlockControlStylesSSR = exports.fixBlockControlStylesSSR = function fixBl
|
|
|
86
84
|
// The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
|
|
87
85
|
var akEditorBreakpointForSmallDevice = "1266px";
|
|
88
86
|
var contentStyles = function contentStyles(props) {
|
|
89
|
-
return (0, _react2.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: 52px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t", "\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t", "\n\n\t", "\n\t", "\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", ";\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\n .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t// For FullPage only when inside a table\n\t// Related code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\t// In the \"editorContentAreaContainerStyle\" function\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Link icon in the Atlaskit package\n is bigger than the others\n */\n\t
|
|
87
|
+
return (0, _react2.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: 52px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t", "\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px solid ", ";\n\t}\n\n\t", "\n\n\t", "\n\t", "\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", ";\n\t", "\n\t", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n\n .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t// For FullPage only when inside a table\n\t// Related code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\t// In the \"editorContentAreaContainerStyle\" function\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), _editorSharedStyles.akEditorGutterPadding, _editorSharedStyles.akEditorDefaultLayoutWidth, _editorSharedStyles.akEditorFullWidthLayoutWidth, _editorSharedStyles.akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, _editorSharedStyles.akEditorCalculatedWideLayoutWidth, (0, _editorSharedStyles.editorFontSize)({
|
|
90
88
|
theme: props.theme
|
|
91
|
-
}), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('editor_request_to_edit_task') ? null : (0, _react2.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\topacity: 0.7;\n\t\t\t\t}\n\t\t\t"]))), "var(--ds-border-focused, #8cf)", (0, _platformFeatureFlags.fg)('platform_editor_mark_boundary_cursor') ? (0, _react2.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\t\t\t\tdisplay: none;\n\t\t\t\t}\n\t\t\t"]))) : null, _styles5.placeholderTextStyles, placeholderStyles, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(props.typographyTheme), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, (0, _styles.backgroundColorStyles)(), listsStyles, ruleStyles(), _media.mediaStyles, (0, _layout.layoutStyles)(props.viewMode), _collab.telepointerStyle, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, emojiStyles, _styles.tasksAndDecisionsStyles, _styles.gridStyles, linkStyles, _styles.blockMarksSharedStyles, _styles.dateSharedStyle, _extension.extensionStyles, (0, _expand.expandStyles)(), _styles3.findReplaceStyles, _styles4.textHighlightStyle, _tasksAndDecisions.taskDecisionStyles, _status.statusStyles, (0, _styles.annotationSharedStyles)(), (0, _styles.smartCardStyles)(), _styles.smartCardSharedStyles, _date.dateStyles, _styles.embedCardStyles, _styles.unsupportedStyles, _styles.resizerStyles, (0, _aiPanels.aiPanelStyles)(props.colorMode), fixBlockControlStylesSSR(), _styles.MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT);
|
|
89
|
+
}), _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(props.typographyTheme), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('editor_request_to_edit_task') ? null : (0, _react2.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\topacity: 0.7;\n\t\t\t\t}\n\t\t\t"]))), "var(--ds-border-focused, #8cf)", (0, _platformFeatureFlags.fg)('platform_editor_mark_boundary_cursor') ? (0, _react2.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\t\t\t\tdisplay: none;\n\t\t\t\t}\n\t\t\t"]))) : null, _styles5.placeholderTextStyles, placeholderStyles, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(props.typographyTheme), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, (0, _styles.backgroundColorStyles)(), listsStyles, ruleStyles(), _media.mediaStyles, (0, _layout.layoutStyles)(props.viewMode), _collab.telepointerStyle, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, emojiStyles, _styles.tasksAndDecisionsStyles, _styles.gridStyles, linkStyles, _styles.blockMarksSharedStyles, _styles.dateSharedStyle, _extension.extensionStyles, (0, _expand.expandStyles)(), _styles3.findReplaceStyles, _styles4.textHighlightStyle, _tasksAndDecisions.taskDecisionStyles, _status.statusStyles, (0, _styles.annotationSharedStyles)(), (0, _styles.smartCardStyles)(), _styles.smartCardSharedStyles, _date.dateStyles, _styles.embedCardStyles, _styles.unsupportedStyles, _styles.resizerStyles, (0, _aiPanels.aiPanelStyles)(props.colorMode), fixBlockControlStylesSSR(), _styles.MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !(0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? (0, _react2.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
|
|
92
90
|
};
|
|
93
91
|
var createEditorContentStyle = exports.createEditorContentStyle = function createEditorContentStyle(styles) {
|
|
94
92
|
return /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
@@ -99,18 +97,15 @@ var createEditorContentStyle = exports.createEditorContentStyle = function creat
|
|
|
99
97
|
var _useThemeObserver = (0, _tokens.useThemeObserver)(),
|
|
100
98
|
colorMode = _useThemeObserver.colorMode,
|
|
101
99
|
typography = _useThemeObserver.typography;
|
|
102
|
-
var editorAPI = (0, _context.usePresetContext)();
|
|
103
|
-
var _useSharedPluginState = (0, _hooks.useSharedPluginState)(editorAPI, ['editorViewMode']),
|
|
104
|
-
editorViewModeState = _useSharedPluginState.editorViewModeState;
|
|
105
100
|
var memoizedStyle = (0, _react.useMemo)(function () {
|
|
106
101
|
return contentStyles({
|
|
107
102
|
theme: theme,
|
|
108
103
|
colorMode: colorMode,
|
|
109
104
|
featureFlags: featureFlags,
|
|
110
|
-
viewMode:
|
|
105
|
+
viewMode: props.viewMode,
|
|
111
106
|
typographyTheme: typography
|
|
112
107
|
});
|
|
113
|
-
}, [theme, colorMode, featureFlags,
|
|
108
|
+
}, [theme, colorMode, featureFlags, props.viewMode, typography]);
|
|
114
109
|
return (
|
|
115
110
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
116
111
|
(0, _react2.jsx)("div", {
|
|
@@ -16,7 +16,6 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
16
16
|
var _UNSAFE_do_not_use_editor_context = require("@atlaskit/editor-common/UNSAFE_do_not_use_editor_context");
|
|
17
17
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
18
18
|
var _actions = _interopRequireDefault(require("../../actions"));
|
|
19
|
-
var _context = require("../../presets/context");
|
|
20
19
|
function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
|
|
21
20
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
22
21
|
var useEditorContext = exports.useEditorContext = function useEditorContext() {
|
|
@@ -43,19 +42,11 @@ var LegacyEditorContext = exports.LegacyEditorContext = /*#__PURE__*/function (_
|
|
|
43
42
|
function LegacyEditorContextNew(_ref) {
|
|
44
43
|
var children = _ref.children,
|
|
45
44
|
editorActions = _ref.editorActions;
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
}, children);
|
|
52
|
-
} else {
|
|
53
|
-
return /*#__PURE__*/_react.default.createElement(_UNSAFE_do_not_use_editor_context.EditorContext.Provider, {
|
|
54
|
-
value: {
|
|
55
|
-
editorActions: editorActions !== null && editorActions !== void 0 ? editorActions : new _actions.default()
|
|
56
|
-
}
|
|
57
|
-
}, /*#__PURE__*/_react.default.createElement(_context.PresetContextProvider, null, children));
|
|
58
|
-
}
|
|
45
|
+
return /*#__PURE__*/_react.default.createElement(_UNSAFE_do_not_use_editor_context.EditorContext.Provider, {
|
|
46
|
+
value: {
|
|
47
|
+
editorActions: editorActions !== null && editorActions !== void 0 ? editorActions : new _actions.default()
|
|
48
|
+
}
|
|
49
|
+
}, children);
|
|
59
50
|
}
|
|
60
51
|
var LegacyEditorContextOld = exports.default = /*#__PURE__*/function (_React$Component2) {
|
|
61
52
|
(0, _inherits2.default)(LegacyEditorContextOld, _React$Component2);
|
|
@@ -77,15 +68,9 @@ var LegacyEditorContextOld = exports.default = /*#__PURE__*/function (_React$Com
|
|
|
77
68
|
}, {
|
|
78
69
|
key: "render",
|
|
79
70
|
value: function render() {
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
}, this.props.children);
|
|
84
|
-
} else {
|
|
85
|
-
return /*#__PURE__*/_react.default.createElement(_UNSAFE_do_not_use_editor_context.EditorContext.Provider, {
|
|
86
|
-
value: this.getChildContext()
|
|
87
|
-
}, /*#__PURE__*/_react.default.createElement(_context.PresetContextProvider, null, this.props.children));
|
|
88
|
-
}
|
|
71
|
+
return /*#__PURE__*/_react.default.createElement(_UNSAFE_do_not_use_editor_context.EditorContext.Provider, {
|
|
72
|
+
value: this.getChildContext()
|
|
73
|
+
}, this.props.children);
|
|
89
74
|
}
|
|
90
75
|
}]);
|
|
91
76
|
return LegacyEditorContextOld;
|
|
@@ -3,18 +3,16 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
3
3
|
* @jsxRuntime classic
|
|
4
4
|
* @jsx jsx
|
|
5
5
|
*/
|
|
6
|
-
import { Fragment, memo,
|
|
6
|
+
import { Fragment, memo, useState } from 'react';
|
|
7
7
|
|
|
8
8
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
9
9
|
import { css, jsx } from '@emotion/react';
|
|
10
10
|
import { ACTION, ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
|
|
11
11
|
import { usePortalProvider } from '@atlaskit/editor-common/portal';
|
|
12
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
12
|
import ErrorBoundary from '../create-editor/ErrorBoundary';
|
|
14
13
|
import { createFeatureFlagsFromProps } from '../create-editor/feature-flags-from-props';
|
|
15
14
|
import ReactEditorView from '../create-editor/ReactEditorView';
|
|
16
15
|
import { ContextAdapter } from '../nodeviews/context-adapter';
|
|
17
|
-
import { usePresetContext, useSetPresetContext } from '../presets/context';
|
|
18
16
|
import EditorContext from '../ui/EditorContext';
|
|
19
17
|
import { IntlProviderIfMissingWrapper } from '../ui/IntlProviderIfMissingWrapper/IntlProviderIfMissingWrapper';
|
|
20
18
|
import { RenderTracking } from '../utils/performance/components/RenderTracking';
|
|
@@ -135,36 +133,14 @@ export const EditorInternal = /*#__PURE__*/memo(({
|
|
|
135
133
|
});
|
|
136
134
|
function ReactEditorViewContextWrapper(props) {
|
|
137
135
|
var _media, _linking, _linking$smartLinks;
|
|
138
|
-
// deprecated, unable to be FF due to hook usage
|
|
139
|
-
const setInternalEditorAPI = useSetPresetContext();
|
|
140
|
-
const presetContextEditorAPI = usePresetContext();
|
|
141
|
-
|
|
142
|
-
// new way of storing the editorApi when FF platform_editor_remove_use_preset_context is enabled
|
|
143
|
-
const [editorAPI, setEditorAPI] = useState(undefined);
|
|
144
|
-
|
|
145
|
-
/**
|
|
146
|
-
* We use the context to retrieve the editorAPI
|
|
147
|
-
* externally for consumers via `usePreset`.
|
|
148
|
-
*
|
|
149
|
-
* However we also may need to retrieve this value internally via context
|
|
150
|
-
* so we should also set the value for the `EditorContext` that is used in
|
|
151
|
-
* `EditorInternal`.
|
|
152
|
-
*/
|
|
153
|
-
const setPresetContextEditorAPI = useCallback(
|
|
154
136
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
155
|
-
|
|
156
|
-
if (fg('platform_editor_remove_use_preset_context')) {
|
|
157
|
-
setEditorAPI(api);
|
|
158
|
-
} else {
|
|
159
|
-
setInternalEditorAPI === null || setInternalEditorAPI === void 0 ? void 0 : setInternalEditorAPI(api);
|
|
160
|
-
}
|
|
161
|
-
}, [setInternalEditorAPI, setEditorAPI]);
|
|
137
|
+
const [editorAPI, setEditorAPI] = useState(undefined);
|
|
162
138
|
|
|
163
139
|
// TODO: Remove these when we deprecate these props from editor-props - smartLinks is unfortunately still used in some places, we can sidestep this problem if we move everyone across to ComposableEditor and deprecate Editor
|
|
164
140
|
const UNSAFE_cards = props.editorProps.UNSAFE_cards;
|
|
165
141
|
const smartLinks = props.editorProps.smartLinks;
|
|
166
142
|
useProviders({
|
|
167
|
-
editorApi:
|
|
143
|
+
editorApi: editorAPI,
|
|
168
144
|
contextIdentifierProvider: props.editorProps.contextIdentifierProvider,
|
|
169
145
|
mediaProvider: (_media = props.editorProps.media) === null || _media === void 0 ? void 0 : _media.provider,
|
|
170
146
|
cardProvider: ((_linking = props.editorProps.linking) === null || _linking === void 0 ? void 0 : (_linking$smartLinks = _linking.smartLinks) === null || _linking$smartLinks === void 0 ? void 0 : _linking$smartLinks.provider) || smartLinks && smartLinks.provider || UNSAFE_cards && UNSAFE_cards.provider,
|
|
@@ -174,6 +150,6 @@ function ReactEditorViewContextWrapper(props) {
|
|
|
174
150
|
});
|
|
175
151
|
return jsx(ReactEditorView, _extends({}, props, {
|
|
176
152
|
editorAPI: editorAPI,
|
|
177
|
-
|
|
153
|
+
setEditorAPI: setEditorAPI
|
|
178
154
|
}));
|
|
179
155
|
}
|
|
@@ -57,11 +57,9 @@ export const useProviders = ({
|
|
|
57
57
|
}
|
|
58
58
|
}, [autoformattingProvider, editorApi]);
|
|
59
59
|
useEffect(() => {
|
|
60
|
-
if (
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
editorApi === null || editorApi === void 0 ? void 0 : (_editorApi$taskDecisi = editorApi.taskDecision) === null || _editorApi$taskDecisi === void 0 ? void 0 : _editorApi$taskDecisi.actions.setProvider(taskDecisionProvider);
|
|
64
|
-
}
|
|
60
|
+
if (taskDecisionProvider) {
|
|
61
|
+
var _editorApi$taskDecisi;
|
|
62
|
+
editorApi === null || editorApi === void 0 ? void 0 : (_editorApi$taskDecisi = editorApi.taskDecision) === null || _editorApi$taskDecisi === void 0 ? void 0 : _editorApi$taskDecisi.actions.setProvider(taskDecisionProvider);
|
|
65
63
|
}
|
|
66
64
|
}, [taskDecisionProvider, editorApi]);
|
|
67
65
|
};
|
|
@@ -24,9 +24,6 @@ export default function handleProviders(providerFactory, {
|
|
|
24
24
|
}, extensionProvider, quickInsertProvider) {
|
|
25
25
|
providerFactory.setProvider('emojiProvider', emojiProvider);
|
|
26
26
|
providerFactory.setProvider('mentionProvider', mentionProvider);
|
|
27
|
-
if (!fg('platform_editor_td_provider_from_plugin_config')) {
|
|
28
|
-
providerFactory.setProvider('taskDecisionProvider', taskDecisionProvider);
|
|
29
|
-
}
|
|
30
27
|
providerFactory.setProvider('contextIdentifierProvider', contextIdentifierProvider);
|
|
31
28
|
providerFactory.setProvider('imageUploadProvider', imageUploadProvider);
|
|
32
29
|
providerFactory.setProvider('collabEditProvider', collabEditProvider);
|
|
@@ -18,7 +18,6 @@ import { EditorState, Selection, TextSelection } from '@atlaskit/editor-prosemir
|
|
|
18
18
|
import { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
19
19
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
20
20
|
import { createDispatch, EventDispatcher } from '../event-dispatcher';
|
|
21
|
-
import { EditorAPIContext } from '../presets/context';
|
|
22
21
|
import { findChangedNodesFromTransaction } from '../utils/findChangedNodesFromTransaction';
|
|
23
22
|
import { getNodesCount } from '../utils/getNodesCount';
|
|
24
23
|
import { isFullPage } from '../utils/is-full-page';
|
|
@@ -95,7 +94,7 @@ export class ReactEditorView extends React.Component {
|
|
|
95
94
|
return ((_this$props$editorPro3 = this.props.editorProps) === null || _this$props$editorPro3 === void 0 ? void 0 : (_this$props$editorPro4 = _this$props$editorPro3.performanceTracking) === null || _this$props$editorPro4 === void 0 ? void 0 : (_this$props$editorPro5 = _this$props$editorPro4.transactionTracking) === null || _this$props$editorPro5 === void 0 ? void 0 : _this$props$editorPro5.enabled) === false;
|
|
96
95
|
}
|
|
97
96
|
constructor(props) {
|
|
98
|
-
var _this$props$editorPro12, _props$
|
|
97
|
+
var _this$props$editorPro12, _props$setEditorAPI, _props$editorProps, _props$editorProps$pe, _props$editorProps$pe2;
|
|
99
98
|
super(props);
|
|
100
99
|
_defineProperty(this, "editorRef", /*#__PURE__*/React.createRef());
|
|
101
100
|
// ProseMirror is instantiated prior to the initial React render cycle,
|
|
@@ -546,7 +545,7 @@ export class ReactEditorView extends React.Component {
|
|
|
546
545
|
getEditorView: this.getEditorView
|
|
547
546
|
});
|
|
548
547
|
const _api = this.pluginInjectionAPI.api();
|
|
549
|
-
(_props$
|
|
548
|
+
(_props$setEditorAPI = props.setEditorAPI) === null || _props$setEditorAPI === void 0 ? void 0 : _props$setEditorAPI.call(props, _api);
|
|
550
549
|
this.eventDispatcher = new EventDispatcher();
|
|
551
550
|
this.dispatch = createDispatch(this.eventDispatcher);
|
|
552
551
|
this.errorReporter = createErrorReporter(props.editorProps.errorReporterHandler);
|
|
@@ -706,35 +705,10 @@ export class ReactEditorView extends React.Component {
|
|
|
706
705
|
return this.editorPlugins;
|
|
707
706
|
}
|
|
708
707
|
render() {
|
|
709
|
-
var _this$props$editorPro14, _this$props$editorPro15;
|
|
708
|
+
var _this$props$editorPro14, _this$props$editorPro15, _this$props$render, _this$props$render2, _this$props;
|
|
710
709
|
const renderTracking = (_this$props$editorPro14 = this.props.editorProps.performanceTracking) === null || _this$props$editorPro14 === void 0 ? void 0 : (_this$props$editorPro15 = _this$props$editorPro14.renderTracking) === null || _this$props$editorPro15 === void 0 ? void 0 : _this$props$editorPro15.reactEditorView;
|
|
711
710
|
const renderTrackingEnabled = renderTracking === null || renderTracking === void 0 ? void 0 : renderTracking.enabled;
|
|
712
711
|
const useShallow = renderTracking === null || renderTracking === void 0 ? void 0 : renderTracking.useShallow;
|
|
713
|
-
if (fg('platform_editor_remove_use_preset_context')) {
|
|
714
|
-
var _this$props$render, _this$props$render2, _this$props;
|
|
715
|
-
return /*#__PURE__*/React.createElement(ReactEditorViewContext.Provider, {
|
|
716
|
-
value: {
|
|
717
|
-
editorRef: this.editorRef,
|
|
718
|
-
editorView: this.view,
|
|
719
|
-
popupsMountPoint: this.props.editorProps.popupsMountPoint
|
|
720
|
-
}
|
|
721
|
-
}, renderTrackingEnabled && /*#__PURE__*/React.createElement(RenderTracking, {
|
|
722
|
-
componentProps: this.props,
|
|
723
|
-
action: ACTION.RE_RENDERED,
|
|
724
|
-
actionSubject: ACTION_SUBJECT.REACT_EDITOR_VIEW,
|
|
725
|
-
handleAnalyticsEvent: this.handleAnalyticsEvent,
|
|
726
|
-
useShallow: useShallow
|
|
727
|
-
}), this.props.render ? (_this$props$render = (_this$props$render2 = (_this$props = this.props).render) === null || _this$props$render2 === void 0 ? void 0 : _this$props$render2.call(_this$props, {
|
|
728
|
-
editor: this.editor,
|
|
729
|
-
view: this.view,
|
|
730
|
-
config: this.config,
|
|
731
|
-
eventDispatcher: this.eventDispatcher,
|
|
732
|
-
transformer: this.contentTransformer,
|
|
733
|
-
dispatchAnalyticsEvent: this.dispatchAnalyticsEvent,
|
|
734
|
-
editorRef: this.editorRef,
|
|
735
|
-
editorAPI: this.props.editorAPI
|
|
736
|
-
})) !== null && _this$props$render !== void 0 ? _this$props$render : this.editor : this.editor);
|
|
737
|
-
}
|
|
738
712
|
return /*#__PURE__*/React.createElement(ReactEditorViewContext.Provider, {
|
|
739
713
|
value: {
|
|
740
714
|
editorRef: this.editorRef,
|
|
@@ -747,21 +721,16 @@ export class ReactEditorView extends React.Component {
|
|
|
747
721
|
actionSubject: ACTION_SUBJECT.REACT_EDITOR_VIEW,
|
|
748
722
|
handleAnalyticsEvent: this.handleAnalyticsEvent,
|
|
749
723
|
useShallow: useShallow
|
|
750
|
-
}), this.props.render ?
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
dispatchAnalyticsEvent: this.dispatchAnalyticsEvent,
|
|
761
|
-
editorRef: this.editorRef,
|
|
762
|
-
editorAPI: editorApi
|
|
763
|
-
})) !== null && _this$props$render3 !== void 0 ? _this$props$render3 : this.editor;
|
|
764
|
-
}) : this.editor);
|
|
724
|
+
}), this.props.render ? (_this$props$render = (_this$props$render2 = (_this$props = this.props).render) === null || _this$props$render2 === void 0 ? void 0 : _this$props$render2.call(_this$props, {
|
|
725
|
+
editor: this.editor,
|
|
726
|
+
view: this.view,
|
|
727
|
+
config: this.config,
|
|
728
|
+
eventDispatcher: this.eventDispatcher,
|
|
729
|
+
transformer: this.contentTransformer,
|
|
730
|
+
dispatchAnalyticsEvent: this.dispatchAnalyticsEvent,
|
|
731
|
+
editorRef: this.editorRef,
|
|
732
|
+
editorAPI: this.props.editorAPI
|
|
733
|
+
})) !== null && _this$props$render !== void 0 ? _this$props$render : this.editor : this.editor);
|
|
765
734
|
}
|
|
766
735
|
}
|
|
767
736
|
function getUAPrefix() {
|
|
@@ -9,7 +9,6 @@ import React, { Fragment } from 'react';
|
|
|
9
9
|
import { css, jsx } from '@emotion/react';
|
|
10
10
|
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
11
11
|
import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
|
|
12
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
12
|
import { createEditorContentStyle } from '../ContentStyles';
|
|
14
13
|
import PluginSlot from '../PluginSlot';
|
|
15
14
|
import WithFlash from '../WithFlash';
|
|
@@ -89,7 +88,7 @@ export default class Editor extends React.Component {
|
|
|
89
88
|
, {
|
|
90
89
|
className: "ak-editor-content-area",
|
|
91
90
|
featureFlags: featureFlags,
|
|
92
|
-
viewMode:
|
|
91
|
+
viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode
|
|
93
92
|
}, customContentComponents && 'before' in customContentComponents ? customContentComponents.before : customContentComponents, jsx(PluginSlot, {
|
|
94
93
|
editorView: editorView,
|
|
95
94
|
editorActions: editorActions,
|