prosemirror-slash-menu 0.1.8 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/README.md +2 -0
  2. package/dist/types.d.ts +1 -0
  3. package/package.json +2 -1
  4. package/dist/plugin.js +0 -152
package/README.md CHANGED
@@ -65,6 +65,7 @@ A menu elements can either be a simple `CommandItem` that executes an action, or
65
65
  You can nest submenus into other submenus as needed.
66
66
  The `locked` property can be used to hide a menu element from the user. The main idea behind it is to have a `SubMenu` that can only be opened by sending a transaction with `openSubMenu` meta.
67
67
  Once opened it behaves like a second, hidden slash menu. For eg. you can have a command that needs approval or rejection after execution, you could open the slash menu with just these two options that are otherwise hidden.
68
+ The `group` property can be used to group elements together in the menu. It is used to separate elements in the UI. It is not necessary to group elements, but it can be useful for better organization.
68
69
 
69
70
  NOTE: It is necessary to add unique ids to every menu element.
70
71
 
@@ -78,6 +79,7 @@ type MenuItem = {
78
79
  type: ItemType;
79
80
  available: () => boolean;
80
81
  locked?: boolean;
82
+ group?: string;
81
83
  };
82
84
 
83
85
  interface CommandItem extends MenuItem {
package/dist/types.d.ts CHANGED
@@ -8,6 +8,7 @@ export type MenuItem = {
8
8
  type: ItemType;
9
9
  available: (view: EditorView) => boolean;
10
10
  locked?: boolean;
11
+ group?: string;
11
12
  };
12
13
  export interface CommandItem extends MenuItem {
13
14
  type: "command";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "prosemirror-slash-menu",
3
- "version": "0.1.8",
3
+ "version": "0.2.0",
4
4
  "description": "Slash menu for ProseMirror",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.es.js",
@@ -25,6 +25,7 @@
25
25
  "homepage": "https://github.com/emergence-engineering/prosemirror-slash-menu#readme",
26
26
  "dependencies": {
27
27
  "prosemirror-state": "^1.4.3",
28
+ "rimraf": "^6.0.1",
28
29
  "prosemirror-view": "^1.31.4"
29
30
  },
30
31
  "devDependencies": {
package/dist/plugin.js DELETED
@@ -1,152 +0,0 @@
1
- import { Plugin, PluginKey } from "prosemirror-state";
2
- import { dispatchWithMeta, getElementById, getFilteredItems, hasDuplicateIds, defaultIgnoredKeys, } from "./utils";
3
- import { getCase, SlashCases } from "./cases";
4
- import { closeMenu, closeSubMenu, nextItem, openSubMenu, prevItem, } from "./actions";
5
- import { SlashMetaTypes } from "./enums";
6
- console.log("slash-menu");
7
- export const SlashMenuKey = new PluginKey("slash-menu-plugin");
8
- export const SlashMenuPlugin = (menuElements, ignoredKeys, customConditions, openInSelection) => {
9
- const initialState = {
10
- selected: menuElements[0].id,
11
- open: false,
12
- filter: "",
13
- ignoredKeys: ignoredKeys
14
- ? [...defaultIgnoredKeys, ...ignoredKeys]
15
- : defaultIgnoredKeys,
16
- filteredElements: menuElements.filter((element) => !element.locked),
17
- elements: menuElements,
18
- };
19
- if (hasDuplicateIds(initialState)) {
20
- throw new Error("Menu elements must have unique id's!");
21
- }
22
- return new Plugin({
23
- key: SlashMenuKey,
24
- props: {
25
- handleKeyDown(view, event) {
26
- const editorState = view.state;
27
- const state = SlashMenuKey.getState(editorState);
28
- if (!state)
29
- return false;
30
- const slashCase = getCase(state, event, view, initialState.ignoredKeys, customConditions, openInSelection);
31
- switch (slashCase) {
32
- case SlashCases.OpenMenu:
33
- dispatchWithMeta(view, SlashMenuKey, { type: SlashMetaTypes.open });
34
- return true;
35
- case SlashCases.CloseMenu: {
36
- const { subMenuId } = state;
37
- if (subMenuId) {
38
- const submenu = getElementById(subMenuId, initialState);
39
- const callback = submenu === null || submenu === void 0 ? void 0 : submenu.callbackOnClose;
40
- if (!(submenu === null || submenu === void 0 ? void 0 : submenu.locked)) {
41
- if (callback) {
42
- callback();
43
- }
44
- dispatchWithMeta(view, SlashMenuKey, {
45
- type: SlashMetaTypes.closeSubMenu,
46
- element: getElementById(subMenuId, initialState),
47
- });
48
- }
49
- else
50
- dispatchWithMeta(view, SlashMenuKey, {
51
- type: SlashMetaTypes.close,
52
- });
53
- }
54
- else if (event.key === "/") {
55
- view.dispatch(editorState.tr.insertText("/").setMeta(SlashMenuKey, {
56
- type: SlashMetaTypes.close,
57
- }));
58
- }
59
- else
60
- dispatchWithMeta(view, SlashMenuKey, {
61
- type: SlashMetaTypes.close,
62
- });
63
- return true;
64
- }
65
- case SlashCases.Execute: {
66
- const menuElement = getElementById(state.selected, state);
67
- if (!menuElement)
68
- return false;
69
- if (menuElement.type === "command") {
70
- dispatchWithMeta(view, SlashMenuKey, {
71
- type: SlashMetaTypes.execute,
72
- });
73
- menuElement.command(view);
74
- }
75
- if (menuElement.type === "submenu") {
76
- dispatchWithMeta(view, SlashMenuKey, {
77
- type: SlashMetaTypes.openSubMenu,
78
- element: menuElement,
79
- });
80
- }
81
- return true;
82
- }
83
- case SlashCases.NextItem:
84
- dispatchWithMeta(view, SlashMenuKey, {
85
- type: SlashMetaTypes.nextItem,
86
- });
87
- return true;
88
- case SlashCases.PrevItem:
89
- dispatchWithMeta(view, SlashMenuKey, {
90
- type: SlashMetaTypes.prevItem,
91
- });
92
- return true;
93
- case SlashCases.addChar: {
94
- dispatchWithMeta(view, SlashMenuKey, {
95
- type: SlashMetaTypes.inputChange,
96
- filter: state.filter + event.key,
97
- });
98
- return true;
99
- }
100
- case SlashCases.removeChar: {
101
- const newFilter = state.filter.length === 1 ? "" : state.filter.slice(0, -1);
102
- dispatchWithMeta(view, SlashMenuKey, {
103
- type: SlashMetaTypes.inputChange,
104
- filter: newFilter,
105
- });
106
- return true;
107
- }
108
- case SlashCases.Catch: {
109
- return true;
110
- }
111
- default:
112
- return false;
113
- }
114
- },
115
- },
116
- state: {
117
- init() {
118
- return initialState;
119
- },
120
- apply(tr, state) {
121
- var _a;
122
- const meta = tr.getMeta(SlashMenuKey);
123
- switch (meta === null || meta === void 0 ? void 0 : meta.type) {
124
- case SlashMetaTypes.open:
125
- return Object.assign(Object.assign({}, initialState), { open: true });
126
- case SlashMetaTypes.close:
127
- return closeMenu(initialState);
128
- case SlashMetaTypes.execute:
129
- return initialState;
130
- case SlashMetaTypes.openSubMenu:
131
- return openSubMenu(state, meta);
132
- case SlashMetaTypes.closeSubMenu:
133
- return closeSubMenu(state, meta, initialState);
134
- case SlashMetaTypes.nextItem:
135
- return nextItem(state);
136
- case SlashMetaTypes.prevItem:
137
- return prevItem(state);
138
- case SlashMetaTypes.inputChange: {
139
- const newElements = meta.filter
140
- ? getFilteredItems(state, meta.filter)
141
- : initialState.elements;
142
- const selectedId = (_a = newElements === null || newElements === void 0 ? void 0 : newElements[0]) === null || _a === void 0 ? void 0 : _a.id;
143
- return Object.assign(Object.assign({}, state), { selected: selectedId || state.selected, filteredElements: newElements, filter: meta.filter || "" });
144
- }
145
- default:
146
- return state;
147
- }
148
- },
149
- },
150
- initialState,
151
- });
152
- };