@atlaskit/editor-plugin-limited-mode 0.0.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/LICENSE.md +11 -0
- package/README.md +1 -0
- package/afm-cc/tsconfig.json +27 -0
- package/afm-dev-agents/tsconfig.json +27 -0
- package/afm-jira/tsconfig.json +27 -0
- package/afm-post-office/tsconfig.json +27 -0
- package/afm-rovo-extension/tsconfig.json +27 -0
- package/afm-townsquare/tsconfig.json +27 -0
- package/build/tsconfig.json +17 -0
- package/dist/cjs/index.js +12 -0
- package/dist/cjs/limitedModePlugin.js +32 -0
- package/dist/cjs/limitedModePluginType.js +5 -0
- package/dist/cjs/pm-plugins/main.js +71 -0
- package/dist/es2019/index.js +4 -0
- package/dist/es2019/limitedModePlugin.js +26 -0
- package/dist/es2019/limitedModePluginType.js +1 -0
- package/dist/es2019/pm-plugins/main.js +63 -0
- package/dist/esm/index.js +4 -0
- package/dist/esm/limitedModePlugin.js +26 -0
- package/dist/esm/limitedModePluginType.js +1 -0
- package/dist/esm/pm-plugins/main.js +65 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/limitedModePlugin.d.ts +2 -0
- package/dist/types/limitedModePluginType.d.ts +11 -0
- package/dist/types/pm-plugins/main.d.ts +5 -0
- package/dist/types-ts4.5/index.d.ts +2 -0
- package/dist/types-ts4.5/limitedModePlugin.d.ts +2 -0
- package/dist/types-ts4.5/limitedModePluginType.d.ts +11 -0
- package/dist/types-ts4.5/pm-plugins/main.d.ts +5 -0
- package/docs/0-intro.tsx +43 -0
- package/package.json +81 -0
- package/tsconfig.json +8 -0
package/LICENSE.md
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
Copyright 2019 Atlassian Pty Ltd
|
|
2
|
+
|
|
3
|
+
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in
|
|
4
|
+
compliance with the License. You may obtain a copy of the License at
|
|
5
|
+
|
|
6
|
+
http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
+
|
|
8
|
+
Unless required by applicable law or agreed to in writing, software distributed under the License is
|
|
9
|
+
distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
|
10
|
+
implied. See the License for the specific language governing permissions and limitations under the
|
|
11
|
+
License.
|
package/README.md
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
# Editor plugin limited mode
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "../../../../tsconfig.entry-points.confluence.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"target": "es5",
|
|
5
|
+
"composite": true,
|
|
6
|
+
"outDir": "../../../../../confluence/tsDist/@atlaskit__editor-plugin-limited-mode",
|
|
7
|
+
"rootDir": "../"
|
|
8
|
+
},
|
|
9
|
+
"include": [
|
|
10
|
+
"../src/**/*.ts",
|
|
11
|
+
"../src/**/*.tsx"
|
|
12
|
+
],
|
|
13
|
+
"exclude": [
|
|
14
|
+
"../src/**/__tests__/*",
|
|
15
|
+
"../src/**/*.test.*",
|
|
16
|
+
"../src/**/test.*",
|
|
17
|
+
"../src/**/examples.*"
|
|
18
|
+
],
|
|
19
|
+
"references": [
|
|
20
|
+
{
|
|
21
|
+
"path": "../../tmp-editor-statsig/afm-cc/tsconfig.json"
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
"path": "../../editor-common/afm-cc/tsconfig.json"
|
|
25
|
+
}
|
|
26
|
+
]
|
|
27
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "../../../../tsconfig.entry-points.dev-agents.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"target": "es5",
|
|
5
|
+
"outDir": "../../../../../dev-agents/tsDist/@atlaskit__editor-plugin-limited-mode/app",
|
|
6
|
+
"rootDir": "../",
|
|
7
|
+
"composite": true
|
|
8
|
+
},
|
|
9
|
+
"include": [
|
|
10
|
+
"../src/**/*.ts",
|
|
11
|
+
"../src/**/*.tsx"
|
|
12
|
+
],
|
|
13
|
+
"exclude": [
|
|
14
|
+
"../src/**/__tests__/*",
|
|
15
|
+
"../src/**/*.test.*",
|
|
16
|
+
"../src/**/test.*",
|
|
17
|
+
"../src/**/examples.*"
|
|
18
|
+
],
|
|
19
|
+
"references": [
|
|
20
|
+
{
|
|
21
|
+
"path": "../../tmp-editor-statsig/afm-dev-agents/tsconfig.json"
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
"path": "../../editor-common/afm-dev-agents/tsconfig.json"
|
|
25
|
+
}
|
|
26
|
+
]
|
|
27
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "../../../../tsconfig.entry-points.jira.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"target": "es5",
|
|
5
|
+
"outDir": "../../../../../tsDist/@atlaskit__editor-plugin-limited-mode/app",
|
|
6
|
+
"rootDir": "../",
|
|
7
|
+
"composite": true
|
|
8
|
+
},
|
|
9
|
+
"include": [
|
|
10
|
+
"../src/**/*.ts",
|
|
11
|
+
"../src/**/*.tsx"
|
|
12
|
+
],
|
|
13
|
+
"exclude": [
|
|
14
|
+
"../src/**/__tests__/*",
|
|
15
|
+
"../src/**/*.test.*",
|
|
16
|
+
"../src/**/test.*",
|
|
17
|
+
"../src/**/examples.*"
|
|
18
|
+
],
|
|
19
|
+
"references": [
|
|
20
|
+
{
|
|
21
|
+
"path": "../../tmp-editor-statsig/afm-jira/tsconfig.json"
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
"path": "../../editor-common/afm-jira/tsconfig.json"
|
|
25
|
+
}
|
|
26
|
+
]
|
|
27
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "../../../../tsconfig.entry-points.post-office.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"target": "es5",
|
|
5
|
+
"outDir": "../../../../../post-office/tsDist/@atlaskit__editor-plugin-limited-mode/app",
|
|
6
|
+
"rootDir": "../",
|
|
7
|
+
"composite": true
|
|
8
|
+
},
|
|
9
|
+
"include": [
|
|
10
|
+
"../src/**/*.ts",
|
|
11
|
+
"../src/**/*.tsx"
|
|
12
|
+
],
|
|
13
|
+
"exclude": [
|
|
14
|
+
"../src/**/__tests__/*",
|
|
15
|
+
"../src/**/*.test.*",
|
|
16
|
+
"../src/**/test.*",
|
|
17
|
+
"../src/**/examples.*"
|
|
18
|
+
],
|
|
19
|
+
"references": [
|
|
20
|
+
{
|
|
21
|
+
"path": "../../tmp-editor-statsig/afm-post-office/tsconfig.json"
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
"path": "../../editor-common/afm-post-office/tsconfig.json"
|
|
25
|
+
}
|
|
26
|
+
]
|
|
27
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "../../../../tsconfig.entry-points.rovo-extension.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"target": "es5",
|
|
5
|
+
"outDir": "../../../../../rovo-extension/tsDist/@atlaskit__editor-plugin-limited-mode/app",
|
|
6
|
+
"rootDir": "../",
|
|
7
|
+
"composite": true
|
|
8
|
+
},
|
|
9
|
+
"include": [
|
|
10
|
+
"../src/**/*.ts",
|
|
11
|
+
"../src/**/*.tsx"
|
|
12
|
+
],
|
|
13
|
+
"exclude": [
|
|
14
|
+
"../src/**/__tests__/*",
|
|
15
|
+
"../src/**/*.test.*",
|
|
16
|
+
"../src/**/test.*",
|
|
17
|
+
"../src/**/examples.*"
|
|
18
|
+
],
|
|
19
|
+
"references": [
|
|
20
|
+
{
|
|
21
|
+
"path": "../../tmp-editor-statsig/afm-rovo-extension/tsconfig.json"
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
"path": "../../editor-common/afm-rovo-extension/tsconfig.json"
|
|
25
|
+
}
|
|
26
|
+
]
|
|
27
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "../../../../tsconfig.entry-points.townsquare.json",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"target": "es5",
|
|
5
|
+
"outDir": "../../../../../townsquare/tsDist/@atlaskit__editor-plugin-limited-mode/app",
|
|
6
|
+
"rootDir": "../",
|
|
7
|
+
"composite": true
|
|
8
|
+
},
|
|
9
|
+
"include": [
|
|
10
|
+
"../src/**/*.ts",
|
|
11
|
+
"../src/**/*.tsx"
|
|
12
|
+
],
|
|
13
|
+
"exclude": [
|
|
14
|
+
"../src/**/__tests__/*",
|
|
15
|
+
"../src/**/*.test.*",
|
|
16
|
+
"../src/**/test.*",
|
|
17
|
+
"../src/**/examples.*"
|
|
18
|
+
],
|
|
19
|
+
"references": [
|
|
20
|
+
{
|
|
21
|
+
"path": "../../tmp-editor-statsig/afm-townsquare/tsconfig.json"
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
"path": "../../editor-common/afm-townsquare/tsconfig.json"
|
|
25
|
+
}
|
|
26
|
+
]
|
|
27
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": "../tsconfig",
|
|
3
|
+
"compilerOptions": {
|
|
4
|
+
"target": "es5",
|
|
5
|
+
"paths": {}
|
|
6
|
+
},
|
|
7
|
+
"include": [
|
|
8
|
+
"../src/**/*.ts",
|
|
9
|
+
"../src/**/*.tsx"
|
|
10
|
+
],
|
|
11
|
+
"exclude": [
|
|
12
|
+
"../src/**/__tests__/*",
|
|
13
|
+
"../src/**/*.test.*",
|
|
14
|
+
"../src/**/test.*",
|
|
15
|
+
"../src/**/examples.*"
|
|
16
|
+
]
|
|
17
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "limitedModePlugin", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _limitedModePlugin.limitedModePlugin;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _limitedModePlugin = require("./limitedModePlugin");
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.limitedModePlugin = void 0;
|
|
7
|
+
var _main = require("./pm-plugins/main");
|
|
8
|
+
var limitedModePlugin = exports.limitedModePlugin = function limitedModePlugin() {
|
|
9
|
+
return {
|
|
10
|
+
name: 'limitedMode',
|
|
11
|
+
pmPlugins: function pmPlugins() {
|
|
12
|
+
return [{
|
|
13
|
+
name: 'limitedModePlugin',
|
|
14
|
+
plugin: _main.createPlugin
|
|
15
|
+
}];
|
|
16
|
+
},
|
|
17
|
+
getSharedState: function getSharedState(editorState) {
|
|
18
|
+
if (editorState) {
|
|
19
|
+
return {
|
|
20
|
+
get enabled() {
|
|
21
|
+
return _main.limitedModePluginKey.getState(editorState).documentSizeBreachesThreshold;
|
|
22
|
+
},
|
|
23
|
+
limitedModePluginKey: _main.limitedModePluginKey
|
|
24
|
+
};
|
|
25
|
+
}
|
|
26
|
+
return {
|
|
27
|
+
enabled: false,
|
|
28
|
+
limitedModePluginKey: _main.limitedModePluginKey
|
|
29
|
+
};
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
};
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.limitedModePluginKey = exports.createPlugin = void 0;
|
|
7
|
+
var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
|
|
8
|
+
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
9
|
+
var _expVal = require("@atlaskit/tmp-editor-statsig/expVal");
|
|
10
|
+
var limitedModePluginKey = exports.limitedModePluginKey = new _state.PluginKey('limitedModePlugin');
|
|
11
|
+
var createPlugin = exports.createPlugin = function createPlugin() {
|
|
12
|
+
var _view2;
|
|
13
|
+
var stateUpdated = false;
|
|
14
|
+
function updateState(view) {
|
|
15
|
+
var newState = _state.EditorState.create({
|
|
16
|
+
schema: view.state.schema,
|
|
17
|
+
doc: view.state.doc,
|
|
18
|
+
// remove the state plugin to trigger the view cleanup function
|
|
19
|
+
// @ts-ignore This plugin interaction is expected to be temporary - we can't pass the key via standard inter plugin communication as that would introduce cyclical dependencies
|
|
20
|
+
plugins: view.state.plugins.filter(function (p) {
|
|
21
|
+
return p.key !== 'blockControls$';
|
|
22
|
+
}) // Filter out the unwanted plugin
|
|
23
|
+
});
|
|
24
|
+
view.updateState(newState);
|
|
25
|
+
stateUpdated = true;
|
|
26
|
+
}
|
|
27
|
+
return new _safePlugin.SafePlugin({
|
|
28
|
+
key: limitedModePluginKey,
|
|
29
|
+
view: function view(_view) {
|
|
30
|
+
_view2 = _view;
|
|
31
|
+
return {};
|
|
32
|
+
},
|
|
33
|
+
state: {
|
|
34
|
+
init: function init(config, editorState) {
|
|
35
|
+
if (editorState.doc.childCount > (0, _expVal.expVal)('cc_editor_limited_mode', 'nodeSize', 100)) {
|
|
36
|
+
return {
|
|
37
|
+
documentSizeBreachesThreshold: true
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
return {
|
|
41
|
+
documentSizeBreachesThreshold: false
|
|
42
|
+
};
|
|
43
|
+
},
|
|
44
|
+
apply: function apply(tr, _currentPluginState) {
|
|
45
|
+
if (_currentPluginState.documentSizeBreachesThreshold) {
|
|
46
|
+
if (!stateUpdated) {
|
|
47
|
+
// when the document size reaches the threshold from the state initialisation there is no existing seam to communicate this
|
|
48
|
+
// to the controls plug-in without putting in limited mode specific logic inside the controls plug-in as well.
|
|
49
|
+
// to mitigate this we call the update state here. Which will mean the editor does not have state divergence
|
|
50
|
+
// between when limited mode kicks in on first load versus mid edit session.
|
|
51
|
+
updateState(_view2);
|
|
52
|
+
}
|
|
53
|
+
return {
|
|
54
|
+
documentSizeBreachesThreshold: true
|
|
55
|
+
};
|
|
56
|
+
}
|
|
57
|
+
if (tr.doc.childCount > (0, _expVal.expVal)('cc_editor_limited_mode', 'nodeSize', 100)) {
|
|
58
|
+
var customEvent = new CustomEvent('limited-mode-activated');
|
|
59
|
+
document.dispatchEvent(customEvent);
|
|
60
|
+
updateState(_view2);
|
|
61
|
+
return {
|
|
62
|
+
documentSizeBreachesThreshold: true
|
|
63
|
+
};
|
|
64
|
+
}
|
|
65
|
+
return {
|
|
66
|
+
documentSizeBreachesThreshold: false
|
|
67
|
+
};
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { createPlugin, limitedModePluginKey } from './pm-plugins/main';
|
|
2
|
+
export const limitedModePlugin = () => {
|
|
3
|
+
return {
|
|
4
|
+
name: 'limitedMode',
|
|
5
|
+
pmPlugins() {
|
|
6
|
+
return [{
|
|
7
|
+
name: 'limitedModePlugin',
|
|
8
|
+
plugin: createPlugin
|
|
9
|
+
}];
|
|
10
|
+
},
|
|
11
|
+
getSharedState(editorState) {
|
|
12
|
+
if (editorState) {
|
|
13
|
+
return {
|
|
14
|
+
get enabled() {
|
|
15
|
+
return limitedModePluginKey.getState(editorState).documentSizeBreachesThreshold;
|
|
16
|
+
},
|
|
17
|
+
limitedModePluginKey
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
return {
|
|
21
|
+
enabled: false,
|
|
22
|
+
limitedModePluginKey
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
2
|
+
import { EditorState, PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
3
|
+
import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
|
|
4
|
+
export const limitedModePluginKey = new PluginKey('limitedModePlugin');
|
|
5
|
+
export const createPlugin = () => {
|
|
6
|
+
let view;
|
|
7
|
+
let stateUpdated = false;
|
|
8
|
+
function updateState(view) {
|
|
9
|
+
const newState = EditorState.create({
|
|
10
|
+
schema: view.state.schema,
|
|
11
|
+
doc: view.state.doc,
|
|
12
|
+
// remove the state plugin to trigger the view cleanup function
|
|
13
|
+
// @ts-ignore This plugin interaction is expected to be temporary - we can't pass the key via standard inter plugin communication as that would introduce cyclical dependencies
|
|
14
|
+
plugins: view.state.plugins.filter(p => p.key !== 'blockControls$') // Filter out the unwanted plugin
|
|
15
|
+
});
|
|
16
|
+
view.updateState(newState);
|
|
17
|
+
stateUpdated = true;
|
|
18
|
+
}
|
|
19
|
+
return new SafePlugin({
|
|
20
|
+
key: limitedModePluginKey,
|
|
21
|
+
view: _view => {
|
|
22
|
+
view = _view;
|
|
23
|
+
return {};
|
|
24
|
+
},
|
|
25
|
+
state: {
|
|
26
|
+
init(config, editorState) {
|
|
27
|
+
if (editorState.doc.childCount > expVal('cc_editor_limited_mode', 'nodeSize', 100)) {
|
|
28
|
+
return {
|
|
29
|
+
documentSizeBreachesThreshold: true
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
return {
|
|
33
|
+
documentSizeBreachesThreshold: false
|
|
34
|
+
};
|
|
35
|
+
},
|
|
36
|
+
apply: (tr, _currentPluginState) => {
|
|
37
|
+
if (_currentPluginState.documentSizeBreachesThreshold) {
|
|
38
|
+
if (!stateUpdated) {
|
|
39
|
+
// when the document size reaches the threshold from the state initialisation there is no existing seam to communicate this
|
|
40
|
+
// to the controls plug-in without putting in limited mode specific logic inside the controls plug-in as well.
|
|
41
|
+
// to mitigate this we call the update state here. Which will mean the editor does not have state divergence
|
|
42
|
+
// between when limited mode kicks in on first load versus mid edit session.
|
|
43
|
+
updateState(view);
|
|
44
|
+
}
|
|
45
|
+
return {
|
|
46
|
+
documentSizeBreachesThreshold: true
|
|
47
|
+
};
|
|
48
|
+
}
|
|
49
|
+
if (tr.doc.childCount > expVal('cc_editor_limited_mode', 'nodeSize', 100)) {
|
|
50
|
+
const customEvent = new CustomEvent('limited-mode-activated');
|
|
51
|
+
document.dispatchEvent(customEvent);
|
|
52
|
+
updateState(view);
|
|
53
|
+
return {
|
|
54
|
+
documentSizeBreachesThreshold: true
|
|
55
|
+
};
|
|
56
|
+
}
|
|
57
|
+
return {
|
|
58
|
+
documentSizeBreachesThreshold: false
|
|
59
|
+
};
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { createPlugin, limitedModePluginKey } from './pm-plugins/main';
|
|
2
|
+
export var limitedModePlugin = function limitedModePlugin() {
|
|
3
|
+
return {
|
|
4
|
+
name: 'limitedMode',
|
|
5
|
+
pmPlugins: function pmPlugins() {
|
|
6
|
+
return [{
|
|
7
|
+
name: 'limitedModePlugin',
|
|
8
|
+
plugin: createPlugin
|
|
9
|
+
}];
|
|
10
|
+
},
|
|
11
|
+
getSharedState: function getSharedState(editorState) {
|
|
12
|
+
if (editorState) {
|
|
13
|
+
return {
|
|
14
|
+
get enabled() {
|
|
15
|
+
return limitedModePluginKey.getState(editorState).documentSizeBreachesThreshold;
|
|
16
|
+
},
|
|
17
|
+
limitedModePluginKey: limitedModePluginKey
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
return {
|
|
21
|
+
enabled: false,
|
|
22
|
+
limitedModePluginKey: limitedModePluginKey
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
2
|
+
import { EditorState, PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
3
|
+
import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
|
|
4
|
+
export var limitedModePluginKey = new PluginKey('limitedModePlugin');
|
|
5
|
+
export var createPlugin = function createPlugin() {
|
|
6
|
+
var _view2;
|
|
7
|
+
var stateUpdated = false;
|
|
8
|
+
function updateState(view) {
|
|
9
|
+
var newState = EditorState.create({
|
|
10
|
+
schema: view.state.schema,
|
|
11
|
+
doc: view.state.doc,
|
|
12
|
+
// remove the state plugin to trigger the view cleanup function
|
|
13
|
+
// @ts-ignore This plugin interaction is expected to be temporary - we can't pass the key via standard inter plugin communication as that would introduce cyclical dependencies
|
|
14
|
+
plugins: view.state.plugins.filter(function (p) {
|
|
15
|
+
return p.key !== 'blockControls$';
|
|
16
|
+
}) // Filter out the unwanted plugin
|
|
17
|
+
});
|
|
18
|
+
view.updateState(newState);
|
|
19
|
+
stateUpdated = true;
|
|
20
|
+
}
|
|
21
|
+
return new SafePlugin({
|
|
22
|
+
key: limitedModePluginKey,
|
|
23
|
+
view: function view(_view) {
|
|
24
|
+
_view2 = _view;
|
|
25
|
+
return {};
|
|
26
|
+
},
|
|
27
|
+
state: {
|
|
28
|
+
init: function init(config, editorState) {
|
|
29
|
+
if (editorState.doc.childCount > expVal('cc_editor_limited_mode', 'nodeSize', 100)) {
|
|
30
|
+
return {
|
|
31
|
+
documentSizeBreachesThreshold: true
|
|
32
|
+
};
|
|
33
|
+
}
|
|
34
|
+
return {
|
|
35
|
+
documentSizeBreachesThreshold: false
|
|
36
|
+
};
|
|
37
|
+
},
|
|
38
|
+
apply: function apply(tr, _currentPluginState) {
|
|
39
|
+
if (_currentPluginState.documentSizeBreachesThreshold) {
|
|
40
|
+
if (!stateUpdated) {
|
|
41
|
+
// when the document size reaches the threshold from the state initialisation there is no existing seam to communicate this
|
|
42
|
+
// to the controls plug-in without putting in limited mode specific logic inside the controls plug-in as well.
|
|
43
|
+
// to mitigate this we call the update state here. Which will mean the editor does not have state divergence
|
|
44
|
+
// between when limited mode kicks in on first load versus mid edit session.
|
|
45
|
+
updateState(_view2);
|
|
46
|
+
}
|
|
47
|
+
return {
|
|
48
|
+
documentSizeBreachesThreshold: true
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
if (tr.doc.childCount > expVal('cc_editor_limited_mode', 'nodeSize', 100)) {
|
|
52
|
+
var customEvent = new CustomEvent('limited-mode-activated');
|
|
53
|
+
document.dispatchEvent(customEvent);
|
|
54
|
+
updateState(_view2);
|
|
55
|
+
return {
|
|
56
|
+
documentSizeBreachesThreshold: true
|
|
57
|
+
};
|
|
58
|
+
}
|
|
59
|
+
return {
|
|
60
|
+
documentSizeBreachesThreshold: false
|
|
61
|
+
};
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
3
|
+
export type LimitedModePluginState = {
|
|
4
|
+
documentSizeBreachesThreshold: boolean;
|
|
5
|
+
};
|
|
6
|
+
export type LimitedModePlugin = NextEditorPlugin<'limitedMode', {
|
|
7
|
+
sharedState: {
|
|
8
|
+
enabled: boolean;
|
|
9
|
+
limitedModePluginKey: PluginKey<LimitedModePluginState>;
|
|
10
|
+
};
|
|
11
|
+
}>;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
2
|
+
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
3
|
+
import type { LimitedModePluginState } from '../limitedModePluginType';
|
|
4
|
+
export declare const limitedModePluginKey: PluginKey<any>;
|
|
5
|
+
export declare const createPlugin: () => SafePlugin<LimitedModePluginState>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
3
|
+
export type LimitedModePluginState = {
|
|
4
|
+
documentSizeBreachesThreshold: boolean;
|
|
5
|
+
};
|
|
6
|
+
export type LimitedModePlugin = NextEditorPlugin<'limitedMode', {
|
|
7
|
+
sharedState: {
|
|
8
|
+
enabled: boolean;
|
|
9
|
+
limitedModePluginKey: PluginKey<LimitedModePluginState>;
|
|
10
|
+
};
|
|
11
|
+
}>;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
2
|
+
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
3
|
+
import type { LimitedModePluginState } from '../limitedModePluginType';
|
|
4
|
+
export declare const limitedModePluginKey: PluginKey<any>;
|
|
5
|
+
export declare const createPlugin: () => SafePlugin<LimitedModePluginState>;
|
package/docs/0-intro.tsx
ADDED
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
import { AtlassianInternalWarning, code, md } from '@atlaskit/docs';
|
|
4
|
+
// eslint-disable-next-line @atlassian/tangerine/import/entry-points
|
|
5
|
+
import { createEditorUseOnlyNotice } from '@atlaskit/editor-common/doc-utils';
|
|
6
|
+
import { token } from '@atlaskit/tokens';
|
|
7
|
+
|
|
8
|
+
export default md`
|
|
9
|
+
|
|
10
|
+
${createEditorUseOnlyNotice('Editor Plugin Limited Mode', [
|
|
11
|
+
{ name: 'Editor Core', link: '/packages/editor/editor-core' },
|
|
12
|
+
])}
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
${
|
|
16
|
+
(
|
|
17
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
18
|
+
<div style={{ marginTop: token('space.100', '8px') }}>
|
|
19
|
+
<AtlassianInternalWarning />
|
|
20
|
+
</div>
|
|
21
|
+
)
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
This package includes the limited mode plugin used by \`@atlaskit/editor-core\`.
|
|
25
|
+
|
|
26
|
+
## Usage
|
|
27
|
+
---
|
|
28
|
+
|
|
29
|
+
The \`dependencies\`, \`configuration\`, \`state\`, \`actions\`, and \`commands\` of the plugin are defined
|
|
30
|
+
below:
|
|
31
|
+
|
|
32
|
+
${code`
|
|
33
|
+
type LimitedModePlugin = NextEditorPlugin<'limitedMode'>
|
|
34
|
+
`}
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
## Support
|
|
38
|
+
---
|
|
39
|
+
For internal Atlassian, visit the slack channel [#help-editor](https://atlassian.slack.com/archives/CFG3PSQ9E) for support or visit [go/editor-help](https://go/editor-help) to submit a bug.
|
|
40
|
+
## License
|
|
41
|
+
---
|
|
42
|
+
Please see [Atlassian Frontend - License](https://hello.atlassian.net/wiki/spaces/AF/pages/2589099144/Documentation#License) for more licensing information.
|
|
43
|
+
`;
|
package/package.json
ADDED
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@atlaskit/editor-plugin-limited-mode",
|
|
3
|
+
"version": "0.0.0",
|
|
4
|
+
"description": "LimitedMode plugin for @atlaskit/editor-core",
|
|
5
|
+
"author": "Atlassian Pty Ltd",
|
|
6
|
+
"license": "Apache-2.0",
|
|
7
|
+
"publishConfig": {
|
|
8
|
+
"registry": "https://registry.npmjs.org/"
|
|
9
|
+
},
|
|
10
|
+
"atlassian": {
|
|
11
|
+
"team": "Editor: Lego",
|
|
12
|
+
"releaseModel": "continuous",
|
|
13
|
+
"singleton": true
|
|
14
|
+
},
|
|
15
|
+
"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
|
|
16
|
+
"main": "dist/cjs/index.js",
|
|
17
|
+
"module": "dist/esm/index.js",
|
|
18
|
+
"module:es2019": "dist/es2019/index.js",
|
|
19
|
+
"types": "dist/types/index.d.ts",
|
|
20
|
+
"typesVersions": {
|
|
21
|
+
">=4.5 <4.9": {
|
|
22
|
+
"*": [
|
|
23
|
+
"dist/types-ts4.5/*",
|
|
24
|
+
"dist/types-ts4.5/index.d.ts"
|
|
25
|
+
]
|
|
26
|
+
}
|
|
27
|
+
},
|
|
28
|
+
"sideEffects": false,
|
|
29
|
+
"atlaskit:src": "src/index.ts",
|
|
30
|
+
"af:exports": {
|
|
31
|
+
".": "./src/index.ts"
|
|
32
|
+
},
|
|
33
|
+
"dependencies": {
|
|
34
|
+
"@atlaskit/editor-prosemirror": "7.0.0",
|
|
35
|
+
"@atlaskit/tmp-editor-statsig": "^9.27.0",
|
|
36
|
+
"@babel/runtime": "^7.0.0"
|
|
37
|
+
},
|
|
38
|
+
"peerDependencies": {
|
|
39
|
+
"@atlaskit/editor-common": "^107.20.0",
|
|
40
|
+
"react": "^18.2.0"
|
|
41
|
+
},
|
|
42
|
+
"devDependencies": {
|
|
43
|
+
"typescript": "~5.4.2"
|
|
44
|
+
},
|
|
45
|
+
"techstack": {
|
|
46
|
+
"@atlassian/frontend": {
|
|
47
|
+
"code-structure": [
|
|
48
|
+
"editor-plugin"
|
|
49
|
+
],
|
|
50
|
+
"import-structure": [
|
|
51
|
+
"atlassian-conventions"
|
|
52
|
+
],
|
|
53
|
+
"circular-dependencies": [
|
|
54
|
+
"file-and-folder-level"
|
|
55
|
+
]
|
|
56
|
+
},
|
|
57
|
+
"@repo/internal": {
|
|
58
|
+
"dom-events": "use-bind-event-listener",
|
|
59
|
+
"analytics": [
|
|
60
|
+
"analytics-next"
|
|
61
|
+
],
|
|
62
|
+
"design-tokens": [
|
|
63
|
+
"color"
|
|
64
|
+
],
|
|
65
|
+
"theming": [
|
|
66
|
+
"react-context"
|
|
67
|
+
],
|
|
68
|
+
"ui-components": [
|
|
69
|
+
"lite-mode"
|
|
70
|
+
],
|
|
71
|
+
"deprecation": "no-deprecated-imports",
|
|
72
|
+
"styling": [
|
|
73
|
+
"emotion",
|
|
74
|
+
"emotion"
|
|
75
|
+
],
|
|
76
|
+
"imports": [
|
|
77
|
+
"import-no-extraneous-disable-for-examples-and-docs"
|
|
78
|
+
]
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|