@plasmicpkgs/tiptap 0.0.1

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 (103) hide show
  1. package/LICENSE.md +21 -0
  2. package/README.md +1 -0
  3. package/dist/.tsbuildinfo +1 -0
  4. package/dist/components/MentionList.d.ts +12 -0
  5. package/dist/contexts.d.ts +30 -0
  6. package/dist/index.d.ts +2 -0
  7. package/dist/index.js +1400 -0
  8. package/dist/index.js.map +1 -0
  9. package/dist/registerBold.d.ts +9 -0
  10. package/dist/registerCode.d.ts +9 -0
  11. package/dist/registerItalic.d.ts +9 -0
  12. package/dist/registerLink.d.ts +9 -0
  13. package/dist/registerMention.d.ts +28 -0
  14. package/dist/registerStrike.d.ts +9 -0
  15. package/dist/registerTiptap.d.ts +18 -0
  16. package/dist/registerUnderline.d.ts +9 -0
  17. package/dist/tiptap.esm.js +1382 -0
  18. package/dist/tiptap.esm.js.map +1 -0
  19. package/dist/toolbar/registerToolbarBold.d.ts +13 -0
  20. package/dist/toolbar/registerToolbarCode.d.ts +13 -0
  21. package/dist/toolbar/registerToolbarItalic.d.ts +13 -0
  22. package/dist/toolbar/registerToolbarLink.d.ts +13 -0
  23. package/dist/toolbar/registerToolbarMention.d.ts +13 -0
  24. package/dist/toolbar/registerToolbarStrike.d.ts +13 -0
  25. package/dist/toolbar/registerToolbarUnderline.d.ts +13 -0
  26. package/dist/useIsClient.d.ts +3 -0
  27. package/dist/utils.d.ts +24 -0
  28. package/package.json +103 -0
  29. package/skinny/contexts.d.ts +30 -0
  30. package/skinny/registerBold.cjs.js +48 -0
  31. package/skinny/registerBold.cjs.js.map +1 -0
  32. package/skinny/registerBold.d.ts +9 -0
  33. package/skinny/registerBold.esm.js +41 -0
  34. package/skinny/registerBold.esm.js.map +1 -0
  35. package/skinny/registerCode.cjs.js +48 -0
  36. package/skinny/registerCode.cjs.js.map +1 -0
  37. package/skinny/registerCode.d.ts +9 -0
  38. package/skinny/registerCode.esm.js +41 -0
  39. package/skinny/registerCode.esm.js.map +1 -0
  40. package/skinny/registerItalic.cjs.js +48 -0
  41. package/skinny/registerItalic.cjs.js.map +1 -0
  42. package/skinny/registerItalic.d.ts +9 -0
  43. package/skinny/registerItalic.esm.js +41 -0
  44. package/skinny/registerItalic.esm.js.map +1 -0
  45. package/skinny/registerLink.cjs.js +48 -0
  46. package/skinny/registerLink.cjs.js.map +1 -0
  47. package/skinny/registerLink.d.ts +9 -0
  48. package/skinny/registerLink.esm.js +41 -0
  49. package/skinny/registerLink.esm.js.map +1 -0
  50. package/skinny/registerMention.cjs.js +420 -0
  51. package/skinny/registerMention.cjs.js.map +1 -0
  52. package/skinny/registerMention.d.ts +28 -0
  53. package/skinny/registerMention.esm.js +411 -0
  54. package/skinny/registerMention.esm.js.map +1 -0
  55. package/skinny/registerStrike.cjs.js +48 -0
  56. package/skinny/registerStrike.cjs.js.map +1 -0
  57. package/skinny/registerStrike.d.ts +9 -0
  58. package/skinny/registerStrike.esm.js +41 -0
  59. package/skinny/registerStrike.esm.js.map +1 -0
  60. package/skinny/registerTiptap-6a2d0bb4.esm.js +375 -0
  61. package/skinny/registerTiptap-6a2d0bb4.esm.js.map +1 -0
  62. package/skinny/registerTiptap-fd9bf882.cjs.js +391 -0
  63. package/skinny/registerTiptap-fd9bf882.cjs.js.map +1 -0
  64. package/skinny/registerTiptap.cjs.js +20 -0
  65. package/skinny/registerTiptap.cjs.js.map +1 -0
  66. package/skinny/registerTiptap.d.ts +18 -0
  67. package/skinny/registerTiptap.esm.js +10 -0
  68. package/skinny/registerTiptap.esm.js.map +1 -0
  69. package/skinny/registerToolbarBold.cjs.js +78 -0
  70. package/skinny/registerToolbarBold.cjs.js.map +1 -0
  71. package/skinny/registerToolbarBold.esm.js +71 -0
  72. package/skinny/registerToolbarBold.esm.js.map +1 -0
  73. package/skinny/registerToolbarCode.cjs.js +78 -0
  74. package/skinny/registerToolbarCode.cjs.js.map +1 -0
  75. package/skinny/registerToolbarCode.esm.js +71 -0
  76. package/skinny/registerToolbarCode.esm.js.map +1 -0
  77. package/skinny/registerToolbarItalic.cjs.js +81 -0
  78. package/skinny/registerToolbarItalic.cjs.js.map +1 -0
  79. package/skinny/registerToolbarItalic.esm.js +74 -0
  80. package/skinny/registerToolbarItalic.esm.js.map +1 -0
  81. package/skinny/registerToolbarLink.cjs.js +78 -0
  82. package/skinny/registerToolbarLink.cjs.js.map +1 -0
  83. package/skinny/registerToolbarLink.esm.js +71 -0
  84. package/skinny/registerToolbarLink.esm.js.map +1 -0
  85. package/skinny/registerToolbarMention.cjs.js +78 -0
  86. package/skinny/registerToolbarMention.cjs.js.map +1 -0
  87. package/skinny/registerToolbarMention.esm.js +71 -0
  88. package/skinny/registerToolbarMention.esm.js.map +1 -0
  89. package/skinny/registerToolbarStrike.cjs.js +78 -0
  90. package/skinny/registerToolbarStrike.cjs.js.map +1 -0
  91. package/skinny/registerToolbarStrike.esm.js +71 -0
  92. package/skinny/registerToolbarStrike.esm.js.map +1 -0
  93. package/skinny/registerToolbarUnderline.cjs.js +78 -0
  94. package/skinny/registerToolbarUnderline.cjs.js.map +1 -0
  95. package/skinny/registerToolbarUnderline.esm.js +71 -0
  96. package/skinny/registerToolbarUnderline.esm.js.map +1 -0
  97. package/skinny/registerUnderline.cjs.js +48 -0
  98. package/skinny/registerUnderline.cjs.js.map +1 -0
  99. package/skinny/registerUnderline.d.ts +9 -0
  100. package/skinny/registerUnderline.esm.js +41 -0
  101. package/skinny/registerUnderline.esm.js.map +1 -0
  102. package/skinny/useIsClient.d.ts +3 -0
  103. package/skinny/utils.d.ts +24 -0
