@modusoperandi/licit 1.4.2 → 1.4.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/BlockquoteInsertNewLineCommand.js.flow +70 -70
- package/BlockquoteNodeSpec.js.flow +29 -29
- package/BlockquoteToggleCommand.js.flow +56 -56
- package/BookmarkNodeSpec.js.flow +39 -39
- package/BulletListNodeSpec.js.flow +61 -61
- package/CZIProseMirror.js.flow +90 -90
- package/CodeBlockCommand.js.flow +65 -65
- package/CodeBlockNodeSpec.js.flow +24 -24
- package/CodeMarkSpec.js.flow +14 -14
- package/ContentPlaceholderPlugin.js.flow +183 -183
- package/CursorPlaceholderPlugin.js.flow +113 -113
- package/DocLayoutCommand.js.flow +97 -97
- package/DocNodeSpec.js.flow +62 -62
- package/EMMarkSpec.js.flow +39 -39
- package/EditorCommands.js.flow +124 -124
- package/EditorKeyMap.js.flow +173 -173
- package/EditorMarks.js +4 -2
- package/EditorMarks.js.flow +77 -74
- package/EditorNodes.js.flow +55 -55
- package/EditorPageLayoutPlugin.js.flow +67 -67
- package/EditorPlugins.js.flow +8 -8
- package/EditorSchema.js.flow +12 -12
- package/EditorState.js.flow +7 -7
- package/FontSizeMarkSpec.js.flow +54 -54
- package/FontTypeMarkSpec.js.flow +89 -89
- package/HTMLMutator.js.flow +58 -58
- package/HangingIndentMarkSpec.js +34 -0
- package/HangingIndentMarkSpec.js.flow +30 -0
- package/HardBreakNodeSpec.js.flow +15 -15
- package/HeadingNodeSpec.js.flow +42 -42
- package/HistoryRedoCommand.js.flow +41 -41
- package/HistoryUndoCommand.js.flow +41 -41
- package/HorizontalRuleCommand.js.flow +71 -71
- package/HorizontalRuleNodeSpec.js.flow +39 -39
- package/ImageUploadPlaceholderPlugin.js.flow +187 -187
- package/LICENSE +22 -22
- package/LinkMarkSpec.js +4 -2
- package/LinkMarkSpec.js.flow +38 -37
- package/LinkSetURLCommand.js +1 -1
- package/LinkSetURLCommand.js.flow +129 -129
- package/LinkTooltipPlugin.js +32 -38
- package/LinkTooltipPlugin.js.flow +204 -217
- package/ListItemInsertNewLineCommand.js.flow +76 -76
- package/ListItemMergeCommand.js.flow +197 -197
- package/ListItemNodeSpec.js.flow +52 -52
- package/ListSplitCommand.js.flow +54 -54
- package/ListToggleCommand.js.flow +99 -99
- package/MarkNames.js +2 -1
- package/MarkNames.js.flow +20 -19
- package/MarksClearCommand.js.flow +66 -66
- package/NodeNames.js.flow +23 -23
- package/OrderedListNodeSpec.js.flow +131 -131
- package/OverrideMarkSpec.js.flow +49 -49
- package/ParagraphNodeSpec.js +21 -2
- package/ParagraphNodeSpec.js.flow +233 -215
- package/ParagraphSpacingCommand.js.flow +139 -139
- package/PrintCommand.js.flow +53 -53
- package/SelectionPlaceholderPlugin.js.flow +129 -129
- package/SpacerMarkSpec.js.flow +47 -47
- package/StrikeMarkSpec.js.flow +24 -24
- package/StrongMarkSpec.js.flow +39 -39
- package/StyleView.js.flow +18 -18
- package/TableBackgroundColorCommand.js.flow +79 -79
- package/TableBorderColorCommand.js +5 -3
- package/TableBorderColorCommand.js.flow +108 -106
- package/TableCellColorCommand.js.flow +73 -73
- package/TableCellMenuPlugin.js.flow +129 -129
- package/TableInsertCommand.js.flow +117 -117
- package/TableMergeCellsCommand.js.flow +113 -113
- package/TableNodesSpecs.js.flow +144 -144
- package/TablePlugins.js.flow +14 -14
- package/TableResizePlugin.js.flow +636 -636
- package/TextColorMarkSpec.js.flow +40 -40
- package/TextHighlightMarkSpec.js.flow +47 -47
- package/TextInsertTabSpaceCommand.js +0 -3
- package/TextInsertTabSpaceCommand.js.flow +103 -106
- package/TextNoWrapMarkSpec.js.flow +14 -14
- package/TextNodeSpec.js.flow +7 -7
- package/TextSelectionMarkSpec.js.flow +24 -24
- package/TextSubMarkSpec.js.flow +28 -28
- package/TextSuperMarkSpec.js.flow +28 -28
- package/TextUnderlineMarkSpec.js.flow +24 -24
- package/Types.js.flow +77 -77
- package/WebFontLoader.js.flow +22 -22
- package/blockQuoteInputRule.js.flow +36 -36
- package/bom.xml +8645 -8637
- package/browser.js.flow +7 -7
- package/buildEditorPlugins.js.flow +48 -48
- package/buildInputRules.js.flow +85 -85
- package/client/CollabConnector.js.flow +90 -90
- package/client/EditorConnection.js.flow +324 -324
- package/client/Licit.js +40 -40
- package/client/Licit.js.flow +649 -648
- package/client/Licit.test.js.flow +104 -104
- package/client/Reporter.js.flow +35 -35
- package/client/SimpleConnector.js.flow +61 -61
- package/client/http.js.flow +60 -60
- package/client/licit.css +12 -12
- package/client/throttle.js.flow +27 -27
- package/convertFromDOMElement.js.flow +33 -33
- package/convertFromHTML.js.flow +15 -15
- package/convertFromJSON.js.flow +53 -53
- package/convertToCSSPTValue.js.flow +19 -19
- package/convertToJSON.js.flow +7 -7
- package/createCommand.js.flow +62 -62
- package/createEditorKeyMap.js.flow +87 -87
- package/createEmptyEditorState.js.flow +29 -29
- package/createTableResizingPlugin.js.flow +86 -86
- package/findActionableCell.js.flow +74 -74
- package/findActiveMark.js.flow +32 -32
- package/hyphenize.js.flow +17 -17
- package/index.d.ts +167 -167
- package/index.js.flow +10 -10
- package/insertTable.js.flow +54 -54
- package/isEditorStateEmpty.js.flow +32 -32
- package/isTableNode.js.flow +15 -15
- package/joinDown.js.flow +25 -25
- package/joinListNode.js.flow +55 -55
- package/joinUp.js.flow +37 -37
- package/keymaps.js.flow +175 -175
- package/lookUpElement.js.flow +14 -14
- package/nodeAt.js.flow +12 -12
- package/normalizeHTML.js.flow +80 -80
- package/package.json +152 -152
- package/patchAnchorElements.js.flow +38 -38
- package/patchBreakElements.js.flow +22 -22
- package/patchElementInlineStyles.js.flow +92 -92
- package/patchListElements.js.flow +275 -275
- package/patchMathElements.js.flow +58 -58
- package/patchParagraphElements.js.flow +20 -20
- package/patchStyleElements.js.flow +197 -197
- package/patchTableElements.js.flow +88 -88
- package/rebaseDocWithSteps.js.flow +42 -42
- package/sanitizeURL.js.flow +13 -13
- package/splitListItem.js.flow +191 -191
- package/styles.css +46 -46
- package/toClosestFontPtSize.js.flow +22 -22
- package/toSafeHTMLDocument.js.flow +9 -9
- package/toggleBlockquote.js.flow +101 -101
- package/toggleCodeBlock.js.flow +102 -102
- package/ui/AlertInfo.js.flow +63 -63
- package/ui/BookmarkNodeView.js.flow +64 -64
- package/ui/CommandButton.js.flow +68 -68
- package/ui/CommandMenu.js.flow +74 -74
- package/ui/CommandMenuButton.js.flow +128 -128
- package/ui/CustomEditorView.js.flow +29 -29
- package/ui/CustomMenu.js.flow +14 -14
- package/ui/CustomMenuItem.js.flow +35 -35
- package/ui/CustomNodeView.js.flow +207 -207
- package/ui/CustomRadioButton.js.flow +63 -63
- package/ui/DocLayoutEditor.js.flow +130 -130
- package/ui/Editor.js.flow +281 -281
- package/ui/EditorFrameset.js.flow +79 -79
- package/ui/EditorToolbar.js.flow +197 -197
- package/ui/EditorToolbarConfig.js.flow +162 -162
- package/ui/FontSizeCommandMenuButton.js.flow +66 -66
- package/ui/FontTypeCommandMenuButton.js.flow +60 -60
- package/ui/Frag.js.flow +11 -11
- package/ui/Icon.js +1 -1
- package/ui/Icon.js.flow +82 -82
- package/ui/ImageInlineEditor.js.flow +66 -66
- package/ui/KeyCodes.js.flow +12 -12
- package/ui/LinkTooltip.js.flow +51 -51
- package/ui/LinkURLEditor.js.flow +227 -227
- package/ui/ListItemNodeView.js.flow +101 -101
- package/ui/ListTypeButton.js.flow +121 -121
- package/ui/ListTypeCommandButton.js.flow +85 -85
- package/ui/ListTypeMenu.js.flow +78 -78
- package/ui/LoadingIndicator.js.flow +19 -19
- package/ui/PasteMenu.js.flow +52 -52
- package/ui/ResizeObserver.js.flow +105 -105
- package/ui/RichTextEditor.js.flow +133 -133
- package/ui/SelectionObserver.js.flow +134 -134
- package/ui/TableCellMenu.js.flow +49 -49
- package/ui/TableGridSizeEditor.js.flow +185 -185
- package/ui/TableNodeView.js.flow +36 -36
- package/ui/bindScrollHandler.js.flow +46 -46
- package/ui/canUseCSSFont.js.flow +42 -42
- package/ui/czi-body-layout-editor.css +16 -16
- package/ui/czi-bookmark-view.css +10 -10
- package/ui/czi-cursor-placeholder.css +36 -36
- package/ui/czi-custom-menu-button.css +18 -18
- package/ui/czi-custom-menu-item.css +30 -30
- package/ui/czi-custom-menu.css +8 -8
- package/ui/czi-custom-radio-button.css +80 -80
- package/ui/czi-custom-scrollbar.css +21 -21
- package/ui/czi-editor-frameset.css +81 -81
- package/ui/czi-editor-toolbar.css +122 -122
- package/ui/czi-editor.css +239 -216
- package/ui/czi-form.css +201 -201
- package/ui/czi-frag.css +3 -3
- package/ui/czi-heading.css +40 -40
- package/ui/czi-icon.css +72 -72
- package/ui/czi-image-resize-box.css +165 -165
- package/ui/czi-image-upload-editor.css +57 -57
- package/ui/czi-image-upload-placeholder.css +50 -50
- package/ui/czi-image-url-editor.css +38 -38
- package/ui/czi-image-view.css +121 -121
- package/ui/czi-indent.css +137 -137
- package/ui/czi-inline-editor.css +20 -20
- package/ui/czi-link-tooltip.css +112 -112
- package/ui/czi-list.css +406 -406
- package/ui/czi-loading-indicator.css +66 -66
- package/ui/czi-math-view.css +62 -62
- package/ui/czi-selection-placeholder.css +24 -24
- package/ui/czi-table-cell-menu.css +16 -16
- package/ui/czi-table-grid-size-editor.css +37 -37
- package/ui/czi-table.css +89 -89
- package/ui/czi-vars.css +47 -45
- package/ui/findActiveFontSize.js.flow +55 -55
- package/ui/findActiveFontType.js.flow +35 -35
- package/ui/fonts.css +460 -460
- package/ui/handleEditorDrop.js.flow +28 -28
- package/ui/handleEditorKeyDown.js.flow +39 -39
- package/ui/handleEditorPaste.js.flow +33 -33
- package/ui/htmlElementToRect.js.flow +18 -18
- package/ui/icon-font.css +9 -9
- package/ui/injectStyleSheet.js.flow +40 -40
- package/ui/isElementFullyVisible.js.flow +14 -14
- package/ui/isOffline.js.flow +8 -8
- package/ui/isReactClass.js.flow +12 -12
- package/ui/listType.css +21 -21
- package/ui/resolveImage.js.flow +121 -121
- package/ui/toCSSColor.js.flow +51 -51
- package/ui/toCSSLineSpacing.js.flow +53 -53
- package/ui/toHexColor.js.flow +26 -26
- package/ui/uuid.js.flow +9 -9
- package/uuid.js.flow +9 -9
|
@@ -1,73 +1,73 @@
|
|
|
1
|
-
// @flow
|
|
2
|
-
|
|
3
|
-
import { EditorState } from 'prosemirror-state';
|
|
4
|
-
import { setCellAttr } from 'prosemirror-tables';
|
|
5
|
-
import { Transform } from 'prosemirror-transform';
|
|
6
|
-
import { EditorView } from 'prosemirror-view';
|
|
7
|
-
import { ColorEditor } from '@modusoperandi/color-picker';
|
|
8
|
-
import { atAnchorRight, createPopUp } from '@modusoperandi/licit-ui-commands';
|
|
9
|
-
import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
|
|
10
|
-
|
|
11
|
-
const setCellBackgroundBlack = setCellAttr('background', '#000000');
|
|
12
|
-
|
|
13
|
-
class TableCellColorCommand extends UICommand {
|
|
14
|
-
_popUp = null;
|
|
15
|
-
|
|
16
|
-
shouldRespondToUIEvent = (e: SyntheticEvent<> | MouseEvent): boolean => {
|
|
17
|
-
return e.type === UICommand.EventType.MOUSEENTER;
|
|
18
|
-
};
|
|
19
|
-
|
|
20
|
-
isEnabled = (state: EditorState): boolean => {
|
|
21
|
-
return setCellBackgroundBlack(state.tr);
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
waitForUserInput = (
|
|
25
|
-
state: EditorState,
|
|
26
|
-
dispatch: ?(tr: Transform) => void,
|
|
27
|
-
view: ?EditorView,
|
|
28
|
-
event: ?SyntheticEvent<>
|
|
29
|
-
): Promise<any> => {
|
|
30
|
-
if (this._popUp) {
|
|
31
|
-
return Promise.resolve(undefined);
|
|
32
|
-
}
|
|
33
|
-
const target = event?.currentTarget;
|
|
34
|
-
if (!(target instanceof HTMLElement)) {
|
|
35
|
-
return Promise.resolve(undefined);
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
const anchor = event ? event.currentTarget : null;
|
|
39
|
-
return new Promise((resolve) => {
|
|
40
|
-
this._popUp = createPopUp(ColorEditor, null, {
|
|
41
|
-
anchor,
|
|
42
|
-
autoDismiss: false,
|
|
43
|
-
position: atAnchorRight,
|
|
44
|
-
onClose: (val) => {
|
|
45
|
-
if (this._popUp) {
|
|
46
|
-
this._popUp = null;
|
|
47
|
-
resolve(val);
|
|
48
|
-
}
|
|
49
|
-
},
|
|
50
|
-
});
|
|
51
|
-
});
|
|
52
|
-
};
|
|
53
|
-
|
|
54
|
-
executeWithUserInput = (
|
|
55
|
-
state: EditorState,
|
|
56
|
-
dispatch: ?(tr: Transform) => void,
|
|
57
|
-
view: ?EditorView,
|
|
58
|
-
hex: ?{ color: string, selectedPosition?: string }
|
|
59
|
-
): boolean => {
|
|
60
|
-
if (dispatch && hex !== undefined) {
|
|
61
|
-
const cmd = setCellAttr('background', hex.color);
|
|
62
|
-
cmd(state, dispatch, view);
|
|
63
|
-
return true;
|
|
64
|
-
}
|
|
65
|
-
return false;
|
|
66
|
-
};
|
|
67
|
-
|
|
68
|
-
cancel(): void {
|
|
69
|
-
return null;
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
export default TableCellColorCommand;
|
|
1
|
+
// @flow
|
|
2
|
+
|
|
3
|
+
import { EditorState } from 'prosemirror-state';
|
|
4
|
+
import { setCellAttr } from 'prosemirror-tables';
|
|
5
|
+
import { Transform } from 'prosemirror-transform';
|
|
6
|
+
import { EditorView } from 'prosemirror-view';
|
|
7
|
+
import { ColorEditor } from '@modusoperandi/color-picker';
|
|
8
|
+
import { atAnchorRight, createPopUp } from '@modusoperandi/licit-ui-commands';
|
|
9
|
+
import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
|
|
10
|
+
|
|
11
|
+
const setCellBackgroundBlack = setCellAttr('background', '#000000');
|
|
12
|
+
|
|
13
|
+
class TableCellColorCommand extends UICommand {
|
|
14
|
+
_popUp = null;
|
|
15
|
+
|
|
16
|
+
shouldRespondToUIEvent = (e: SyntheticEvent<> | MouseEvent): boolean => {
|
|
17
|
+
return e.type === UICommand.EventType.MOUSEENTER;
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
isEnabled = (state: EditorState): boolean => {
|
|
21
|
+
return setCellBackgroundBlack(state.tr);
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
waitForUserInput = (
|
|
25
|
+
state: EditorState,
|
|
26
|
+
dispatch: ?(tr: Transform) => void,
|
|
27
|
+
view: ?EditorView,
|
|
28
|
+
event: ?SyntheticEvent<>
|
|
29
|
+
): Promise<any> => {
|
|
30
|
+
if (this._popUp) {
|
|
31
|
+
return Promise.resolve(undefined);
|
|
32
|
+
}
|
|
33
|
+
const target = event?.currentTarget;
|
|
34
|
+
if (!(target instanceof HTMLElement)) {
|
|
35
|
+
return Promise.resolve(undefined);
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
const anchor = event ? event.currentTarget : null;
|
|
39
|
+
return new Promise((resolve) => {
|
|
40
|
+
this._popUp = createPopUp(ColorEditor, null, {
|
|
41
|
+
anchor,
|
|
42
|
+
autoDismiss: false,
|
|
43
|
+
position: atAnchorRight,
|
|
44
|
+
onClose: (val) => {
|
|
45
|
+
if (this._popUp) {
|
|
46
|
+
this._popUp = null;
|
|
47
|
+
resolve(val);
|
|
48
|
+
}
|
|
49
|
+
},
|
|
50
|
+
});
|
|
51
|
+
});
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
executeWithUserInput = (
|
|
55
|
+
state: EditorState,
|
|
56
|
+
dispatch: ?(tr: Transform) => void,
|
|
57
|
+
view: ?EditorView,
|
|
58
|
+
hex: ?{ color: string, selectedPosition?: string[] }
|
|
59
|
+
): boolean => {
|
|
60
|
+
if (dispatch && hex !== undefined) {
|
|
61
|
+
const cmd = setCellAttr('background', hex.color);
|
|
62
|
+
cmd(state, dispatch, view);
|
|
63
|
+
return true;
|
|
64
|
+
}
|
|
65
|
+
return false;
|
|
66
|
+
};
|
|
67
|
+
|
|
68
|
+
cancel(): void {
|
|
69
|
+
return null;
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
export default TableCellColorCommand;
|
|
@@ -1,129 +1,129 @@
|
|
|
1
|
-
// @flow
|
|
2
|
-
|
|
3
|
-
import { EditorState, Plugin, PluginKey } from 'prosemirror-state';
|
|
4
|
-
import { EditorView } from 'prosemirror-view';
|
|
5
|
-
/* eslint-disable-next-line */
|
|
6
|
-
import * as React from 'react';
|
|
7
|
-
|
|
8
|
-
import findActionableCell from './findActionableCell.js';
|
|
9
|
-
import { atAnchorTopRight, createPopUp } from '@modusoperandi/licit-ui-commands';
|
|
10
|
-
import TableCellMenu from './ui/TableCellMenu.js';
|
|
11
|
-
import bindScrollHandler from './ui/bindScrollHandler.js';
|
|
12
|
-
import isElementFullyVisible from './ui/isElementFullyVisible.js';
|
|
13
|
-
import { CellSelection } from 'prosemirror-tables';
|
|
14
|
-
|
|
15
|
-
class TableCellTooltipView {
|
|
16
|
-
_cellElement: null;
|
|
17
|
-
_popUp = null;
|
|
18
|
-
_scrollHandle = null;
|
|
19
|
-
|
|
20
|
-
constructor(editorView: EditorView) {
|
|
21
|
-
this.update(editorView, null);
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
update(view: EditorView, lastState: EditorState): void {
|
|
25
|
-
const { state, readOnly } = view;
|
|
26
|
-
const result = findActionableCell(state);
|
|
27
|
-
|
|
28
|
-
if (!result || readOnly) {
|
|
29
|
-
this.destroy();
|
|
30
|
-
return;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
// These is screen coordinate.
|
|
34
|
-
const domFound = view.domAtPos(result.pos + 1);
|
|
35
|
-
if (!domFound) {
|
|
36
|
-
this.destroy();
|
|
37
|
-
return;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
let cellEl = domFound.node;
|
|
41
|
-
const popUp = this._popUp;
|
|
42
|
-
let actionNode = null;
|
|
43
|
-
if (result && state.selection instanceof CellSelection) {
|
|
44
|
-
actionNode = state.selection.$anchorCell.node(-1);
|
|
45
|
-
}
|
|
46
|
-
const viewPops = {
|
|
47
|
-
editorState: state,
|
|
48
|
-
editorView: view,
|
|
49
|
-
pluginView: this,
|
|
50
|
-
actionNode,
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
if (cellEl && !isElementFullyVisible(cellEl)) {
|
|
54
|
-
cellEl = null;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
if (!cellEl) {
|
|
58
|
-
// Closes the popup.
|
|
59
|
-
popUp?.close();
|
|
60
|
-
this._cellElement = null;
|
|
61
|
-
} else if (popUp && cellEl === this._cellElement) {
|
|
62
|
-
// Updates the popup.
|
|
63
|
-
popUp.update(viewPops);
|
|
64
|
-
} else {
|
|
65
|
-
// Creates a new popup.
|
|
66
|
-
popUp?.close();
|
|
67
|
-
this._cellElement = cellEl;
|
|
68
|
-
// [FS] IRAD-1009 2020-07-16
|
|
69
|
-
// Does not allow Table Menu Popuup button in disable mode
|
|
70
|
-
if (!view.disabled) {
|
|
71
|
-
this._popUp = createPopUp(TableCellMenu, viewPops, {
|
|
72
|
-
anchor: cellEl,
|
|
73
|
-
autoDismiss: false,
|
|
74
|
-
onClose: this._onClose,
|
|
75
|
-
position: atAnchorTopRight,
|
|
76
|
-
});
|
|
77
|
-
this._onOpen();
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
destroy = (): void => {
|
|
83
|
-
this._popUp?.close();
|
|
84
|
-
this._popUp = null;
|
|
85
|
-
};
|
|
86
|
-
|
|
87
|
-
_onOpen = (): void => {
|
|
88
|
-
const cellEl = this._cellElement;
|
|
89
|
-
if (!cellEl) {
|
|
90
|
-
return;
|
|
91
|
-
}
|
|
92
|
-
this._scrollHandle = bindScrollHandler(cellEl, this._onScroll);
|
|
93
|
-
};
|
|
94
|
-
|
|
95
|
-
_onClose = (): void => {
|
|
96
|
-
this._popUp = null;
|
|
97
|
-
this._scrollHandle?.dispose();
|
|
98
|
-
this._scrollHandle = null;
|
|
99
|
-
};
|
|
100
|
-
|
|
101
|
-
_onScroll = (): void => {
|
|
102
|
-
const popUp = this._popUp;
|
|
103
|
-
const cellEl = this._cellElement;
|
|
104
|
-
if (!popUp || !cellEl) {
|
|
105
|
-
return;
|
|
106
|
-
}
|
|
107
|
-
if (!isElementFullyVisible(cellEl)) {
|
|
108
|
-
popUp.close();
|
|
109
|
-
}
|
|
110
|
-
};
|
|
111
|
-
}
|
|
112
|
-
|
|
113
|
-
// https://prosemirror.net/examples/tooltip/
|
|
114
|
-
const SPEC = {
|
|
115
|
-
// [FS] IRAD-1005 2020-07-07
|
|
116
|
-
// Upgrade outdated packages.
|
|
117
|
-
key: new PluginKey('TableCellMenuPlugin'),
|
|
118
|
-
view(editorView: EditorView) {
|
|
119
|
-
return new TableCellTooltipView(editorView);
|
|
120
|
-
},
|
|
121
|
-
};
|
|
122
|
-
|
|
123
|
-
class TableCellMenuPlugin extends Plugin {
|
|
124
|
-
constructor() {
|
|
125
|
-
super(SPEC);
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
export default TableCellMenuPlugin;
|
|
1
|
+
// @flow
|
|
2
|
+
|
|
3
|
+
import { EditorState, Plugin, PluginKey } from 'prosemirror-state';
|
|
4
|
+
import { EditorView } from 'prosemirror-view';
|
|
5
|
+
/* eslint-disable-next-line */
|
|
6
|
+
import * as React from 'react';
|
|
7
|
+
|
|
8
|
+
import findActionableCell from './findActionableCell.js';
|
|
9
|
+
import { atAnchorTopRight, createPopUp } from '@modusoperandi/licit-ui-commands';
|
|
10
|
+
import TableCellMenu from './ui/TableCellMenu.js';
|
|
11
|
+
import bindScrollHandler from './ui/bindScrollHandler.js';
|
|
12
|
+
import isElementFullyVisible from './ui/isElementFullyVisible.js';
|
|
13
|
+
import { CellSelection } from 'prosemirror-tables';
|
|
14
|
+
|
|
15
|
+
class TableCellTooltipView {
|
|
16
|
+
_cellElement: null;
|
|
17
|
+
_popUp = null;
|
|
18
|
+
_scrollHandle = null;
|
|
19
|
+
|
|
20
|
+
constructor(editorView: EditorView) {
|
|
21
|
+
this.update(editorView, null);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
update(view: EditorView, lastState: EditorState): void {
|
|
25
|
+
const { state, readOnly } = view;
|
|
26
|
+
const result = findActionableCell(state);
|
|
27
|
+
|
|
28
|
+
if (!result || readOnly) {
|
|
29
|
+
this.destroy();
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
// These is screen coordinate.
|
|
34
|
+
const domFound = view.domAtPos(result.pos + 1);
|
|
35
|
+
if (!domFound) {
|
|
36
|
+
this.destroy();
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
let cellEl = domFound.node;
|
|
41
|
+
const popUp = this._popUp;
|
|
42
|
+
let actionNode = null;
|
|
43
|
+
if (result && state.selection instanceof CellSelection) {
|
|
44
|
+
actionNode = state.selection.$anchorCell.node(-1);
|
|
45
|
+
}
|
|
46
|
+
const viewPops = {
|
|
47
|
+
editorState: state,
|
|
48
|
+
editorView: view,
|
|
49
|
+
pluginView: this,
|
|
50
|
+
actionNode,
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
if (cellEl && !isElementFullyVisible(cellEl)) {
|
|
54
|
+
cellEl = null;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
if (!cellEl) {
|
|
58
|
+
// Closes the popup.
|
|
59
|
+
popUp?.close();
|
|
60
|
+
this._cellElement = null;
|
|
61
|
+
} else if (popUp && cellEl === this._cellElement) {
|
|
62
|
+
// Updates the popup.
|
|
63
|
+
popUp.update(viewPops);
|
|
64
|
+
} else {
|
|
65
|
+
// Creates a new popup.
|
|
66
|
+
popUp?.close();
|
|
67
|
+
this._cellElement = cellEl;
|
|
68
|
+
// [FS] IRAD-1009 2020-07-16
|
|
69
|
+
// Does not allow Table Menu Popuup button in disable mode
|
|
70
|
+
if (!view.disabled) {
|
|
71
|
+
this._popUp = createPopUp(TableCellMenu, viewPops, {
|
|
72
|
+
anchor: cellEl,
|
|
73
|
+
autoDismiss: false,
|
|
74
|
+
onClose: this._onClose,
|
|
75
|
+
position: atAnchorTopRight,
|
|
76
|
+
});
|
|
77
|
+
this._onOpen();
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
destroy = (): void => {
|
|
83
|
+
this._popUp?.close();
|
|
84
|
+
this._popUp = null;
|
|
85
|
+
};
|
|
86
|
+
|
|
87
|
+
_onOpen = (): void => {
|
|
88
|
+
const cellEl = this._cellElement;
|
|
89
|
+
if (!cellEl) {
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
this._scrollHandle = bindScrollHandler(cellEl, this._onScroll);
|
|
93
|
+
};
|
|
94
|
+
|
|
95
|
+
_onClose = (): void => {
|
|
96
|
+
this._popUp = null;
|
|
97
|
+
this._scrollHandle?.dispose();
|
|
98
|
+
this._scrollHandle = null;
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
_onScroll = (): void => {
|
|
102
|
+
const popUp = this._popUp;
|
|
103
|
+
const cellEl = this._cellElement;
|
|
104
|
+
if (!popUp || !cellEl) {
|
|
105
|
+
return;
|
|
106
|
+
}
|
|
107
|
+
if (!isElementFullyVisible(cellEl)) {
|
|
108
|
+
popUp.close();
|
|
109
|
+
}
|
|
110
|
+
};
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
// https://prosemirror.net/examples/tooltip/
|
|
114
|
+
const SPEC = {
|
|
115
|
+
// [FS] IRAD-1005 2020-07-07
|
|
116
|
+
// Upgrade outdated packages.
|
|
117
|
+
key: new PluginKey('TableCellMenuPlugin'),
|
|
118
|
+
view(editorView: EditorView) {
|
|
119
|
+
return new TableCellTooltipView(editorView);
|
|
120
|
+
},
|
|
121
|
+
};
|
|
122
|
+
|
|
123
|
+
class TableCellMenuPlugin extends Plugin {
|
|
124
|
+
constructor() {
|
|
125
|
+
super(SPEC);
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
export default TableCellMenuPlugin;
|
|
@@ -1,117 +1,117 @@
|
|
|
1
|
-
// @flow
|
|
2
|
-
|
|
3
|
-
import { EditorState, TextSelection } from 'prosemirror-state';
|
|
4
|
-
import { Transform } from 'prosemirror-transform';
|
|
5
|
-
import { EditorView } from 'prosemirror-view';
|
|
6
|
-
import { Fragment } from 'prosemirror-model';
|
|
7
|
-
import insertTable from './insertTable.js';
|
|
8
|
-
import { atAnchorRight, createPopUp } from '@modusoperandi/licit-ui-commands';
|
|
9
|
-
import TableGridSizeEditor from './ui/TableGridSizeEditor.js';
|
|
10
|
-
import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
|
|
11
|
-
import {
|
|
12
|
-
PARAGRAPH
|
|
13
|
-
} from './NodeNames.js';
|
|
14
|
-
import type {
|
|
15
|
-
TableGridSizeEditorValue
|
|
16
|
-
} from './ui/TableGridSizeEditor.js';
|
|
17
|
-
|
|
18
|
-
class TableInsertCommand extends UICommand {
|
|
19
|
-
_popUp = null;
|
|
20
|
-
|
|
21
|
-
shouldRespondToUIEvent = (e: SyntheticEvent<> | MouseEvent): boolean => {
|
|
22
|
-
return e.type === UICommand.EventType.MOUSEENTER;
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
isEnabled = (state: EditorState): boolean => {
|
|
26
|
-
const tr = state;
|
|
27
|
-
let bOK = false;
|
|
28
|
-
const { selection } = tr;
|
|
29
|
-
if (selection instanceof TextSelection) {
|
|
30
|
-
bOK = selection.from === selection.to;
|
|
31
|
-
// [FS] IRAD-1065 2020-09-18
|
|
32
|
-
// Disable create table menu if the selection is inside a table.
|
|
33
|
-
if (bOK) {
|
|
34
|
-
const $head = selection.$head;
|
|
35
|
-
for (let d = $head.depth; d > 0; d--) {
|
|
36
|
-
if ($head.node(d).type.spec.tableRole == 'row') {
|
|
37
|
-
return false;
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
return bOK;
|
|
42
|
-
}
|
|
43
|
-
return bOK;
|
|
44
|
-
};
|
|
45
|
-
|
|
46
|
-
waitForUserInput = (
|
|
47
|
-
state: EditorState,
|
|
48
|
-
dispatch: ?(tr: Transform) => void,
|
|
49
|
-
view: ?EditorView,
|
|
50
|
-
event: ?SyntheticEvent<>
|
|
51
|
-
): Promise<any> => {
|
|
52
|
-
if (this._popUp) {
|
|
53
|
-
return Promise.resolve(undefined);
|
|
54
|
-
}
|
|
55
|
-
const target = event?.currentTarget;
|
|
56
|
-
if (!(target instanceof HTMLElement)) {
|
|
57
|
-
return Promise.resolve(undefined);
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
const anchor = event ? event.currentTarget : null;
|
|
61
|
-
return new Promise((resolve) => {
|
|
62
|
-
this._popUp = createPopUp(TableGridSizeEditor, null, {
|
|
63
|
-
anchor,
|
|
64
|
-
position: atAnchorRight,
|
|
65
|
-
onClose: (val) => {
|
|
66
|
-
if (this._popUp) {
|
|
67
|
-
this._popUp = null;
|
|
68
|
-
resolve(val);
|
|
69
|
-
}
|
|
70
|
-
},
|
|
71
|
-
});
|
|
72
|
-
});
|
|
73
|
-
};
|
|
74
|
-
|
|
75
|
-
executeWithUserInput = (
|
|
76
|
-
state: EditorState,
|
|
77
|
-
dispatch: ?(tr: Transform) => void,
|
|
78
|
-
view: ?EditorView,
|
|
79
|
-
inputs: ?TableGridSizeEditorValue
|
|
80
|
-
): boolean => {
|
|
81
|
-
if (dispatch) {
|
|
82
|
-
const { selection, schema } = state;
|
|
83
|
-
let { tr } = state;
|
|
84
|
-
if (inputs) {
|
|
85
|
-
const { rows, cols } = inputs;
|
|
86
|
-
tr = tr.setSelection(selection);
|
|
87
|
-
tr = insertTable(tr, schema, rows, cols);
|
|
88
|
-
tr = insertParagraph(state, tr);
|
|
89
|
-
}
|
|
90
|
-
dispatch(tr);
|
|
91
|
-
}
|
|
92
|
-
return false;
|
|
93
|
-
};
|
|
94
|
-
|
|
95
|
-
cancel(): void {
|
|
96
|
-
return null;
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
// [FS] 2021-04-01
|
|
101
|
-
// Add empty line after table drop
|
|
102
|
-
// To make easier to enter a line after table
|
|
103
|
-
function insertParagraph(state, tr) {
|
|
104
|
-
const paragraph = state.schema.nodes[PARAGRAPH];
|
|
105
|
-
const textNode = state.schema.text(' ');
|
|
106
|
-
const { from, to } = tr.selection;
|
|
107
|
-
if (from !== to) {
|
|
108
|
-
return tr;
|
|
109
|
-
}
|
|
110
|
-
const paragraphNode = paragraph.create({}, textNode, null);
|
|
111
|
-
tr = tr.insert(
|
|
112
|
-
from + tr.selection.$head.node(1).nodeSize - 4,
|
|
113
|
-
Fragment.from(paragraphNode)
|
|
114
|
-
);
|
|
115
|
-
return tr;
|
|
116
|
-
}
|
|
117
|
-
export default TableInsertCommand;
|
|
1
|
+
// @flow
|
|
2
|
+
|
|
3
|
+
import { EditorState, TextSelection } from 'prosemirror-state';
|
|
4
|
+
import { Transform } from 'prosemirror-transform';
|
|
5
|
+
import { EditorView } from 'prosemirror-view';
|
|
6
|
+
import { Fragment } from 'prosemirror-model';
|
|
7
|
+
import insertTable from './insertTable.js';
|
|
8
|
+
import { atAnchorRight, createPopUp } from '@modusoperandi/licit-ui-commands';
|
|
9
|
+
import TableGridSizeEditor from './ui/TableGridSizeEditor.js';
|
|
10
|
+
import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
|
|
11
|
+
import {
|
|
12
|
+
PARAGRAPH
|
|
13
|
+
} from './NodeNames.js';
|
|
14
|
+
import type {
|
|
15
|
+
TableGridSizeEditorValue
|
|
16
|
+
} from './ui/TableGridSizeEditor.js';
|
|
17
|
+
|
|
18
|
+
class TableInsertCommand extends UICommand {
|
|
19
|
+
_popUp = null;
|
|
20
|
+
|
|
21
|
+
shouldRespondToUIEvent = (e: SyntheticEvent<> | MouseEvent): boolean => {
|
|
22
|
+
return e.type === UICommand.EventType.MOUSEENTER;
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
isEnabled = (state: EditorState): boolean => {
|
|
26
|
+
const tr = state;
|
|
27
|
+
let bOK = false;
|
|
28
|
+
const { selection } = tr;
|
|
29
|
+
if (selection instanceof TextSelection) {
|
|
30
|
+
bOK = selection.from === selection.to;
|
|
31
|
+
// [FS] IRAD-1065 2020-09-18
|
|
32
|
+
// Disable create table menu if the selection is inside a table.
|
|
33
|
+
if (bOK) {
|
|
34
|
+
const $head = selection.$head;
|
|
35
|
+
for (let d = $head.depth; d > 0; d--) {
|
|
36
|
+
if ($head.node(d).type.spec.tableRole == 'row') {
|
|
37
|
+
return false;
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
return bOK;
|
|
42
|
+
}
|
|
43
|
+
return bOK;
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
waitForUserInput = (
|
|
47
|
+
state: EditorState,
|
|
48
|
+
dispatch: ?(tr: Transform) => void,
|
|
49
|
+
view: ?EditorView,
|
|
50
|
+
event: ?SyntheticEvent<>
|
|
51
|
+
): Promise<any> => {
|
|
52
|
+
if (this._popUp) {
|
|
53
|
+
return Promise.resolve(undefined);
|
|
54
|
+
}
|
|
55
|
+
const target = event?.currentTarget;
|
|
56
|
+
if (!(target instanceof HTMLElement)) {
|
|
57
|
+
return Promise.resolve(undefined);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
const anchor = event ? event.currentTarget : null;
|
|
61
|
+
return new Promise((resolve) => {
|
|
62
|
+
this._popUp = createPopUp(TableGridSizeEditor, null, {
|
|
63
|
+
anchor,
|
|
64
|
+
position: atAnchorRight,
|
|
65
|
+
onClose: (val) => {
|
|
66
|
+
if (this._popUp) {
|
|
67
|
+
this._popUp = null;
|
|
68
|
+
resolve(val);
|
|
69
|
+
}
|
|
70
|
+
},
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
executeWithUserInput = (
|
|
76
|
+
state: EditorState,
|
|
77
|
+
dispatch: ?(tr: Transform) => void,
|
|
78
|
+
view: ?EditorView,
|
|
79
|
+
inputs: ?TableGridSizeEditorValue
|
|
80
|
+
): boolean => {
|
|
81
|
+
if (dispatch) {
|
|
82
|
+
const { selection, schema } = state;
|
|
83
|
+
let { tr } = state;
|
|
84
|
+
if (inputs) {
|
|
85
|
+
const { rows, cols } = inputs;
|
|
86
|
+
tr = tr.setSelection(selection);
|
|
87
|
+
tr = insertTable(tr, schema, rows, cols);
|
|
88
|
+
tr = insertParagraph(state, tr);
|
|
89
|
+
}
|
|
90
|
+
dispatch(tr);
|
|
91
|
+
}
|
|
92
|
+
return false;
|
|
93
|
+
};
|
|
94
|
+
|
|
95
|
+
cancel(): void {
|
|
96
|
+
return null;
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
// [FS] 2021-04-01
|
|
101
|
+
// Add empty line after table drop
|
|
102
|
+
// To make easier to enter a line after table
|
|
103
|
+
function insertParagraph(state, tr) {
|
|
104
|
+
const paragraph = state.schema.nodes[PARAGRAPH];
|
|
105
|
+
const textNode = state.schema.text(' ');
|
|
106
|
+
const { from, to } = tr.selection;
|
|
107
|
+
if (from !== to) {
|
|
108
|
+
return tr;
|
|
109
|
+
}
|
|
110
|
+
const paragraphNode = paragraph.create({}, textNode, null);
|
|
111
|
+
tr = tr.insert(
|
|
112
|
+
from + tr.selection.$head.node(1).nodeSize - 4,
|
|
113
|
+
Fragment.from(paragraphNode)
|
|
114
|
+
);
|
|
115
|
+
return tr;
|
|
116
|
+
}
|
|
117
|
+
export default TableInsertCommand;
|