@flozy/editor 1.0.6 → 1.0.7
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/CollaborativeEditor.js +116 -0
- package/dist/Editor/CommonEditor.js +132 -0
- package/dist/Editor/Editor.css +115 -0
- package/dist/Editor/Elements/CodeToText/CodeToText.css +57 -0
- package/dist/Editor/Elements/CodeToText/CodeToText.js +112 -0
- package/dist/Editor/Elements/CodeToText/CodeToTextButton.js +18 -0
- package/dist/Editor/Elements/CodeToText/HtmlCode.js +54 -0
- package/dist/Editor/Elements/CodeToText/HtmlContextMenu.js +39 -0
- package/dist/Editor/Elements/Color Picker/ColorPicker.css +38 -0
- package/dist/Editor/Elements/Color Picker/ColorPicker.js +116 -0
- package/dist/Editor/Elements/Color Picker/defaultColors.js +1 -0
- package/dist/Editor/Elements/Embed/Embed.css +14 -0
- package/dist/Editor/Elements/Embed/Embed.js +94 -0
- package/dist/Editor/Elements/Embed/Image.js +70 -0
- package/dist/Editor/Elements/Embed/Video.js +62 -0
- package/dist/Editor/Elements/Equation/Equation.js +24 -0
- package/dist/Editor/Elements/Equation/EquationButton.js +66 -0
- package/dist/Editor/Elements/Equation/styles.css +4 -0
- package/dist/Editor/Elements/Grid/Grid.js +53 -0
- package/dist/Editor/Elements/Grid/GridButton.js +19 -0
- package/dist/Editor/Elements/Grid/GridItem.js +53 -0
- package/dist/Editor/Elements/ID/Id.js +56 -0
- package/dist/Editor/Elements/Link/Link.js +34 -0
- package/dist/Editor/Elements/Link/LinkButton.js +77 -0
- package/dist/Editor/Elements/Link/styles.css +20 -0
- package/dist/Editor/Elements/Mentions/Mentions.js +34 -0
- package/dist/Editor/Elements/NewLine/NewLineButton.js +22 -0
- package/dist/Editor/Elements/Table/Table.js +15 -0
- package/dist/Editor/Elements/Table/TableSelector.css +18 -0
- package/dist/Editor/Elements/Table/TableSelector.js +93 -0
- package/dist/Editor/Elements/TableContextMenu/TableContextMenu.js +91 -0
- package/dist/Editor/Elements/TableContextMenu/styles.css +18 -0
- package/dist/Editor/RemoteCursorOverlay/Overlay.js +75 -0
- package/dist/Editor/Toolbar/Toolbar.js +166 -0
- package/dist/Editor/Toolbar/styles.css +28 -0
- package/dist/Editor/Toolbar/toolbarGroups.js +131 -0
- package/dist/Editor/Toolbar/toolbarIcons/align-center.svg +1 -0
- package/dist/Editor/Toolbar/toolbarIcons/align-left.svg +1 -0
- package/dist/Editor/Toolbar/toolbarIcons/align-right.svg +1 -0
- package/dist/Editor/Toolbar/toolbarIcons/blockquote.svg +1 -0
- package/dist/Editor/Toolbar/toolbarIcons/bold.png +0 -0
- package/dist/Editor/Toolbar/toolbarIcons/fontColor.svg +4 -0
- package/dist/Editor/Toolbar/toolbarIcons/headingOne.svg +3 -0
- package/dist/Editor/Toolbar/toolbarIcons/headingTwo.svg +3 -0
- package/dist/Editor/Toolbar/toolbarIcons/italic.png +0 -0
- package/dist/Editor/Toolbar/toolbarIcons/link.svg +1 -0
- package/dist/Editor/Toolbar/toolbarIcons/orderedList.svg +1 -0
- package/dist/Editor/Toolbar/toolbarIcons/strikethrough.png +0 -0
- package/dist/Editor/Toolbar/toolbarIcons/subscript.svg +1 -0
- package/dist/Editor/Toolbar/toolbarIcons/superscript.svg +1 -0
- package/dist/Editor/Toolbar/toolbarIcons/textColor.png +0 -0
- package/dist/Editor/Toolbar/toolbarIcons/underline.png +0 -0
- package/dist/Editor/Toolbar/toolbarIcons/unorderedList.svg +1 -0
- package/dist/Editor/YjsProvider.js +9 -0
- package/dist/Editor/common/Button.js +21 -0
- package/dist/Editor/common/Icon.js +114 -0
- package/dist/Editor/common/MentionsPopup.js +54 -0
- package/dist/Editor/hooks/useMentions.js +44 -0
- package/dist/Editor/hooks/withCollaborative.js +15 -0
- package/dist/Editor/hooks/withCommon.js +11 -0
- package/dist/Editor/plugins/withEmbeds.js +29 -0
- package/dist/Editor/plugins/withEquation.js +8 -0
- package/dist/Editor/plugins/withLinks.js +8 -0
- package/dist/Editor/plugins/withMentions.js +18 -0
- package/dist/Editor/plugins/withTable.js +61 -0
- package/dist/Editor/utils/SlateUtilityFunctions.js +224 -0
- package/dist/Editor/utils/customHooks/useContextMenu.js +37 -0
- package/dist/Editor/utils/customHooks/useFormat.js +21 -0
- package/dist/Editor/utils/customHooks/usePopup.js +21 -0
- package/dist/Editor/utils/customHooks/useResize.js +47 -0
- package/dist/Editor/utils/draftToSlate.js +111 -0
- package/dist/Editor/utils/embed.js +24 -0
- package/dist/Editor/utils/equation.js +23 -0
- package/dist/Editor/utils/events.js +76 -0
- package/dist/Editor/utils/grid.js +13 -0
- package/dist/Editor/utils/gridItem.js +19 -0
- package/dist/Editor/utils/link.js +52 -0
- package/dist/Editor/utils/mentions.js +12 -0
- package/dist/Editor/utils/paragraph.js +6 -0
- package/dist/Editor/utils/serializer.js +28 -0
- package/dist/Editor/utils/table.js +129 -0
- package/dist/index.js +4 -0
- package/package.json +18 -8
- package/build/asset-manifest.json +0 -14
- package/build/favicon.ico +0 -0
- package/build/index.html +0 -1
- package/build/logo192.png +0 -0
- package/build/logo512.png +0 -0
- package/build/manifest.json +0 -25
- package/build/robots.txt +0 -3
- package/build/static/css/main.71100b24.css +0 -2
- package/build/static/css/main.71100b24.css.map +0 -1
- package/build/static/js/main.dd36b23b.js +0 -3
- package/build/static/js/main.dd36b23b.js.LICENSE.txt +0 -19
- package/build/static/js/main.dd36b23b.js.map +0 -1
- /package/{build/static/media/unlink.b8761030d4a17499149d2d61adc064b3.svg → dist/Editor/Toolbar/toolbarIcons/unlink.svg} +0 -0
@@ -0,0 +1,131 @@
|
|
1
|
+
const toolbarGroups = [[{
|
2
|
+
id: 1,
|
3
|
+
format: "fontFamily",
|
4
|
+
type: "dropdown",
|
5
|
+
options: [{
|
6
|
+
text: "Sans Serif",
|
7
|
+
value: "sans"
|
8
|
+
}, {
|
9
|
+
text: "Serif",
|
10
|
+
value: "serif"
|
11
|
+
}, {
|
12
|
+
text: "MonoSpace",
|
13
|
+
value: "monospace"
|
14
|
+
}]
|
15
|
+
}, {
|
16
|
+
id: 2,
|
17
|
+
format: "fontSize",
|
18
|
+
type: "dropdown",
|
19
|
+
options: [{
|
20
|
+
text: "Small",
|
21
|
+
value: "small"
|
22
|
+
}, {
|
23
|
+
text: "Normal",
|
24
|
+
value: "normal"
|
25
|
+
}, {
|
26
|
+
text: "Medium",
|
27
|
+
value: "medium"
|
28
|
+
}, {
|
29
|
+
text: "Huge",
|
30
|
+
value: "huge"
|
31
|
+
}]
|
32
|
+
}], [{
|
33
|
+
id: 3,
|
34
|
+
format: "bold",
|
35
|
+
type: "mark"
|
36
|
+
}, {
|
37
|
+
id: 4,
|
38
|
+
format: "italic",
|
39
|
+
type: "mark"
|
40
|
+
}, {
|
41
|
+
id: 5,
|
42
|
+
format: "underline",
|
43
|
+
type: "mark"
|
44
|
+
}, {
|
45
|
+
id: 6,
|
46
|
+
format: "strikethrough",
|
47
|
+
type: "mark"
|
48
|
+
}], [{
|
49
|
+
id: 7,
|
50
|
+
format: "color",
|
51
|
+
type: "color-picker"
|
52
|
+
}, {
|
53
|
+
id: 8,
|
54
|
+
format: "bgColor",
|
55
|
+
type: "color-picker"
|
56
|
+
}], [{
|
57
|
+
id: 9,
|
58
|
+
format: "superscript",
|
59
|
+
type: "mark"
|
60
|
+
}, {
|
61
|
+
id: 10,
|
62
|
+
format: "subscript",
|
63
|
+
type: "mark"
|
64
|
+
}], [{
|
65
|
+
id: 11,
|
66
|
+
format: "headingOne",
|
67
|
+
type: "block"
|
68
|
+
}, {
|
69
|
+
id: 12,
|
70
|
+
format: "headingTwo",
|
71
|
+
type: "block"
|
72
|
+
}, {
|
73
|
+
id: 13,
|
74
|
+
format: "headingThree",
|
75
|
+
type: "block"
|
76
|
+
}, {
|
77
|
+
id: 14,
|
78
|
+
format: "blockquote",
|
79
|
+
type: "block"
|
80
|
+
}], [{
|
81
|
+
id: 15,
|
82
|
+
format: "orderedList",
|
83
|
+
type: "block"
|
84
|
+
}, {
|
85
|
+
id: 16,
|
86
|
+
format: "unorderedList",
|
87
|
+
type: "block"
|
88
|
+
}], [{
|
89
|
+
id: 17,
|
90
|
+
format: "alignLeft",
|
91
|
+
type: "block"
|
92
|
+
}, {
|
93
|
+
id: 18,
|
94
|
+
format: "alignCenter",
|
95
|
+
type: "block"
|
96
|
+
}, {
|
97
|
+
id: 19,
|
98
|
+
format: "alignRight",
|
99
|
+
type: "block"
|
100
|
+
}], [{
|
101
|
+
id: 20,
|
102
|
+
format: "link",
|
103
|
+
type: "link"
|
104
|
+
}, {
|
105
|
+
id: 21,
|
106
|
+
format: "image",
|
107
|
+
type: "embed"
|
108
|
+
}, {
|
109
|
+
id: 22,
|
110
|
+
format: "video",
|
111
|
+
type: "embed"
|
112
|
+
}, {
|
113
|
+
id: 23,
|
114
|
+
type: "table"
|
115
|
+
}], [{
|
116
|
+
id: 25,
|
117
|
+
type: "id"
|
118
|
+
}, {
|
119
|
+
id: 26,
|
120
|
+
type: "equation"
|
121
|
+
}, {
|
122
|
+
id: 27,
|
123
|
+
type: "codeToText"
|
124
|
+
}, {
|
125
|
+
id: 28,
|
126
|
+
type: "grid"
|
127
|
+
}, {
|
128
|
+
id: 29,
|
129
|
+
type: "newLine"
|
130
|
+
}]];
|
131
|
+
export default toolbarGroups;
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="align-center" class="svg-inline--fa fa-align-center fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M432 160H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0 256H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zM108.1 96h231.81A12.09 12.09 0 0 0 352 83.9V44.09A12.09 12.09 0 0 0 339.91 32H108.1A12.09 12.09 0 0 0 96 44.09V83.9A12.1 12.1 0 0 0 108.1 96zm231.81 256A12.09 12.09 0 0 0 352 339.9v-39.81A12.09 12.09 0 0 0 339.91 288H108.1A12.09 12.09 0 0 0 96 300.09v39.81a12.1 12.1 0 0 0 12.1 12.1z"></path></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="align-left" class="svg-inline--fa fa-align-left fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M12.83 352h262.34A12.82 12.82 0 0 0 288 339.17v-38.34A12.82 12.82 0 0 0 275.17 288H12.83A12.82 12.82 0 0 0 0 300.83v38.34A12.82 12.82 0 0 0 12.83 352zm0-256h262.34A12.82 12.82 0 0 0 288 83.17V44.83A12.82 12.82 0 0 0 275.17 32H12.83A12.82 12.82 0 0 0 0 44.83v38.34A12.82 12.82 0 0 0 12.83 96zM432 160H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0 256H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z"></path></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="align-right" class="svg-inline--fa fa-align-right fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M16 224h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16zm416 192H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm3.17-384H172.83A12.82 12.82 0 0 0 160 44.83v38.34A12.82 12.82 0 0 0 172.83 96h262.34A12.82 12.82 0 0 0 448 83.17V44.83A12.82 12.82 0 0 0 435.17 32zm0 256H172.83A12.82 12.82 0 0 0 160 300.83v38.34A12.82 12.82 0 0 0 172.83 352h262.34A12.82 12.82 0 0 0 448 339.17v-38.34A12.82 12.82 0 0 0 435.17 288z"></path></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="quote-right" class="svg-inline--fa fa-quote-right fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M464 32H336c-26.5 0-48 21.5-48 48v128c0 26.5 21.5 48 48 48h80v64c0 35.3-28.7 64-64 64h-8c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24h8c88.4 0 160-71.6 160-160V80c0-26.5-21.5-48-48-48zm-288 0H48C21.5 32 0 53.5 0 80v128c0 26.5 21.5 48 48 48h80v64c0 35.3-28.7 64-64 64h-8c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24h8c88.4 0 160-71.6 160-160V80c0-26.5-21.5-48-48-48z"></path></svg>
|
Binary file
|
@@ -0,0 +1,4 @@
|
|
1
|
+
<svg width="634" height="461" viewBox="0 0 634 461" fill="none" xmlns="http://www.w3.org/2000/svg">
|
2
|
+
<path d="M59.2793 8.77344H55.7051L54.9023 11H53.7422L57 2.46875H57.9844L61.248 11H60.0938L59.2793 8.77344ZM56.0449 7.84766H58.9453L57.4922 3.85742L56.0449 7.84766Z" fill="black"/>
|
3
|
+
<line x1="54" y1="12.5" x2="61" y2="12.5" stroke="black"/>
|
4
|
+
</svg>
|
@@ -0,0 +1,3 @@
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-h1" viewBox="0 0 16 16">
|
2
|
+
<path d="M8.637 13V3.669H7.379V7.62H2.758V3.67H1.5V13h1.258V8.728h4.62V13h1.259zm5.329 0V3.669h-1.244L10.5 5.316v1.265l2.16-1.565h.062V13h1.244z"/>
|
3
|
+
</svg>
|
@@ -0,0 +1,3 @@
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-h2" viewBox="0 0 16 16">
|
2
|
+
<path d="M7.638 13V3.669H6.38V7.62H1.759V3.67H.5V13h1.258V8.728h4.62V13h1.259zm3.022-6.733v-.048c0-.889.63-1.668 1.716-1.668.957 0 1.675.608 1.675 1.572 0 .855-.554 1.504-1.067 2.085l-3.513 3.999V13H15.5v-1.094h-4.245v-.075l2.481-2.844c.875-.998 1.586-1.784 1.586-2.953 0-1.463-1.155-2.556-2.919-2.556-1.941 0-2.966 1.326-2.966 2.74v.049h1.223z"/>
|
3
|
+
</svg>
|
Binary file
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="link" class="svg-inline--fa fa-link fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M326.612 185.391c59.747 59.809 58.927 155.698.36 214.59-.11.12-.24.25-.36.37l-67.2 67.2c-59.27 59.27-155.699 59.262-214.96 0-59.27-59.26-59.27-155.7 0-214.96l37.106-37.106c9.84-9.84 26.786-3.3 27.294 10.606.648 17.722 3.826 35.527 9.69 52.721 1.986 5.822.567 12.262-3.783 16.612l-13.087 13.087c-28.026 28.026-28.905 73.66-1.155 101.96 28.024 28.579 74.086 28.749 102.325.51l67.2-67.19c28.191-28.191 28.073-73.757 0-101.83-3.701-3.694-7.429-6.564-10.341-8.569a16.037 16.037 0 0 1-6.947-12.606c-.396-10.567 3.348-21.456 11.698-29.806l21.054-21.055c5.521-5.521 14.182-6.199 20.584-1.731a152.482 152.482 0 0 1 20.522 17.197zM467.547 44.449c-59.261-59.262-155.69-59.27-214.96 0l-67.2 67.2c-.12.12-.25.25-.36.37-58.566 58.892-59.387 154.781.36 214.59a152.454 152.454 0 0 0 20.521 17.196c6.402 4.468 15.064 3.789 20.584-1.731l21.054-21.055c8.35-8.35 12.094-19.239 11.698-29.806a16.037 16.037 0 0 0-6.947-12.606c-2.912-2.005-6.64-4.875-10.341-8.569-28.073-28.073-28.191-73.639 0-101.83l67.2-67.19c28.239-28.239 74.3-28.069 102.325.51 27.75 28.3 26.872 73.934-1.155 101.96l-13.087 13.087c-4.35 4.35-5.769 10.79-3.783 16.612 5.864 17.194 9.042 34.999 9.69 52.721.509 13.906 17.454 20.446 27.294 10.606l37.106-37.106c59.271-59.259 59.271-155.699.001-214.959z"></path></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="list-ol" class="svg-inline--fa fa-list-ol fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M61.77 401l17.5-20.15a19.92 19.92 0 0 0 5.07-14.19v-3.31C84.34 356 80.5 352 73 352H16a8 8 0 0 0-8 8v16a8 8 0 0 0 8 8h22.83a157.41 157.41 0 0 0-11 12.31l-5.61 7c-4 5.07-5.25 10.13-2.8 14.88l1.05 1.93c3 5.76 6.29 7.88 12.25 7.88h4.73c10.33 0 15.94 2.44 15.94 9.09 0 4.72-4.2 8.22-14.36 8.22a41.54 41.54 0 0 1-15.47-3.12c-6.49-3.88-11.74-3.5-15.6 3.12l-5.59 9.31c-3.72 6.13-3.19 11.72 2.63 15.94 7.71 4.69 20.38 9.44 37 9.44 34.16 0 48.5-22.75 48.5-44.12-.03-14.38-9.12-29.76-28.73-34.88zM496 224H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-160H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16V80a16 16 0 0 0-16-16zm0 320H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zM16 160h64a8 8 0 0 0 8-8v-16a8 8 0 0 0-8-8H64V40a8 8 0 0 0-8-8H32a8 8 0 0 0-7.14 4.42l-8 16A8 8 0 0 0 24 64h8v64H16a8 8 0 0 0-8 8v16a8 8 0 0 0 8 8zm-3.91 160H80a8 8 0 0 0 8-8v-16a8 8 0 0 0-8-8H41.32c3.29-10.29 48.34-18.68 48.34-56.44 0-29.06-25-39.56-44.47-39.56-21.36 0-33.8 10-40.46 18.75-4.37 5.59-3 10.84 2.8 15.37l8.58 6.88c5.61 4.56 11 2.47 16.12-2.44a13.44 13.44 0 0 1 9.46-3.84c3.33 0 9.28 1.56 9.28 8.75C51 248.19 0 257.31 0 304.59v4C0 316 5.08 320 12.09 320z"></path></svg>
|
Binary file
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="subscript" class="svg-inline--fa fa-subscript fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M496 448h-16V304a16 16 0 0 0-16-16h-48a16 16 0 0 0-14.29 8.83l-16 32A16 16 0 0 0 400 352h16v96h-16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h96a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zM336 64h-67a16 16 0 0 0-13.14 6.87l-79.9 115-79.9-115A16 16 0 0 0 83 64H16A16 16 0 0 0 0 80v48a16 16 0 0 0 16 16h33.48l77.81 112-77.81 112H16a16 16 0 0 0-16 16v48a16 16 0 0 0 16 16h67a16 16 0 0 0 13.14-6.87l79.9-115 79.9 115A16 16 0 0 0 269 448h67a16 16 0 0 0 16-16v-48a16 16 0 0 0-16-16h-33.48l-77.81-112 77.81-112H336a16 16 0 0 0 16-16V80a16 16 0 0 0-16-16z"></path></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="superscript" class="svg-inline--fa fa-superscript fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M496 160h-16V16a16 16 0 0 0-16-16h-48a16 16 0 0 0-14.29 8.83l-16 32A16 16 0 0 0 400 64h16v96h-16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h96a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zM336 64h-67a16 16 0 0 0-13.14 6.87l-79.9 115-79.9-115A16 16 0 0 0 83 64H16A16 16 0 0 0 0 80v48a16 16 0 0 0 16 16h33.48l77.81 112-77.81 112H16a16 16 0 0 0-16 16v48a16 16 0 0 0 16 16h67a16 16 0 0 0 13.14-6.87l79.9-115 79.9 115A16 16 0 0 0 269 448h67a16 16 0 0 0 16-16v-48a16 16 0 0 0-16-16h-33.48l-77.81-112 77.81-112H336a16 16 0 0 0 16-16V80a16 16 0 0 0-16-16z"></path></svg>
|
Binary file
|
Binary file
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="list-ul" class="svg-inline--fa fa-list-ul fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M48 48a48 48 0 1 0 48 48 48 48 0 0 0-48-48zm0 160a48 48 0 1 0 48 48 48 48 0 0 0-48-48zm0 160a48 48 0 1 0 48 48 48 48 0 0 0-48-48zm448 16H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-320H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16V80a16 16 0 0 0-16-16zm0 160H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z"></path></svg>
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import * as Y from "yjs";
|
2
|
+
import { WebsocketProvider } from "y-websocket";
|
3
|
+
const YJS_SOCKET_URL = "ws://localhost:8080";
|
4
|
+
function YjsProvider(roomName) {
|
5
|
+
const doc = new Y.Doc();
|
6
|
+
const provider = new WebsocketProvider(YJS_SOCKET_URL, roomName, doc);
|
7
|
+
return provider;
|
8
|
+
}
|
9
|
+
export default YjsProvider;
|
@@ -0,0 +1,21 @@
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
2
|
+
import React from 'react';
|
3
|
+
const Button = props => {
|
4
|
+
const {
|
5
|
+
children,
|
6
|
+
format,
|
7
|
+
active,
|
8
|
+
...rest
|
9
|
+
} = props;
|
10
|
+
return /*#__PURE__*/React.createElement("button", _extends({
|
11
|
+
className: active ? 'btnActive' : '',
|
12
|
+
title: format
|
13
|
+
}, rest, {
|
14
|
+
style: {
|
15
|
+
width: '30px',
|
16
|
+
height: '20px',
|
17
|
+
margin: '0 2px'
|
18
|
+
}
|
19
|
+
}), children);
|
20
|
+
};
|
21
|
+
export default Button;
|
@@ -0,0 +1,114 @@
|
|
1
|
+
import React from "react";
|
2
|
+
import { MdFormatBold, MdFormatItalic, MdStrikethroughS, MdFormatUnderlined, MdFormatQuote, MdFormatAlignLeft, MdFormatAlignCenter, MdFormatAlignRight, MdFormatListNumbered, MdFormatListBulleted, MdInsertLink, MdVideoLibrary, MdImage, MdAdd, MdArrowForward } from "react-icons/md";
|
3
|
+
import { BsTypeH1, BsTypeH2, BsTypeH3, BsCameraVideoFill } from "react-icons/bs";
|
4
|
+
import { FaSuperscript, FaSubscript } from "react-icons/fa";
|
5
|
+
import { AiFillEdit, AiOutlineTable, AiOutlineInsertRowBelow, AiOutlineInsertRowRight, AiOutlineDelete, AiFillTag, AiOutlineUpload, AiOutlineArrowsAlt, AiOutlineInsertRowAbove, AiOutlineInsertRowLeft, AiFillHtml5 } from "react-icons/ai";
|
6
|
+
import { SiLatex } from "react-icons/si";
|
7
|
+
const iconList = {
|
8
|
+
bold: /*#__PURE__*/React.createElement(MdFormatBold, {
|
9
|
+
size: 20
|
10
|
+
}),
|
11
|
+
italic: /*#__PURE__*/React.createElement(MdFormatItalic, {
|
12
|
+
size: 20
|
13
|
+
}),
|
14
|
+
strikethrough: /*#__PURE__*/React.createElement(MdStrikethroughS, {
|
15
|
+
size: 20
|
16
|
+
}),
|
17
|
+
underline: /*#__PURE__*/React.createElement(MdFormatUnderlined, {
|
18
|
+
size: 20
|
19
|
+
}),
|
20
|
+
headingOne: /*#__PURE__*/React.createElement(BsTypeH1, {
|
21
|
+
size: 20
|
22
|
+
}),
|
23
|
+
headingTwo: /*#__PURE__*/React.createElement(BsTypeH2, {
|
24
|
+
size: 20
|
25
|
+
}),
|
26
|
+
headingThree: /*#__PURE__*/React.createElement(BsTypeH3, {
|
27
|
+
size: 20
|
28
|
+
}),
|
29
|
+
blockquote: /*#__PURE__*/React.createElement(MdFormatQuote, {
|
30
|
+
size: 20
|
31
|
+
}),
|
32
|
+
superscript: /*#__PURE__*/React.createElement(FaSuperscript, {
|
33
|
+
size: 15
|
34
|
+
}),
|
35
|
+
subscript: /*#__PURE__*/React.createElement(FaSubscript, {
|
36
|
+
size: 15
|
37
|
+
}),
|
38
|
+
alignLeft: /*#__PURE__*/React.createElement(MdFormatAlignLeft, {
|
39
|
+
size: 20
|
40
|
+
}),
|
41
|
+
alignCenter: /*#__PURE__*/React.createElement(MdFormatAlignCenter, {
|
42
|
+
size: 20
|
43
|
+
}),
|
44
|
+
alignRight: /*#__PURE__*/React.createElement(MdFormatAlignRight, {
|
45
|
+
size: 20
|
46
|
+
}),
|
47
|
+
orderedList: /*#__PURE__*/React.createElement(MdFormatListNumbered, {
|
48
|
+
size: 20
|
49
|
+
}),
|
50
|
+
unorderedList: /*#__PURE__*/React.createElement(MdFormatListBulleted, {
|
51
|
+
size: 20
|
52
|
+
}),
|
53
|
+
link: /*#__PURE__*/React.createElement(MdInsertLink, {
|
54
|
+
size: 20
|
55
|
+
}),
|
56
|
+
image: /*#__PURE__*/React.createElement(MdImage, {
|
57
|
+
size: 20
|
58
|
+
}),
|
59
|
+
video: /*#__PURE__*/React.createElement(MdVideoLibrary, {
|
60
|
+
size: 20
|
61
|
+
}),
|
62
|
+
add: /*#__PURE__*/React.createElement(MdAdd, {
|
63
|
+
size: 20
|
64
|
+
}),
|
65
|
+
table: /*#__PURE__*/React.createElement(AiOutlineTable, {
|
66
|
+
size: 20
|
67
|
+
}),
|
68
|
+
insertRowBelow: /*#__PURE__*/React.createElement(AiOutlineInsertRowBelow, {
|
69
|
+
size: 25
|
70
|
+
}),
|
71
|
+
insertColumnRight: /*#__PURE__*/React.createElement(AiOutlineInsertRowRight, {
|
72
|
+
size: 25
|
73
|
+
}),
|
74
|
+
insertColumnLeft: /*#__PURE__*/React.createElement(AiOutlineInsertRowLeft, {
|
75
|
+
size: 25
|
76
|
+
}),
|
77
|
+
insertRowAbove: /*#__PURE__*/React.createElement(AiOutlineInsertRowAbove, {
|
78
|
+
size: 25
|
79
|
+
}),
|
80
|
+
trashCan: /*#__PURE__*/React.createElement(AiOutlineDelete, {
|
81
|
+
size: 25
|
82
|
+
}),
|
83
|
+
addId: /*#__PURE__*/React.createElement(AiFillTag, {
|
84
|
+
size: 20
|
85
|
+
}),
|
86
|
+
upload: /*#__PURE__*/React.createElement(AiOutlineUpload, {
|
87
|
+
size: 20
|
88
|
+
}),
|
89
|
+
equation: /*#__PURE__*/React.createElement(SiLatex, {
|
90
|
+
size: 20
|
91
|
+
}),
|
92
|
+
resize: /*#__PURE__*/React.createElement(AiOutlineArrowsAlt, {
|
93
|
+
size: 20
|
94
|
+
}),
|
95
|
+
videoPlayer: /*#__PURE__*/React.createElement(BsCameraVideoFill, {
|
96
|
+
size: 20
|
97
|
+
}),
|
98
|
+
insertHtml: /*#__PURE__*/React.createElement(AiFillHtml5, {
|
99
|
+
size: 20
|
100
|
+
}),
|
101
|
+
arrowRight: /*#__PURE__*/React.createElement(MdArrowForward, {
|
102
|
+
size: 35
|
103
|
+
}),
|
104
|
+
pen: /*#__PURE__*/React.createElement(AiFillEdit, {
|
105
|
+
size: 20
|
106
|
+
})
|
107
|
+
};
|
108
|
+
const Icon = props => {
|
109
|
+
const {
|
110
|
+
icon
|
111
|
+
} = props;
|
112
|
+
return iconList[icon];
|
113
|
+
};
|
114
|
+
export default Icon;
|
@@ -0,0 +1,54 @@
|
|
1
|
+
import React, { useRef, useEffect } from "react";
|
2
|
+
import { Transforms } from "slate";
|
3
|
+
import { ReactEditor } from "slate-react";
|
4
|
+
import { insertMention } from "../utils/mentions";
|
5
|
+
const MentionsPopup = props => {
|
6
|
+
const {
|
7
|
+
editor,
|
8
|
+
index,
|
9
|
+
target,
|
10
|
+
chars,
|
11
|
+
mentions,
|
12
|
+
setMentions
|
13
|
+
} = props;
|
14
|
+
const ref = useRef(null);
|
15
|
+
useEffect(() => {
|
16
|
+
if (target && chars.length > 0) {
|
17
|
+
const el = ref.current;
|
18
|
+
const domRange = ReactEditor.toDOMRange(editor, target);
|
19
|
+
const rect = domRange.getBoundingClientRect();
|
20
|
+
el.style.top = `${rect.top + window.scrollY + 24}px`;
|
21
|
+
el.style.left = `${rect.left + window.scrollX}px`;
|
22
|
+
}
|
23
|
+
}, [chars.length, editor, index, target]);
|
24
|
+
return target && chars.length > 0 ? /*#__PURE__*/React.createElement("div", {
|
25
|
+
ref: ref,
|
26
|
+
style: {
|
27
|
+
top: "-9999px",
|
28
|
+
left: "-9999px",
|
29
|
+
position: "absolute",
|
30
|
+
zIndex: 1,
|
31
|
+
padding: "3px",
|
32
|
+
background: "white",
|
33
|
+
borderRadius: "4px",
|
34
|
+
boxShadow: "0 1px 5px rgba(0,0,0,.2)"
|
35
|
+
},
|
36
|
+
"data-cy": "mentions-portal"
|
37
|
+
}, chars.map((char, i) => /*#__PURE__*/React.createElement("div", {
|
38
|
+
key: char,
|
39
|
+
onClick: () => {
|
40
|
+
Transforms.select(editor, target);
|
41
|
+
insertMention(editor, char);
|
42
|
+
setMentions({
|
43
|
+
...mentions,
|
44
|
+
target: null
|
45
|
+
});
|
46
|
+
},
|
47
|
+
style: {
|
48
|
+
padding: "1px 3px",
|
49
|
+
borderRadius: "3px",
|
50
|
+
background: i === index ? "#B4D5FF" : "transparent"
|
51
|
+
}
|
52
|
+
}, char))) : null;
|
53
|
+
};
|
54
|
+
export default MentionsPopup;
|
@@ -0,0 +1,44 @@
|
|
1
|
+
import { useEffect, useState } from "react";
|
2
|
+
import { Editor, Range } from "slate";
|
3
|
+
const useMentions = props => {
|
4
|
+
const {
|
5
|
+
editor,
|
6
|
+
selection
|
7
|
+
} = props;
|
8
|
+
const [mentions, setMentions] = useState({
|
9
|
+
target: null,
|
10
|
+
index: null,
|
11
|
+
search: null
|
12
|
+
});
|
13
|
+
useEffect(() => {
|
14
|
+
if (selection && Range.isCollapsed(selection)) {
|
15
|
+
const [start] = Range.edges(selection);
|
16
|
+
const wordBefore = Editor.before(editor, start, {
|
17
|
+
unit: "word"
|
18
|
+
});
|
19
|
+
const before = wordBefore && Editor.before(editor, wordBefore);
|
20
|
+
const beforeRange = before && Editor.range(editor, before, start);
|
21
|
+
const beforeText = beforeRange && Editor.string(editor, beforeRange);
|
22
|
+
const beforeMatch = beforeText && beforeText.match(/^@(\w+)$/);
|
23
|
+
const after = Editor.after(editor, start);
|
24
|
+
const afterRange = Editor.range(editor, start, after);
|
25
|
+
const afterText = Editor.string(editor, afterRange);
|
26
|
+
const afterMatch = afterText.match(/^(\s|$)/);
|
27
|
+
if (beforeMatch && afterMatch) {
|
28
|
+
setMentions({
|
29
|
+
target: beforeRange,
|
30
|
+
search: beforeMatch[1],
|
31
|
+
index: 0
|
32
|
+
});
|
33
|
+
}
|
34
|
+
} else {
|
35
|
+
setMentions({
|
36
|
+
target: null,
|
37
|
+
search: null,
|
38
|
+
index: null
|
39
|
+
});
|
40
|
+
}
|
41
|
+
}, [selection, editor]);
|
42
|
+
return [mentions, setMentions];
|
43
|
+
};
|
44
|
+
export default useMentions;
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import { createEditor } from "slate";
|
2
|
+
import { withYjs, withCursors } from "@slate-yjs/core";
|
3
|
+
const withCollaborative = props => {
|
4
|
+
const {
|
5
|
+
provider,
|
6
|
+
sharedType,
|
7
|
+
data
|
8
|
+
} = props;
|
9
|
+
return withCursors(withYjs(createEditor(), sharedType, {
|
10
|
+
autoConnect: false
|
11
|
+
}), provider.awareness, {
|
12
|
+
data
|
13
|
+
});
|
14
|
+
};
|
15
|
+
export default withCollaborative;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { withReact } from "slate-react";
|
2
|
+
import { withHistory } from "slate-history";
|
3
|
+
import withLinks from "../plugins/withLinks";
|
4
|
+
import withTables from "../plugins/withTable";
|
5
|
+
import withEmbeds from "../plugins/withEmbeds";
|
6
|
+
import withEquation from "../plugins/withEquation";
|
7
|
+
import withMentions from "../plugins/withMentions";
|
8
|
+
const withCommon = props => {
|
9
|
+
return withEquation(withHistory(withEmbeds(withTables(withLinks(withMentions(withReact(props)))))));
|
10
|
+
};
|
11
|
+
export default withCommon;
|
@@ -0,0 +1,29 @@
|
|
1
|
+
import { Transforms, Path, Node } from 'slate';
|
2
|
+
const withEmbeds = editor => {
|
3
|
+
const {
|
4
|
+
isVoid,
|
5
|
+
insertBreak
|
6
|
+
} = editor;
|
7
|
+
editor.isVoid = element => ['video', 'image', 'htmlCode'].includes(element.type) ? true : isVoid(element);
|
8
|
+
editor.insertBreak = (...args) => {
|
9
|
+
const parentPath = Path.parent(editor.selection.focus.path);
|
10
|
+
const parentNode = Node.get(editor, parentPath);
|
11
|
+
// console.log(parentNode);
|
12
|
+
if (editor.isVoid(parentNode)) {
|
13
|
+
const nextPath = Path.next(parentPath);
|
14
|
+
Transforms.insertNodes(editor, {
|
15
|
+
type: 'paragraph',
|
16
|
+
children: [{
|
17
|
+
text: ''
|
18
|
+
}]
|
19
|
+
}, {
|
20
|
+
at: nextPath,
|
21
|
+
select: true // Focus on this node once inserted
|
22
|
+
});
|
23
|
+
} else {
|
24
|
+
insertBreak(...args);
|
25
|
+
}
|
26
|
+
};
|
27
|
+
return editor;
|
28
|
+
};
|
29
|
+
export default withEmbeds;
|
@@ -0,0 +1,18 @@
|
|
1
|
+
const withMentions = editor => {
|
2
|
+
const {
|
3
|
+
isInline,
|
4
|
+
isVoid,
|
5
|
+
markableVoid
|
6
|
+
} = editor;
|
7
|
+
editor.isInline = element => {
|
8
|
+
return element.type === "mention" ? true : isInline(element);
|
9
|
+
};
|
10
|
+
editor.isVoid = element => {
|
11
|
+
return element.type === "mention" ? true : isVoid(element);
|
12
|
+
};
|
13
|
+
editor.markableVoid = element => {
|
14
|
+
return element.type === "mention" || markableVoid(element);
|
15
|
+
};
|
16
|
+
return editor;
|
17
|
+
};
|
18
|
+
export default withMentions;
|
@@ -0,0 +1,61 @@
|
|
1
|
+
import { Editor, Range, Point, Element } from "slate";
|
2
|
+
const withTable = editor => {
|
3
|
+
const {
|
4
|
+
deleteBackward,
|
5
|
+
deleteForward
|
6
|
+
} = editor;
|
7
|
+
editor.deleteBackward = unit => {
|
8
|
+
const {
|
9
|
+
selection
|
10
|
+
} = editor;
|
11
|
+
if (selection) {
|
12
|
+
const [cell] = Editor.nodes(editor, {
|
13
|
+
match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table-cell"
|
14
|
+
});
|
15
|
+
const prevNodePath = Editor.before(editor, selection);
|
16
|
+
const [tableNode] = Editor.nodes(editor, {
|
17
|
+
at: prevNodePath,
|
18
|
+
match: n => !Editor.isEditor(n) && Element.isElement && n.type === "table-cell"
|
19
|
+
});
|
20
|
+
if (cell) {
|
21
|
+
const [, cellPath] = cell;
|
22
|
+
const start = Editor.start(editor, cellPath);
|
23
|
+
if (Point.equals(selection.anchor, start)) {
|
24
|
+
return;
|
25
|
+
}
|
26
|
+
}
|
27
|
+
if (!cell && tableNode) {
|
28
|
+
return;
|
29
|
+
}
|
30
|
+
}
|
31
|
+
deleteBackward(unit);
|
32
|
+
};
|
33
|
+
editor.deleteForward = unit => {
|
34
|
+
const {
|
35
|
+
selection
|
36
|
+
} = editor;
|
37
|
+
if (selection && Range.isCollapsed(selection)) {
|
38
|
+
const [cell] = Editor.nodes(editor, {
|
39
|
+
match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table-cell"
|
40
|
+
});
|
41
|
+
const prevNodePath = Editor.after(editor, selection);
|
42
|
+
const [tableNode] = Editor.nodes(editor, {
|
43
|
+
at: prevNodePath,
|
44
|
+
match: n => !Editor.isEditor(n) && Element.isElement && n.type === "table-cell"
|
45
|
+
});
|
46
|
+
if (cell) {
|
47
|
+
const [, cellPath] = cell;
|
48
|
+
const end = Editor.end(editor, cellPath);
|
49
|
+
if (Point.equals(selection.anchor, end)) {
|
50
|
+
return;
|
51
|
+
}
|
52
|
+
}
|
53
|
+
if (!cell && tableNode) {
|
54
|
+
return;
|
55
|
+
}
|
56
|
+
}
|
57
|
+
deleteForward(unit);
|
58
|
+
};
|
59
|
+
return editor;
|
60
|
+
};
|
61
|
+
export default withTable;
|