@progress/kendo-editor-common 1.11.9-dev.202412020819 → 1.11.9-develop.2
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/dist/cdn/main.js +1 -1
- package/dist/es/DOMSerializer.js +71 -75
- package/dist/es/align.js +19 -16
- package/dist/es/blockNode.js +76 -78
- package/dist/es/blockquote.js +12 -9
- package/dist/es/cleanFormatting.js +16 -16
- package/dist/es/config/align-rules.js +8 -6
- package/dist/es/config/commands.js +9 -13
- package/dist/es/config/constants.js +9 -7
- package/dist/es/config/indent-rules.js +8 -6
- package/dist/es/config/keymap.js +20 -18
- package/dist/es/config/list-settings.js +7 -6
- package/dist/es/config/schema.js +184 -126
- package/dist/es/find-replace.js +34 -32
- package/dist/es/image.js +10 -7
- package/dist/es/indent.js +47 -44
- package/dist/es/inline-style.js +72 -70
- package/dist/es/link.js +51 -52
- package/dist/es/listConvert.js +37 -34
- package/dist/es/lists.js +83 -82
- package/dist/es/main.js +32 -33
- package/dist/es/mark.js +87 -92
- package/dist/es/paste.js +48 -46
- package/dist/es/plugins/caret-color.js +14 -11
- package/dist/es/plugins/csp-fix.js +23 -23
- package/dist/es/plugins/highlight.js +12 -10
- package/dist/es/plugins/image-resize.js +81 -81
- package/dist/es/plugins/list-markers-styles.js +43 -39
- package/dist/es/plugins/placeholder.js +12 -9
- package/dist/es/plugins/resize-utils.js +11 -9
- package/dist/es/plugins/spaces-fix.js +13 -10
- package/dist/es/plugins/table-resize/column-resize.js +104 -102
- package/dist/es/plugins/table-resize/index.js +10 -7
- package/dist/es/plugins/table-resize/row-resize.js +88 -89
- package/dist/es/plugins/table-resize/table-resize.js +129 -122
- package/dist/es/plugins/table-resize/table-view.js +46 -48
- package/dist/es/plugins/table-resize/utils.js +39 -41
- package/dist/es/source.js +78 -74
- package/dist/es/table.js +64 -66
- package/dist/es/text.js +4 -2
- package/dist/es/utils.js +107 -116
- package/dist/es2015/DOMSerializer.js +20 -17
- package/dist/es2015/align.js +6 -3
- package/dist/es2015/blockNode.js +15 -12
- package/dist/es2015/blockquote.js +5 -2
- package/dist/es2015/cleanFormatting.js +6 -3
- package/dist/es2015/config/align-rules.js +7 -5
- package/dist/es2015/config/commands.js +9 -13
- package/dist/es2015/config/constants.js +9 -7
- package/dist/es2015/config/indent-rules.js +6 -3
- package/dist/es2015/config/keymap.js +10 -7
- package/dist/es2015/config/list-settings.js +5 -3
- package/dist/es2015/config/schema.js +8 -6
- package/dist/es2015/find-replace.js +9 -6
- package/dist/es2015/image.js +5 -2
- package/dist/es2015/indent.js +14 -11
- package/dist/es2015/inline-style.js +9 -6
- package/dist/es2015/link.js +7 -4
- package/dist/es2015/listConvert.js +5 -2
- package/dist/es2015/lists.js +14 -11
- package/dist/es2015/main.js +32 -33
- package/dist/es2015/mark.js +15 -12
- package/dist/es2015/node_modules/tslib/tslib.es6.js +35 -0
- package/dist/es2015/paste.js +14 -11
- package/dist/es2015/plugins/caret-color.js +8 -5
- package/dist/es2015/plugins/csp-fix.js +5 -2
- package/dist/es2015/plugins/highlight.js +6 -3
- package/dist/es2015/plugins/image-resize.js +10 -7
- package/dist/es2015/plugins/list-markers-styles.js +6 -3
- package/dist/es2015/plugins/placeholder.js +5 -2
- package/dist/es2015/plugins/resize-utils.js +11 -9
- package/dist/es2015/plugins/spaces-fix.js +4 -1
- package/dist/es2015/plugins/table-resize/column-resize.js +24 -21
- package/dist/es2015/plugins/table-resize/index.js +9 -6
- package/dist/es2015/plugins/table-resize/row-resize.js +23 -20
- package/dist/es2015/plugins/table-resize/table-resize.js +20 -17
- package/dist/es2015/plugins/table-resize/table-view.js +9 -6
- package/dist/es2015/plugins/table-resize/utils.js +13 -10
- package/dist/es2015/source.js +24 -13
- package/dist/es2015/table.js +18 -15
- package/dist/es2015/text.js +3 -1
- package/dist/es2015/utils.js +22 -25
- package/dist/npm/DOMSerializer.js +73 -78
- package/dist/npm/align.d.ts +7 -4
- package/dist/npm/align.js +22 -21
- package/dist/npm/blockNode.d.ts +14 -15
- package/dist/npm/blockNode.js +91 -95
- package/dist/npm/blockquote.d.ts +5 -2
- package/dist/npm/blockquote.js +16 -15
- package/dist/npm/cleanFormatting.d.ts +6 -3
- package/dist/npm/cleanFormatting.js +17 -19
- package/dist/npm/config/align-rules.d.ts +8 -6
- package/dist/npm/config/align-rules.js +14 -9
- package/dist/npm/config/commands.d.ts +11 -19
- package/dist/npm/config/commands.js +17 -16
- package/dist/npm/config/constants.js +17 -10
- package/dist/npm/config/indent-rules.d.ts +6 -4
- package/dist/npm/config/indent-rules.js +11 -9
- package/dist/npm/config/keymap.d.ts +5 -2
- package/dist/npm/config/keymap.js +30 -30
- package/dist/npm/config/list-settings.js +13 -11
- package/dist/npm/config/schema.d.ts +4 -3
- package/dist/npm/config/schema.js +191 -134
- package/dist/npm/find-replace.d.ts +10 -7
- package/dist/npm/find-replace.js +47 -47
- package/dist/npm/image.d.ts +6 -3
- package/dist/npm/image.js +11 -10
- package/dist/npm/indent.d.ts +12 -9
- package/dist/npm/indent.js +68 -67
- package/dist/npm/inline-style.d.ts +7 -4
- package/dist/npm/inline-style.js +83 -83
- package/dist/npm/link.d.ts +4 -2
- package/dist/npm/link.js +58 -61
- package/dist/npm/listConvert.d.ts +3 -1
- package/dist/npm/listConvert.js +40 -39
- package/dist/npm/lists.d.ts +9 -9
- package/dist/npm/lists.js +94 -95
- package/dist/npm/main.d.ts +34 -33
- package/dist/npm/main.js +389 -198
- package/dist/npm/mark.d.ts +13 -18
- package/dist/npm/mark.js +104 -111
- package/dist/npm/paste.d.ts +12 -9
- package/dist/npm/paste.js +61 -61
- package/dist/npm/plugins/caret-color.d.ts +6 -3
- package/dist/npm/plugins/caret-color.js +21 -19
- package/dist/npm/plugins/csp-fix.d.ts +4 -1
- package/dist/npm/plugins/csp-fix.js +28 -30
- package/dist/npm/plugins/highlight.d.ts +7 -4
- package/dist/npm/plugins/highlight.js +17 -16
- package/dist/npm/plugins/image-resize.d.ts +7 -5
- package/dist/npm/plugins/image-resize.js +96 -97
- package/dist/npm/plugins/list-markers-styles.d.ts +5 -2
- package/dist/npm/plugins/list-markers-styles.js +49 -47
- package/dist/npm/plugins/placeholder.d.ts +4 -1
- package/dist/npm/plugins/placeholder.js +18 -17
- package/dist/npm/plugins/resize-utils.js +14 -12
- package/dist/npm/plugins/spaces-fix.d.ts +4 -1
- package/dist/npm/plugins/spaces-fix.js +19 -18
- package/dist/npm/plugins/table-resize/column-resize.js +117 -117
- package/dist/npm/plugins/table-resize/index.d.ts +5 -2
- package/dist/npm/plugins/table-resize/index.js +16 -15
- package/dist/npm/plugins/table-resize/row-resize.js +98 -101
- package/dist/npm/plugins/table-resize/table-resize.js +144 -139
- package/dist/npm/plugins/table-resize/table-view.js +59 -61
- package/dist/npm/plugins/table-resize/utils.d.ts +7 -17
- package/dist/npm/plugins/table-resize/utils.js +51 -52
- package/dist/npm/source.d.ts +18 -11
- package/dist/npm/source.js +94 -91
- package/dist/npm/table.d.ts +10 -9
- package/dist/npm/table.js +93 -82
- package/dist/npm/text.d.ts +6 -3
- package/dist/npm/text.js +5 -5
- package/dist/npm/types/active-marks.d.ts +4 -1
- package/dist/npm/types/command.d.ts +5 -2
- package/dist/npm/types/dispatchFn.d.ts +4 -1
- package/dist/npm/types/paste-cleanup-settings.d.ts +3 -1
- package/dist/npm/utils.d.ts +14 -29
- package/dist/npm/utils.js +133 -145
- package/package.json +35 -53
- package/dist/cdn/js/kendo-editor-common.js +0 -1
- package/dist/es/types/active-marks.js +0 -1
- package/dist/es/types/command.js +0 -1
- package/dist/es/types/dispatchFn.js +0 -1
- package/dist/es/types/paste-cleanup-settings.js +0 -1
- package/dist/es/types/predicate.js +0 -1
- package/dist/es2015/types/active-marks.js +0 -1
- package/dist/es2015/types/command.js +0 -1
- package/dist/es2015/types/dispatchFn.js +0 -1
- package/dist/es2015/types/paste-cleanup-settings.js +0 -1
- package/dist/es2015/types/predicate.js +0 -1
- package/dist/npm/DOMSerializer.d.ts +0 -35
- package/dist/npm/config/constants.d.ts +0 -7
- package/dist/npm/config/list-settings.d.ts +0 -30
- package/dist/npm/plugins/resize-utils.d.ts +0 -35
- package/dist/npm/plugins/table-resize/column-resize.d.ts +0 -2
- package/dist/npm/plugins/table-resize/row-resize.d.ts +0 -2
- package/dist/npm/plugins/table-resize/table-resize.d.ts +0 -18
- package/dist/npm/plugins/table-resize/table-view.d.ts +0 -28
- package/dist/npm/types/active-marks.js +0 -2
- package/dist/npm/types/command.js +0 -2
- package/dist/npm/types/dispatchFn.js +0 -2
- package/dist/npm/types/paste-cleanup-settings.js +0 -2
- package/dist/npm/types/predicate.d.ts +0 -1
- package/dist/npm/types/predicate.js +0 -2
- package/dist/systemjs/kendo-editor-common.js +0 -1
|
@@ -1,50 +1,48 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
var setSize = function (domNode, sizeType, value) {
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var prosemirrorState = require('prosemirror-state');
|
|
4
|
+
var prosemirrorView = require('prosemirror-view');
|
|
5
|
+
var constants = require('../config/constants.js');
|
|
6
|
+
var utils = require('../utils.js');
|
|
7
|
+
var resizeUtils = require('./resize-utils.js');
|
|
8
|
+
|
|
9
|
+
const imageResizeKey = new prosemirrorState.PluginKey('image-resize');
|
|
10
|
+
const setSize = (domNode, sizeType, value) => {
|
|
12
11
|
domNode.style[sizeType] = value + 'px';
|
|
13
12
|
};
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
13
|
+
const reSize = /[^\-]width:|[^\-]height:/;
|
|
14
|
+
const reAnyValue = /^.+$/;
|
|
15
|
+
class ResizeState {
|
|
16
|
+
constructor(activeHandle, dragging, rect, nodePosition) {
|
|
18
17
|
this.activeHandle = activeHandle;
|
|
19
18
|
this.dragging = dragging;
|
|
20
19
|
this.rect = rect;
|
|
21
20
|
this.nodePosition = nodePosition;
|
|
22
21
|
}
|
|
23
|
-
|
|
24
|
-
|
|
22
|
+
apply(tr) {
|
|
23
|
+
const next = tr.getMeta(imageResizeKey);
|
|
25
24
|
if (next) {
|
|
26
25
|
return new ResizeState(next.activeHandle, next.setDragging, next.rect, next.nodePosition);
|
|
27
26
|
}
|
|
28
27
|
return this;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
var rect = state.rect, dragging = state.dragging, nodePosition = state.nodePosition, activeHandle = state.activeHandle;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
const handleMouseMove = (view, event, options) => {
|
|
31
|
+
const state = imageResizeKey.getState(view.state);
|
|
32
|
+
const { rect, dragging, nodePosition: nodePosition, activeHandle } = state;
|
|
35
33
|
if (!dragging || !rect) {
|
|
36
34
|
return;
|
|
37
35
|
}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
36
|
+
const img = view.nodeDOM(nodePosition);
|
|
37
|
+
const dir = resizeUtils.directions[activeHandle];
|
|
38
|
+
const diffX = (event.clientX - dragging.startX) * dir.x;
|
|
39
|
+
const diffY = (event.clientY - dragging.startY) * dir.y;
|
|
40
|
+
let width = dir.x ? diffX + img.width : rect.width;
|
|
41
|
+
let height = dir.y ? diffY + img.height : rect.height;
|
|
44
42
|
if (options.lockRatio && dir.x && dir.y) {
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
43
|
+
const ratio = Math.min(width / img.width, height / img.height);
|
|
44
|
+
const lockWidth = img.width * ratio;
|
|
45
|
+
const lockHeight = img.height * ratio;
|
|
48
46
|
dragging.startX = event.clientX - (width - lockWidth) * dir.x;
|
|
49
47
|
dragging.startY = event.clientY - (height - lockHeight) * dir.y;
|
|
50
48
|
width = lockWidth;
|
|
@@ -60,59 +58,59 @@ var handleMouseMove = function (view, event, options) {
|
|
|
60
58
|
rect.left = img.offsetLeft;
|
|
61
59
|
rect.width = img.offsetWidth;
|
|
62
60
|
rect.height = img.offsetHeight;
|
|
63
|
-
|
|
61
|
+
const handlesWrapper = img.nextElementSibling;
|
|
64
62
|
handlesWrapper.style.width = rect.width + 'px';
|
|
65
63
|
handlesWrapper.style.height = rect.height + 'px';
|
|
66
64
|
handlesWrapper.style.top = rect.top + 'px';
|
|
67
65
|
handlesWrapper.style.left = rect.left + 'px';
|
|
68
66
|
};
|
|
69
|
-
|
|
70
|
-
|
|
67
|
+
const handleMouseUp = (view) => {
|
|
68
|
+
const { rect, dragging, nodePosition } = imageResizeKey.getState(view.state);
|
|
71
69
|
if (dragging && rect) {
|
|
72
|
-
|
|
73
|
-
if (selection instanceof
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
70
|
+
const selection = view.state.selection;
|
|
71
|
+
if (selection instanceof prosemirrorState.NodeSelection) {
|
|
72
|
+
const currAttrs = selection.node.attrs;
|
|
73
|
+
const width = rect.width;
|
|
74
|
+
const height = rect.height;
|
|
75
|
+
let attrs;
|
|
78
76
|
if (reSize.test(currAttrs.style || '')) {
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
attrs =
|
|
77
|
+
const changedWidth = utils.changeStylesString(currAttrs.style, { style: 'width', value: reAnyValue, newValue: width + 'px' });
|
|
78
|
+
const { style } = utils.changeStylesString(changedWidth.style || '', { style: 'height', value: reAnyValue, newValue: height + 'px' });
|
|
79
|
+
attrs = { ...currAttrs, style };
|
|
82
80
|
}
|
|
83
81
|
else {
|
|
84
|
-
attrs =
|
|
82
|
+
attrs = { ...currAttrs, width, height };
|
|
85
83
|
}
|
|
86
|
-
|
|
84
|
+
const newImage = selection.node.type.createAndFill(attrs);
|
|
87
85
|
if (newImage) {
|
|
88
|
-
|
|
86
|
+
const tr = view.state.tr;
|
|
89
87
|
tr.replaceWith(nodePosition, nodePosition + 1, newImage);
|
|
90
|
-
tr.setSelection(
|
|
88
|
+
tr.setSelection(prosemirrorState.NodeSelection.create(tr.doc, nodePosition));
|
|
91
89
|
tr.setMeta('commandName', 'image-resize');
|
|
92
90
|
tr.setMeta('args', attrs);
|
|
93
|
-
tr.setMeta(
|
|
91
|
+
tr.setMeta(imageResizeKey, {
|
|
94
92
|
setDragging: null,
|
|
95
93
|
activeHandle: null,
|
|
96
|
-
rect
|
|
97
|
-
nodePosition
|
|
94
|
+
rect,
|
|
95
|
+
nodePosition
|
|
98
96
|
});
|
|
99
97
|
view.dispatch(tr);
|
|
100
98
|
}
|
|
101
99
|
}
|
|
102
100
|
}
|
|
103
101
|
};
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
102
|
+
const handleMouseDown = (view, event, options) => {
|
|
103
|
+
const target = event.target;
|
|
104
|
+
const activeHandle = target.getAttribute(constants.dataResizeDirImage);
|
|
107
105
|
if (!activeHandle) {
|
|
108
106
|
return false;
|
|
109
107
|
}
|
|
110
|
-
|
|
108
|
+
const resizeState = imageResizeKey.getState(view.state);
|
|
111
109
|
event.preventDefault();
|
|
112
|
-
|
|
113
|
-
transaction.setMeta(
|
|
110
|
+
const transaction = view.state.tr;
|
|
111
|
+
transaction.setMeta(imageResizeKey, {
|
|
114
112
|
setDragging: { startX: event.clientX, startY: event.clientY },
|
|
115
|
-
activeHandle
|
|
113
|
+
activeHandle,
|
|
116
114
|
rect: resizeState.rect,
|
|
117
115
|
nodePosition: resizeState.nodePosition
|
|
118
116
|
});
|
|
@@ -130,41 +128,40 @@ var handleMouseDown = function (view, event, options) {
|
|
|
130
128
|
event.view.addEventListener('mousemove', move);
|
|
131
129
|
return true;
|
|
132
130
|
};
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
if (exports.imageResizeKey.getState(viewObj.state).rect) {
|
|
131
|
+
const imageResizing = (options = { node: 'image', lockRatio: true }) => {
|
|
132
|
+
return new prosemirrorState.Plugin({
|
|
133
|
+
key: imageResizeKey,
|
|
134
|
+
view: (viewObj) => ({
|
|
135
|
+
resize() {
|
|
136
|
+
if (imageResizeKey.getState(viewObj.state).rect) {
|
|
140
137
|
viewObj.dispatch(viewObj.state.tr.setMeta('resize', true));
|
|
141
138
|
}
|
|
142
139
|
},
|
|
143
140
|
get window() {
|
|
144
141
|
return viewObj.dom.ownerDocument && viewObj.dom.ownerDocument.defaultView;
|
|
145
142
|
},
|
|
146
|
-
attachResize
|
|
147
|
-
|
|
143
|
+
attachResize() {
|
|
144
|
+
const win = this.window;
|
|
148
145
|
if (win) {
|
|
149
146
|
win.removeEventListener('resize', this.resize);
|
|
150
147
|
win.addEventListener('resize', this.resize);
|
|
151
148
|
}
|
|
152
149
|
},
|
|
153
|
-
removeResize
|
|
154
|
-
|
|
150
|
+
removeResize() {
|
|
151
|
+
const win = this.window;
|
|
155
152
|
if (win) {
|
|
156
153
|
win.removeEventListener('resize', this.resize);
|
|
157
154
|
}
|
|
158
155
|
},
|
|
159
|
-
update
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
if (selection instanceof
|
|
166
|
-
|
|
167
|
-
|
|
156
|
+
update(view, prevState) {
|
|
157
|
+
const state = view.state;
|
|
158
|
+
const selection = state.selection;
|
|
159
|
+
const nodeType = state.schema.nodes[options.node];
|
|
160
|
+
const pluginState = imageResizeKey.getState(state);
|
|
161
|
+
const prevRect = pluginState.rect;
|
|
162
|
+
if (selection instanceof prosemirrorState.NodeSelection && nodeType === selection.node.type) {
|
|
163
|
+
const img = view.nodeDOM(selection.from);
|
|
164
|
+
const rect = {
|
|
168
165
|
top: img.offsetTop,
|
|
169
166
|
left: img.offsetLeft,
|
|
170
167
|
width: img.offsetWidth,
|
|
@@ -173,8 +170,8 @@ var imageResizing = function (options) {
|
|
|
173
170
|
if (!prevState.selection.eq(selection) ||
|
|
174
171
|
(prevRect && (prevRect.width !== rect.width || prevRect.height !== rect.height ||
|
|
175
172
|
prevRect.top !== rect.top || prevRect.left !== rect.left))) {
|
|
176
|
-
|
|
177
|
-
tr.setMeta(
|
|
173
|
+
const tr = state.tr;
|
|
174
|
+
tr.setMeta(imageResizeKey, { rect, nodePosition: selection.from });
|
|
178
175
|
view.dispatch(tr);
|
|
179
176
|
this.attachResize();
|
|
180
177
|
}
|
|
@@ -184,46 +181,48 @@ var imageResizing = function (options) {
|
|
|
184
181
|
pluginState.nodePosition = -1;
|
|
185
182
|
}
|
|
186
183
|
},
|
|
187
|
-
destroy
|
|
184
|
+
destroy() {
|
|
188
185
|
this.removeResize();
|
|
189
186
|
}
|
|
190
|
-
})
|
|
187
|
+
}),
|
|
191
188
|
state: {
|
|
192
|
-
init
|
|
189
|
+
init() {
|
|
193
190
|
return new ResizeState('', null, null, -1);
|
|
194
191
|
},
|
|
195
|
-
apply
|
|
192
|
+
apply(tr, prev) {
|
|
196
193
|
return prev.apply(tr);
|
|
197
194
|
}
|
|
198
195
|
},
|
|
199
196
|
props: {
|
|
200
197
|
handleDOMEvents: {
|
|
201
|
-
mousedown
|
|
198
|
+
mousedown(view, event) {
|
|
202
199
|
return handleMouseDown(view, event, options);
|
|
203
200
|
}
|
|
204
201
|
},
|
|
205
|
-
decorations
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
if (rect && selection instanceof
|
|
210
|
-
|
|
202
|
+
decorations(state) {
|
|
203
|
+
const selection = state.selection;
|
|
204
|
+
const nodeType = state.schema.nodes[options.node];
|
|
205
|
+
const rect = imageResizeKey.getState(state).rect;
|
|
206
|
+
if (rect && selection instanceof prosemirrorState.NodeSelection && nodeType === selection.node.type) {
|
|
207
|
+
const wrapper = document.createElement('div');
|
|
211
208
|
wrapper.className = 'k-editor-resize-handles-wrapper';
|
|
212
209
|
wrapper.style.width = rect.width + 'px';
|
|
213
210
|
wrapper.style.height = rect.height + 'px';
|
|
214
211
|
wrapper.style.top = rect.top + 'px';
|
|
215
212
|
wrapper.style.left = rect.left + 'px';
|
|
216
|
-
for (
|
|
217
|
-
|
|
218
|
-
dom.className =
|
|
219
|
-
dom.setAttribute(
|
|
213
|
+
for (let i = 0; i < resizeUtils.handles.length; i++) {
|
|
214
|
+
const dom = document.createElement('div');
|
|
215
|
+
dom.className = constants.resizeHandle + ' ' + resizeUtils.handles[i];
|
|
216
|
+
dom.setAttribute(constants.dataResizeDirImage, resizeUtils.handles[i]);
|
|
220
217
|
wrapper.appendChild(dom);
|
|
221
218
|
}
|
|
222
|
-
return
|
|
219
|
+
return prosemirrorView.DecorationSet.create(state.doc, [prosemirrorView.Decoration.widget(state.selection.from + 1, wrapper)]);
|
|
223
220
|
}
|
|
224
|
-
return
|
|
221
|
+
return prosemirrorView.DecorationSet.empty;
|
|
225
222
|
}
|
|
226
223
|
}
|
|
227
224
|
});
|
|
228
225
|
};
|
|
226
|
+
|
|
227
|
+
exports.imageResizeKey = imageResizeKey;
|
|
229
228
|
exports.imageResizing = imageResizing;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Plugin } from 'prosemirror-state';
|
|
2
|
-
|
|
2
|
+
|
|
3
|
+
interface ListMarkersStylesOptions {
|
|
3
4
|
listItem: string;
|
|
4
5
|
resetValues: {
|
|
5
6
|
'font-size': string;
|
|
@@ -10,4 +11,6 @@ export interface ListMarkersStylesOptions {
|
|
|
10
11
|
/**
|
|
11
12
|
* Returns a plugin which applies font-size, font-family, color styles to list item marker.
|
|
12
13
|
*/
|
|
13
|
-
|
|
14
|
+
declare function listMarkersStyles(options?: ListMarkersStylesOptions): Plugin;
|
|
15
|
+
|
|
16
|
+
export { type ListMarkersStylesOptions, listMarkersStyles };
|
|
@@ -1,15 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var wrapper, parentLi;
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var prosemirrorState = require('prosemirror-state');
|
|
4
|
+
var prosemirrorTransform = require('prosemirror-transform');
|
|
5
|
+
var utils = require('../utils.js');
|
|
6
|
+
|
|
7
|
+
const inSelection = (from, to, nodePos, node, doc) => {
|
|
8
|
+
const $from = doc.resolve(from);
|
|
9
|
+
const $to = doc.resolve(to);
|
|
10
|
+
const nodeName = node.type.name;
|
|
11
|
+
let wrapper, parentLi;
|
|
13
12
|
if (!$from.nodeBefore) {
|
|
14
13
|
wrapper = $from.node($from.depth);
|
|
15
14
|
parentLi = $from.node($from.depth - 1);
|
|
@@ -26,44 +25,47 @@ var inSelection = function (from, to, nodePos, node, doc) {
|
|
|
26
25
|
}
|
|
27
26
|
return from <= nodePos && nodePos + node.content.size <= to;
|
|
28
27
|
};
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
doc.nodesBetween(from, to,
|
|
28
|
+
const applyToListItems = (tr, state, options) => {
|
|
29
|
+
const { tr: transaction, doc, selection: { from, to } } = state;
|
|
30
|
+
const args = tr.getMeta('args');
|
|
31
|
+
doc.nodesBetween(from, to, (node, pos) => {
|
|
33
32
|
if ((node.type.name === options.listItem) && inSelection(from, to, pos, node, doc)) {
|
|
34
|
-
transaction.setNodeMarkup(pos, null,
|
|
33
|
+
transaction.setNodeMarkup(pos, null, {
|
|
34
|
+
...node.attrs,
|
|
35
|
+
style: utils.applyStyle(node.attrs.style, args.style, args.value)
|
|
36
|
+
});
|
|
35
37
|
}
|
|
36
38
|
});
|
|
37
39
|
return transaction.docChanged ? transaction : undefined;
|
|
38
40
|
};
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
doc.nodesBetween(from, to,
|
|
41
|
+
const cleanListItems = (tr, state, options) => {
|
|
42
|
+
const stylesToClean = Object.keys(options.resetValues);
|
|
43
|
+
const { tr: transaction, doc, selection: { from, to } } = state;
|
|
44
|
+
doc.nodesBetween(from, to, (node, pos) => {
|
|
43
45
|
if (node.type.name === options.listItem && inSelection(from, to, pos, node, doc)) {
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
stylesToClean.forEach(
|
|
47
|
-
if (
|
|
48
|
-
|
|
46
|
+
let attrs = node.attrs;
|
|
47
|
+
const nodeStyles = utils.parseStyle(node.attrs.style);
|
|
48
|
+
stylesToClean.forEach(style => {
|
|
49
|
+
if (nodeStyles[style]) {
|
|
50
|
+
attrs = { ...attrs, style: utils.applyStyle(attrs.style, style, '') };
|
|
49
51
|
}
|
|
50
52
|
});
|
|
51
|
-
if (
|
|
52
|
-
transaction.setNodeMarkup(pos, null,
|
|
53
|
+
if (attrs !== node.attrs) {
|
|
54
|
+
transaction.setNodeMarkup(pos, null, attrs);
|
|
53
55
|
}
|
|
54
56
|
}
|
|
55
57
|
});
|
|
56
|
-
tr.steps.forEach(
|
|
57
|
-
if (step instanceof
|
|
58
|
-
|
|
58
|
+
tr.steps.forEach((step) => {
|
|
59
|
+
if (step instanceof prosemirrorTransform.RemoveMarkStep) {
|
|
60
|
+
const mark = step.mark;
|
|
59
61
|
if (mark.type.name === 'style' && mark.attrs.style) {
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
62
|
+
const [name] = mark.attrs.style.split(/\s*:\s*/);
|
|
63
|
+
const $pos = transaction.doc.resolve(step.from);
|
|
64
|
+
const li = utils.parentNode($pos, n => n.type.name === options.listItem);
|
|
63
65
|
if (li) {
|
|
64
|
-
|
|
65
|
-
if (liStyles[
|
|
66
|
-
|
|
66
|
+
const liStyles = utils.parseStyle(li.node.attrs.style);
|
|
67
|
+
if (liStyles[name] && options.resetValues[name]) {
|
|
68
|
+
const newMark = mark.type.create({ style: `${name}: ${options.resetValues[name]};` });
|
|
67
69
|
transaction.addMark(step.from, step.to, newMark);
|
|
68
70
|
}
|
|
69
71
|
}
|
|
@@ -72,10 +74,10 @@ var cleanListItems = function (tr, state, options) {
|
|
|
72
74
|
});
|
|
73
75
|
return transaction.docChanged ? transaction : undefined;
|
|
74
76
|
};
|
|
75
|
-
|
|
77
|
+
const DEFAULT_OPTIONS = {
|
|
76
78
|
listItem: 'list_item',
|
|
77
79
|
resetValues: {
|
|
78
|
-
'font-size': '',
|
|
80
|
+
'font-size': '', // 'initial' or '16px'
|
|
79
81
|
'font-family': '',
|
|
80
82
|
'color': ''
|
|
81
83
|
}
|
|
@@ -83,14 +85,13 @@ var DEFAULT_OPTIONS = {
|
|
|
83
85
|
/**
|
|
84
86
|
* Returns a plugin which applies font-size, font-family, color styles to list item marker.
|
|
85
87
|
*/
|
|
86
|
-
function listMarkersStyles(options) {
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
var transaction;
|
|
88
|
+
function listMarkersStyles(options = DEFAULT_OPTIONS) {
|
|
89
|
+
return new prosemirrorState.Plugin({
|
|
90
|
+
key: new prosemirrorState.PluginKey('list-markers-styles'),
|
|
91
|
+
appendTransaction: (transactions, _oldState, newState) => {
|
|
92
|
+
const tr = transactions.slice().pop();
|
|
93
|
+
const commandName = tr.getMeta('commandName');
|
|
94
|
+
let transaction;
|
|
94
95
|
if (commandName === 'FontSize' || commandName === 'FontName' || commandName === 'ForeColor') {
|
|
95
96
|
transaction = applyToListItems(tr, newState, options);
|
|
96
97
|
}
|
|
@@ -104,4 +105,5 @@ function listMarkersStyles(options) {
|
|
|
104
105
|
}
|
|
105
106
|
});
|
|
106
107
|
}
|
|
108
|
+
|
|
107
109
|
exports.listMarkersStyles = listMarkersStyles;
|
|
@@ -1,28 +1,29 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var
|
|
5
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var prosemirrorState = require('prosemirror-state');
|
|
4
|
+
var prosemirrorView = require('prosemirror-view');
|
|
5
|
+
|
|
6
6
|
function placeholder(message) {
|
|
7
|
-
|
|
8
|
-
return new
|
|
9
|
-
key: new
|
|
7
|
+
const decAttrs = { class: 'k-placeholder', 'data-placeholder': message };
|
|
8
|
+
return new prosemirrorState.Plugin({
|
|
9
|
+
key: new prosemirrorState.PluginKey('placeholder'),
|
|
10
10
|
props: {
|
|
11
|
-
decorations:
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
decorations: (state) => {
|
|
12
|
+
const { doc } = state;
|
|
13
|
+
const firstChild = doc.content.firstChild;
|
|
14
|
+
const empty = doc.childCount === 0 ||
|
|
15
15
|
(doc.childCount === 1 && firstChild.inlineContent && firstChild.childCount === 0);
|
|
16
16
|
if (!empty) {
|
|
17
|
-
return
|
|
17
|
+
return prosemirrorView.DecorationSet.empty;
|
|
18
18
|
}
|
|
19
|
-
|
|
20
|
-
doc.descendants(
|
|
21
|
-
decorations.push(
|
|
19
|
+
const decorations = [];
|
|
20
|
+
doc.descendants((node, pos) => {
|
|
21
|
+
decorations.push(prosemirrorView.Decoration.node(pos, pos + node.nodeSize, decAttrs));
|
|
22
22
|
});
|
|
23
|
-
return
|
|
23
|
+
return prosemirrorView.DecorationSet.create(doc, decorations);
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
});
|
|
27
27
|
}
|
|
28
|
+
|
|
28
29
|
exports.placeholder = placeholder;
|
|
@@ -1,14 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
'
|
|
6
|
-
'
|
|
7
|
-
'
|
|
8
|
-
'
|
|
9
|
-
'
|
|
10
|
-
'
|
|
11
|
-
'northwest': { x: -1, y: -1 },
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
const directions = {
|
|
4
|
+
'southeast': { x: 1, y: 1 }, // bottom right
|
|
5
|
+
'east': { x: 1, y: 0 }, // right
|
|
6
|
+
'south': { x: 0, y: 1 }, // bottom
|
|
7
|
+
'north': { x: 0, y: -1 }, // top
|
|
8
|
+
'west': { x: -1, y: 0 }, // left
|
|
9
|
+
'southwest': { x: -1, y: 1 }, // bottom left
|
|
10
|
+
'northwest': { x: -1, y: -1 }, // top left
|
|
12
11
|
'northeast': { x: 1, y: -1 } // top right
|
|
13
12
|
};
|
|
14
|
-
|
|
13
|
+
const handles = Object.keys(directions);
|
|
14
|
+
|
|
15
|
+
exports.directions = directions;
|
|
16
|
+
exports.handles = handles;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var
|
|
5
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var prosemirrorState = require('prosemirror-state');
|
|
4
|
+
var prosemirrorView = require('prosemirror-view');
|
|
5
|
+
|
|
6
6
|
// The plugin resolves the following problems:
|
|
7
7
|
//
|
|
8
8
|
// 1. white-space: pre-wrap does not work with text-align: justify in firefox
|
|
@@ -13,17 +13,17 @@ var prosemirror_view_1 = require("prosemirror-view");
|
|
|
13
13
|
// Additional info here:
|
|
14
14
|
// https://github.com/ProseMirror/prosemirror/issues/651
|
|
15
15
|
// https://github.com/ProseMirror/prosemirror/issues/857
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
key: new
|
|
16
|
+
const spaces = /\s+/g;
|
|
17
|
+
const align = /text-align/;
|
|
18
|
+
const aligned = (node) => align.test((node && node.attrs && node.attrs.style) || '');
|
|
19
|
+
const spacesFix = () => new prosemirrorState.Plugin({
|
|
20
|
+
key: new prosemirrorState.PluginKey('spaces-fix'),
|
|
21
21
|
props: {
|
|
22
|
-
decorations:
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
doc.nodesBetween(0, doc.content.size,
|
|
22
|
+
decorations: (state) => {
|
|
23
|
+
const decorations = [];
|
|
24
|
+
const doc = state.doc;
|
|
25
|
+
let start, match, length, i;
|
|
26
|
+
doc.nodesBetween(0, doc.content.size, (node, position, parent) => {
|
|
27
27
|
if (node.type.isText && aligned(parent)) {
|
|
28
28
|
match = spaces.exec(node.text || '');
|
|
29
29
|
while (match !== null) {
|
|
@@ -31,7 +31,7 @@ var spacesFix = function () { return new prosemirror_state_1.Plugin({
|
|
|
31
31
|
length = match[0].length;
|
|
32
32
|
if (match.index + length < match.input.length) {
|
|
33
33
|
for (i = 0; i <= length - 1; i += 2) {
|
|
34
|
-
decorations.push(
|
|
34
|
+
decorations.push(prosemirrorView.Decoration.inline(start + i, start + i + 1, {
|
|
35
35
|
style: 'white-space: normal'
|
|
36
36
|
}));
|
|
37
37
|
}
|
|
@@ -40,8 +40,9 @@ var spacesFix = function () { return new prosemirror_state_1.Plugin({
|
|
|
40
40
|
}
|
|
41
41
|
}
|
|
42
42
|
});
|
|
43
|
-
return
|
|
43
|
+
return prosemirrorView.DecorationSet.create(doc, decorations);
|
|
44
44
|
}
|
|
45
45
|
}
|
|
46
|
-
});
|
|
46
|
+
});
|
|
47
|
+
|
|
47
48
|
exports.spacesFix = spacesFix;
|