prosemirror-slash-menu-react 0.0.2 → 0.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +96 -84
- package/dist/index.es.js +5 -5
- package/dist/index.js +5 -5
- package/package.json +8 -12
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2023 Emergence Engineering
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -4,9 +4,12 @@
|
|
|
4
4
|
|
|
5
5
|
[**Made by Emergence-Engineering**](https://emergence-engineering.com/)
|
|
6
6
|
|
|
7
|
-
A UI package used together
|
|
7
|
+
A UI package used together
|
|
8
|
+
with [prosemirror-slash-menu](https://github.com/emergence-engineering/prosemirror-slash-menu) to display the menu with
|
|
9
|
+
react.
|
|
8
10
|
|
|
9
|
-
By Horváth Áron & [Viktor Váczi](https://emergence-engineering.com/cv/viktor)
|
|
11
|
+
By Horváth Áron & [Viktor Váczi](https://emergence-engineering.com/cv/viktor)
|
|
12
|
+
at [Emergence Engineering](https://emergence-engineering.com/)
|
|
10
13
|
|
|
11
14
|
Try it out at <https://emergence-engineering.com/blog/prosemirror-slash-menu>
|
|
12
15
|
|
|
@@ -22,102 +25,104 @@ Try it out at <https://emergence-engineering.com/blog/prosemirror-slash-menu>
|
|
|
22
25
|
|
|
23
26
|
# Behavior
|
|
24
27
|
|
|
25
|
-
You can open the menu with the `/` key in an empty paragraph or after a space and you can filter the elements just by
|
|
26
|
-
For exact behaviour description
|
|
27
|
-
|
|
28
|
+
You can open the menu with the `/` key in an empty paragraph or after a space and you can filter the elements just by
|
|
29
|
+
typing, or you can navigate with the keyboard. For exact behaviour description
|
|
30
|
+
checkout [prosemirror-slash-menu](https://github.com/emergence-engineering/prosemirror-slash-menu).
|
|
28
31
|
|
|
29
32
|
# Installation and Usage
|
|
33
|
+
|
|
30
34
|
Install from npm with:
|
|
31
35
|
|
|
32
|
-
`npm install prosemirror-slash-menu-react`
|
|
36
|
+
`npm install prosemirror-slash-menu-react`
|
|
33
37
|
|
|
34
38
|
Usage in the app:
|
|
35
39
|
|
|
36
40
|
```tsx
|
|
37
|
-
import React, {
|
|
38
|
-
import {
|
|
39
|
-
import {
|
|
40
|
-
import {
|
|
41
|
+
import React, {useEffect, useRef, useState} from "react";
|
|
42
|
+
import {exampleSetup} from "prosemirror-example-setup";
|
|
43
|
+
import {EditorState} from "prosemirror-state";
|
|
44
|
+
import {EditorView} from "prosemirror-view";
|
|
41
45
|
import schema from "./schema";
|
|
42
|
-
import {
|
|
46
|
+
import {SlashMenuPlugin} from "prosemirror-slash-menu";
|
|
43
47
|
import {
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
+
defaultElements,
|
|
49
|
+
defaultIcons,
|
|
50
|
+
Icons,
|
|
51
|
+
SlashMenuReact,
|
|
48
52
|
} from "prosemirror-slash-menu-react";
|
|
49
53
|
|
|
50
54
|
const ProseMirrorSlashMenuDemo = () => {
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
55
|
+
const [pmState, setPmState] = useState<EditorState>();
|
|
56
|
+
const [editorView, setEditorView] = useState<EditorView>();
|
|
57
|
+
const editorRef = useRef<HTMLDivElement>(null);
|
|
58
|
+
useEffect(() => {
|
|
59
|
+
if (!editorRef.current) return;
|
|
60
|
+
const state = EditorState.create({
|
|
61
|
+
doc: schema.nodeFromJSON({
|
|
62
|
+
content: [
|
|
63
|
+
{
|
|
64
|
+
content: [
|
|
65
|
+
{
|
|
66
|
+
text: "Type '/' after a space to open the menu. ",
|
|
67
|
+
type: "text",
|
|
68
|
+
},
|
|
69
|
+
],
|
|
70
|
+
type: "paragraph",
|
|
71
|
+
},
|
|
72
|
+
],
|
|
73
|
+
type: "doc",
|
|
74
|
+
}),
|
|
75
|
+
plugins: [
|
|
76
|
+
SlashMenuPlugin(defaultElements),
|
|
77
|
+
...exampleSetup({
|
|
78
|
+
schema,
|
|
79
|
+
}),
|
|
65
80
|
],
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
[Icons.Italic]: defaultIcons.ItalicIcon,
|
|
105
|
-
[Icons.Code]: defaultIcons.CodeIcon,
|
|
106
|
-
[Icons.Link]: defaultIcons.LinkIcon,
|
|
107
|
-
}}
|
|
108
|
-
editorState={pmState}
|
|
109
|
-
editorView={editorView}
|
|
110
|
-
/>
|
|
111
|
-
)}
|
|
112
|
-
</>
|
|
113
|
-
);
|
|
81
|
+
});
|
|
82
|
+
const view: EditorView = new EditorView(editorRef.current, {
|
|
83
|
+
state,
|
|
84
|
+
dispatchTransaction: (tr) => {
|
|
85
|
+
try {
|
|
86
|
+
const newState = view.state.apply(tr);
|
|
87
|
+
view.updateState(newState);
|
|
88
|
+
setPmState(newState);
|
|
89
|
+
} catch (e) {
|
|
90
|
+
}
|
|
91
|
+
},
|
|
92
|
+
});
|
|
93
|
+
setEditorView(view);
|
|
94
|
+
return () => {
|
|
95
|
+
view && view.destroy();
|
|
96
|
+
};
|
|
97
|
+
}, [editorRef]);
|
|
98
|
+
return (
|
|
99
|
+
<>
|
|
100
|
+
<div ref={editorRef} id="editor"/>
|
|
101
|
+
{pmState && editorView && (
|
|
102
|
+
<SlashMenuReact
|
|
103
|
+
icons={{
|
|
104
|
+
[Icons.HeaderMenu]: defaultIcons.H1Icon,
|
|
105
|
+
[Icons.Level1]: defaultIcons.H1Icon,
|
|
106
|
+
[Icons.Level2]: defaultIcons.H2Icon,
|
|
107
|
+
[Icons.Level3]: defaultIcons.H3Icon,
|
|
108
|
+
[Icons.Bold]: defaultIcons.BoldIcon,
|
|
109
|
+
[Icons.Italic]: defaultIcons.ItalicIcon,
|
|
110
|
+
[Icons.Code]: defaultIcons.CodeIcon,
|
|
111
|
+
[Icons.Link]: defaultIcons.LinkIcon,
|
|
112
|
+
}}
|
|
113
|
+
editorState={pmState}
|
|
114
|
+
editorView={editorView}
|
|
115
|
+
/>
|
|
116
|
+
)}
|
|
117
|
+
</>
|
|
118
|
+
);
|
|
114
119
|
};
|
|
115
120
|
```
|
|
116
121
|
|
|
122
|
+
# Styling
|
|
117
123
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
To use the basic styling you can import `menu-style.css` into your project. If you want to use your own styling you can override the following classnames.
|
|
124
|
+
To use the basic styling you can import `menu-style.css` into your project. If you want to use your own styling you can
|
|
125
|
+
override the following classnames.
|
|
121
126
|
|
|
122
127
|
- `menu-display-root` root div for the menu
|
|
123
128
|
- `menu-element-wrapper` root of menu elements
|
|
@@ -126,12 +131,19 @@ To use the basic styling you can import `menu-style.css` into your project. If y
|
|
|
126
131
|
- `menu-element-label` label of the menu element
|
|
127
132
|
- `menu-placeholder` when there is no matching items for the filter, this is displayed with the text "No matching items"
|
|
128
133
|
- `menu-filter-wrapper` root of the filter display, positioned above the menu by default
|
|
129
|
-
- `menu-filter` the filter text
|
|
134
|
+
- `menu-filter` the filter text
|
|
135
|
+
- `menu-filter-placeholder` placeholder text for the filter field
|
|
136
|
+
- `menu-filter-icon` if icon is provided for the filter field it's rendered in this div
|
|
130
137
|
- `submenu-label` The label of the submenu is shown above the menu elements when its opened
|
|
131
138
|
|
|
132
|
-
# Props
|
|
139
|
+
# Props
|
|
133
140
|
|
|
134
141
|
- `editorState` prosemirrors editor state
|
|
135
142
|
- `editorView` prosemirror editor view
|
|
136
|
-
- `icons` Optional, if you want to provide icons for your menu elements. Type of `{[key: string]: FC}` where the key is
|
|
137
|
-
|
|
143
|
+
- `icons` Optional, if you want to provide icons for your menu elements. Type of `{[key: string]: FC}` where the key is
|
|
144
|
+
the id of the menu element and the value is a `FunctionComponent` that renders the icon
|
|
145
|
+
- `subMenuIcon` Optional icon for submenu label. By default, when a submenu is open an arrow is displayed indicating
|
|
146
|
+
that the user is in a subMenu, it can be replaced with a react node of your choice
|
|
147
|
+
- `filterFieldIcon` Optional icon in the filter field.
|
|
148
|
+
- `filterPlaceHolder` Optional placeholder text for the filter field.
|
|
149
|
+
- `mainMenuLabel` Optional label for the main menu. By default, there is none.
|
package/dist/index.es.js
CHANGED
|
@@ -137,17 +137,17 @@ const H3Icon = () => (React.createElement("svg", { width: "36", height: "36", vi
|
|
|
137
137
|
const ItalicIcon = () => (React.createElement("svg", { width: "25", height: "24", viewBox: "0 0 25 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
138
138
|
React.createElement("path", { d: "M8.38197 18L14.382 6H11.5C10.9477 6 10.5 5.55228 10.5 5C10.5 4.44772 10.9477 4 11.5 4H19.5C20.0523 4 20.5 4.44772 20.5 5C20.5 5.55228 20.0523 6 19.5 6H16.618L10.618 18H13.5C14.0523 18 14.5 18.4477 14.5 19C14.5 19.5523 14.0523 20 13.5 20H5.5C4.94772 20 4.5 19.5523 4.5 19C4.5 18.4477 4.94772 18 5.5 18H8.38197Z", fill: "#050038" })));
|
|
139
139
|
const BoldIcon = () => (React.createElement("svg", { width: "25", height: "24", viewBox: "0 0 25 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
140
|
-
React.createElement("path", {
|
|
141
|
-
const ArrowLeft = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor",
|
|
140
|
+
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.5 15C19.5 17.7614 17.2614 20 14.5 20H8.5C7.94772 20 7.5 19.5523 7.5 19V5C7.5 4.44772 7.94772 4 8.5 4H14C16.4853 4 18.5 6.01472 18.5 8.5C18.5 9.4786 18.1876 10.3842 17.6572 11.1226C18.7818 12.0395 19.5 13.4359 19.5 15ZM10.5 10H14C14.8284 10 15.5 9.32843 15.5 8.5C15.5 7.67157 14.8284 7 14 7H10.5V10ZM10.5 17V13H14.5C15.6046 13 16.5 13.8954 16.5 15C16.5 16.1046 15.6046 17 14.5 17H10.5Z", fill: "#050038" })));
|
|
141
|
+
const ArrowLeft = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-arrow-left" },
|
|
142
142
|
React.createElement("line", { x1: "19", y1: "12", x2: "5", y2: "12" }),
|
|
143
143
|
React.createElement("polyline", { points: "12 19 5 12 12 5" })));
|
|
144
|
-
const ArrowRight = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor",
|
|
144
|
+
const ArrowRight = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-arrow-right" },
|
|
145
145
|
React.createElement("line", { x1: "5", y1: "12", x2: "19", y2: "12" }),
|
|
146
146
|
React.createElement("polyline", { points: "12 5 19 12 12 19" })));
|
|
147
|
-
const CodeIcon = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor",
|
|
147
|
+
const CodeIcon = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-code" },
|
|
148
148
|
React.createElement("polyline", { points: "16 18 22 12 16 6" }),
|
|
149
149
|
React.createElement("polyline", { points: "8 6 2 12 8 18" })));
|
|
150
|
-
const LinkIcon = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor",
|
|
150
|
+
const LinkIcon = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-link-2" },
|
|
151
151
|
React.createElement("path", { d: "M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3" }),
|
|
152
152
|
React.createElement("line", { x1: "8", y1: "12", x2: "16", y2: "12" })));
|
|
153
153
|
const defaultIcons = {
|
package/dist/index.js
CHANGED
|
@@ -145,17 +145,17 @@ const H3Icon = () => (React__default["default"].createElement("svg", { width: "3
|
|
|
145
145
|
const ItalicIcon = () => (React__default["default"].createElement("svg", { width: "25", height: "24", viewBox: "0 0 25 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
146
146
|
React__default["default"].createElement("path", { d: "M8.38197 18L14.382 6H11.5C10.9477 6 10.5 5.55228 10.5 5C10.5 4.44772 10.9477 4 11.5 4H19.5C20.0523 4 20.5 4.44772 20.5 5C20.5 5.55228 20.0523 6 19.5 6H16.618L10.618 18H13.5C14.0523 18 14.5 18.4477 14.5 19C14.5 19.5523 14.0523 20 13.5 20H5.5C4.94772 20 4.5 19.5523 4.5 19C4.5 18.4477 4.94772 18 5.5 18H8.38197Z", fill: "#050038" })));
|
|
147
147
|
const BoldIcon = () => (React__default["default"].createElement("svg", { width: "25", height: "24", viewBox: "0 0 25 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
148
|
-
React__default["default"].createElement("path", {
|
|
149
|
-
const ArrowLeft = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor",
|
|
148
|
+
React__default["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.5 15C19.5 17.7614 17.2614 20 14.5 20H8.5C7.94772 20 7.5 19.5523 7.5 19V5C7.5 4.44772 7.94772 4 8.5 4H14C16.4853 4 18.5 6.01472 18.5 8.5C18.5 9.4786 18.1876 10.3842 17.6572 11.1226C18.7818 12.0395 19.5 13.4359 19.5 15ZM10.5 10H14C14.8284 10 15.5 9.32843 15.5 8.5C15.5 7.67157 14.8284 7 14 7H10.5V10ZM10.5 17V13H14.5C15.6046 13 16.5 13.8954 16.5 15C16.5 16.1046 15.6046 17 14.5 17H10.5Z", fill: "#050038" })));
|
|
149
|
+
const ArrowLeft = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-arrow-left" },
|
|
150
150
|
React__default["default"].createElement("line", { x1: "19", y1: "12", x2: "5", y2: "12" }),
|
|
151
151
|
React__default["default"].createElement("polyline", { points: "12 19 5 12 12 5" })));
|
|
152
|
-
const ArrowRight = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor",
|
|
152
|
+
const ArrowRight = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-arrow-right" },
|
|
153
153
|
React__default["default"].createElement("line", { x1: "5", y1: "12", x2: "19", y2: "12" }),
|
|
154
154
|
React__default["default"].createElement("polyline", { points: "12 5 19 12 12 19" })));
|
|
155
|
-
const CodeIcon = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor",
|
|
155
|
+
const CodeIcon = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-code" },
|
|
156
156
|
React__default["default"].createElement("polyline", { points: "16 18 22 12 16 6" }),
|
|
157
157
|
React__default["default"].createElement("polyline", { points: "8 6 2 12 8 18" })));
|
|
158
|
-
const LinkIcon = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor",
|
|
158
|
+
const LinkIcon = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-link-2" },
|
|
159
159
|
React__default["default"].createElement("path", { d: "M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3" }),
|
|
160
160
|
React__default["default"].createElement("line", { x1: "8", y1: "12", x2: "16", y2: "12" })));
|
|
161
161
|
const defaultIcons = {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "prosemirror-slash-menu-react",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.4",
|
|
4
4
|
"description": "Implementation of prosemirror-slash-menu in react",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.es.js",
|
|
@@ -20,12 +20,11 @@
|
|
|
20
20
|
"prettier": "^2.8.8",
|
|
21
21
|
"prosemirror-commands": "^1.5.2",
|
|
22
22
|
"prosemirror-schema-basic": "^1.2.2",
|
|
23
|
-
"prosemirror-slash-menu": "^0.1.
|
|
23
|
+
"prosemirror-slash-menu": "^0.1.2",
|
|
24
24
|
"prosemirror-view": "^1.31.4",
|
|
25
25
|
"react": "^18.2.0",
|
|
26
26
|
"react-dom": "^18.2.0",
|
|
27
27
|
"react-popper": "^2.3.0",
|
|
28
|
-
"react-scripts": "5.0.1",
|
|
29
28
|
"rollup-plugin-import-css": "^3.2.1",
|
|
30
29
|
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
31
30
|
"rollup-plugin-postcss": "^4.0.2",
|
|
@@ -33,9 +32,7 @@
|
|
|
33
32
|
"web-vitals": "^2.1.4"
|
|
34
33
|
},
|
|
35
34
|
"scripts": {
|
|
36
|
-
"
|
|
37
|
-
"test": "react-scripts test",
|
|
38
|
-
"eject": "react-scripts eject",
|
|
35
|
+
"test": "echo \"no test specified\" && exit 0",
|
|
39
36
|
"build": "rollup -c --bundleConfigAsCjs",
|
|
40
37
|
"yalc:watch": "nodemon --watch dist --exec 'yalc push'",
|
|
41
38
|
"dev:watch": "npm-run-all --parallel dev yalc:watch"
|
|
@@ -59,12 +56,6 @@
|
|
|
59
56
|
"url": "https://github.com/emergence-engineering/prosemirror-slash-menu-react/issues"
|
|
60
57
|
},
|
|
61
58
|
"homepage": "https://github.com/emergence-engineering/prosemirror-slash-menu-react#readme",
|
|
62
|
-
"eslintConfig": {
|
|
63
|
-
"extends": [
|
|
64
|
-
"react-app",
|
|
65
|
-
"react-app/jest"
|
|
66
|
-
]
|
|
67
|
-
},
|
|
68
59
|
"devDependencies": {
|
|
69
60
|
"@babel/core": "^7.22.1",
|
|
70
61
|
"@babel/preset-env": "^7.22.4",
|
|
@@ -72,6 +63,7 @@
|
|
|
72
63
|
"@rollup/plugin-babel": "^6.0.3",
|
|
73
64
|
"@rollup/plugin-node-resolve": "^15.1.0",
|
|
74
65
|
"nodemon": "^2.0.22",
|
|
66
|
+
"np": "^8.0.4",
|
|
75
67
|
"rollup": "^2.79.1",
|
|
76
68
|
"rollup-plugin-babel": "^4.4.0",
|
|
77
69
|
"rollup-plugin-copy": "^3.4.0",
|
|
@@ -79,5 +71,9 @@
|
|
|
79
71
|
},
|
|
80
72
|
"peerDependencies": {
|
|
81
73
|
"react": "^18.2.0"
|
|
74
|
+
},
|
|
75
|
+
"engines": {
|
|
76
|
+
"node": ">=12",
|
|
77
|
+
"npm": ">=7"
|
|
82
78
|
}
|
|
83
79
|
}
|