dragon-editor 2.1.2 → 3.0.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 (58) hide show
  1. package/README.md +82 -96
  2. package/dist/module.json +1 -1
  3. package/dist/module.mjs +10 -12
  4. package/dist/runtime/components/DragonEditor.vue +457 -0
  5. package/dist/runtime/components/DragonEditorViewer.vue +228 -0
  6. package/dist/runtime/plugin.d.ts +2 -0
  7. package/dist/runtime/plugin.mjs +10 -0
  8. package/dist/runtime/scss/editor.css +261 -0
  9. package/dist/runtime/scss/viewer.css +198 -0
  10. package/dist/runtime/store.d.ts +7 -0
  11. package/dist/runtime/store.mjs +27 -0
  12. package/dist/runtime/type.d.ts +24 -0
  13. package/dist/runtime/utils/block.d.ts +9 -0
  14. package/dist/runtime/utils/block.mjs +70 -0
  15. package/dist/runtime/utils/convertor.d.ts +2 -0
  16. package/dist/runtime/utils/convertor.mjs +86 -0
  17. package/dist/runtime/utils/cursor.d.ts +6 -0
  18. package/dist/runtime/utils/cursor.mjs +132 -0
  19. package/dist/runtime/utils/element.d.ts +3 -0
  20. package/dist/runtime/utils/element.mjs +39 -0
  21. package/dist/runtime/utils/keyboardEvent.d.ts +10 -0
  22. package/dist/runtime/utils/keyboardEvent.mjs +781 -0
  23. package/dist/runtime/utils/style.d.ts +1 -0
  24. package/dist/runtime/utils/style.mjs +330 -0
  25. package/dist/runtime/utils/ui.d.ts +1 -0
  26. package/dist/runtime/utils/ui.mjs +35 -0
  27. package/package.json +10 -4
  28. package/README_en.md +0 -30
  29. package/dist/runtime/core/components/SvgIcon.d.ts +0 -10
  30. package/dist/runtime/core/components/SvgIcon.mjs +0 -98
  31. package/dist/runtime/core/components/editor/ImageBlock.vue +0 -175
  32. package/dist/runtime/core/components/editor/OlBlock.vue +0 -162
  33. package/dist/runtime/core/components/editor/TextBlock.vue +0 -172
  34. package/dist/runtime/core/components/editor/UlBlock.vue +0 -162
  35. package/dist/runtime/core/style/common.css +0 -496
  36. package/dist/runtime/core/style/viewer.css +0 -205
  37. package/dist/runtime/core/utils/converter.d.ts +0 -2
  38. package/dist/runtime/core/utils/converter.mjs +0 -90
  39. package/dist/runtime/core/utils/cursor.d.ts +0 -4
  40. package/dist/runtime/core/utils/cursor.mjs +0 -84
  41. package/dist/runtime/core/utils/element.d.ts +0 -3
  42. package/dist/runtime/core/utils/element.mjs +0 -40
  43. package/dist/runtime/core/utils/global.d.ts +0 -3
  44. package/dist/runtime/core/utils/global.mjs +0 -81
  45. package/dist/runtime/core/utils/index.d.ts +0 -7
  46. package/dist/runtime/core/utils/index.mjs +0 -7
  47. package/dist/runtime/core/utils/keyboard.d.ts +0 -6
  48. package/dist/runtime/core/utils/keyboard.mjs +0 -565
  49. package/dist/runtime/core/utils/style.d.ts +0 -6
  50. package/dist/runtime/core/utils/style.mjs +0 -374
  51. package/dist/runtime/core/utils/ui.d.ts +0 -4
  52. package/dist/runtime/core/utils/ui.mjs +0 -13
  53. package/dist/runtime/shared/components/DragonEditor.vue +0 -695
  54. package/dist/runtime/shared/components/DragonEditorComment.vue +0 -172
  55. package/dist/runtime/shared/components/DragonEditorNew.d.ts +0 -16
  56. package/dist/runtime/shared/components/DragonEditorNew.mjs +0 -62
  57. package/dist/runtime/shared/components/DragonEditorViewer.d.ts +0 -14
  58. package/dist/runtime/shared/components/DragonEditorViewer.mjs +0 -15
