@milkdown/plugin-slash 7.6.3 → 7.7.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.
- package/lib/index.es.js +135 -76
- package/lib/index.es.js.map +1 -1
- package/lib/slash-provider.d.ts.map +1 -1
- package/package.json +6 -6
package/lib/index.es.js
CHANGED
|
@@ -1,101 +1,160 @@
|
|
|
1
|
-
var
|
|
2
|
-
throw TypeError(
|
|
1
|
+
var __typeError = (msg) => {
|
|
2
|
+
throw TypeError(msg);
|
|
3
3
|
};
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
import {
|
|
11
|
-
|
|
12
|
-
|
|
4
|
+
var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
|
|
5
|
+
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
|
|
6
|
+
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
7
|
+
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
|
|
8
|
+
var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
|
|
9
|
+
var _initialized, _middleware, _floatingUIOptions, _root, _debounce, _trigger, _shouldShow, _offset, _onUpdate, _SlashProvider_instances, _shouldShow_fn;
|
|
10
|
+
import { Plugin, PluginKey, TextSelection } from "@milkdown/prose/state";
|
|
11
|
+
import { $ctx, $prose } from "@milkdown/utils";
|
|
12
|
+
import { posToDOMRect, findParentNode } from "@milkdown/prose";
|
|
13
|
+
import debounce from "lodash.debounce";
|
|
14
|
+
import { computePosition, flip, offset } from "@floating-ui/dom";
|
|
15
|
+
function slashFactory(id) {
|
|
16
|
+
const slashSpec = $ctx(
|
|
13
17
|
{},
|
|
14
|
-
`${
|
|
15
|
-
)
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
18
|
+
`${id}_SLASH_SPEC`
|
|
19
|
+
);
|
|
20
|
+
const slashPlugin = $prose((ctx) => {
|
|
21
|
+
const spec = ctx.get(slashSpec.key);
|
|
22
|
+
return new Plugin({
|
|
23
|
+
key: new PluginKey(`${id}_SLASH`),
|
|
24
|
+
...spec
|
|
20
25
|
});
|
|
21
|
-
})
|
|
22
|
-
|
|
26
|
+
});
|
|
27
|
+
const result = [slashSpec, slashPlugin];
|
|
28
|
+
result.key = slashSpec.key;
|
|
29
|
+
result.pluginKey = slashPlugin.key;
|
|
30
|
+
slashSpec.meta = {
|
|
23
31
|
package: "@milkdown/plugin-slash",
|
|
24
|
-
displayName: `Ctx<slashSpec>|${
|
|
25
|
-
}
|
|
32
|
+
displayName: `Ctx<slashSpec>|${id}`
|
|
33
|
+
};
|
|
34
|
+
slashPlugin.meta = {
|
|
26
35
|
package: "@milkdown/plugin-slash",
|
|
27
|
-
displayName: `Prose<slash>|${
|
|
28
|
-
}
|
|
36
|
+
displayName: `Prose<slash>|${id}`
|
|
37
|
+
};
|
|
38
|
+
return result;
|
|
29
39
|
}
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
i(this, m);
|
|
40
|
+
class SlashProvider {
|
|
41
|
+
constructor(options) {
|
|
42
|
+
__privateAdd(this, _SlashProvider_instances);
|
|
43
|
+
__privateAdd(this, _initialized);
|
|
35
44
|
/// @internal
|
|
36
|
-
|
|
45
|
+
__privateAdd(this, _middleware);
|
|
37
46
|
/// @internal
|
|
38
|
-
|
|
47
|
+
__privateAdd(this, _floatingUIOptions);
|
|
39
48
|
/// @internal
|
|
40
|
-
|
|
49
|
+
__privateAdd(this, _root);
|
|
41
50
|
/// @internal
|
|
42
|
-
|
|
51
|
+
__privateAdd(this, _debounce);
|
|
43
52
|
/// @internal
|
|
44
|
-
|
|
53
|
+
__privateAdd(this, _trigger);
|
|
45
54
|
/// @internal
|
|
46
|
-
|
|
55
|
+
__privateAdd(this, _shouldShow);
|
|
47
56
|
/// The offset to get the block. Default is 0.
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
57
|
+
__privateAdd(this, _offset);
|
|
58
|
+
__privateAdd(this, _onUpdate);
|
|
59
|
+
__privateSet(this, _initialized, false);
|
|
60
|
+
this.onShow = () => {
|
|
61
|
+
};
|
|
62
|
+
this.onHide = () => {
|
|
63
|
+
};
|
|
64
|
+
__privateSet(this, _onUpdate, (view, prevState) => {
|
|
65
|
+
const { state, composing } = view;
|
|
66
|
+
const { selection, doc } = state;
|
|
67
|
+
const { ranges } = selection;
|
|
68
|
+
const from = Math.min(...ranges.map((range) => range.$from.pos));
|
|
69
|
+
const to = Math.max(...ranges.map((range) => range.$to.pos));
|
|
70
|
+
const isSame = prevState && prevState.doc.eq(doc) && prevState.selection.eq(selection);
|
|
71
|
+
if (!__privateGet(this, _initialized)) {
|
|
72
|
+
const root = __privateGet(this, _root) ?? view.dom.parentElement ?? document.body;
|
|
73
|
+
root.appendChild(this.element);
|
|
74
|
+
__privateSet(this, _initialized, true);
|
|
75
|
+
}
|
|
76
|
+
if (composing || isSame) return;
|
|
77
|
+
if (!__privateGet(this, _shouldShow).call(this, view, prevState)) {
|
|
56
78
|
this.hide();
|
|
57
79
|
return;
|
|
58
80
|
}
|
|
59
|
-
|
|
60
|
-
getBoundingClientRect: () =>
|
|
61
|
-
}
|
|
81
|
+
const virtualEl = {
|
|
82
|
+
getBoundingClientRect: () => posToDOMRect(view, from, to)
|
|
83
|
+
};
|
|
84
|
+
computePosition(virtualEl, this.element, {
|
|
62
85
|
placement: "bottom-start",
|
|
63
|
-
middleware: [
|
|
64
|
-
...
|
|
65
|
-
}).then(({ x
|
|
86
|
+
middleware: [flip(), offset(__privateGet(this, _offset)), ...__privateGet(this, _middleware)],
|
|
87
|
+
...__privateGet(this, _floatingUIOptions)
|
|
88
|
+
}).then(({ x, y }) => {
|
|
66
89
|
Object.assign(this.element.style, {
|
|
67
|
-
left: `${
|
|
68
|
-
top: `${
|
|
90
|
+
left: `${x}px`,
|
|
91
|
+
top: `${y}px`
|
|
69
92
|
});
|
|
70
|
-
})
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
const
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
93
|
+
});
|
|
94
|
+
this.show();
|
|
95
|
+
});
|
|
96
|
+
this.update = (view, prevState) => {
|
|
97
|
+
const updater = debounce(__privateGet(this, _onUpdate), __privateGet(this, _debounce));
|
|
98
|
+
updater(view, prevState);
|
|
99
|
+
};
|
|
100
|
+
this.getContent = (view, matchNode = (node) => node.type.name === "paragraph") => {
|
|
101
|
+
const { selection } = view.state;
|
|
102
|
+
const { empty, $from } = selection;
|
|
103
|
+
const isTextBlock = view.state.selection instanceof TextSelection;
|
|
104
|
+
const isSlashChildren = this.element.contains(document.activeElement);
|
|
105
|
+
const notHasFocus = !view.hasFocus() && !isSlashChildren;
|
|
106
|
+
const isReadonly = !view.editable;
|
|
107
|
+
const paragraph = findParentNode(matchNode)(view.state.selection);
|
|
108
|
+
const isNotInParagraph = !paragraph;
|
|
109
|
+
if (notHasFocus || isReadonly || !empty || !isTextBlock || isNotInParagraph)
|
|
110
|
+
return;
|
|
111
|
+
return $from.parent.textBetween(
|
|
112
|
+
Math.max(0, $from.parentOffset - 500),
|
|
113
|
+
$from.parentOffset,
|
|
114
|
+
void 0,
|
|
115
|
+
""
|
|
116
|
+
);
|
|
117
|
+
};
|
|
118
|
+
this.destroy = () => {
|
|
119
|
+
};
|
|
120
|
+
this.show = () => {
|
|
121
|
+
this.element.dataset.show = "true";
|
|
122
|
+
this.onShow();
|
|
123
|
+
};
|
|
124
|
+
this.hide = () => {
|
|
125
|
+
this.element.dataset.show = "false";
|
|
126
|
+
this.onHide();
|
|
127
|
+
};
|
|
128
|
+
this.element = options.content;
|
|
129
|
+
__privateSet(this, _debounce, options.debounce ?? 200);
|
|
130
|
+
__privateSet(this, _shouldShow, options.shouldShow ?? __privateMethod(this, _SlashProvider_instances, _shouldShow_fn));
|
|
131
|
+
__privateSet(this, _trigger, options.trigger ?? "/");
|
|
132
|
+
__privateSet(this, _offset, options.offset);
|
|
133
|
+
__privateSet(this, _middleware, options.middleware ?? []);
|
|
134
|
+
__privateSet(this, _floatingUIOptions, options.floatingUIOptions ?? {});
|
|
135
|
+
__privateSet(this, _root, options.root);
|
|
88
136
|
}
|
|
89
137
|
}
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
138
|
+
_initialized = new WeakMap();
|
|
139
|
+
_middleware = new WeakMap();
|
|
140
|
+
_floatingUIOptions = new WeakMap();
|
|
141
|
+
_root = new WeakMap();
|
|
142
|
+
_debounce = new WeakMap();
|
|
143
|
+
_trigger = new WeakMap();
|
|
144
|
+
_shouldShow = new WeakMap();
|
|
145
|
+
_offset = new WeakMap();
|
|
146
|
+
_onUpdate = new WeakMap();
|
|
147
|
+
_SlashProvider_instances = new WeakSet();
|
|
148
|
+
/// @internal
|
|
149
|
+
_shouldShow_fn = function(view) {
|
|
150
|
+
const currentTextBlockContent = this.getContent(view);
|
|
151
|
+
if (!currentTextBlockContent) return false;
|
|
152
|
+
const target = currentTextBlockContent.at(-1);
|
|
153
|
+
if (!target) return false;
|
|
154
|
+
return Array.isArray(__privateGet(this, _trigger)) ? __privateGet(this, _trigger).includes(target) : __privateGet(this, _trigger) === target;
|
|
96
155
|
};
|
|
97
156
|
export {
|
|
98
|
-
|
|
99
|
-
|
|
157
|
+
SlashProvider,
|
|
158
|
+
slashFactory
|
|
100
159
|
};
|
|
101
160
|
//# sourceMappingURL=index.es.js.map
|
package/lib/index.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../src/slash-plugin.ts","../src/slash-provider.ts"],"sourcesContent":["import type { SliceType } from '@milkdown/ctx'\nimport type { PluginSpec } from '@milkdown/prose/state'\nimport { Plugin, PluginKey } from '@milkdown/prose/state'\nimport type { $Ctx, $Prose } from '@milkdown/utils'\nimport { $ctx, $prose } from '@milkdown/utils'\n\n/// @internal\nexport type SlashPluginSpecId<Id extends string> = `${Id}_SLASH_SPEC`\n\n/// @internal\nexport type SlashPlugin<Id extends string, State = any> = [\n $Ctx<PluginSpec<State>, SlashPluginSpecId<Id>>,\n $Prose,\n] & {\n key: SliceType<PluginSpec<State>, SlashPluginSpecId<Id>>\n pluginKey: $Prose['key']\n}\n\n/// Create a slash plugin with a unique id.\nexport function slashFactory<Id extends string, State = any>(id: Id) {\n const slashSpec = $ctx<PluginSpec<State>, SlashPluginSpecId<Id>>(\n {},\n `${id}_SLASH_SPEC`\n )\n const slashPlugin = $prose((ctx) => {\n const spec = ctx.get(slashSpec.key)\n return new Plugin({\n key: new PluginKey(`${id}_SLASH`),\n ...spec,\n })\n })\n const result = [slashSpec, slashPlugin] as SlashPlugin<Id>\n result.key = slashSpec.key\n result.pluginKey = slashPlugin.key\n slashSpec.meta = {\n package: '@milkdown/plugin-slash',\n displayName: `Ctx<slashSpec>|${id}`,\n }\n slashPlugin.meta = {\n package: '@milkdown/plugin-slash',\n displayName: `Prose<slash>|${id}`,\n }\n\n return result\n}\n","import { findParentNode, posToDOMRect } from '@milkdown/prose'\nimport type { EditorState } from '@milkdown/prose/state'\nimport type { Node } from '@milkdown/prose/model'\nimport { TextSelection } from '@milkdown/prose/state'\nimport type { EditorView } from '@milkdown/prose/view'\nimport debounce from 'lodash.debounce'\nimport type {\n ComputePositionConfig,\n Middleware,\n VirtualElement,\n} from '@floating-ui/dom'\nimport { computePosition, flip, offset } from '@floating-ui/dom'\n\n/// Options for slash provider.\nexport interface SlashProviderOptions {\n /// The slash content.\n content: HTMLElement\n /// The debounce time for updating slash, 200ms by default.\n debounce?: number\n /// The function to determine whether the tooltip should be shown.\n shouldShow?: (view: EditorView, prevState?: EditorState) => boolean\n /// The key trigger for shouldShow, '/' by default.\n trigger?: string | string[]\n /// The offset to get the block. Default is 0.\n offset?:\n | number\n | {\n mainAxis?: number\n crossAxis?: number\n alignmentAxis?: number | null\n }\n /// Other middlewares for floating ui. This will be added after the internal middlewares.\n middleware?: Middleware[]\n /// Options for floating ui. If you pass `middleware` or `placement`, it will override the internal settings.\n floatingUIOptions?: Partial<ComputePositionConfig>\n /// The root element that the slash will be appended to.\n root?: HTMLElement\n}\n\n/// A provider for creating slash.\nexport class SlashProvider {\n /// The root element of the slash.\n element: HTMLElement\n\n /// @internal\n #initialized = false\n\n /// @internal\n readonly #middleware: Middleware[]\n\n /// @internal\n readonly #floatingUIOptions: Partial<ComputePositionConfig>\n\n /// @internal\n readonly #root?: HTMLElement\n\n /// @internal\n readonly #debounce: number\n\n /// @internal\n readonly #trigger: string | string[]\n\n /// @internal\n readonly #shouldShow: (view: EditorView, prevState?: EditorState) => boolean\n\n /// The offset to get the block. Default is 0.\n readonly #offset?:\n | number\n | {\n mainAxis?: number\n crossAxis?: number\n alignmentAxis?: number | null\n }\n\n /// On show callback.\n onShow = () => {}\n\n /// On hide callback.\n onHide = () => {}\n\n constructor(options: SlashProviderOptions) {\n this.element = options.content\n this.#debounce = options.debounce ?? 200\n this.#shouldShow = options.shouldShow ?? this.#_shouldShow\n this.#trigger = options.trigger ?? '/'\n this.#offset = options.offset\n this.#middleware = options.middleware ?? []\n this.#floatingUIOptions = options.floatingUIOptions ?? {}\n this.#root = options.root\n }\n\n /// @internal\n #onUpdate = (view: EditorView, prevState?: EditorState): void => {\n const { state, composing } = view\n const { selection, doc } = state\n const { ranges } = selection\n const from = Math.min(...ranges.map((range) => range.$from.pos))\n const to = Math.max(...ranges.map((range) => range.$to.pos))\n const isSame =\n prevState && prevState.doc.eq(doc) && prevState.selection.eq(selection)\n\n if (!this.#initialized) {\n const root = this.#root ?? view.dom.parentElement ?? document.body\n root.appendChild(this.element)\n this.#initialized = true\n }\n\n if (composing || isSame) return\n\n if (!this.#shouldShow(view, prevState)) {\n this.hide()\n return\n }\n\n const virtualEl: VirtualElement = {\n getBoundingClientRect: () => posToDOMRect(view, from, to),\n }\n computePosition(virtualEl, this.element, {\n placement: 'bottom-start',\n middleware: [flip(), offset(this.#offset), ...this.#middleware],\n ...this.#floatingUIOptions,\n }).then(({ x, y }) => {\n Object.assign(this.element.style, {\n left: `${x}px`,\n top: `${y}px`,\n })\n })\n\n this.show()\n }\n\n /// @internal\n #_shouldShow(view: EditorView): boolean {\n const currentTextBlockContent = this.getContent(view)\n\n if (!currentTextBlockContent) return false\n\n const target = currentTextBlockContent.at(-1)\n\n if (!target) return false\n\n return Array.isArray(this.#trigger)\n ? this.#trigger.includes(target)\n : this.#trigger === target\n }\n\n /// Update provider state by editor view.\n update = (view: EditorView, prevState?: EditorState): void => {\n const updater = debounce(this.#onUpdate, this.#debounce)\n\n updater(view, prevState)\n }\n\n /// Get the content of the current text block.\n /// Pass the `matchNode` function to determine whether the current node should be matched, by default, it will match the paragraph node.\n getContent = (\n view: EditorView,\n matchNode: (node: Node) => boolean = (node) =>\n node.type.name === 'paragraph'\n ): string | undefined => {\n const { selection } = view.state\n const { empty, $from } = selection\n const isTextBlock = view.state.selection instanceof TextSelection\n\n const isSlashChildren = this.element.contains(document.activeElement)\n\n const notHasFocus = !view.hasFocus() && !isSlashChildren\n\n const isReadonly = !view.editable\n\n const paragraph = findParentNode(matchNode)(view.state.selection)\n\n const isNotInParagraph = !paragraph\n\n if (notHasFocus || isReadonly || !empty || !isTextBlock || isNotInParagraph)\n return\n\n return $from.parent.textBetween(\n Math.max(0, $from.parentOffset - 500),\n $from.parentOffset,\n undefined,\n '\\uFFFC'\n )\n }\n\n /// Destroy the slash.\n destroy = () => {}\n\n /// Show the slash.\n show = () => {\n this.element.dataset.show = 'true'\n this.onShow()\n }\n\n /// Hide the slash.\n hide = () => {\n this.element.dataset.show = 'false'\n this.onHide()\n }\n}\n"],"names":["slashFactory","id","slashSpec","$ctx","slashPlugin","$prose","ctx","spec","Plugin","PluginKey","result","SlashProvider","options","__privateAdd","_SlashProvider_instances","_initialized","_middleware","_floatingUIOptions","_root","_debounce","_trigger","_shouldShow","_offset","_onUpdate","__privateSet","view","prevState","state","composing","selection","doc","ranges","from","range","to","isSame","__privateGet","computePosition","posToDOMRect","flip","offset","x","y","debounce","matchNode","node","empty","$from","isTextBlock","TextSelection","isSlashChildren","notHasFocus","isReadonly","isNotInParagraph","findParentNode","__privateMethod","_shouldShow_fn","currentTextBlockContent","target"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../src/slash-plugin.ts","../src/slash-provider.ts"],"sourcesContent":["import type { SliceType } from '@milkdown/ctx'\nimport type { PluginSpec } from '@milkdown/prose/state'\nimport { Plugin, PluginKey } from '@milkdown/prose/state'\nimport type { $Ctx, $Prose } from '@milkdown/utils'\nimport { $ctx, $prose } from '@milkdown/utils'\n\n/// @internal\nexport type SlashPluginSpecId<Id extends string> = `${Id}_SLASH_SPEC`\n\n/// @internal\nexport type SlashPlugin<Id extends string, State = any> = [\n $Ctx<PluginSpec<State>, SlashPluginSpecId<Id>>,\n $Prose,\n] & {\n key: SliceType<PluginSpec<State>, SlashPluginSpecId<Id>>\n pluginKey: $Prose['key']\n}\n\n/// Create a slash plugin with a unique id.\nexport function slashFactory<Id extends string, State = any>(id: Id) {\n const slashSpec = $ctx<PluginSpec<State>, SlashPluginSpecId<Id>>(\n {},\n `${id}_SLASH_SPEC`\n )\n const slashPlugin = $prose((ctx) => {\n const spec = ctx.get(slashSpec.key)\n return new Plugin({\n key: new PluginKey(`${id}_SLASH`),\n ...spec,\n })\n })\n const result = [slashSpec, slashPlugin] as SlashPlugin<Id>\n result.key = slashSpec.key\n result.pluginKey = slashPlugin.key\n slashSpec.meta = {\n package: '@milkdown/plugin-slash',\n displayName: `Ctx<slashSpec>|${id}`,\n }\n slashPlugin.meta = {\n package: '@milkdown/plugin-slash',\n displayName: `Prose<slash>|${id}`,\n }\n\n return result\n}\n","import { findParentNode, posToDOMRect } from '@milkdown/prose'\nimport type { EditorState } from '@milkdown/prose/state'\nimport type { Node } from '@milkdown/prose/model'\nimport { TextSelection } from '@milkdown/prose/state'\nimport type { EditorView } from '@milkdown/prose/view'\nimport debounce from 'lodash.debounce'\nimport type {\n ComputePositionConfig,\n Middleware,\n VirtualElement,\n} from '@floating-ui/dom'\nimport { computePosition, flip, offset } from '@floating-ui/dom'\n\n/// Options for slash provider.\nexport interface SlashProviderOptions {\n /// The slash content.\n content: HTMLElement\n /// The debounce time for updating slash, 200ms by default.\n debounce?: number\n /// The function to determine whether the tooltip should be shown.\n shouldShow?: (view: EditorView, prevState?: EditorState) => boolean\n /// The key trigger for shouldShow, '/' by default.\n trigger?: string | string[]\n /// The offset to get the block. Default is 0.\n offset?:\n | number\n | {\n mainAxis?: number\n crossAxis?: number\n alignmentAxis?: number | null\n }\n /// Other middlewares for floating ui. This will be added after the internal middlewares.\n middleware?: Middleware[]\n /// Options for floating ui. If you pass `middleware` or `placement`, it will override the internal settings.\n floatingUIOptions?: Partial<ComputePositionConfig>\n /// The root element that the slash will be appended to.\n root?: HTMLElement\n}\n\n/// A provider for creating slash.\nexport class SlashProvider {\n /// The root element of the slash.\n element: HTMLElement\n\n /// @internal\n #initialized = false\n\n /// @internal\n readonly #middleware: Middleware[]\n\n /// @internal\n readonly #floatingUIOptions: Partial<ComputePositionConfig>\n\n /// @internal\n readonly #root?: HTMLElement\n\n /// @internal\n readonly #debounce: number\n\n /// @internal\n readonly #trigger: string | string[]\n\n /// @internal\n readonly #shouldShow: (view: EditorView, prevState?: EditorState) => boolean\n\n /// The offset to get the block. Default is 0.\n readonly #offset?:\n | number\n | {\n mainAxis?: number\n crossAxis?: number\n alignmentAxis?: number | null\n }\n\n /// On show callback.\n onShow = () => {}\n\n /// On hide callback.\n onHide = () => {}\n\n constructor(options: SlashProviderOptions) {\n this.element = options.content\n this.#debounce = options.debounce ?? 200\n this.#shouldShow = options.shouldShow ?? this.#_shouldShow\n this.#trigger = options.trigger ?? '/'\n this.#offset = options.offset\n this.#middleware = options.middleware ?? []\n this.#floatingUIOptions = options.floatingUIOptions ?? {}\n this.#root = options.root\n }\n\n /// @internal\n #onUpdate = (view: EditorView, prevState?: EditorState): void => {\n const { state, composing } = view\n const { selection, doc } = state\n const { ranges } = selection\n const from = Math.min(...ranges.map((range) => range.$from.pos))\n const to = Math.max(...ranges.map((range) => range.$to.pos))\n const isSame =\n prevState && prevState.doc.eq(doc) && prevState.selection.eq(selection)\n\n if (!this.#initialized) {\n const root = this.#root ?? view.dom.parentElement ?? document.body\n root.appendChild(this.element)\n this.#initialized = true\n }\n\n if (composing || isSame) return\n\n if (!this.#shouldShow(view, prevState)) {\n this.hide()\n return\n }\n\n const virtualEl: VirtualElement = {\n getBoundingClientRect: () => posToDOMRect(view, from, to),\n }\n computePosition(virtualEl, this.element, {\n placement: 'bottom-start',\n middleware: [flip(), offset(this.#offset), ...this.#middleware],\n ...this.#floatingUIOptions,\n }).then(({ x, y }) => {\n Object.assign(this.element.style, {\n left: `${x}px`,\n top: `${y}px`,\n })\n })\n\n this.show()\n }\n\n /// @internal\n #_shouldShow(view: EditorView): boolean {\n const currentTextBlockContent = this.getContent(view)\n\n if (!currentTextBlockContent) return false\n\n const target = currentTextBlockContent.at(-1)\n\n if (!target) return false\n\n return Array.isArray(this.#trigger)\n ? this.#trigger.includes(target)\n : this.#trigger === target\n }\n\n /// Update provider state by editor view.\n update = (view: EditorView, prevState?: EditorState): void => {\n const updater = debounce(this.#onUpdate, this.#debounce)\n\n updater(view, prevState)\n }\n\n /// Get the content of the current text block.\n /// Pass the `matchNode` function to determine whether the current node should be matched, by default, it will match the paragraph node.\n getContent = (\n view: EditorView,\n matchNode: (node: Node) => boolean = (node) =>\n node.type.name === 'paragraph'\n ): string | undefined => {\n const { selection } = view.state\n const { empty, $from } = selection\n const isTextBlock = view.state.selection instanceof TextSelection\n\n const isSlashChildren = this.element.contains(document.activeElement)\n\n const notHasFocus = !view.hasFocus() && !isSlashChildren\n\n const isReadonly = !view.editable\n\n const paragraph = findParentNode(matchNode)(view.state.selection)\n\n const isNotInParagraph = !paragraph\n\n if (notHasFocus || isReadonly || !empty || !isTextBlock || isNotInParagraph)\n return\n\n return $from.parent.textBetween(\n Math.max(0, $from.parentOffset - 500),\n $from.parentOffset,\n undefined,\n '\\uFFFC'\n )\n }\n\n /// Destroy the slash.\n destroy = () => {}\n\n /// Show the slash.\n show = () => {\n this.element.dataset.show = 'true'\n this.onShow()\n }\n\n /// Hide the slash.\n hide = () => {\n this.element.dataset.show = 'false'\n this.onHide()\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slash-provider.d.ts","sourceRoot":"","sources":["../src/slash-provider.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACxD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAEjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AAEtD,OAAO,KAAK,EACV,qBAAqB,EACrB,UAAU,EAEX,MAAM,kBAAkB,CAAA;AAIzB,MAAM,WAAW,oBAAoB;IAEnC,OAAO,EAAE,WAAW,CAAA;IAEpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,SAAS,CAAC,EAAE,WAAW,KAAK,OAAO,CAAA;IAEnE,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IAE3B,MAAM,CAAC,EACH,MAAM,GACN;QACE,QAAQ,CAAC,EAAE,MAAM,CAAA;QACjB,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;KAC9B,CAAA;IAEL,UAAU,CAAC,EAAE,UAAU,EAAE,CAAA;IAEzB,iBAAiB,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAA;IAElD,IAAI,CAAC,EAAE,WAAW,CAAA;CACnB;AAGD,qBAAa,aAAa;;IAExB,OAAO,EAAE,WAAW,CAAA;IAiCpB,MAAM,aAAW;IAGjB,MAAM,aAAW;gBAEL,OAAO,EAAE,oBAAoB;IAmEzC,MAAM,
|
|
1
|
+
{"version":3,"file":"slash-provider.d.ts","sourceRoot":"","sources":["../src/slash-provider.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACxD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAEjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AAEtD,OAAO,KAAK,EACV,qBAAqB,EACrB,UAAU,EAEX,MAAM,kBAAkB,CAAA;AAIzB,MAAM,WAAW,oBAAoB;IAEnC,OAAO,EAAE,WAAW,CAAA;IAEpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,SAAS,CAAC,EAAE,WAAW,KAAK,OAAO,CAAA;IAEnE,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IAE3B,MAAM,CAAC,EACH,MAAM,GACN;QACE,QAAQ,CAAC,EAAE,MAAM,CAAA;QACjB,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;KAC9B,CAAA;IAEL,UAAU,CAAC,EAAE,UAAU,EAAE,CAAA;IAEzB,iBAAiB,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAA;IAElD,IAAI,CAAC,EAAE,WAAW,CAAA;CACnB;AAGD,qBAAa,aAAa;;IAExB,OAAO,EAAE,WAAW,CAAA;IAiCpB,MAAM,aAAW;IAGjB,MAAM,aAAW;gBAEL,OAAO,EAAE,oBAAoB;IAmEzC,MAAM,GAAI,MAAM,UAAU,EAAE,YAAY,WAAW,KAAG,IAAI,CAIzD;IAID,UAAU,GACR,MAAM,UAAU,EAChB,YAAW,CAAC,IAAI,EAAE,IAAI,KAAK,OACK,KAC/B,MAAM,GAAG,SAAS,CAwBpB;IAGD,OAAO,aAAW;IAGlB,IAAI,aAGH;IAGD,IAAI,aAGH;CACF"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@milkdown/plugin-slash",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "7.
|
|
4
|
+
"version": "7.7.0",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -34,13 +34,13 @@
|
|
|
34
34
|
"@types/lodash.debounce": "^4.0.7",
|
|
35
35
|
"lodash.debounce": "^4.0.8",
|
|
36
36
|
"tslib": "^2.8.1",
|
|
37
|
-
"@milkdown/exception": "7.
|
|
38
|
-
"@milkdown/utils": "7.
|
|
37
|
+
"@milkdown/exception": "7.7.0",
|
|
38
|
+
"@milkdown/utils": "7.7.0"
|
|
39
39
|
},
|
|
40
40
|
"devDependencies": {
|
|
41
|
-
"@milkdown/
|
|
42
|
-
"@milkdown/
|
|
43
|
-
"@milkdown/prose": "7.
|
|
41
|
+
"@milkdown/core": "7.7.0",
|
|
42
|
+
"@milkdown/ctx": "7.7.0",
|
|
43
|
+
"@milkdown/prose": "7.7.0"
|
|
44
44
|
},
|
|
45
45
|
"nx": {
|
|
46
46
|
"targets": {
|