@@ -0,0 +1,411 @@
1
+ import { DataProvider, repeatedElement, usePlasmicCanvasContext } from '@plasmicapp/host';
2
+ import TiptapMention from '@tiptap/extension-mention';
3
+ import { ReactRenderer } from '@tiptap/react';
4
+ import React, { forwardRef, useState, useEffect, useImperativeHandle, useRef, useMemo } from 'react';
5
+ import tippy from 'tippy.js';
6
+ import { u as useTiptapContext, r as registerComponentHelper, T as TIPTAP_COMPONENT_NAME } from './registerTiptap-6a2d0bb4.esm.js';
7
+ import '@tiptap/extension-document';
8
+ import '@tiptap/extension-paragraph';
9
+ import '@tiptap/extension-text';
10
+ import 'antd';
11
+ import '@plasmicapp/host/registerComponent';
12
+ import '@plasmicapp/host/registerGlobalContext';
13
+
14
+ var MentionList = forwardRef(
15
+ (props, ref) => {
16
+ const [selectedIndex, setSelectedIndex] = useState(0);
17
+ const {
18
+ items = [],
19
+ suggestionItem,
20
+ searchField,
21
+ popupClassName,
22
+ itemClassName,
23
+ selectedItemClassName
24
+ } = props;
25
+ const selectItem = (index) => {
26
+ var _a;
27
+ const item = items[index];
28
+ if (item) {
29
+ (_a = props.command) == null ? void 0 : _a.call(props, { id: item[searchField] });
30
+ }
31
+ };
32
+ const upHandler = () => {
33
+ setSelectedIndex((selectedIndex + (items == null ? void 0 : items.length) - 1) % items.length);
34
+ };
35
+ const downHandler = () => {
36
+ setSelectedIndex((selectedIndex + 1) % items.length);
37
+ };
38
+ const enterHandler = () => {
39
+ selectItem(selectedIndex);
40
+ };
41
+ useEffect(() => setSelectedIndex(0), [items]);
42
+ useImperativeHandle(ref, () => ({
43
+ onKeyDown: (event) => {
44
+ if (event.key === "ArrowUp") {
45
+ upHandler();
46
+ return true;
47
+ }
48
+ if (event.key === "ArrowDown") {
49
+ downHandler();
50
+ return true;
51
+ }
52
+ if (event.key === "Enter") {
53
+ enterHandler();
54
+ return true;
55
+ }
56
+ return false;
57
+ }
58
+ }));
59
+ const css = `
60
+ .SuggestionsList {
61
+ background: #eee;
62
+ position: relative;
63
+ border-radius: 0.5rem;
64
+
65
+ & .item {
66
+ display: block;
67
+ width: 100%;
68
+
69
+ & .is-selected {
70
+ color: purple;
71
+ }
72
+ }
73
+ }
74
+
75
+ `;
76
+ const hasSuggestionItemSlot = suggestionItem == null ? void 0 : suggestionItem.props.children;
77
+ return /* @__PURE__ */ React.createElement("div", { className: `SuggestionsList` }, /* @__PURE__ */ React.createElement("div", { className: popupClassName }, props.items.length ? props.items.map((item, index) => /* @__PURE__ */ React.createElement(
78
+ "div",
79
+ {
80
+ role: "button",
81
+ className: `item`,
82
+ key: index,
83
+ onClick: () => selectItem(index)
84
+ },
85
+ /* @__PURE__ */ React.createElement(
86
+ DataProvider,
87
+ {
88
+ key: item[searchField],
89
+ name: "suggestionItem",
90
+ data: item
91
+ },
92
+ /* @__PURE__ */ React.createElement(
93
+ "div",
94
+ {
95
+ className: `${itemClassName} ${index === selectedIndex ? "is-selected" : ""}`
96
+ },
97
+ /* @__PURE__ */ React.createElement(
98
+ "div",
99
+ {
100
+ className: index === selectedIndex ? selectedItemClassName : ""
101
+ },
102
+ hasSuggestionItemSlot ? repeatedElement(index === 0, suggestionItem) : item[searchField]
103
+ )
104
+ )
105
+ )
106
+ )) : /* @__PURE__ */ React.createElement("div", { className: "item" }, "No result")), /* @__PURE__ */ React.createElement("style", { dangerouslySetInnerHTML: { __html: css } }));
107
+ }
108
+ );
109
+
110
+ var __defProp = Object.defineProperty;
111
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
112
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
113
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
114
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
115
+ var __spreadValues = (a, b) => {
116
+ for (var prop in b || (b = {}))
117
+ if (__hasOwnProp.call(b, prop))
118
+ __defNormalProp(a, prop, b[prop]);
119
+ if (__getOwnPropSymbols)
120
+ for (var prop of __getOwnPropSymbols(b)) {
121
+ if (__propIsEnum.call(b, prop))
122
+ __defNormalProp(a, prop, b[prop]);
123
+ }
124
+ return a;
125
+ };
126
+ function Mention(props) {
127
+ const {
128
+ dataStatic = [],
129
+ dataDynamic,
130
+ hasDataDynamic,
131
+ suggestionItem,
132
+ searchField = "id",
133
+ popupClassName,
134
+ itemClassName,
135
+ selectedItemClassName,
136
+ mentionClassName,
137
+ maxSuggestionCount = 5
138
+ } = props;
139
+ const dataDynamicRef = useRef(dataDynamic);
140
+ const hasDataDynamicRef = useRef(hasDataDynamic);
141
+ const maxSuggestionCountRef = useRef(maxSuggestionCount);
142
+ dataDynamicRef.current = dataDynamic;
143
+ hasDataDynamicRef.current = hasDataDynamic;
144
+ maxSuggestionCountRef.current = maxSuggestionCount;
145
+ const { setMention } = useTiptapContext();
146
+ useEffect(() => {
147
+ setMention(
148
+ TiptapMention.configure({
149
+ HTMLAttributes: {
150
+ class: mentionClassName
151
+ },
152
+ renderLabel: ({ options, node }) => {
153
+ return `${options.suggestion.char}${node.attrs.id}`;
154
+ },
155
+ suggestion: {
156
+ /**
157
+ * This function below only does static filtering. It can't give query parameters to the Plasmic query for filtering at the server side to avoid some complexities.
158
+ *
159
+ * Before we move on to the issues, lets first explain how it could have supported server-side filtering via query params:
160
+ * - The user creates a plasmic query to fetch the suggestions. These suggestions are filtered by some query parameter. The value of the query parameter is bound to the currentMention state.
161
+ *
162
+ * - When the user types `@abc` for example, the following async function `items` is triggered. It knows the query and returns the new set of suggestions. The returned array is rendered in the suggestions popup
163
+ *
164
+ * Issues:
165
+ * 1. Stale Query issue:
166
+ * The same async function is responsible for setting the currentMention state, and also return the new suggestion results. We can't await the Plasmic query after it is triggered by the currentMention state change. So query results it has are stale.
167
+ *
168
+ * Solution: We poll the Plasmic query's isLoading field (indefinitely)
169
+ *
170
+ * For simplicity, therefore, we are just supporting static filtering for now, and may consider the approach highlighted above for filtering via query params.
171
+ *
172
+ * 2. The async function is provided at the time of extension initialization. That async function only knows the state/props in its render cycle, so these props are outdated at the time the async function is triggered.
173
+ *
174
+ * We can't put all of them in the useEffect dependencies array, because change in any of them will cause the Mention extension to be removed/re-added, resulting in a flicker on every keystroke + lost input focus (which causes the suggestion popup to never show)
175
+ *
176
+ * Solution: Use refs
177
+ *
178
+ * @param param0
179
+ * @returns
180
+ */
181
+ items: ({ query }) => {
182
+ var _a, _b;
183
+ if (!query)
184
+ return [];
185
+ if (!hasDataDynamicRef.current) {
186
+ const res = (dataStatic == null ? void 0 : dataStatic.filter(
187
+ (item) => {
188
+ var _a2, _b2, _c;
189
+ return (_c = (_b2 = (_a2 = item[searchField]).toLowerCase) == null ? void 0 : _b2.call(_a2)) == null ? void 0 : _c.includes(query.toLowerCase());
190
+ }
191
+ ).slice(0, maxSuggestionCountRef.current)) || [];
192
+ return res;
193
+ }
194
+ if (!dataDynamicRef.current)
195
+ return [];
196
+ if (((_a = dataDynamicRef.current) == null ? void 0 : _a.isLoading) === false) {
197
+ const data = (_b = dataDynamicRef.current.data) == null ? void 0 : _b.response;
198
+ if (!Array.isArray(data))
199
+ return [];
200
+ return (data == null ? void 0 : data.filter(
201
+ (item) => {
202
+ var _a2, _b2, _c;
203
+ return (_c = (_b2 = (_a2 = item[searchField]).toLowerCase) == null ? void 0 : _b2.call(_a2)) == null ? void 0 : _c.includes(query.toLowerCase());
204
+ }
205
+ ).slice(0, maxSuggestionCountRef.current)) || [];
206
+ }
207
+ return [];
208
+ },
209
+ render: () => {
210
+ let component;
211
+ let popup;
212
+ const otherProps = {
213
+ suggestionItem,
214
+ searchField,
215
+ popupClassName,
216
+ itemClassName,
217
+ selectedItemClassName
218
+ };
219
+ return {
220
+ // eslint-disable-next-line no-shadow
221
+ onStart: (props2) => {
222
+ component = new ReactRenderer(MentionList, {
223
+ props: __spreadValues(__spreadValues({}, props2), otherProps),
224
+ editor: props2.editor
225
+ });
226
+ if (!props2.clientRect) {
227
+ return;
228
+ }
229
+ popup = tippy("body", {
230
+ getReferenceClientRect: props2.clientRect,
231
+ appendTo: () => document.body,
232
+ content: component.element,
233
+ showOnCreate: true,
234
+ interactive: true,
235
+ trigger: "manual",
236
+ placement: "bottom-start"
237
+ });
238
+ },
239
+ // eslint-disable-next-line no-shadow
240
+ onUpdate(props2) {
241
+ var _a;
242
+ component.updateProps(__spreadValues(__spreadValues({}, props2), otherProps));
243
+ if (!props2.clientRect) {
244
+ return;
245
+ }
246
+ (_a = popup == null ? void 0 : popup[0]) == null ? void 0 : _a.setProps({
247
+ getReferenceClientRect: props2.clientRect
248
+ });
249
+ },
250
+ // eslint-disable-next-line no-shadow
251
+ onKeyDown(props2) {
252
+ var _a, _b;
253
+ if (props2.event.key === "Escape") {
254
+ (_a = popup == null ? void 0 : popup[0]) == null ? void 0 : _a.hide();
255
+ return true;
256
+ }
257
+ return ((_b = component.ref) == null ? void 0 : _b.onKeyDown(props2.event)) || false;
258
+ },
259
+ onExit() {
260
+ var _a;
261
+ (_a = popup == null ? void 0 : popup[0]) == null ? void 0 : _a.destroy();
262
+ component.destroy();
263
+ }
264
+ };
265
+ }
266
+ }
267
+ })
268
+ );
269
+ return () => {
270
+ setMention(void 0);
271
+ };
272
+ }, [
273
+ searchField,
274
+ mentionClassName,
275
+ popupClassName,
276
+ itemClassName,
277
+ selectedItemClassName
278
+ ]);
279
+ const inCanvas = !!usePlasmicCanvasContext();
280
+ const providerData = useMemo(() => {
281
+ var _a, _b;
282
+ const noData = [{ [searchField]: "No data" }];
283
+ let data = inCanvas ? noData : [];
284
+ if (!hasDataDynamic) {
285
+ if ((dataStatic == null ? void 0 : dataStatic.length) && Array.isArray(dataStatic)) {
286
+ data = [...dataStatic];
287
+ }
288
+ return data;
289
+ }
290
+ if (!dataDynamic || dataDynamic.isLoading)
291
+ return noData;
292
+ data = (_b = (_a = dataDynamic.data) == null ? void 0 : _a.response) != null ? _b : noData;
293
+ if (!Array.isArray(data))
294
+ return noData;
295
+ return data.slice(0, maxSuggestionCount);
296
+ }, [
297
+ dataDynamic,
298
+ searchField,
299
+ hasDataDynamic,
300
+ maxSuggestionCount,
301
+ dataStatic
302
+ ]);
303
+ return /* @__PURE__ */ React.createElement(
304
+ "div",
305
+ {
306
+ style: __spreadValues({}, {
307
+ // bare minimum styles (that need not be overridden)
308
+ // We just want to make the dataProvider data available to the MentionList component (<DataProvider> is needed to be returned from the returned JSX). It should not be shown in the UI, hence the display: none
309
+ display: "none",
310
+ position: "absolute",
311
+ top: 0,
312
+ background: "white"
313
+ })
314
+ },
315
+ providerData == null ? void 0 : providerData.slice(0, maxSuggestionCount).map((item, index) => {
316
+ var _a;
317
+ return (
318
+ // Data provider needs to be in the returned JSX (the actual use of the "suggestionItem" data is in the MentionList component.)
319
+ /* @__PURE__ */ React.createElement(DataProvider, { key: item.id, name: "suggestionItem", data: item }, (_a = repeatedElement(index === 0, suggestionItem)) != null ? _a : item[searchField])
320
+ );
321
+ })
322
+ );
323
+ }
324
+ Mention.displayName = "Mention";
325
+ function registerMention(loader) {
326
+ registerComponentHelper(loader, Mention, {
327
+ name: `${TIPTAP_COMPONENT_NAME}-extension-mention`,
328
+ displayName: "Tiptap Mention",
329
+ providesData: true,
330
+ props: {
331
+ dataDynamic: {
332
+ type: "dataSourceOpData",
333
+ description: "Filtered suggestions",
334
+ disableDynamicValue: true,
335
+ // we don't want the users to temper with the Plasmic's default query type.
336
+ hidden: (ps) => !ps.hasDataDynamic
337
+ },
338
+ searchField: {
339
+ type: "string",
340
+ defaultValueHint: "id"
341
+ },
342
+ maxSuggestionCount: {
343
+ type: "number",
344
+ defaultValueHint: 5,
345
+ description: "Limits the number of suggestions that appear in the suggestions popup"
346
+ },
347
+ dataStatic: {
348
+ type: "array",
349
+ hidden: (ps) => Boolean(ps.hasDataDynamic),
350
+ itemType: {
351
+ type: "object",
352
+ nameFunc: (item) => item.label,
353
+ fields: {
354
+ id: "string",
355
+ label: "string"
356
+ }
357
+ },
358
+ defaultValue: [
359
+ {
360
+ id: "thomasEd1",
361
+ label: "Thomas Edison"
362
+ },
363
+ {
364
+ id: "sherlock221b",
365
+ label: "Sherlock Holmes"
366
+ },
367
+ {
368
+ id: "eliot_thomas",
369
+ label: "T.S Eliot"
370
+ },
371
+ {
372
+ id: "shakespeare74",
373
+ label: "William Shakespeare"
374
+ }
375
+ ]
376
+ },
377
+ hasDataDynamic: {
378
+ type: "boolean"
379
+ },
380
+ mentionClassName: {
381
+ type: "class",
382
+ displayName: "Mention label"
383
+ },
384
+ popupClassName: {
385
+ type: "class",
386
+ displayName: "Suggestion Popup"
387
+ },
388
+ itemClassName: {
389
+ type: "class",
390
+ displayName: "Suggestion Item"
391
+ },
392
+ selectedItemClassName: {
393
+ type: "class",
394
+ displayName: "Selected Item"
395
+ },
396
+ suggestionItem: {
397
+ type: "slot"
398
+ },
399
+ currentMention: {
400
+ type: "string",
401
+ hidden: () => true
402
+ }
403
+ },
404
+ importName: "Mention",
405
+ importPath: "@plasmicpkgs/tiptap/skinny/registerMention",
406
+ parentComponentName: TIPTAP_COMPONENT_NAME
407
+ });
408
+ }
409
+
410
+ export { Mention, registerMention };
411
+ //# sourceMappingURL=registerMention.esm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"registerMention.esm.js","sources":["../src/components/MentionList.tsx","../src/registerMention.tsx"],"sourcesContent":["import { DataProvider, repeatedElement } from \"@plasmicapp/host\";\nimport { SuggestionProps } from \"@tiptap/suggestion\";\nimport React, {\n forwardRef,\n useEffect,\n useImperativeHandle,\n useState,\n} from \"react\";\n\ntype MentionListProps = SuggestionProps<any> & {\n suggestionItem: React.ReactNode;\n searchField: string;\n popupClassName: string;\n itemClassName: string;\n selectedItemClassName: string;\n};\n\nexport default forwardRef(\n (\n props: MentionListProps,\n ref: React.ForwardedRef<{ onKeyDown: (e: KeyboardEvent) => boolean }>\n ) => {\n const [selectedIndex, setSelectedIndex] = useState(0);\n const {\n items = [],\n suggestionItem,\n searchField,\n popupClassName,\n itemClassName,\n selectedItemClassName,\n } = props;\n\n const selectItem = (index: number) => {\n const item = items[index];\n\n if (item) {\n props.command?.({ id: item[searchField] });\n }\n };\n\n const upHandler = () => {\n setSelectedIndex((selectedIndex + items?.length - 1) % items.length);\n };\n\n const downHandler = () => {\n setSelectedIndex((selectedIndex + 1) % items.length);\n };\n\n const enterHandler = () => {\n selectItem(selectedIndex);\n };\n\n useEffect(() => setSelectedIndex(0), [items]);\n\n useImperativeHandle(ref, () => ({\n onKeyDown: (event) => {\n if (event.key === \"ArrowUp\") {\n upHandler();\n return true;\n }\n\n if (event.key === \"ArrowDown\") {\n downHandler();\n return true;\n }\n\n if (event.key === \"Enter\") {\n enterHandler();\n return true;\n }\n\n return false;\n },\n }));\n\n // bare minimum styles that can easily be overridden.\n const css = `\n .SuggestionsList {\n background: #eee;\n position: relative;\n border-radius: 0.5rem;\n\n & .item {\n display: block;\n width: 100%;\n\n & .is-selected {\n color: purple;\n }\n }\n }\n\n `;\n\n const hasSuggestionItemSlot = (suggestionItem as any)?.props.children;\n return (\n <div className={`SuggestionsList`}>\n <div className={popupClassName}>\n {props.items.length ? (\n props.items.map((item, index: number) => (\n <div\n role=\"button\"\n className={`item`}\n key={index}\n onClick={() => selectItem(index)}\n >\n <DataProvider\n key={item[searchField]}\n name={\"suggestionItem\"}\n data={item}\n >\n <div\n className={`${itemClassName} ${\n index === selectedIndex ? \"is-selected\" : \"\"\n }`}\n >\n <div\n /**\n * override styles from is-selected.\n * Reason: The styles added by Plasmic user via the Design tab in the studio have low-proiorty selectors\n * compared to the default styles defined above. And we do not have a choice on the selector either, so its not possible to increase its selector priority\n * What we do here though is add a child div with the className that should be able to overWrite the default styles instead.\n */\n className={\n index === selectedIndex ? selectedItemClassName : \"\"\n }\n >\n {hasSuggestionItemSlot\n ? repeatedElement(index === 0, suggestionItem)\n : item[searchField]}\n </div>\n </div>\n </DataProvider>\n </div>\n ))\n ) : (\n <div className=\"item\">No result</div>\n )}\n </div>\n <style dangerouslySetInnerHTML={{ __html: css }} />\n </div>\n );\n }\n);\n","import {\n DataProvider,\n repeatedElement,\n usePlasmicCanvasContext,\n} from \"@plasmicapp/host\";\nimport TiptapMention, { MentionOptions } from \"@tiptap/extension-mention\";\nimport { ReactRenderer } from \"@tiptap/react\";\nimport React, { useEffect, useMemo, useRef } from \"react\";\nimport tippy, { GetReferenceClientRect, Instance, Props } from \"tippy.js\";\nimport MentionList from \"./components/MentionList\";\nimport { useTiptapContext } from \"./contexts\";\nimport { TIPTAP_COMPONENT_NAME } from \"./registerTiptap\";\nimport { Registerable, registerComponentHelper } from \"./utils\";\n\nexport type QueryResult = {\n data?: { response: any[] };\n error?: Error;\n isLoading?: boolean;\n};\n\nexport type MentionProps = Omit<MentionOptions, \"HTMLAttributes\"> & {\n className: string;\n dataStatic?: any[];\n hasDataDynamic?: boolean;\n dataDynamic?: QueryResult;\n suggestionItem: React.ReactNode;\n searchField?: string;\n popupClassName?: string;\n itemClassName?: string;\n selectedItemClassName?: string;\n mentionClassName?: string;\n maxSuggestionCount?: number;\n};\n\nexport function Mention(props: MentionProps) {\n const {\n dataStatic = [],\n dataDynamic,\n hasDataDynamic,\n suggestionItem,\n searchField = \"id\",\n popupClassName,\n itemClassName,\n selectedItemClassName,\n mentionClassName,\n maxSuggestionCount = 5,\n } = props;\n\n /**\n * Although refs should be sparingly used, we need all these refs here due to the way tiptap works:\n *\n * It needs to be passed the async function that returns the suggestion items, when the extension is initialized (ie. in the .configure() call). Whenever there is a need for new suggestions, the same async callback is called. Without refs, that callback would always use stale data. That is why we absolutely need these here.\n */\n const dataDynamicRef = useRef(dataDynamic);\n const hasDataDynamicRef = useRef(hasDataDynamic);\n const maxSuggestionCountRef = useRef(maxSuggestionCount);\n dataDynamicRef.current = dataDynamic;\n hasDataDynamicRef.current = hasDataDynamic;\n maxSuggestionCountRef.current = maxSuggestionCount;\n\n const { setMention } = useTiptapContext();\n useEffect(() => {\n setMention(\n TiptapMention.configure({\n HTMLAttributes: {\n class: mentionClassName,\n },\n renderLabel: ({ options, node }) => {\n return `${options.suggestion.char}${node.attrs.id}`;\n },\n suggestion: {\n /**\n * This function below only does static filtering. It can't give query parameters to the Plasmic query for filtering at the server side to avoid some complexities.\n *\n * Before we move on to the issues, lets first explain how it could have supported server-side filtering via query params:\n * - The user creates a plasmic query to fetch the suggestions. These suggestions are filtered by some query parameter. The value of the query parameter is bound to the currentMention state.\n *\n * - When the user types `@abc` for example, the following async function `items` is triggered. It knows the query and returns the new set of suggestions. The returned array is rendered in the suggestions popup\n *\n * Issues:\n * 1. Stale Query issue:\n * The same async function is responsible for setting the currentMention state, and also return the new suggestion results. We can't await the Plasmic query after it is triggered by the currentMention state change. So query results it has are stale.\n *\n * Solution: We poll the Plasmic query's isLoading field (indefinitely)\n *\n * For simplicity, therefore, we are just supporting static filtering for now, and may consider the approach highlighted above for filtering via query params.\n *\n * 2. The async function is provided at the time of extension initialization. That async function only knows the state/props in its render cycle, so these props are outdated at the time the async function is triggered.\n *\n * We can't put all of them in the useEffect dependencies array, because change in any of them will cause the Mention extension to be removed/re-added, resulting in a flicker on every keystroke + lost input focus (which causes the suggestion popup to never show)\n *\n * Solution: Use refs\n *\n * @param param0\n * @returns\n */\n items: ({ query }: { query: string }) => {\n if (!query) return [];\n\n if (!hasDataDynamicRef.current) {\n // for static data, just filter the static array and return results\n const res =\n dataStatic\n ?.filter((item) =>\n item[searchField]\n .toLowerCase?.()\n ?.includes(query.toLowerCase())\n )\n .slice(0, maxSuggestionCountRef.current) || [];\n return res;\n }\n\n if (!dataDynamicRef.current) return [];\n\n if (dataDynamicRef.current?.isLoading === false) {\n const data = dataDynamicRef.current.data?.response;\n if (!Array.isArray(data)) return [];\n return (\n data\n ?.filter((item) =>\n item[searchField]\n .toLowerCase?.()\n ?.includes(query.toLowerCase())\n )\n .slice(0, maxSuggestionCountRef.current) || []\n );\n }\n\n return [];\n },\n render: () => {\n let component: ReactRenderer<\n { onKeyDown: (e: KeyboardEvent) => boolean },\n typeof MentionList\n >;\n let popup: Instance<Props>[];\n const otherProps = {\n suggestionItem,\n searchField,\n popupClassName,\n itemClassName,\n selectedItemClassName,\n };\n\n return {\n // eslint-disable-next-line no-shadow\n onStart: (props) => {\n component = new ReactRenderer<any, any>(MentionList, {\n props: {\n ...props,\n ...otherProps,\n },\n editor: props.editor,\n });\n\n if (!props.clientRect) {\n return;\n }\n\n popup = tippy(\"body\", {\n getReferenceClientRect:\n props.clientRect as GetReferenceClientRect,\n appendTo: () => document.body,\n content: component.element,\n showOnCreate: true,\n interactive: true,\n trigger: \"manual\",\n placement: \"bottom-start\",\n });\n },\n\n // eslint-disable-next-line no-shadow\n onUpdate(props) {\n component.updateProps({\n ...props,\n ...otherProps,\n });\n\n if (!props.clientRect) {\n return;\n }\n\n popup?.[0]?.setProps({\n getReferenceClientRect:\n props.clientRect as GetReferenceClientRect,\n });\n },\n\n // eslint-disable-next-line no-shadow\n onKeyDown(props) {\n if (props.event.key === \"Escape\") {\n popup?.[0]?.hide();\n\n return true;\n }\n\n return component.ref?.onKeyDown(props.event) || false;\n },\n\n onExit() {\n popup?.[0]?.destroy();\n component.destroy();\n },\n };\n },\n },\n })\n );\n return () => {\n setMention(undefined);\n };\n // add only those dependencies that are OK to trigger a flicker in the tiptap editor, while it re-initializes. ie. changes that are one-time (or not frequent / not per keystroke)\n }, [\n searchField,\n mentionClassName,\n popupClassName,\n itemClassName,\n selectedItemClassName,\n ]);\n\n const inCanvas = !!usePlasmicCanvasContext();\n\n const providerData = useMemo(() => {\n const noData = [{ [searchField]: \"No data\" }];\n let data = inCanvas ? noData : [];\n if (!hasDataDynamic) {\n if (dataStatic?.length && Array.isArray(dataStatic)) {\n data = [...dataStatic];\n }\n return data;\n }\n\n if (!dataDynamic || dataDynamic.isLoading) return noData;\n data = dataDynamic.data?.response ?? noData;\n if (!Array.isArray(data)) return noData;\n return data.slice(0, maxSuggestionCount);\n }, [\n dataDynamic,\n searchField,\n hasDataDynamic,\n maxSuggestionCount,\n dataStatic,\n ]);\n\n return (\n <div\n style={{\n // ...(showSuggestionItem ? {} : { display: \"none\" }),\n ...{\n // bare minimum styles (that need not be overridden)\n // We just want to make the dataProvider data available to the MentionList component (<DataProvider> is needed to be returned from the returned JSX). It should not be shown in the UI, hence the display: none\n display: \"none\",\n position: \"absolute\",\n top: 0,\n background: \"white\",\n },\n }}\n >\n {providerData?.slice(0, maxSuggestionCount).map((item, index) => (\n // Data provider needs to be in the returned JSX (the actual use of the \"suggestionItem\" data is in the MentionList component.)\n <DataProvider key={item.id} name={\"suggestionItem\"} data={item}>\n {repeatedElement(index === 0, suggestionItem) ?? item[searchField]}\n </DataProvider>\n ))}\n </div>\n );\n // return null;\n}\nMention.displayName = \"Mention\";\n\nexport function registerMention(loader?: Registerable) {\n registerComponentHelper(loader, Mention, {\n name: `${TIPTAP_COMPONENT_NAME}-extension-mention`,\n displayName: \"Tiptap Mention\",\n providesData: true,\n props: {\n dataDynamic: {\n type: \"dataSourceOpData\" as any,\n description: \"Filtered suggestions\",\n disableDynamicValue: true, // we don't want the users to temper with the Plasmic's default query type.\n hidden: (ps) => !ps.hasDataDynamic,\n },\n searchField: {\n type: \"string\",\n defaultValueHint: \"id\",\n },\n maxSuggestionCount: {\n type: \"number\",\n defaultValueHint: 5,\n description:\n \"Limits the number of suggestions that appear in the suggestions popup\",\n },\n dataStatic: {\n type: \"array\",\n hidden: (ps) => Boolean(ps.hasDataDynamic),\n itemType: {\n type: \"object\",\n nameFunc: (item) => item.label,\n fields: {\n id: \"string\",\n label: \"string\",\n },\n },\n defaultValue: [\n {\n id: \"thomasEd1\",\n label: \"Thomas Edison\",\n },\n {\n id: \"sherlock221b\",\n label: \"Sherlock Holmes\",\n },\n {\n id: \"eliot_thomas\",\n label: \"T.S Eliot\",\n },\n {\n id: \"shakespeare74\",\n label: \"William Shakespeare\",\n },\n ],\n },\n hasDataDynamic: {\n type: \"boolean\",\n },\n mentionClassName: {\n type: \"class\",\n displayName: \"Mention label\",\n },\n popupClassName: {\n type: \"class\",\n displayName: \"Suggestion Popup\",\n },\n itemClassName: {\n type: \"class\",\n displayName: \"Suggestion Item\",\n },\n selectedItemClassName: {\n type: \"class\",\n displayName: \"Selected Item\",\n },\n suggestionItem: {\n type: \"slot\",\n },\n currentMention: {\n type: \"string\",\n hidden: () => true,\n },\n },\n importName: \"Mention\",\n importPath: \"@plasmicpkgs/tiptap/skinny/registerMention\",\n parentComponentName: TIPTAP_COMPONENT_NAME,\n });\n}\n"],"names":["_a","_b","props"],"mappings":"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"}
@@ -0,0 +1,48 @@
1
+ 'use strict';
2
+
3
+ var TiptapStrike = require('@tiptap/extension-strike');
4
+ var React = require('react');
5
+ var registerTiptap = require('./registerTiptap-fd9bf882.cjs.js');
6
+ require('@tiptap/extension-document');
7
+ require('@tiptap/extension-paragraph');
8
+ require('@tiptap/extension-text');
9
+ require('@tiptap/react');
10
+ require('antd');
11
+ require('@plasmicapp/host/registerComponent');
12
+ require('@plasmicapp/host/registerGlobalContext');
13
+
14
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
15
+
16
+ var TiptapStrike__default = /*#__PURE__*/_interopDefault(TiptapStrike);
17
+
18
+ function Strike(props) {
19
+ const { setStrike } = registerTiptap.useTiptapContext();
20
+ React.useEffect(() => {
21
+ setStrike(
22
+ TiptapStrike__default.default.configure({
23
+ HTMLAttributes: {
24
+ class: props.className
25
+ }
26
+ })
27
+ );
28
+ return () => {
29
+ setStrike(void 0);
30
+ };
31
+ }, []);
32
+ return null;
33
+ }
34
+ Strike.displayName = "Strike";
35
+ function registerStrike(loader) {
36
+ registerTiptap.registerComponentHelper(loader, Strike, {
37
+ name: `${registerTiptap.TIPTAP_COMPONENT_NAME}-extension-strike`,
38
+ displayName: "Tiptap Strike",
39
+ props: {},
40
+ importName: "Strike",
41
+ importPath: "@plasmicpkgs/tiptap/skinny/registerStrike",
42
+ parentComponentName: registerTiptap.TIPTAP_COMPONENT_NAME
43
+ });
44
+ }
45
+
46
+ exports.Strike = Strike;
47
+ exports.registerStrike = registerStrike;
48
+ //# sourceMappingURL=registerStrike.cjs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"registerStrike.cjs.js","sources":["../src/registerStrike.tsx"],"sourcesContent":["import TiptapStrike from \"@tiptap/extension-strike\";\nimport { useEffect } from \"react\";\nimport { useTiptapContext } from \"./contexts\";\nimport { TIPTAP_COMPONENT_NAME } from \"./registerTiptap\";\nimport { Registerable, registerComponentHelper } from \"./utils\";\n\nexport interface StrikeProps {\n className: string;\n}\n\nexport function Strike(props: StrikeProps) {\n const { setStrike } = useTiptapContext();\n\n useEffect(() => {\n setStrike(\n TiptapStrike.configure({\n HTMLAttributes: {\n class: props.className,\n },\n })\n );\n return () => {\n setStrike(undefined);\n };\n }, []);\n\n return null;\n}\nStrike.displayName = \"Strike\";\n\nexport function registerStrike(loader?: Registerable) {\n registerComponentHelper(loader, Strike, {\n name: `${TIPTAP_COMPONENT_NAME}-extension-strike`,\n displayName: \"Tiptap Strike\",\n props: {},\n importName: \"Strike\",\n importPath: \"@plasmicpkgs/tiptap/skinny/registerStrike\",\n parentComponentName: TIPTAP_COMPONENT_NAME,\n });\n}\n"],"names":["useTiptapContext","useEffect","TiptapStrike","registerComponentHelper","TIPTAP_COMPONENT_NAME"],"mappings":";;;;;;;;;;;;;;;;;AAUO,SAAS,OAAO,KAAoB,EAAA;AACzC,EAAM,MAAA,EAAE,SAAU,EAAA,GAAIA,+BAAiB,EAAA,CAAA;AAEvC,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,SAAA;AAAA,MACEC,8BAAa,SAAU,CAAA;AAAA,QACrB,cAAgB,EAAA;AAAA,UACd,OAAO,KAAM,CAAA,SAAA;AAAA,SACf;AAAA,OACD,CAAA;AAAA,KACH,CAAA;AACA,IAAA,OAAO,MAAM;AACX,MAAA,SAAA,CAAU,KAAS,CAAA,CAAA,CAAA;AAAA,KACrB,CAAA;AAAA,GACF,EAAG,EAAE,CAAA,CAAA;AAEL,EAAO,OAAA,IAAA,CAAA;AACT,CAAA;AACA,MAAA,CAAO,WAAc,GAAA,QAAA,CAAA;AAEd,SAAS,eAAe,MAAuB,EAAA;AACpD,EAAAC,sCAAA,CAAwB,QAAQ,MAAQ,EAAA;AAAA,IACtC,MAAM,CAAG,EAAAC,oCAAA,CAAA,iBAAA,CAAA;AAAA,IACT,WAAa,EAAA,eAAA;AAAA,IACb,OAAO,EAAC;AAAA,IACR,UAAY,EAAA,QAAA;AAAA,IACZ,UAAY,EAAA,2CAAA;AAAA,IACZ,mBAAqB,EAAAA,oCAAA;AAAA,GACtB,CAAA,CAAA;AACH;;;;;"}
@@ -0,0 +1,9 @@
1
+ import { Registerable } from "./utils";
2
+ export interface StrikeProps {
3
+ className: string;
4
+ }
5
+ export declare function Strike(props: StrikeProps): null;
6
+ export declare namespace Strike {
7
+ var displayName: string;
8
+ }
9
+ export declare function registerStrike(loader?: Registerable): void;
@@ -0,0 +1,41 @@
1
+ import TiptapStrike from '@tiptap/extension-strike';
2
+ import { useEffect } from 'react';
3
+ import { u as useTiptapContext, r as registerComponentHelper, T as TIPTAP_COMPONENT_NAME } from './registerTiptap-6a2d0bb4.esm.js';
4
+ import '@tiptap/extension-document';
5
+ import '@tiptap/extension-paragraph';
6
+ import '@tiptap/extension-text';
7
+ import '@tiptap/react';
8
+ import 'antd';
9
+ import '@plasmicapp/host/registerComponent';
10
+ import '@plasmicapp/host/registerGlobalContext';
11
+
12
+ function Strike(props) {
13
+ const { setStrike } = useTiptapContext();
14
+ useEffect(() => {
15
+ setStrike(
16
+ TiptapStrike.configure({
17
+ HTMLAttributes: {
18
+ class: props.className
19
+ }
20
+ })
21
+ );
22
+ return () => {
23
+ setStrike(void 0);
24
+ };
25
+ }, []);
26
+ return null;
27
+ }
28
+ Strike.displayName = "Strike";
29
+ function registerStrike(loader) {
30
+ registerComponentHelper(loader, Strike, {
31
+ name: `${TIPTAP_COMPONENT_NAME}-extension-strike`,
32
+ displayName: "Tiptap Strike",
33
+ props: {},
34
+ importName: "Strike",
35
+ importPath: "@plasmicpkgs/tiptap/skinny/registerStrike",
36
+ parentComponentName: TIPTAP_COMPONENT_NAME
37
+ });
38
+ }
39
+
40
+ export { Strike, registerStrike };
41
+ //# sourceMappingURL=registerStrike.esm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"registerStrike.esm.js","sources":["../src/registerStrike.tsx"],"sourcesContent":["import TiptapStrike from \"@tiptap/extension-strike\";\nimport { useEffect } from \"react\";\nimport { useTiptapContext } from \"./contexts\";\nimport { TIPTAP_COMPONENT_NAME } from \"./registerTiptap\";\nimport { Registerable, registerComponentHelper } from \"./utils\";\n\nexport interface StrikeProps {\n className: string;\n}\n\nexport function Strike(props: StrikeProps) {\n const { setStrike } = useTiptapContext();\n\n useEffect(() => {\n setStrike(\n TiptapStrike.configure({\n HTMLAttributes: {\n class: props.className,\n },\n })\n );\n return () => {\n setStrike(undefined);\n };\n }, []);\n\n return null;\n}\nStrike.displayName = \"Strike\";\n\nexport function registerStrike(loader?: Registerable) {\n registerComponentHelper(loader, Strike, {\n name: `${TIPTAP_COMPONENT_NAME}-extension-strike`,\n displayName: \"Tiptap Strike\",\n props: {},\n importName: \"Strike\",\n importPath: \"@plasmicpkgs/tiptap/skinny/registerStrike\",\n parentComponentName: TIPTAP_COMPONENT_NAME,\n });\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAUO,SAAS,OAAO,KAAoB,EAAA;AACzC,EAAM,MAAA,EAAE,SAAU,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAEvC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,SAAA;AAAA,MACE,aAAa,SAAU,CAAA;AAAA,QACrB,cAAgB,EAAA;AAAA,UACd,OAAO,KAAM,CAAA,SAAA;AAAA,SACf;AAAA,OACD,CAAA;AAAA,KACH,CAAA;AACA,IAAA,OAAO,MAAM;AACX,MAAA,SAAA,CAAU,KAAS,CAAA,CAAA,CAAA;AAAA,KACrB,CAAA;AAAA,GACF,EAAG,EAAE,CAAA,CAAA;AAEL,EAAO,OAAA,IAAA,CAAA;AACT,CAAA;AACA,MAAA,CAAO,WAAc,GAAA,QAAA,CAAA;AAEd,SAAS,eAAe,MAAuB,EAAA;AACpD,EAAA,uBAAA,CAAwB,QAAQ,MAAQ,EAAA;AAAA,IACtC,MAAM,CAAG,EAAA,qBAAA,CAAA,iBAAA,CAAA;AAAA,IACT,WAAa,EAAA,eAAA;AAAA,IACb,OAAO,EAAC;AAAA,IACR,UAAY,EAAA,QAAA;AAAA,IACZ,UAAY,EAAA,2CAAA;AAAA,IACZ,mBAAqB,EAAA,qBAAA;AAAA,GACtB,CAAA,CAAA;AACH;;;;"}