@@ -0,0 +1,781 @@
1
+ import { _setCursor, _setCursorData, _clenupCursor, _soltingCursorDataOnElement } from "./cursor.mjs";
2
+ import { _getParentElementIfNodeIsText, _findContentEditableElement } from "./element.mjs";
3
+ import { _getBlockType, _createTextBlock, _createListItemBlock } from "./block.mjs";
4
+ import { _setNodeStyle } from "./style.mjs";
5
+ let ketEventCount = 0;
6
+ export function _elementKeyEvent(event, store) {
7
+ _setCursorData(store);
8
+ switch (event.code) {
9
+ case "Enter":
10
+ event.preventDefault();
11
+ if (ketEventCount === 0) {
12
+ _clenupCursor(store);
13
+ setTimeout(() => {
14
+ if (event.shiftKey === true) {
15
+ elementShiftEnterEvent(event, store);
16
+ } else {
17
+ elementEnterEvent(event, store);
18
+ }
19
+ });
20
+ }
21
+ ketEventCount += 1;
22
+ setTimeout(() => {
23
+ ketEventCount = 0;
24
+ }, 150);
25
+ break;
26
+ case "Backspace":
27
+ elementBackspaceEvent(event, store);
28
+ break;
29
+ case "Tab":
30
+ event.preventDefault();
31
+ if (ketEventCount === 0) {
32
+ _clenupCursor(store);
33
+ setTimeout(() => {
34
+ elementTabEvent(event, store);
35
+ });
36
+ }
37
+ ketEventCount += 1;
38
+ setTimeout(() => {
39
+ ketEventCount = 0;
40
+ }, 150);
41
+ break;
42
+ case "Space":
43
+ break;
44
+ case "ArrowUp":
45
+ moveToBlockEvent(event, store, "up");
46
+ break;
47
+ case "ArrowDown":
48
+ moveToBlockEvent(event, store, "down");
49
+ break;
50
+ }
51
+ }
52
+ function elementEnterEvent(event, store) {
53
+ const { $element, type } = _getBlockType(event.target);
54
+ switch (type) {
55
+ case "text":
56
+ case "heading":
57
+ defaultBlockEnterEvent(store, $element);
58
+ break;
59
+ case "list":
60
+ listBlockEnterEvent(event, store, $element);
61
+ break;
62
+ default:
63
+ }
64
+ }
65
+ function elementShiftEnterEvent(event, store) {
66
+ const { $element, type } = _getBlockType(event.target);
67
+ switch (type) {
68
+ case "text":
69
+ case "heading":
70
+ defaultBlockShiftEnterEvent(store, $element);
71
+ break;
72
+ case "list":
73
+ listBlockEnterEvent(event, store, $element);
74
+ break;
75
+ default:
76
+ }
77
+ }
78
+ function elementBackspaceEvent(e, store) {
79
+ const { $element, type } = _getBlockType(e.target);
80
+ switch (type) {
81
+ case "text":
82
+ case "heading":
83
+ defaultBlockBackspaceEvent(e, store, $element);
84
+ break;
85
+ default:
86
+ console.log("// TODO : \uB2E4\uB978 \uD0C0\uC785 \uBE14\uB7ED \uBC31\uC2A4\uD398\uC774\uC2A4 \uC774\uBCA4\uD2B8", type);
87
+ }
88
+ }
89
+ function defaultBlockEnterEvent(store, $element) {
90
+ const $textBlock = $element;
91
+ if (store.cursorData.type === "Caret") {
92
+ if ($textBlock.textContent === "") {
93
+ if ($textBlock.hasChildNodes() === false) {
94
+ const $newTextBlock = _createTextBlock();
95
+ $textBlock.insertAdjacentElement("afterend", $newTextBlock);
96
+ $newTextBlock.focus();
97
+ } else {
98
+ let preStructure = [];
99
+ let nextStructure = [];
100
+ $textBlock.childNodes.forEach((_, i) => {
101
+ const $br = document.createElement("br");
102
+ if (store.cursorData.startOffset < i) {
103
+ preStructure.push($br);
104
+ } else {
105
+ nextStructure.push($br);
106
+ }
107
+ });
108
+ $textBlock.replaceChildren(...preStructure);
109
+ $textBlock.insertAdjacentElement("afterend", _createTextBlock());
110
+ const $nextBlock = $textBlock.nextElementSibling;
111
+ if (nextStructure.length === 0) {
112
+ $nextBlock.focus();
113
+ } else {
114
+ if (nextStructure.length === 1) {
115
+ nextStructure.push(document.createElement("br"));
116
+ }
117
+ $nextBlock.replaceChildren(...nextStructure);
118
+ _setCursor(nextStructure[0], 0);
119
+ }
120
+ }
121
+ } else {
122
+ const childNodeList = [...$element.childNodes];
123
+ const $targetNode = _getParentElementIfNodeIsText(store.cursorData.startNode, $textBlock);
124
+ const preStructure = [];
125
+ const nextStructure = [];
126
+ let nodeIdx = -1;
127
+ for (let i = 0; childNodeList.length > i; i += 1) {
128
+ if (childNodeList[i] === $targetNode) {
129
+ nodeIdx = i;
130
+ break;
131
+ }
132
+ }
133
+ childNodeList.forEach((node, i) => {
134
+ if (nodeIdx < i) {
135
+ nextStructure.push(node);
136
+ } else if (nodeIdx > i) {
137
+ preStructure.push(node);
138
+ } else if (nodeIdx === i) {
139
+ if (node.constructor.name === "Text") {
140
+ const text = node.textContent;
141
+ const preText = document.createTextNode(text.slice(0, store.cursorData.startOffset));
142
+ const nextText = document.createTextNode(text.slice(store.cursorData.startOffset));
143
+ preStructure.push(preText);
144
+ nextStructure.push(nextText);
145
+ } else {
146
+ const originalClassList = [...node.classList];
147
+ const text = node.textContent;
148
+ const preSpan = document.createElement("span");
149
+ const nextSpan = document.createElement("span");
150
+ preSpan.classList.add(...originalClassList);
151
+ preSpan.textContent = text.slice(0, store.cursorData.startOffset);
152
+ preStructure.push(preSpan);
153
+ nextSpan.classList.add(...originalClassList);
154
+ nextSpan.textContent = text.slice(store.cursorData.startOffset);
155
+ nextStructure.push(nextSpan);
156
+ }
157
+ }
158
+ });
159
+ const $nextBlock = _createTextBlock();
160
+ $textBlock.insertAdjacentElement("afterend", $nextBlock);
161
+ $textBlock.replaceChildren(...preStructure);
162
+ $nextBlock.replaceChildren(...nextStructure);
163
+ if (nextStructure.length === 0) {
164
+ $nextBlock.focus();
165
+ } else {
166
+ _setCursor($nextBlock.childNodes[0], 0);
167
+ }
168
+ }
169
+ } else {
170
+ const childNodeList = $textBlock.childNodes;
171
+ const cursorData = _soltingCursorDataOnElement(store.cursorData, $textBlock);
172
+ const preStructure = [];
173
+ const nextStructure = [];
174
+ if (cursorData.startNodeIdx === cursorData.endNodeIdx) {
175
+ childNodeList.forEach((node, i) => {
176
+ if (cursorData.startNodeIdx > i) {
177
+ preStructure.push(node);
178
+ } else if (cursorData.endNodeIdx < i) {
179
+ nextStructure.push(node);
180
+ } else if (cursorData.startNodeIdx === i) {
181
+ if (node.constructor.name === "Text") {
182
+ const preText = node.textContent.slice(0, cursorData.startOffset);
183
+ const nextText = node.textContent.slice(cursorData.endOffset);
184
+ if (preText !== "") {
185
+ const textNode = document.createTextNode(preText);
186
+ preStructure.push(textNode);
187
+ }
188
+ if (nextText !== "") {
189
+ const textNode = document.createTextNode(nextText);
190
+ nextStructure.push(textNode);
191
+ }
192
+ } else {
193
+ const originalClassList = [...node.classList];
194
+ const preText = node.textContent.slice(0, cursorData.startOffset);
195
+ const nextText = node.textContent.slice(cursorData.endOffset);
196
+ if (preText !== "") {
197
+ const $span = document.createElement("span");
198
+ $span.classList.add(...originalClassList);
199
+ $span.textContent = preText;
200
+ preStructure.push($span);
201
+ }
202
+ if (nextText !== "") {
203
+ const $span = document.createElement("span");
204
+ $span.classList.add(...originalClassList);
205
+ $span.textContent = nextText;
206
+ nextStructure.push($span);
207
+ }
208
+ }
209
+ }
210
+ });
211
+ } else {
212
+ childNodeList.forEach((node, i) => {
213
+ if (cursorData.startNodeIdx > i) {
214
+ preStructure.push(node);
215
+ } else if (cursorData.startNodeIdx === i) {
216
+ if (node.constructor.name === "Text") {
217
+ const text = node.textContent.slice(0, cursorData.startOffset);
218
+ if (text !== "") {
219
+ const textNode = document.createTextNode(text);
220
+ preStructure.push(textNode);
221
+ }
222
+ } else {
223
+ const originalClassList = [...node.classList];
224
+ const text = node.textContent.slice(0, cursorData.startOffset);
225
+ if (text !== "") {
226
+ const $span = document.createElement("span");
227
+ $span.classList.add(...originalClassList);
228
+ $span.textContent = text;
229
+ preStructure.push($span);
230
+ }
231
+ }
232
+ }
233
+ if (cursorData.endNodeIdx < i) {
234
+ nextStructure.push(node);
235
+ } else if (cursorData.endNodeIdx === i) {
236
+ if (node.constructor.name === "Text") {
237
+ const text = node.textContent.slice(cursorData.endOffset);
238
+ if (text !== "") {
239
+ const textNode = document.createTextNode(text);
240
+ nextStructure.push(textNode);
241
+ }
242
+ } else {
243
+ const originalClassList = [...node.classList];
244
+ const text = node.textContent.slice(cursorData.endOffset);
245
+ const $span = document.createElement("span");
246
+ if (text !== "") {
247
+ $span.classList.add(...originalClassList);
248
+ $span.textContent = text;
249
+ nextStructure.push($span);
250
+ }
251
+ }
252
+ }
253
+ });
254
+ }
255
+ const $nextBlock = _createTextBlock(store);
256
+ $textBlock.insertAdjacentElement("afterend", $nextBlock);
257
+ $textBlock.replaceChildren(...preStructure);
258
+ $nextBlock.replaceChildren(...nextStructure);
259
+ if (nextStructure.length === 0) {
260
+ $nextBlock.focus();
261
+ } else {
262
+ _setCursor($nextBlock.childNodes[0], 0);
263
+ }
264
+ }
265
+ }
266
+ function listBlockEnterEvent(event, store, $element) {
267
+ const $listBlock = $element;
268
+ const $editableElement = _findContentEditableElement(event.target);
269
+ const liList = $listBlock.querySelectorAll(".de-item");
270
+ let liIdx = -1;
271
+ for (let i = 0; liList.length > i; i += 1) {
272
+ if (liList[i] === $editableElement) {
273
+ liIdx = i;
274
+ break;
275
+ }
276
+ }
277
+ if (store.cursorData.type === "Caret") {
278
+ if ($editableElement.textContent === "") {
279
+ if (liList.length - 1 === liIdx) {
280
+ const $textBlock = _createTextBlock();
281
+ $listBlock.insertAdjacentElement("afterend", $textBlock);
282
+ if (liList.length === 1) {
283
+ $listBlock.remove();
284
+ } else {
285
+ $editableElement.remove();
286
+ }
287
+ $textBlock.focus();
288
+ } else {
289
+ const $liBlock = _createListItemBlock();
290
+ $editableElement.insertAdjacentElement("afterend", $liBlock);
291
+ $liBlock.focus();
292
+ }
293
+ } else {
294
+ const childNodeList = $editableElement.childNodes;
295
+ const targetNode = _getParentElementIfNodeIsText(store.cursorData.startNode, $editableElement);
296
+ const preStructure = [];
297
+ const nextStructure = [];
298
+ let nodeIdx = -1;
299
+ for (let i = 0; childNodeList.length > i; i += 1) {
300
+ if (childNodeList[i] === targetNode) {
301
+ nodeIdx = i;
302
+ break;
303
+ }
304
+ }
305
+ childNodeList.forEach((node, i) => {
306
+ if (nodeIdx < i) {
307
+ nextStructure.push(node);
308
+ } else if (nodeIdx > i) {
309
+ preStructure.push(node);
310
+ } else if (nodeIdx === i) {
311
+ if (node.constructor.name === "Text") {
312
+ const preText = node.textContent.slice(0, store.cursorData.startOffset);
313
+ const nextText = node.textContent.slice(store.cursorData.endOffset);
314
+ if (preText !== "") {
315
+ preStructure.push(document.createTextNode(preText));
316
+ }
317
+ if (nextText !== "") {
318
+ nextStructure.push(document.createTextNode(nextText));
319
+ }
320
+ } else {
321
+ const originalClassList = [...node.classList];
322
+ const preText = node.textContent.slice(0, store.cursorData.startOffset);
323
+ const nextText = node.textContent.slice(store.cursorData.endOffset);
324
+ if (preText !== "") {
325
+ const $span = document.createElement("span");
326
+ $span.textContent = preText;
327
+ $span.classList.add(...originalClassList);
328
+ preStructure.push($span);
329
+ }
330
+ if (nextText !== "") {
331
+ const $span = document.createElement("span");
332
+ $span.textContent = nextText;
333
+ $span.classList.add(...originalClassList);
334
+ nextStructure.push($span);
335
+ }
336
+ }
337
+ }
338
+ });
339
+ const $liBlock = _createListItemBlock();
340
+ $editableElement.insertAdjacentElement("afterend", $liBlock);
341
+ $editableElement.replaceChildren(...preStructure);
342
+ $liBlock.replaceChildren(...nextStructure);
343
+ if (nextStructure.length === 0) {
344
+ $liBlock.focus();
345
+ } else {
346
+ _setCursor($liBlock.childNodes[0], 0);
347
+ }
348
+ }
349
+ } else {
350
+ const childNodeList = $editableElement.childNodes;
351
+ const cursorData = _soltingCursorDataOnElement(store.cursorData, $editableElement);
352
+ const preStructure = [];
353
+ const nextStructure = [];
354
+ childNodeList.forEach((node, i) => {
355
+ if (cursorData.startNodeIdx > i) {
356
+ preStructure.push(node);
357
+ } else if (cursorData.startNodeIdx === i) {
358
+ if (node.constructor.name === "Text") {
359
+ const text = node.textContent.slice(0, cursorData.startOffset);
360
+ if (text !== "") {
361
+ const $textNode = document.createTextNode(text);
362
+ preStructure.push($textNode);
363
+ }
364
+ } else {
365
+ const originalClassList = [...node.classList];
366
+ const text = node.textContent.slice(0, cursorData.startOffset);
367
+ if (text !== "") {
368
+ const $span = document.createElement("span");
369
+ $span.classList.add(...originalClassList);
370
+ $span.textContent = text;
371
+ preStructure.push($span);
372
+ }
373
+ }
374
+ }
375
+ if (cursorData.endNodeIdx < i) {
376
+ nextStructure.push(node);
377
+ } else if (cursorData.endNodeIdx === i) {
378
+ if (node.constructor.name === "Text") {
379
+ const text = node.textContent.slice(cursorData.endOffset);
380
+ if (text !== "") {
381
+ const $textNode = document.createTextNode(text);
382
+ nextStructure.push($textNode);
383
+ }
384
+ } else {
385
+ const originalClassList = [...node.classList];
386
+ const text = node.textContent.slice(cursorData.endOffset);
387
+ if (text !== "") {
388
+ const $span = document.createElement("span");
389
+ $span.classList.add(...originalClassList);
390
+ $span.textContent = text;
391
+ nextStructure.push($span);
392
+ }
393
+ }
394
+ }
395
+ });
396
+ const $liBlock = _createListItemBlock();
397
+ $editableElement.insertAdjacentElement("afterend", $liBlock);
398
+ $editableElement.replaceChildren(...preStructure);
399
+ if (nextStructure.length === 0) {
400
+ $liBlock.focus();
401
+ } else {
402
+ $liBlock.replaceChildren(...nextStructure);
403
+ _setCursor(nextStructure[0], 0);
404
+ }
405
+ }
406
+ }
407
+ function defaultBlockShiftEnterEvent(store, $element) {
408
+ const $textBlock = $element;
409
+ if (store.cursorData.type === "Caret") {
410
+ if ($textBlock.textContent === "") {
411
+ if ($textBlock.hasChildNodes() === false) {
412
+ $textBlock.insertAdjacentHTML("beforeend", "<br><br>");
413
+ _setCursor($textBlock.childNodes[1], 0);
414
+ } else {
415
+ let $target = store.cursorData.startNode;
416
+ let childIdx = -1;
417
+ if ($textBlock === $target) {
418
+ $target = $textBlock.childNodes[store.cursorData.startOffset];
419
+ }
420
+ for (let i = 0; $textBlock.childNodes.length > i; i += 1) {
421
+ if ($textBlock.childNodes[i] === $target) {
422
+ childIdx = i;
423
+ break;
424
+ }
425
+ }
426
+ $target.insertAdjacentHTML("afterend", "<br>");
427
+ _setCursor($textBlock.childNodes[childIdx + 1], 0);
428
+ }
429
+ } else {
430
+ const childList = $textBlock.childNodes;
431
+ let $target = store.cursorData.startNode;
432
+ let targetIdx = -1;
433
+ let structure = "";
434
+ if ($target.constructor.name === "Text") {
435
+ if ($target.parentNode !== $textBlock) {
436
+ $target = $target.parentNode;
437
+ }
438
+ }
439
+ if ($textBlock === $target) {
440
+ $target = $textBlock.childNodes[store.cursorData.startOffset];
441
+ }
442
+ for (let i = 0; childList.length > i; i += 1) {
443
+ if (childList[i] === $target) {
444
+ targetIdx = i;
445
+ break;
446
+ }
447
+ }
448
+ let curruntIdx = targetIdx;
449
+ childList.forEach((child, i) => {
450
+ if (i === targetIdx) {
451
+ const constructorName = child.constructor.name;
452
+ if (constructorName === "Text") {
453
+ structure += child.textContent.slice(0, store.cursorData.startOffset) + "<br>" + child.textContent.slice(store.cursorData.endOffset);
454
+ if (child.nextSibling === null) {
455
+ if (child.textContent.slice(store.cursorData.endOffset) === "") {
456
+ structure += `<br>`;
457
+ }
458
+ if (child.textContent.slice(0, store.cursorData.startOffset) === "") {
459
+ curruntIdx -= 1;
460
+ }
461
+ } else {
462
+ if (child.textContent.slice(store.cursorData.endOffset) !== "" && child.textContent.slice(0, store.cursorData.startOffset) === "") {
463
+ curruntIdx -= 1;
464
+ }
465
+ }
466
+ curruntIdx += 1;
467
+ } else {
468
+ if (constructorName === "HTMLBRElement") {
469
+ structure += `<br><br>`;
470
+ } else {
471
+ console.log("TODO: \uC2A4\uD0C0\uC77C \uD0DC\uADF8 \uBD84\uB9AC \uC791\uC5C5");
472
+ }
473
+ }
474
+ } else {
475
+ if (child.constructor.name === "Text") {
476
+ structure += child.textContent;
477
+ } else {
478
+ structure += child.outerHTML;
479
+ }
480
+ }
481
+ });
482
+ $textBlock.innerHTML = structure;
483
+ _setCursor($textBlock.childNodes[curruntIdx + 1], 0);
484
+ }
485
+ } else {
486
+ const childNodeList = $textBlock.childNodes;
487
+ let startTargetNode = store.cursorData.startNode;
488
+ let startNodeIdx = -1;
489
+ let startOffset = store.cursorData.startOffset;
490
+ let endTargetNode = store.cursorData.endNode;
491
+ let endNodeIdx = -1;
492
+ let endOffset = store.cursorData.endOffset;
493
+ let structure = "";
494
+ if (startTargetNode.constructor.name === "Text") {
495
+ if (startTargetNode.parentElement !== $textBlock) {
496
+ startTargetNode = startTargetNode.parentElement;
497
+ }
498
+ }
499
+ if (endTargetNode.constructor.name === "Text") {
500
+ if (endTargetNode.parentElement !== $textBlock) {
501
+ endTargetNode = endTargetNode.parentElement;
502
+ }
503
+ }
504
+ for (let i = 0; childNodeList.length > i; i += 1) {
505
+ if (startTargetNode === childNodeList[i]) {
506
+ startNodeIdx = i;
507
+ }
508
+ if (endTargetNode === childNodeList[i]) {
509
+ endNodeIdx = i;
510
+ }
511
+ if (startNodeIdx !== -1 && endNodeIdx !== -1) {
512
+ break;
513
+ }
514
+ }
515
+ if (startNodeIdx !== endNodeIdx) {
516
+ if (startNodeIdx > endNodeIdx) {
517
+ const originalEndNodeIdx = endNodeIdx;
518
+ const originalEndOffset = endOffset;
519
+ const originalStartNodeIdx = startNodeIdx;
520
+ const originalStartOffset = startOffset;
521
+ startNodeIdx = originalEndNodeIdx;
522
+ startOffset = originalEndOffset;
523
+ endNodeIdx = originalStartNodeIdx;
524
+ endOffset = originalStartOffset;
525
+ }
526
+ } else {
527
+ if (startOffset > endOffset) {
528
+ const originalEndOffset = endOffset;
529
+ const originalStartOffset = startOffset;
530
+ startOffset = originalEndOffset;
531
+ endOffset = originalStartOffset;
532
+ }
533
+ }
534
+ childNodeList.forEach((node, i) => {
535
+ if (startNodeIdx > i) {
536
+ if (node.constructor.name === "Text") {
537
+ structure += node.textContent;
538
+ } else {
539
+ structure += node.outerHTML;
540
+ }
541
+ } else if (startNodeIdx === i) {
542
+ if (node.constructor.name === "Text") {
543
+ structure += node.textContent.slice(0, startOffset);
544
+ structure += `<br>`;
545
+ } else {
546
+ if (node.tagName === "BR") {
547
+ structure += `<br>`;
548
+ } else {
549
+ const originalClassList = [...node.classList];
550
+ const text = node.textContent;
551
+ structure += `<span class="${originalClassList.join(" ")}">${text.slice(0, startOffset)}</span><br>`;
552
+ }
553
+ }
554
+ if (childNodeList.length === i) {
555
+ structure += `<br>`;
556
+ }
557
+ }
558
+ if (endNodeIdx < i) {
559
+ if (node.constructor.name === "Text") {
560
+ structure += node.textContent;
561
+ } else {
562
+ structure += node.outerHTML;
563
+ }
564
+ } else if (endNodeIdx === i) {
565
+ if (node.constructor.name === "Text") {
566
+ structure += node.textContent.slice(endOffset);
567
+ } else {
568
+ if (node.tagName === "BR") {
569
+ structure += `<br>`;
570
+ } else {
571
+ const originalClassList = [...node.classList];
572
+ const text = node.textContent;
573
+ structure += `<span class="${originalClassList.join(" ")}">${text.slice(endOffset)}</span><br>`;
574
+ }
575
+ }
576
+ }
577
+ });
578
+ $textBlock.innerHTML = structure;
579
+ _setCursor($textBlock.childNodes[startNodeIdx + 2], 0);
580
+ }
581
+ }
582
+ function elementTabEvent(e, store) {
583
+ const { $element, type } = _getBlockType(e.target);
584
+ switch (type) {
585
+ case "text":
586
+ defaultTabEvent(e.shiftKey, $element);
587
+ break;
588
+ }
589
+ }
590
+ function defaultBlockBackspaceEvent(e, store, $element) {
591
+ const $textBlock = $element;
592
+ const childList = store.wrap.querySelectorAll(".de-block");
593
+ const childLength = childList.length;
594
+ const $target = _getParentElementIfNodeIsText(store.cursorData.startNode, $textBlock);
595
+ let elementIdx = -1;
596
+ for (let i = 0; childLength > i; i += 1) {
597
+ if (childList[i] === $element) {
598
+ elementIdx = i;
599
+ break;
600
+ }
601
+ }
602
+ if (elementIdx === 0) {
603
+ if (store.cursorData.startOffset === 0 && $target === $textBlock) {
604
+ if ($target.textContent === "") {
605
+ $textBlock.insertAdjacentElement("afterend", _createTextBlock());
606
+ _setCursor($textBlock.nextElementSibling, 0);
607
+ $textBlock.remove();
608
+ } else {
609
+ e.preventDefault();
610
+ if ($textBlock.tagName !== "P") {
611
+ $textBlock.insertAdjacentElement("afterend", _createTextBlock($textBlock.textContent));
612
+ _setCursor($textBlock.nextElementSibling, 0);
613
+ $textBlock.remove();
614
+ }
615
+ }
616
+ }
617
+ } else {
618
+ if ($textBlock.hasChildNodes() === false) {
619
+ e.preventDefault();
620
+ const $preBlock = $textBlock.previousElementSibling;
621
+ if ($preBlock !== null) {
622
+ const { type: preBlockType } = _getBlockType($textBlock);
623
+ $textBlock.remove();
624
+ if (preBlockType === "text") {
625
+ if ($preBlock.hasChildNodes() === true) {
626
+ const textBlockChildList = $preBlock.childNodes;
627
+ const textBlockTargetChild = textBlockChildList[textBlockChildList.length - 1];
628
+ _setCursor(textBlockTargetChild, textBlockTargetChild.textContent.length);
629
+ } else {
630
+ _setCursor($preBlock, 0);
631
+ }
632
+ }
633
+ }
634
+ } else {
635
+ if (store.cursorData.startOffset === 0 && ($textBlock.childNodes[0] === store.cursorData.startNode || $textBlock.childNodes[0] === $target)) {
636
+ e.preventDefault();
637
+ const $preBlock = $textBlock.previousElementSibling;
638
+ if ($preBlock !== null) {
639
+ const { type: preBlockType } = _getBlockType($preBlock);
640
+ if (preBlockType === "text") {
641
+ if ($preBlock.hasChildNodes() === true) {
642
+ const textBlockChildList = $preBlock.childNodes;
643
+ const textBlockTargetChildIdx = textBlockChildList.length - 1;
644
+ const textBlockTargetCursorIdx = textBlockChildList[textBlockTargetChildIdx].textContent.length;
645
+ const thisBlockHTML = $textBlock.innerHTML;
646
+ $preBlock.innerHTML = $preBlock.innerHTML + thisBlockHTML;
647
+ _setCursor($preBlock.childNodes[textBlockTargetChildIdx], textBlockTargetCursorIdx);
648
+ } else {
649
+ $preBlock.innerHTML = $textBlock.innerHTML;
650
+ _setCursor($preBlock, 0);
651
+ }
652
+ $textBlock.remove();
653
+ }
654
+ }
655
+ }
656
+ }
657
+ }
658
+ if (store.cursorData.startOffset === 1 && $target !== $textBlock) {
659
+ if ($target.textContent.length === 1) {
660
+ e.preventDefault();
661
+ const preNode = $target.previousSibling;
662
+ if (preNode !== null) {
663
+ $target.remove();
664
+ _setCursor(preNode, preNode.textContent.length);
665
+ } else {
666
+ if ($textBlock.childNodes[1] === void 0) {
667
+ $textBlock.innerHTML = "";
668
+ _setCursor($textBlock, 0);
669
+ } else {
670
+ _setCursor($textBlock.childNodes[1], 0);
671
+ $target.remove();
672
+ }
673
+ }
674
+ }
675
+ }
676
+ _setCursorData(store);
677
+ }
678
+ function defaultTabEvent(useShiftKey, $element) {
679
+ const $target = $element;
680
+ let value = $target.dataset["depth"] === void 0 ? 0 : parseInt($target.dataset["depth"]);
681
+ if (useShiftKey === true) {
682
+ if (value !== 0) {
683
+ value -= 1;
684
+ }
685
+ } else {
686
+ if (value < 5) {
687
+ value += 1;
688
+ }
689
+ }
690
+ if (value === 0) {
691
+ delete $target.dataset["depth"];
692
+ } else {
693
+ $target.dataset["depth"] = String(value);
694
+ }
695
+ }
696
+ function moveToBlockEvent(e, store, keyType) {
697
+ const $editableElement = _findContentEditableElement(store.cursorData.startNode);
698
+ if ($editableElement !== null) {
699
+ const { $element, type } = _getBlockType($editableElement);
700
+ let $target;
701
+ switch (type) {
702
+ case "list":
703
+ if (keyType === "up") {
704
+ $target = $editableElement.previousElementSibling;
705
+ } else {
706
+ $target = $editableElement.nextElementSibling;
707
+ }
708
+ if ($target === null) {
709
+ if (keyType === "up") {
710
+ $target = $element.previousElementSibling;
711
+ } else {
712
+ $target = $element.nextElementSibling;
713
+ }
714
+ }
715
+ break;
716
+ default:
717
+ if (keyType === "up") {
718
+ $target = $element.previousElementSibling;
719
+ } else {
720
+ $target = $element.nextElementSibling;
721
+ }
722
+ }
723
+ if ($target !== null) {
724
+ if ($target.classList.contains("de-block") == true) {
725
+ const { $element: $element2, type: targetType } = _getBlockType($target);
726
+ switch (targetType) {
727
+ case "list":
728
+ const $targetItem = $element2.querySelectorAll(".de-item");
729
+ let $item;
730
+ if (keyType === "up") {
731
+ $item = $targetItem[$targetItem.length - 1];
732
+ } else {
733
+ $item = $targetItem[0];
734
+ }
735
+ _setCursor($item, 0);
736
+ break;
737
+ default:
738
+ _setCursor($element2, 0);
739
+ }
740
+ } else {
741
+ _setCursor($target, 0);
742
+ }
743
+ }
744
+ }
745
+ }
746
+ export function _hotKeyEvent(event, store) {
747
+ _setCursorData(store);
748
+ const isControlKeyActive = event.ctrlKey || event.metaKey;
749
+ if (isControlKeyActive === true) {
750
+ switch (event.key) {
751
+ case "b":
752
+ event.preventDefault();
753
+ _setNodeStyle("de-bold", store);
754
+ break;
755
+ case "i":
756
+ event.preventDefault();
757
+ _setNodeStyle("de-italic", store);
758
+ break;
759
+ case "u":
760
+ event.preventDefault();
761
+ _setNodeStyle("de-underline", store);
762
+ break;
763
+ case "s":
764
+ if (event.shiftKey === true) {
765
+ event.preventDefault();
766
+ _setNodeStyle("de-strikethrough", store);
767
+ }
768
+ break;
769
+ case "c":
770
+ if (event.shiftKey === true) {
771
+ event.preventDefault();
772
+ _setNodeStyle("de-code", store);
773
+ }
774
+ break;
775
+ }
776
+ }
777
+ }
778
+ export function copyEvent(event, store) {
779
+ }
780
+ export function pasteEvent(event, store) {
781
+ }