dragon-editor 3.5.14 → 3.5.16

package/dist/module.json

@@ -4,7 +4,7 @@
     "nuxt": ">=3.0.0"
   },
   "configKey": "dragon-editor",
-  "version": "3.5.14",
+  "version": "3.5.16",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/module.mjs

@@ -18,6 +18,7 @@ const module = defineNuxtModule({
   },
   async setup(options, nuxt) {
     const resolver = createResolver(import.meta.url);
+    const typeContent = await readFile(`${__dirname}/runtime/type.d.ts`);
     addComponent({
       name: "DragonEditor",
       filePath: resolver.resolve(__dirname, "./runtime/components/DragonEditor")
@@ -28,10 +29,25 @@ const module = defineNuxtModule({
     });
     addTypeTemplate({
       filename: "types/dragon-editor.d.ts",
-      src: resolver.resolve(__dirname, "./runtime/type.d.ts"),
-      write: true
+      // src: resolver.resolve(__dirname, "./runtime/type.d.ts"),
+      // write: true,
+      getContents: () => `
+                declare global {
+                    ${typeContent}
+                }
+
+                export {}
+            `
     });
   }
 });
+async function readFile(path) {
+  if (typeof Bun !== "undefined" && Bun.file) {
+    const file = Bun.file(path);
+    return await file.text();
+  }
+  const { promises: fs } = await import('fs');
+  return await fs.readFile(path, "utf-8");
+}
 
 export { module as default };

package/dist/runtime/components/DragonEditor.vue

@@ -10,7 +10,7 @@ import { _addBlock } from "../utils/node";
 import { _setDecoration, _setTextAlign } from "../utils/style";
 import type { VNode } from "vue";
 import { codeToHtml } from "shiki";
-import "../type.d.ts";
+import type { DEBlockData, DEBlockMenutype, DEContentData, DEDecoration, DETextalign, DragonEditorStore } from "../type.d.ts";
 
 interface DEOption {
     modelValue: DEContentData;
@@ -552,6 +552,7 @@ defineExpose({
 }
 .dragon-editor .de-text-block {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor .de-text-block:empty:hover::before, .dragon-editor .de-text-block:empty:focus::before {
@@ -562,6 +563,7 @@ defineExpose({
 }
 .dragon-editor .de-heading-block {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor .de-heading-block[data-level="1"] {
@@ -608,6 +610,7 @@ defineExpose({
 }
 .dragon-editor .de-list-block .de-item {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
   list-style: inherit;
 }
@@ -896,6 +899,7 @@ defineExpose({
   min-height: 1.6em;
   color: #909090;
   text-align: center;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor .de-image-block .de-caption:empty:hover::before, .dragon-editor .de-image-block .de-caption:empty:focus::before {
@@ -912,6 +916,7 @@ defineExpose({
 }
 .dragon-editor .de-code-block .de-filename {
   flex: 1;
+  max-width: calc(100% - 120px);
   padding: 5px 10px;
   box-sizing: border-box;
   outline: 0;

package/dist/runtime/components/DragonEditorViewer.vue

@@ -205,10 +205,12 @@ function structure(): VNode {
 }
 .dragon-editor-viewer .de-text-block {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor-viewer .de-heading-block {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor-viewer .de-heading-block[data-level="1"] {
@@ -249,6 +251,7 @@ function structure(): VNode {
 }
 .dragon-editor-viewer .de-list-block .de-item {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
   list-style: inherit;
 }
@@ -531,6 +534,7 @@ function structure(): VNode {
   min-height: 1.6em;
   color: #909090;
   text-align: center;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor-viewer .de-code-block {
@@ -541,6 +545,7 @@ function structure(): VNode {
 }
 .dragon-editor-viewer .de-code-block .de-filename {
   flex: 1;
+  max-width: calc(100% - 120px);
   padding: 5px 10px;
   box-sizing: border-box;
   outline: 0;

package/dist/runtime/scss/editor.css

@@ -339,6 +339,7 @@
 }
 .dragon-editor .de-text-block {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor .de-text-block:empty:hover::before, .dragon-editor .de-text-block:empty:focus::before {
@@ -349,6 +350,7 @@
 }
 .dragon-editor .de-heading-block {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor .de-heading-block[data-level="1"] {
@@ -395,6 +397,7 @@
 }
 .dragon-editor .de-list-block .de-item {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
   list-style: inherit;
 }
@@ -683,6 +686,7 @@
   min-height: 1.6em;
   color: #909090;
   text-align: center;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor .de-image-block .de-caption:empty:hover::before, .dragon-editor .de-image-block .de-caption:empty:focus::before {
@@ -699,6 +703,7 @@
 }
 .dragon-editor .de-code-block .de-filename {
   flex: 1;
+  max-width: calc(100% - 120px);
   padding: 5px 10px;
   box-sizing: border-box;
   outline: 0;

package/dist/runtime/scss/viewer.css

@@ -170,10 +170,12 @@
 }
 .dragon-editor-viewer .de-text-block {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor-viewer .de-heading-block {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor-viewer .de-heading-block[data-level="1"] {
@@ -214,6 +216,7 @@
 }
 .dragon-editor-viewer .de-list-block .de-item {
   min-height: 1.6em;
+  word-break: break-all;
   outline: 0;
   list-style: inherit;
 }
@@ -496,6 +499,7 @@
   min-height: 1.6em;
   color: #909090;
   text-align: center;
+  word-break: break-all;
   outline: 0;
 }
 .dragon-editor-viewer .de-code-block {
@@ -506,6 +510,7 @@
 }
 .dragon-editor-viewer .de-code-block .de-filename {
   flex: 1;
+  max-width: calc(100% - 120px);
   padding: 5px 10px;
   box-sizing: border-box;
   outline: 0;

package/dist/runtime/utils/event/block.d.ts

@@ -0,0 +1,6 @@
+import type { Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _imageResizeEventStart(event: Event, store: Ref<DragonEditorStore>): void;
+export declare function _imageResizeEvent(event: Event, store: Ref<DragonEditorStore>): void;
+export declare function _imageResizeEventEnd(event: Event, store: Ref<DragonEditorStore>): void;
+export declare function _moveBlock(type: "up" | "down", store: Ref<DragonEditorStore>): void;

package/dist/runtime/utils/event/cursor.d.ts

@@ -0,0 +1,6 @@
+import type { Ref } from "vue";
+import type { DEArrangeCursorData, DEditorCursor, DragonEditorStore } from "../../type.js";
+export declare function _updateCursorData(store: Ref<DragonEditorStore>): void;
+export declare function _setCursor($target: Node, startIdx: number): void;
+export declare function _setRangeCursor($startTarget: Element, $endTarget: Element, startIdx: number, endIdx: number): void;
+export declare function _sortingCursorDataOnElement(cursorData: DEditorCursor, $element: HTMLElement): DEArrangeCursorData;

package/dist/runtime/utils/event/data.d.ts

@@ -0,0 +1,7 @@
+import type { Ref } from "vue";
+import type { DECodeItem, DECodeblockLang, DragonEditorStore, DEBlockData, DEBlockMenutype } from "../../type.js";
+export declare const CODEBLOCKLANG: DECodeItem<DECodeblockLang>[];
+export declare function _updateModelData(store: Ref<DragonEditorStore>): void;
+export declare function _getDefaultBlockData(type: DEBlockMenutype): DEBlockData;
+export declare function _generateId(): string;
+export declare function _updateControlBarStatus(store: Ref<DragonEditorStore>): void;

package/dist/runtime/utils/event/keyboard.d.ts

@@ -0,0 +1,7 @@
+import type { Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _contentKeydownEvent(event: KeyboardEvent, store: Ref<DragonEditorStore>): void;
+export declare function _contentPasteEvent(event: ClipboardEvent, store: Ref<DragonEditorStore>): Promise<void>;
+export declare function _setIndent(store: Ref<DragonEditorStore>, type: "plus" | "minus"): void;
+export declare function _hotKeyEvent(event: KeyboardEvent, store: Ref<DragonEditorStore>): void;
+export declare function _contentKeyupEvent(event: KeyboardEvent, store: Ref<DragonEditorStore>): void;

package/dist/runtime/utils/event/mouse.d.ts

@@ -0,0 +1,11 @@
+import type { Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _contentMouseupEvent(event: MouseEvent, store: Ref<DragonEditorStore>): void;
+export declare function _contentMousedownEvnet(event: MouseEvent, store: Ref<DragonEditorStore>): void;
+export declare function _editorMousemoveEvent(event: MouseEvent, store: Ref<DragonEditorStore>): void;
+export declare function _editorMouseupEvent(event: MouseEvent, store: Ref<DragonEditorStore>): void;
+export declare function _editorMouseleaveEvent(event: MouseEvent, store: Ref<DragonEditorStore>): void;
+export declare function _checkOthersideClick(event: MouseEvent, store: Ref<DragonEditorStore>): void;
+export declare function _openAnchorArea(store: Ref<DragonEditorStore>): void;
+export declare function _decideWhetherOpenControlBar(store: Ref<DragonEditorStore>): void;
+export declare function _editorContextMenuEvent(event: MouseEvent, store: Ref<DragonEditorStore>): void;

package/dist/runtime/utils/event/scroll.d.ts

@@ -0,0 +1,3 @@
+import type { DragonEditorStore } from "../../type.js";
+import type { Ref } from "vue";
+export declare function _parentWrapScollEvent(event: Event, store: Ref<DragonEditorStore>): void;

package/dist/runtime/utils/event/touch.d.ts

@@ -0,0 +1,5 @@
+import type { Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _contentTouchstartEvent(event: TouchEvent, store: Ref<DragonEditorStore>): void;
+export declare function _editorTouchmoveEvent(event: TouchEvent, store: Ref<DragonEditorStore>): void;
+export declare function _editorTouchendEvent(event: TouchEvent, store: Ref<DragonEditorStore>): void;

package/dist/runtime/utils/event/window.d.ts

@@ -0,0 +1,5 @@
+import type { Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _eidtorMountEvent(store: Ref<DragonEditorStore>): void;
+export declare function _eidtorUnmountEvent(store: Ref<DragonEditorStore>): void;
+export declare function _windowResizeEvent(event: Event, store: Ref<DragonEditorStore>): void;

package/dist/runtime/utils/layout/block.d.ts

@@ -0,0 +1,7 @@
+import type { VNode } from "vue";
+import type { DEContentData } from "../../type.js";
+export declare function _createBlockList({ blockList, isEditable, imageHostURL }?: {
+    blockList: DEContentData;
+    isEditable: boolean;
+    imageHostURL: string;
+}): VNode[];

package/dist/runtime/utils/layout/body.d.ts

@@ -0,0 +1,3 @@
+import type { VNode, Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _getBodyVNodeStructure(store: Ref<DragonEditorStore>): VNode;

package/dist/runtime/utils/layout/controlbar.d.ts

@@ -0,0 +1,3 @@
+import type { VNode, Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _getControlbarVNodeStructure(store: Ref<DragonEditorStore>): VNode;

package/dist/runtime/utils/layout/icon.d.ts

@@ -0,0 +1,3 @@
+import type { VNode } from "vue";
+import type { DEIconKind } from "../../type.js";
+export declare function _getIconNode(kind: DEIconKind): VNode;

package/dist/runtime/utils/layout/menuBar.d.ts

@@ -0,0 +1,3 @@
+import type { VNode, Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _getMenuBarVNodeStructure(store: Ref<DragonEditorStore>): VNode;

package/dist/runtime/utils/node/block.d.ts

@@ -0,0 +1,19 @@
+import type { Ref } from "vue";
+import type { DEBlockMenutype, DragonEditorStore, DEBlockData, DETextBlock, DEBlock, DEHeadingBlock, DEListBlock, DEListItem, DEImageBlock, DECodeBlock, DECustomBlock, DECodeblockTheme, DECodeblockLang, DEListStyle } from "../../type.js";
+export declare function _addBlock(type: DEBlockMenutype, store: Ref<DragonEditorStore>, data?: DEBlockData): void;
+export declare function _getCurrentBlock($target: EventTarget): {
+    type: DEBlock;
+    $element: HTMLDivElement | null;
+};
+export declare function _createTextBlock(data: DETextBlock): HTMLParagraphElement;
+export declare function _createHeadingBlock(data: DEHeadingBlock): HTMLHeadingElement;
+export declare function _createListBlock(data: DEListBlock): HTMLElement;
+export declare function _createListItemBlock(child?: DEListItem): HTMLLIElement;
+export declare function _createImageBlock(data: DEImageBlock, imageHostURL?: string): HTMLDivElement;
+export declare function _createCodeBlock(data: DECodeBlock, store: Ref<DragonEditorStore>): HTMLDivElement;
+export declare function _createCustomBlock(data: DECustomBlock): HTMLDivElement;
+export declare function _updateCurrentBlock(event: Event, store: Ref<DragonEditorStore>): void;
+export declare function _updateHeadingBlockList(store: Ref<DragonEditorStore>): void;
+export declare function _setCodeBlockTheme(theme: DECodeblockTheme, store: Ref<DragonEditorStore>): Promise<void>;
+export declare function _setCodeBlockLanguage(language: DECodeblockLang, store: Ref<DragonEditorStore>): Promise<void>;
+export declare function _setListBlockStyle(style: DEListStyle, store: Ref<DragonEditorStore>): void;

package/dist/runtime/utils/node/block.js

@@ -213,9 +213,12 @@ export async function _setCodeBlockTheme(theme, store) {
       const convert = await store.value.codeToHtml($code.textContent ?? "", { lang: store.value.controlStatus.codeBlockLang, theme });
       const $div = document.createElement("div");
       $div.innerHTML = convert;
-      $code.innerHTML = $div.querySelector("code").innerHTML;
-      store.value.controlStatus.codeBlockTheme = theme;
-      store.value.controlStatus.$currentBlock.dataset["theme"] = theme;
+      const $childCode = $div.querySelector("code");
+      if ($childCode !== null) {
+        $code.innerHTML = $childCode.innerHTML;
+        store.value.controlStatus.codeBlockTheme = theme;
+        store.value.controlStatus.$currentBlock.dataset["theme"] = theme;
+      }
       _updateCursorData(store);
       _updateModelData(store);
     }
@@ -231,11 +234,14 @@ export async function _setCodeBlockLanguage(language, store) {
         const convert = await store.value.codeToHtml($code.textContent ?? "", { lang: language, theme: store.value.controlStatus.codeBlockTheme });
         const $div = document.createElement("div");
         $div.innerHTML = convert;
-        $target.textContent = targetValue.text;
-        $code.innerHTML = $div.querySelector("code").innerHTML;
-        store.value.controlStatus.codeBlockLang = targetValue.code;
-        _updateCursorData(store);
-        _updateModelData(store);
+        const $childCode = $div.querySelector("code");
+        if ($childCode !== null) {
+          $target.textContent = targetValue.text;
+          $code.innerHTML = $childCode.innerHTML;
+          store.value.controlStatus.codeBlockLang = targetValue.code;
+          _updateCursorData(store);
+          _updateModelData(store);
+        }
       }
     }
   }

package/dist/runtime/utils/node/element.d.ts

@@ -0,0 +1,4 @@
+export declare function _findScrollingElement($target: HTMLElement): HTMLElement | Window;
+export declare function _getParentElementIfNodeIsText($target: Node, $block: HTMLElement): Node;
+export declare function _findContentEditableElement($target: Node): HTMLElement | null;
+export declare function _findPoverTextNode(node: Element, idx: number): number;

package/dist/runtime/utils/style/anchor.d.ts

@@ -0,0 +1,5 @@
+import type { Ref } from "vue";
+import type { DragonEditorStore } from "../../type.js";
+export declare function _setAnchorTag(url: string, isOutsideLink: boolean, store: Ref<DragonEditorStore>): void;
+export declare function _unsetAnchorTag(store: Ref<DragonEditorStore>): false | undefined;
+export declare function _updateAnchorTagValue(store: Ref<DragonEditorStore>, previous?: boolean): void;

package/dist/runtime/utils/style/decoration.d.ts

@@ -0,0 +1,4 @@
+import type { Ref } from "vue";
+import type { DragonEditorStore, DETextalign } from "../../type.js";
+export declare function _setDecoration(className: string, store: Ref<DragonEditorStore>): void;
+export declare function _setTextAlign(type: DETextalign, store: Ref<DragonEditorStore>): void;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "dragon-editor",
-    "version": "3.5.14",
+    "version": "3.5.16",
     "description": "Javascript WYSIWYG editor in Nuxt3!",
     "repository": {
         "type": "git",