@adminforth/rich-editor 1.0.4 → 1.0.6
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/custom/quillEditor.vue +10 -25
- package/dist/custom/quillEditor.vue +10 -25
- package/dist/index.js +1 -1
- package/index.ts +1 -1
- package/package.json +1 -1
package/custom/quillEditor.vue
CHANGED
|
@@ -32,10 +32,11 @@ function dbg(title: string,...args: any[]) {
|
|
|
32
32
|
console.log(title, ...args.map(a =>JSON.stringify(a, null, 1)));
|
|
33
33
|
}
|
|
34
34
|
|
|
35
|
-
|
|
35
|
+
// blots/embed: Represents inline embed elements, like images or videos that can be inserted into the text flow.
|
|
36
|
+
const Embed = Quill.import('blots/embed');
|
|
36
37
|
|
|
37
38
|
// @ts-ignore
|
|
38
|
-
class CompleteBlot extends
|
|
39
|
+
class CompleteBlot extends Embed {
|
|
39
40
|
static blotName = 'complete';
|
|
40
41
|
static tagName = 'span';
|
|
41
42
|
|
|
@@ -278,6 +279,8 @@ function approveCompletion(type: 'all' | 'word') {
|
|
|
278
279
|
|
|
279
280
|
let shouldComplete = false;
|
|
280
281
|
if (type === 'all') {
|
|
282
|
+
dbg(`👇 insert all at ${cursorPosition.index}, ${completion.value.join('')}`);
|
|
283
|
+
deleteCompleteEmbed();
|
|
281
284
|
quill.insertText(cursorPosition.index, completion.value.join(''), 'silent');
|
|
282
285
|
shouldComplete = true;
|
|
283
286
|
} else {
|
|
@@ -306,7 +309,6 @@ async function startCompletion() {
|
|
|
306
309
|
return;
|
|
307
310
|
}
|
|
308
311
|
completion.value = null;
|
|
309
|
-
// return;
|
|
310
312
|
deleteCompleteEmbed();
|
|
311
313
|
|
|
312
314
|
if (tmt) {
|
|
@@ -336,12 +338,10 @@ async function startCompletion() {
|
|
|
336
338
|
return;
|
|
337
339
|
}
|
|
338
340
|
|
|
339
|
-
|
|
340
|
-
// insert on +1 to insert after \n
|
|
341
|
-
quill.insertEmbed(cursorPosition.index + 1, 'complete', { text: completionAnswer.join('') }, 'silent');
|
|
341
|
+
quill.insertEmbed(cursorPosition.index, 'complete', { text: completionAnswer.join('') }, 'silent');
|
|
342
342
|
|
|
343
|
-
dbg('👇 set pos', cursorPosition.index, cursorPosition.length)
|
|
344
|
-
quill.setSelection(cursorPosition.index, cursorPosition.length, 'silent');
|
|
343
|
+
// dbg('👇 set pos', cursorPosition.index, cursorPosition.length)
|
|
344
|
+
// quill.setSelection(cursorPosition.index, cursorPosition.length, 'silent');
|
|
345
345
|
|
|
346
346
|
completion.value = completionAnswer;
|
|
347
347
|
|
|
@@ -393,28 +393,13 @@ function removeCompletionOnBlur() {
|
|
|
393
393
|
}
|
|
394
394
|
}
|
|
395
395
|
|
|
396
|
-
|
|
396
|
+
|
|
397
|
+
.ql-editor:not(:focus) [completer] {
|
|
397
398
|
display: none;
|
|
398
399
|
}
|
|
399
|
-
p:has(+ [completer]) {
|
|
400
|
-
// background: rgb(255 227 227); // debug
|
|
401
|
-
display: inline;
|
|
402
|
-
}
|
|
403
|
-
|
|
404
|
-
.ql-editor:not(:focus) [completer] {
|
|
405
|
-
display: none;
|
|
406
|
-
}
|
|
407
400
|
|
|
408
401
|
.ql-editor [completer] {
|
|
409
|
-
// important to keep pointer-events non none for cursor position on completer click
|
|
410
|
-
|
|
411
|
-
// text is not selectable
|
|
412
|
-
user-select: none;
|
|
413
402
|
color: gray;
|
|
414
|
-
|
|
415
|
-
// if inline or inline used then user-select: none brakes triple click
|
|
416
|
-
display: contents;
|
|
417
|
-
|
|
418
403
|
font-style: italic;
|
|
419
404
|
}
|
|
420
405
|
|
|
@@ -32,10 +32,11 @@ function dbg(title: string,...args: any[]) {
|
|
|
32
32
|
console.log(title, ...args.map(a =>JSON.stringify(a, null, 1)));
|
|
33
33
|
}
|
|
34
34
|
|
|
35
|
-
|
|
35
|
+
// blots/embed: Represents inline embed elements, like images or videos that can be inserted into the text flow.
|
|
36
|
+
const Embed = Quill.import('blots/embed');
|
|
36
37
|
|
|
37
38
|
// @ts-ignore
|
|
38
|
-
class CompleteBlot extends
|
|
39
|
+
class CompleteBlot extends Embed {
|
|
39
40
|
static blotName = 'complete';
|
|
40
41
|
static tagName = 'span';
|
|
41
42
|
|
|
@@ -278,6 +279,8 @@ function approveCompletion(type: 'all' | 'word') {
|
|
|
278
279
|
|
|
279
280
|
let shouldComplete = false;
|
|
280
281
|
if (type === 'all') {
|
|
282
|
+
dbg(`👇 insert all at ${cursorPosition.index}, ${completion.value.join('')}`);
|
|
283
|
+
deleteCompleteEmbed();
|
|
281
284
|
quill.insertText(cursorPosition.index, completion.value.join(''), 'silent');
|
|
282
285
|
shouldComplete = true;
|
|
283
286
|
} else {
|
|
@@ -306,7 +309,6 @@ async function startCompletion() {
|
|
|
306
309
|
return;
|
|
307
310
|
}
|
|
308
311
|
completion.value = null;
|
|
309
|
-
// return;
|
|
310
312
|
deleteCompleteEmbed();
|
|
311
313
|
|
|
312
314
|
if (tmt) {
|
|
@@ -336,12 +338,10 @@ async function startCompletion() {
|
|
|
336
338
|
return;
|
|
337
339
|
}
|
|
338
340
|
|
|
339
|
-
|
|
340
|
-
// insert on +1 to insert after \n
|
|
341
|
-
quill.insertEmbed(cursorPosition.index + 1, 'complete', { text: completionAnswer.join('') }, 'silent');
|
|
341
|
+
quill.insertEmbed(cursorPosition.index, 'complete', { text: completionAnswer.join('') }, 'silent');
|
|
342
342
|
|
|
343
|
-
dbg('👇 set pos', cursorPosition.index, cursorPosition.length)
|
|
344
|
-
quill.setSelection(cursorPosition.index, cursorPosition.length, 'silent');
|
|
343
|
+
// dbg('👇 set pos', cursorPosition.index, cursorPosition.length)
|
|
344
|
+
// quill.setSelection(cursorPosition.index, cursorPosition.length, 'silent');
|
|
345
345
|
|
|
346
346
|
completion.value = completionAnswer;
|
|
347
347
|
|
|
@@ -393,28 +393,13 @@ function removeCompletionOnBlur() {
|
|
|
393
393
|
}
|
|
394
394
|
}
|
|
395
395
|
|
|
396
|
-
|
|
396
|
+
|
|
397
|
+
.ql-editor:not(:focus) [completer] {
|
|
397
398
|
display: none;
|
|
398
399
|
}
|
|
399
|
-
p:has(+ [completer]) {
|
|
400
|
-
// background: rgb(255 227 227); // debug
|
|
401
|
-
display: inline;
|
|
402
|
-
}
|
|
403
|
-
|
|
404
|
-
.ql-editor:not(:focus) [completer] {
|
|
405
|
-
display: none;
|
|
406
|
-
}
|
|
407
400
|
|
|
408
401
|
.ql-editor [completer] {
|
|
409
|
-
// important to keep pointer-events non none for cursor position on completer click
|
|
410
|
-
|
|
411
|
-
// text is not selectable
|
|
412
|
-
user-select: none;
|
|
413
402
|
color: gray;
|
|
414
|
-
|
|
415
|
-
// if inline or inline used then user-select: none brakes triple click
|
|
416
|
-
display: contents;
|
|
417
|
-
|
|
418
403
|
font-style: italic;
|
|
419
404
|
}
|
|
420
405
|
|
package/dist/index.js
CHANGED
|
@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
8
8
|
});
|
|
9
9
|
};
|
|
10
10
|
import { AdminForthPlugin } from "adminforth";
|
|
11
|
-
export default class
|
|
11
|
+
export default class RichEditorPlugin extends AdminForthPlugin {
|
|
12
12
|
constructor(options) {
|
|
13
13
|
super(options, import.meta.url);
|
|
14
14
|
this.resourceConfig = undefined;
|
package/index.ts
CHANGED
|
@@ -3,7 +3,7 @@ import { IAdminForth, IHttpServer, AdminForthPlugin, AdminForthResource } from "
|
|
|
3
3
|
import { PluginOptions } from './types.js';
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
export default class
|
|
6
|
+
export default class RichEditorPlugin extends AdminForthPlugin {
|
|
7
7
|
options: PluginOptions;
|
|
8
8
|
resourceConfig?: AdminForthResource = undefined;
|
|
9
9
|
|