@cocoar/vue-markdown-editor 1.13.0-beta.6 → 1.13.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 (12) hide show
  1. package/dist/CoarMarkdownEditor.vue.d.ts +6 -6
  2. package/dist/CoarMarkdownEditor.vue.d.ts.map +1 -1
  3. package/dist/code-block-view/CodeBlockNodeView.d.ts +64 -0
  4. package/dist/code-block-view/CodeBlockNodeView.d.ts.map +1 -0
  5. package/dist/code-block-view/CodeBlockShell.vue.d.ts +21 -0
  6. package/dist/code-block-view/CodeBlockShell.vue.d.ts.map +1 -0
  7. package/dist/code-block-view/index.d.ts +16 -0
  8. package/dist/code-block-view/index.d.ts.map +1 -0
  9. package/dist/index.css +1 -1
  10. package/dist/index.js +364 -228
  11. package/dist/toolbar-helpers.d.ts.map +1 -1
  12. package/package.json +4 -2
package/dist/CoarMarkdownEditor.vue.d.ts CHANGED
@@ -118,16 +118,16 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
118
118
  }>> & Readonly<{
119
119
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
120
120
  }>, {
121
- required: boolean;
122
- readonly: boolean;
121
+ name: string;
122
+ modelValue: string;
123
123
  disabled: boolean;
124
+ readonly: boolean;
125
+ error: boolean;
126
+ id: string;
127
+ required: boolean;
124
128
  toolbarMode: CoarMarkdownEditorToolbarMode;
125
129
  toolbarPosition: CoarMarkdownEditorToolbarPosition;
126
130
  tools: CoarMarkdownEditorTool[];
127
- name: string;
128
- error: boolean;
129
- id: string;
130
- modelValue: string;
131
131
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
132
132
  export default _default;
133
133
  //# sourceMappingURL=CoarMarkdownEditor.vue.d.ts.map
package/dist/CoarMarkdownEditor.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"CoarMarkdownEditor.vue.d.ts","sourceRoot":"","sources":["../src/CoarMarkdownEditor.vue"],"names":[],"mappings":"AAgtCA,OAAO,EAGL,KAAK,QAAQ,EACd,MAAM,KAAK,CAAC;AA6Bb,MAAM,MAAM,6BAA6B,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;AAC1E,MAAM,MAAM,iCAAiC,GAAG,MAAM,GAAG,OAAO,CAAC;AAEjE;;;GAGG;AACH,MAAM,MAAM,sBAAsB,GAC9B,MAAM,GAAG,QAAQ,GAAG,eAAe,GAAG,YAAY,GAClD,UAAU,GACV,YAAY,GAAG,aAAa,GAAG,UAAU,GACzC,QAAQ,GAAG,SAAS,GACpB,YAAY,GAAG,gBAAgB,GAC/B,WAAW,GAAG,OAAO,GAAG,UAAU,GAClC,iBAAiB,GACjB,MAAM,GAAG,MAAM,CAAC;AAEpB;iFACiF;AACjF,eAAO,MAAM,8BAA8B,EAAE,SAAS,sBAAsB,EAS3E,CAAC;AAEF,MAAM,WAAW,uBAAuB;IACtC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mFAAmF;IACnF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,yFAAyF;IACzF,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,yDAAyD;IACzD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,6BAA6B,CAAC;IAC5C,eAAe,CAAC,EAAE,iCAAiC,CAAC;IACpD;;;;OAIG;IACH,KAAK,CAAC,EAAE,sBAAsB,EAAE,CAAC;CAClC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cA+zBkC,QAAQ,CAAC,6BAA6B,CAAC;;;;cACnC,QAAQ,CAAC,iCAAiC,CAAC;;;;cACtD,QAAQ,CAAC,sBAAsB,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAF3B,QAAQ,CAAC,6BAA6B,CAAC;;;;cACnC,QAAQ,CAAC,iCAAiC,CAAC;;;;cACtD,QAAQ,CAAC,sBAAsB,EAAE,CAAC;;;;;;;;;;;;;;;;;AAZ9D,wBAmDG"}
1
+ {"version":3,"file":"CoarMarkdownEditor.vue.d.ts","sourceRoot":"","sources":["../src/CoarMarkdownEditor.vue"],"names":[],"mappings":"AA6tCA,OAAO,EAGL,KAAK,QAAQ,EACd,MAAM,KAAK,CAAC;AA8Bb,MAAM,MAAM,6BAA6B,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;AAC1E,MAAM,MAAM,iCAAiC,GAAG,MAAM,GAAG,OAAO,CAAC;AAEjE;;;GAGG;AACH,MAAM,MAAM,sBAAsB,GAC9B,MAAM,GAAG,QAAQ,GAAG,eAAe,GAAG,YAAY,GAClD,UAAU,GACV,YAAY,GAAG,aAAa,GAAG,UAAU,GACzC,QAAQ,GAAG,SAAS,GACpB,YAAY,GAAG,gBAAgB,GAC/B,WAAW,GAAG,OAAO,GAAG,UAAU,GAClC,iBAAiB,GACjB,MAAM,GAAG,MAAM,CAAC;AAEpB;iFACiF;AACjF,eAAO,MAAM,8BAA8B,EAAE,SAAS,sBAAsB,EAS3E,CAAC;AAEF,MAAM,WAAW,uBAAuB;IACtC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mFAAmF;IACnF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,yFAAyF;IACzF,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,yDAAyD;IACzD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,6BAA6B,CAAC;IAC5C,eAAe,CAAC,EAAE,iCAAiC,CAAC;IACpD;;;;OAIG;IACH,KAAK,CAAC,EAAE,sBAAsB,EAAE,CAAC;CAClC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAu0BkC,QAAQ,CAAC,6BAA6B,CAAC;;;;cACnC,QAAQ,CAAC,iCAAiC,CAAC;;;;cACtD,QAAQ,CAAC,sBAAsB,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAF3B,QAAQ,CAAC,6BAA6B,CAAC;;;;cACnC,QAAQ,CAAC,iCAAiC,CAAC;;;;cACtD,QAAQ,CAAC,sBAAsB,EAAE,CAAC;;;;;;;;;;;;;;;;;AAZ9D,wBAmDG"}
package/dist/code-block-view/CodeBlockNodeView.d.ts ADDED
@@ -0,0 +1,64 @@
1
+ import { Node as ProseNode } from '@milkdown/prose/model';
2
+ import { EditorView, NodeView, ViewMutationRecord } from '@milkdown/prose/view';
3
+ /**
4
+ * Module-scope registry of currently-mounted CodeBlockViews. Populated by
5
+ * each instance's constructor and pruned by `destroy()`. The companion plugin
6
+ * (`codeBlockSelectionWatcherPlugin`) iterates this set on every PM
7
+ * transaction to keep the `editing` ref in sync with the cursor position.
8
+ *
9
+ * Lives at module scope rather than in a ctx slice because the lifecycle is
10
+ * trivially constructor/destructor-bound and there's no per-editor state to
11
+ * isolate — multiple editors on the same page share the registry but each
12
+ * NodeView only ever reacts to its own `view` reference.
13
+ */
14
+ export declare const activeCodeBlockViews: Set<CodeBlockView>;
15
+ export declare class CodeBlockView implements NodeView {
16
+ node: ProseNode;
17
+ view: EditorView;
18
+ getPos: () => number | undefined;
19
+ /** Outer container PM mounts into the document. */
20
+ dom: HTMLElement;
21
+ /** Editable `<code>` element PM writes into. Lives inside the edit-mode slot. */
22
+ contentDOM: HTMLElement;
23
+ private readonly app;
24
+ private readonly text;
25
+ private readonly language;
26
+ private readonly editing;
27
+ constructor(node: ProseNode, view: EditorView, getPos: () => number | undefined);
28
+ /**
29
+ * PM calls this when the node attrs or content changed. Returning `true`
30
+ * keeps the existing NodeView instance; `false` would force PM to throw
31
+ * away this view and create a new one.
32
+ */
33
+ update(node: ProseNode): boolean;
34
+ /** PM marks this node as the active selection — switch to edit mode. */
35
+ selectNode(): void;
36
+ /** PM moved selection elsewhere — switch back to render mode. */
37
+ deselectNode(): void;
38
+ destroy(): void;
39
+ /**
40
+ * Called by the editor-level selection watcher whenever PM's selection
41
+ * changes. Recomputes `editing` based on whether the new selection lands
42
+ * inside this node's range. PM's own `selectNode`/`deselectNode` only fire
43
+ * for NodeSelections, not TextSelections — and the user's natural cursor
44
+ * placement (clicking into the code block, arrow keys) is a TextSelection,
45
+ * so we can't rely on those alone.
46
+ */
47
+ notifySelectionChanged(): void;
48
+ /**
49
+ * PM asks "should I ignore this DOM event?". For code-block child events
50
+ * (typing, paste, etc.) we want PM to handle them, so return false.
51
+ * Returning true would block PM from seeing the event.
52
+ */
53
+ stopEvent(): boolean;
54
+ /**
55
+ * PM asks "should I ignore this DOM mutation?". Mutations inside our
56
+ * Vue chrome (re-renders, hover state changes) are not interesting to PM
57
+ * — return true to skip them. Mutations inside contentDOM are PM's
58
+ * business; we let them through (PM checks the target itself).
59
+ */
60
+ ignoreMutation(mutation: ViewMutationRecord): boolean;
61
+ private handleEnterEdit;
62
+ private handleLanguageChange;
63
+ }
64
+ //# sourceMappingURL=CodeBlockNodeView.d.ts.map
package/dist/code-block-view/CodeBlockNodeView.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CodeBlockNodeView.d.ts","sourceRoot":"","sources":["../../src/code-block-view/CodeBlockNodeView.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,IAAI,IAAI,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAE/D,OAAO,KAAK,EACV,UAAU,EACV,QAAQ,EACR,kBAAkB,EACnB,MAAM,sBAAsB,CAAC;AAI9B;;;;;;;;;;GAUG;AACH,eAAO,MAAM,oBAAoB,oBAA2B,CAAC;AAE7D,qBAAa,aAAc,YAAW,QAAQ;IAYnC,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,UAAU;IAChB,MAAM,EAAE,MAAM,MAAM,GAAG,SAAS;IAbzC,mDAAmD;IACnD,GAAG,EAAE,WAAW,CAAC;IACjB,iFAAiF;IACjF,UAAU,EAAE,WAAW,CAAC;IAExB,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAM;IAC1B,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAW;IAChC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAW;IACpC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAc;gBAG7B,IAAI,EAAE,SAAS,EACf,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,MAAM,MAAM,GAAG,SAAS;IAuCzC;;;;OAIG;IACH,MAAM,CAAC,IAAI,EAAE,SAAS,GAAG,OAAO;IAQhC,wEAAwE;IACxE,UAAU,IAAI,IAAI;IAQlB,iEAAiE;IACjE,YAAY,IAAI,IAAI;IAIpB,OAAO,IAAI,IAAI;IAKf;;;;;;;OAOG;IACH,sBAAsB,IAAI,IAAI;IAc9B;;;;OAIG;IACH,SAAS,IAAI,OAAO;IAIpB;;;;;OAKG;IACH,cAAc,CAAC,QAAQ,EAAE,kBAAkB,GAAG,OAAO;IASrD,OAAO,CAAC,eAAe,CAWrB;IAEF,OAAO,CAAC,oBAAoB,CAM1B;CACH"}
package/dist/code-block-view/CodeBlockShell.vue.d.ts ADDED
@@ -0,0 +1,21 @@
1
+ type __VLS_Props = {
2
+ /** Current code text (live-mirrored from the PM node). */
3
+ text: string;
4
+ /** Current language attribute (live-mirrored from the PM node). */
5
+ language: string;
6
+ /** True when the cursor is inside this code block. */
7
+ editing: boolean;
8
+ /** PM's `contentDOM` element — the NodeView creates it; the shell adopts it. */
9
+ contentDOM: HTMLElement | null;
10
+ };
11
+ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
12
+ enterEdit: () => any;
13
+ languageChange: (args_0: string) => any;
14
+ }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
15
+ onEnterEdit?: (() => any) | undefined;
16
+ onLanguageChange?: ((args_0: string) => any) | undefined;
17
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
18
+ contentMount: HTMLDivElement;
19
+ }, HTMLDivElement>;
20
+ export default _default;
21
+ //# sourceMappingURL=CodeBlockShell.vue.d.ts.map
package/dist/code-block-view/CodeBlockShell.vue.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CodeBlockShell.vue.d.ts","sourceRoot":"","sources":["../../src/code-block-view/CodeBlockShell.vue"],"names":[],"mappings":"AAiOA,KAAK,WAAW,GAAG;IACjB,0DAA0D;IAC1D,IAAI,EAAE,MAAM,CAAC;IACb,mEAAmE;IACnE,QAAQ,EAAE,MAAM,CAAC;IACjB,sDAAsD;IACtD,OAAO,EAAE,OAAO,CAAC;IACjB,gFAAgF;IAChF,UAAU,EAAE,WAAW,GAAG,IAAI,CAAC;CAChC,CAAC;;;;;;;;;;AAsKF,wBASG"}
package/dist/code-block-view/index.d.ts ADDED
@@ -0,0 +1,16 @@
1
+ import { CodeBlockView } from './CodeBlockNodeView';
2
+ export declare const codeBlockNodeViewPlugin: import('@milkdown/utils').$View<import('@milkdown/utils').$Node, (node: import('@milkdown/prose/model').Node, view: import('@milkdown/prose/view').EditorView, getPos: () => number | undefined) => CodeBlockView>;
3
+ /**
4
+ * Editor-level PM plugin: on every transaction whose selection actually
5
+ * changed, ping each mounted `CodeBlockView` so it can recompute its
6
+ * `editing` flag. The pre-flight selection comparison keeps work down to
7
+ * the strict minimum — no DOM walks, no allocations on text-only edits.
8
+ */
9
+ export declare const codeBlockSelectionWatcherPlugin: import('@milkdown/utils').$Prose;
10
+ /**
11
+ * Combined bundle — register both with one `.use(codeBlockNodeView)` call.
12
+ */
13
+ export declare const codeBlockNodeView: (import('@milkdown/utils').$View<import('@milkdown/utils').$Node, (node: import('@milkdown/prose/model').Node, view: import('@milkdown/prose/view').EditorView, getPos: () => number | undefined) => CodeBlockView> | import('@milkdown/utils').$Prose)[];
14
+ export { CodeBlockView, activeCodeBlockViews } from './CodeBlockNodeView';
15
+ export { default as CodeBlockShell } from './CodeBlockShell.vue';
16
+ //# sourceMappingURL=index.d.ts.map
package/dist/code-block-view/index.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/code-block-view/index.ts"],"names":[],"mappings":"AAaA,OAAO,EAAwB,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE1E,eAAO,MAAM,uBAAuB,oNAGnC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,+BAA+B,kCAc3C,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,2PAGtB,CAAC;AAET,OAAO,EAAE,aAAa,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC1E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC"}
package/dist/index.css CHANGED
@@ -1,2 +1,2 @@
1
- .coar-md-root{background:var(--coar-background-neutral-primary);height:100%;color:var(--coar-text-neutral-primary);flex-direction:row;display:flex;overflow:hidden}.coar-md-root--disabled{opacity:.55;cursor:not-allowed}.coar-md-root--disabled .coar-md-area .milkdown{pointer-events:none}.coar-md-root--error{outline:1px solid var(--coar-text-semantic-error-bold,#b91c1c);outline-offset:-1px}.coar-md-sidebar-wrap{border-right:1px solid var(--coar-border-neutral);--coar-sidebar-collapsed-width:2.25rem;--coar-sidebar-item-padding:.25rem .375rem;flex-shrink:0}.coar-md-root>.coar-md-area~.coar-md-sidebar-wrap{border-right:none;border-left:1px solid var(--coar-border-neutral)}.coar-md-area{padding:var(--coar-spacing-s) var(--coar-spacing-m);cursor:text;flex:1;overflow:auto}.coar-md-area .milkdown,.coar-md-area .milkdown .editor,.coar-md-area .milkdown [contenteditable]{outline:none}.coar-md-area .milkdown h1{margin:.5em 0 .3em;font-size:1.75em;font-weight:700;line-height:1.2}.coar-md-area .milkdown h2{margin:.5em 0 .3em;font-size:1.35em;font-weight:600;line-height:1.3}.coar-md-area .milkdown h3{margin:.4em 0 .2em;font-size:1.1em;font-weight:600}.coar-md-area .milkdown p{margin:.4em 0;line-height:1.5}.coar-md-area .milkdown ul,.coar-md-area .milkdown ol{margin:.4em 0;padding-left:1.5em}.coar-md-area .milkdown li{margin:.15em 0}.coar-md-area .milkdown blockquote{padding:.25em var(--coar-spacing-m);border-left:3px solid var(--coar-border-neutral);color:var(--coar-text-neutral-secondary);margin:.5em 0}.coar-md-area .milkdown code{background:var(--coar-background-neutral-secondary);border-radius:var(--coar-radius-s);padding:.15em .4em;font-size:.9em}.coar-md-area .milkdown pre{background:var(--coar-background-neutral-secondary);padding:var(--coar-spacing-s) var(--coar-spacing-m);border-radius:var(--coar-radius-xl);margin:.5em 0;overflow-x:auto}.coar-md-area .milkdown pre code{background:0 0;padding:0}.coar-md-area .milkdown table{border-collapse:collapse;width:100%;margin:.5em 0}.coar-md-area .milkdown th,.coar-md-area .milkdown td{border:1px solid var(--coar-border-neutral);padding:var(--coar-spacing-xs) var(--coar-spacing-s);text-align:left}.coar-md-area .milkdown th{background:var(--coar-background-neutral-secondary);font-weight:600}.coar-md-area .milkdown hr{border:none;border-top:1px solid var(--coar-border-neutral);margin:1em 0}.coar-md-area .milkdown a{color:var(--coar-text-accent-primary);text-decoration:underline}.coar-md-area .milkdown strong{font-weight:600}.coar-md-area .milkdown del{text-decoration:line-through}.coar-md-area .milkdown li[data-item-type=task]{margin-left:-1.25em;padding-left:1.5em;list-style:none;position:relative}.coar-md-area .milkdown li[data-item-type=task]:before{content:"";border:1.5px solid var(--coar-border-neutral-secondary,var(--coar-border-neutral));border-radius:var(--coar-radius-xs,2px);background:var(--coar-background-neutral-primary);cursor:pointer;box-sizing:border-box;width:14px;height:14px;transition:background-color .1s,border-color .1s;position:absolute;top:.45em;left:0}.coar-md-area .milkdown li[data-item-type=task][data-checked=true]:before{background:var(--coar-background-accent-primary);border-color:var(--coar-background-accent-primary)}.coar-md-area .milkdown li[data-item-type=task][data-checked=true]:after{content:"";border-left:2px solid var(--coar-text-on-bold,#fff);border-bottom:2px solid var(--coar-text-on-bold,#fff);pointer-events:none;width:8px;height:5px;position:absolute;top:calc(.45em + 2px);left:3px;transform:rotate(-45deg)}.coar-md-area .milkdown li[data-item-type=task][data-checked=true]>p{color:var(--coar-text-neutral-tertiary);text-decoration:line-through}.coar-md-area .milkdown li[data-item-type=task] input[type=checkbox]{display:none}.coar-md-floating-toolbar{padding:var(--coar-spacing-xs) 6px;background:var(--coar-background-neutral-primary);border:1px solid var(--coar-border-neutral);border-radius:var(--coar-radius-xl);box-shadow:var(--coar-shadow-m,0 4px 12px #0000001f);z-index:10000;gap:2px;animation:.12s ease-out coar-md-float-in;display:flex;position:fixed;transform:translate(-50%,-100%)}.coar-md-float-btn{border-radius:var(--coar-radius-s);width:30px;height:30px;color:var(--coar-text-neutral-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex}.coar-md-float-btn:hover{background:var(--coar-background-neutral-tertiary);color:var(--coar-text-neutral-primary)}.coar-md-float-btn:active,.coar-md-float-btn--active{background:var(--coar-background-accent-tertiary);color:var(--coar-text-accent-primary)}.coar-md-float-btn--disabled,.coar-md-float-btn:disabled{opacity:.4;cursor:not-allowed}.coar-md-float-btn--disabled:hover,.coar-md-float-btn:disabled:hover{color:var(--coar-text-neutral-secondary);background:0 0}.coar-md-float-sep{background:var(--coar-border-neutral);align-self:center;width:1px;height:18px;margin:0 2px}.coar-md-float-dropdown{position:relative}.coar-md-float-submenu{padding:var(--coar-spacing-xs);background:var(--coar-background-neutral-primary);border:1px solid var(--coar-border-neutral);border-radius:var(--coar-radius-xl);box-shadow:var(--coar-shadow-m,0 4px 12px #0000001f);z-index:10001;flex-direction:column;min-width:140px;animation:.1s ease-out coar-md-float-in;display:flex;position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%)}.coar-md-float-submenu-item{align-items:center;gap:var(--coar-spacing-s);border-radius:var(--coar-radius-m);width:100%;color:var(--coar-text-neutral-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;text-align:left;background:0 0;border:none;padding:6px 10px;font-size:13px;display:flex}.coar-md-float-submenu-item:hover{background:var(--coar-background-neutral-tertiary);color:var(--coar-text-neutral-primary)}.coar-md-float-submenu-item:active,.coar-md-float-submenu-item--active{background:var(--coar-background-accent-tertiary);color:var(--coar-text-accent-primary)}@keyframes coar-md-float-in{0%{opacity:0;transform:translate(-50%,-100%)translateY(4px)}to{opacity:1;transform:translate(-50%,-100%)translateY(0)}}
1
+ .coar-md-code-host{border-radius:var(--coar-radius-s);border:1px solid var(--coar-code-block-border,var(--coar-border-neutral));background:var(--coar-code-block-bg,var(--coar-background-neutral-secondary));margin:.75em 0;position:relative;overflow:hidden}.coar-md-code-host--editing{border-color:var(--coar-background-accent-primary)}.coar-md-code-render{position:relative}.coar-md-code-edit-btn{color:var(--coar-text-neutral-secondary);background:var(--coar-background-neutral-primary);border:1px solid var(--coar-border-neutral);border-radius:var(--coar-radius-s);cursor:pointer;opacity:0;z-index:1;align-items:center;gap:.25rem;padding:.25rem .5rem;font-size:.75rem;font-weight:500;transition:opacity .12s ease-out;display:inline-flex;position:absolute;top:.5rem;right:.5rem}.coar-md-code-render:hover .coar-md-code-edit-btn,.coar-md-code-edit-btn:focus-visible{opacity:1}.coar-md-code-edit-btn:hover{background:var(--coar-background-neutral-tertiary);color:var(--coar-text-neutral-primary)}.coar-md-code-lang-row{align-items:center;gap:var(--coar-spacing-s);padding:var(--coar-spacing-s) .75rem;border-bottom:1px solid var(--coar-code-block-border,var(--coar-border-neutral));background:var(--coar-code-block-header-bg,var(--coar-background-neutral-tertiary));min-height:36px;display:flex}.coar-md-code-lang-select{--coar-select-bg:transparent;--coar-select-border:transparent}.coar-md-code-content{padding:var(--coar-spacing-s) .75rem;font-family:var(--coar-font-family-code,"Cascadia Code", Consolas, Monaco, monospace);font-size:var(--coar-component-s-font-size,.85em);line-height:1.5}.coar-md-code-content>pre{white-space:pre-wrap;font-family:inherit;font-size:inherit;background:0 0;margin:0;padding:0}.coar-md-code-content>pre>code{white-space:inherit;outline:none;font-family:inherit;display:block}.coar-markdown{--coar-markdown-text:var(--coar-text-neutral-primary);--coar-markdown-link:var(--coar-text-brand-primary,var(--coar-text-neutral-primary));--coar-markdown-muted-text:var(--coar-text-neutral-tertiary);--coar-markdown-border:var(--coar-border-neutral-tertiary);--coar-markdown-surface:var(--coar-background-neutral-primary);--coar-markdown-surface-muted:var(--coar-background-neutral-tertiary,var(--coar-background-neutral-primary));--coar-markdown-radius:var(--coar-radius-xs);--coar-markdown-space-1:var(--coar-spacing-s,.5rem);--coar-markdown-space-2:var(--coar-spacing-m,1rem);--coar-markdown-heading-block-start:var(--coar-spacing-xxxl,4rem);color:var(--coar-markdown-text);display:block}.coar-markdown :where(h1,h2,h3,h4,h5,h6){font-family:var(--coar-font-family-title,inherit);color:var(--coar-markdown-text)}.coar-markdown h1{font-size:var(--coar-font-size-xl);font-weight:var(--coar-font-weight-bold);line-height:var(--coar-line-height-tight)}.coar-markdown h2{font-size:var(--coar-font-size-l);font-weight:var(--coar-font-weight-bold);line-height:1.25}.coar-markdown h3{font-size:var(--coar-font-size-m);font-weight:var(--coar-font-weight-semi-bold);line-height:var(--coar-line-height-snug)}.coar-markdown h4{font-size:var(--coar-font-size-s);font-weight:var(--coar-font-weight-semi-bold);line-height:1.35}.coar-markdown h5{font-size:var(--coar-font-size-xs);font-weight:var(--coar-font-weight-semi-bold);line-height:var(--coar-line-height-normal)}.coar-markdown h6{font-size:var(--coar-font-size-xxs);font-weight:var(--coar-font-weight-medium);line-height:1.45}.coar-markdown-heading,.coar-markdown-paragraph,.coar-markdown-blockquote,.coar-markdown-list,.coar-markdown-code-block,.coar-markdown-table,.coar-markdown-hr{margin:0}.coar-markdown>:where(h1,h2,h3,h4,h5,h6,p,blockquote,ul,ol,pre,table,hr,.coar-code-block-host,.coar-table-host){margin-block:0 var(--coar-markdown-space-2)}.coar-markdown>:where(h1,h2,h3,h4,h5,h6){margin-block-start:var(--coar-markdown-heading-block-start)}.coar-markdown>:where(h1,h2,h3,h4,h5,h6)+:where(h1,h2,h3,h4,h5,h6){margin-block-start:var(--coar-markdown-space-1)}.coar-markdown>:where(h1,h2,h3,h4,h5,h6):first-child{margin-block-start:0}.coar-markdown-blockquote{padding-inline:var(--coar-markdown-space-2);border-left:2px solid var(--coar-markdown-border)}.coar-markdown-list{padding-inline-start:var(--coar-spacing-l,1.5rem);list-style-position:outside}.coar-markdown-list--unordered{list-style-type:disc}.coar-markdown-list--ordered{list-style-type:decimal}.coar-markdown-list-item{margin-block:.25em;display:list-item}.coar-markdown-list-item--task{align-items:flex-start;gap:var(--coar-spacing-s,.5rem);list-style:none;display:flex}.coar-markdown-list-item-content{min-width:0}.coar-markdown-task-checkbox{margin-top:.15em}.coar-markdown-code-block,.coar-markdown-code{display:block}.coar-markdown-inline-code{color:var(--coar-text-accent-secondary,var(--coar-markdown-link));background:0 0;border:0;border-radius:0;padding:0}.coar-markdown-link{color:var(--coar-markdown-link);text-decoration:underline}.coar-markdown-image{vertical-align:middle;max-width:100%;height:auto}.coar-markdown :where(table),.coar-markdown-table{border-collapse:collapse;border-spacing:0;width:100%;font-size:var(--coar-body-small-base-size,.9rem);line-height:var(--coar-line-height-relaxed,1.5);display:table}.coar-markdown :where(table thead),.coar-markdown-table>thead{background:var(--coar-markdown-surface-muted)}.coar-markdown :where(table th),.coar-markdown-table>thead th{padding:.625rem var(--coar-markdown-space-2);text-align:left;vertical-align:top;font-weight:var(--coar-font-weight-semi-bold,600);font-size:var(--coar-component-s-font-size,.85em);color:var(--coar-markdown-text);border-bottom:1px solid var(--coar-markdown-border);text-transform:uppercase;letter-spacing:.025em}.coar-markdown :where(table td),.coar-markdown-table>tbody td{padding:.625rem var(--coar-markdown-space-2);text-align:left;vertical-align:top;color:var(--coar-text-neutral-secondary,var(--coar-markdown-text));border-bottom:1px solid var(--coar-markdown-border)}.coar-markdown :where(table tbody tr:nth-child(odd)),.coar-markdown-table>tbody tr:nth-child(odd){background:var(--coar-markdown-surface)}.coar-markdown :where(table tbody tr:nth-child(2n)),.coar-markdown-table>tbody tr:nth-child(2n){background:var(--coar-markdown-surface-muted)}.coar-markdown :where(table tbody tr:last-child td),.coar-markdown-table>tbody tr:last-child td{border-bottom:0}.coar-markdown-table-cell{padding:var(--coar-markdown-space-1);vertical-align:top;border-right:1px solid var(--coar-markdown-border);border-bottom:1px solid var(--coar-markdown-border)}.coar-markdown-hr{border:0;border-top:1px solid var(--coar-markdown-border)}.coar-markdown-unsupported,.coar-markdown-unsupported-inline{color:var(--coar-markdown-muted-text);font-style:italic}.coar-markdown-unsupported{padding:var(--coar-markdown-space-1);border:1px dashed var(--coar-markdown-border);border-radius:var(--coar-markdown-radius);background:var(--coar-markdown-surface)}.coar-md-root{background:var(--coar-background-neutral-primary);height:100%;color:var(--coar-text-neutral-primary);flex-direction:row;display:flex;overflow:hidden}.coar-md-root--disabled{opacity:.55;cursor:not-allowed}.coar-md-root--disabled .coar-md-area .milkdown{pointer-events:none}.coar-md-root--error{outline:1px solid var(--coar-text-semantic-error-bold,#b91c1c);outline-offset:-1px}.coar-md-sidebar-wrap{border-right:1px solid var(--coar-border-neutral);--coar-sidebar-collapsed-width:2.25rem;--coar-sidebar-item-padding:.25rem .375rem;flex-shrink:0}.coar-md-root>.coar-md-area~.coar-md-sidebar-wrap{border-right:none;border-left:1px solid var(--coar-border-neutral)}.coar-md-area{padding:var(--coar-spacing-s) var(--coar-spacing-m);cursor:text;flex:1;overflow:auto}.coar-md-area .milkdown,.coar-md-area .milkdown .editor,.coar-md-area .milkdown [contenteditable]{outline:none}.coar-md-area .milkdown h1{margin:.5em 0 .3em;font-size:1.75em;font-weight:700;line-height:1.2}.coar-md-area .milkdown h2{margin:.5em 0 .3em;font-size:1.35em;font-weight:600;line-height:1.3}.coar-md-area .milkdown h3{margin:.4em 0 .2em;font-size:1.1em;font-weight:600}.coar-md-area .milkdown p{margin:.4em 0;line-height:1.5}.coar-md-area .milkdown ul,.coar-md-area .milkdown ol{margin:.4em 0;padding-left:1.5em}.coar-md-area .milkdown li{margin:.15em 0}.coar-md-area .milkdown blockquote{padding:.25em var(--coar-spacing-m);border-left:3px solid var(--coar-border-neutral);color:var(--coar-text-neutral-secondary);margin:.5em 0}.coar-md-area .milkdown code{background:var(--coar-background-neutral-secondary);border-radius:var(--coar-radius-s);padding:.15em .4em;font-size:.9em}.coar-md-area .milkdown pre{background:var(--coar-background-neutral-secondary);padding:var(--coar-spacing-s) var(--coar-spacing-m);border-radius:var(--coar-radius-xl);margin:.5em 0;overflow-x:auto}.coar-md-area .milkdown pre code{background:0 0;padding:0}.coar-md-area .milkdown table{border-collapse:collapse;width:100%;margin:.5em 0}.coar-md-area .milkdown th,.coar-md-area .milkdown td{border:1px solid var(--coar-border-neutral);padding:var(--coar-spacing-xs) var(--coar-spacing-s);text-align:left}.coar-md-area .milkdown th{background:var(--coar-background-neutral-secondary);font-weight:600}.coar-md-area .milkdown hr{border:none;border-top:1px solid var(--coar-border-neutral);margin:1em 0}.coar-md-area .milkdown a{color:var(--coar-text-accent-primary);text-decoration:underline}.coar-md-area .milkdown strong{font-weight:600}.coar-md-area .milkdown del{text-decoration:line-through}.coar-md-area .milkdown li[data-item-type=task]{margin-left:-1.25em;padding-left:1.5em;list-style:none;position:relative}.coar-md-area .milkdown li[data-item-type=task]:before{content:"";border:1.5px solid var(--coar-border-neutral-secondary,var(--coar-border-neutral));border-radius:var(--coar-radius-xs,2px);background:var(--coar-background-neutral-primary);cursor:pointer;box-sizing:border-box;width:14px;height:14px;transition:background-color .1s,border-color .1s;position:absolute;top:.45em;left:0}.coar-md-area .milkdown li[data-item-type=task][data-checked=true]:before{background:var(--coar-background-accent-primary);border-color:var(--coar-background-accent-primary)}.coar-md-area .milkdown li[data-item-type=task][data-checked=true]:after{content:"";border-left:2px solid var(--coar-text-on-bold,#fff);border-bottom:2px solid var(--coar-text-on-bold,#fff);pointer-events:none;width:8px;height:5px;position:absolute;top:calc(.45em + 2px);left:3px;transform:rotate(-45deg)}.coar-md-area .milkdown li[data-item-type=task][data-checked=true]>p{color:var(--coar-text-neutral-tertiary);text-decoration:line-through}.coar-md-area .milkdown li[data-item-type=task] input[type=checkbox]{display:none}.coar-md-floating-toolbar{padding:var(--coar-spacing-xs) 6px;background:var(--coar-background-neutral-primary);border:1px solid var(--coar-border-neutral);border-radius:var(--coar-radius-xl);box-shadow:var(--coar-shadow-m,0 4px 12px #0000001f);z-index:10000;gap:2px;animation:.12s ease-out coar-md-float-in;display:flex;position:fixed;transform:translate(-50%,-100%)}.coar-md-float-btn{border-radius:var(--coar-radius-s);width:30px;height:30px;color:var(--coar-text-neutral-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex}.coar-md-float-btn:hover{background:var(--coar-background-neutral-tertiary);color:var(--coar-text-neutral-primary)}.coar-md-float-btn:active,.coar-md-float-btn--active{background:var(--coar-background-accent-tertiary);color:var(--coar-text-accent-primary)}.coar-md-float-btn--disabled,.coar-md-float-btn:disabled{opacity:.4;cursor:not-allowed}.coar-md-float-btn--disabled:hover,.coar-md-float-btn:disabled:hover{color:var(--coar-text-neutral-secondary);background:0 0}.coar-md-float-sep{background:var(--coar-border-neutral);align-self:center;width:1px;height:18px;margin:0 2px}.coar-md-float-dropdown{position:relative}.coar-md-float-submenu{padding:var(--coar-spacing-xs);background:var(--coar-background-neutral-primary);border:1px solid var(--coar-border-neutral);border-radius:var(--coar-radius-xl);box-shadow:var(--coar-shadow-m,0 4px 12px #0000001f);z-index:10001;flex-direction:column;min-width:140px;animation:.1s ease-out coar-md-float-in;display:flex;position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%)}.coar-md-float-submenu-item{align-items:center;gap:var(--coar-spacing-s);border-radius:var(--coar-radius-m);width:100%;color:var(--coar-text-neutral-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;text-align:left;background:0 0;border:none;padding:6px 10px;font-size:13px;display:flex}.coar-md-float-submenu-item:hover{background:var(--coar-background-neutral-tertiary);color:var(--coar-text-neutral-primary)}.coar-md-float-submenu-item:active,.coar-md-float-submenu-item--active{background:var(--coar-background-accent-tertiary);color:var(--coar-text-accent-primary)}@keyframes coar-md-float-in{0%{opacity:0;transform:translate(-50%,-100%)translateY(4px)}to{opacity:1;transform:translate(-50%,-100%)translateY(0)}}
2
2
  /*$vite$:1*/
package/dist/index.js CHANGED
@@ -1,25 +1,161 @@
1
- import { Teleport as e, computed as t, defineComponent as n, h as r, inject as i, onBeforeUnmount as a, onMounted as o, ref as s, shallowRef as c, useId as l, watch as u } from "vue";
2
- import { Editor as d, commandsCtx as f, defaultValueCtx as p, editorViewCtx as m, editorViewOptionsCtx as h, rootCtx as g } from "@milkdown/core";
3
- import { Milkdown as _, MilkdownProvider as v, useEditor as y, useInstance as b } from "@milkdown/vue";
4
- import { CoarIcon as x, CoarSidebar as ee, CoarSidebarDivider as S, CoarSidebarGroup as te, CoarSidebarItem as C, FORM_FIELD_INJECTION_KEY as w } from "@cocoar/vue-ui";
5
- import { commonmark as T, createCodeBlockCommand as E, insertHrCommand as D, liftListItemCommand as O, sinkListItemCommand as k, toggleEmphasisCommand as A, toggleInlineCodeCommand as j, toggleStrongCommand as M, turnIntoTextCommand as N, wrapInBlockquoteCommand as P, wrapInBulletListCommand as F, wrapInHeadingCommand as I, wrapInOrderedListCommand as L } from "@milkdown/preset-commonmark";
6
- import { addColAfterCommand as R, addColBeforeCommand as z, addRowAfterCommand as B, addRowBeforeCommand as V, deleteSelectedCellsCommand as H, gfm as U, insertTableCommand as W, toggleStrikethroughCommand as G } from "@milkdown/preset-gfm";
7
- import { history as K, redoCommand as q, undoCommand as J } from "@milkdown/plugin-history";
8
- import { clipboard as Y } from "@milkdown/plugin-clipboard";
9
- import { listener as X, listenerCtx as Z } from "@milkdown/plugin-listener";
10
- import { replaceAll as ne } from "@milkdown/utils";
11
- import { TextSelection as Q } from "@milkdown/prose/state";
1
+ import { Teleport as e, computed as t, createApp as n, createElementBlock as r, createElementVNode as i, createVNode as a, defineComponent as o, h as s, inject as c, normalizeClass as l, onBeforeUnmount as u, onMounted as d, openBlock as f, ref as p, shallowRef as m, unref as h, useId as g, useTemplateRef as _, vShow as v, watch as y, withDirectives as b, withModifiers as x } from "vue";
2
+ import { Editor as S, commandsCtx as C, defaultValueCtx as w, editorViewCtx as T, editorViewOptionsCtx as E, rootCtx as D } from "@milkdown/core";
3
+ import { Milkdown as ee, MilkdownProvider as O, useEditor as k, useInstance as A } from "@milkdown/vue";
4
+ import { CoarCodeBlock as j, CoarIcon as M, CoarSelect as N, CoarSidebar as te, CoarSidebarDivider as P, CoarSidebarGroup as F, CoarSidebarItem as I, FORM_FIELD_INJECTION_KEY as L } from "@cocoar/vue-ui";
5
+ import { codeBlockSchema as R, commonmark as z, createCodeBlockCommand as B, insertHrCommand as V, liftListItemCommand as H, sinkListItemCommand as ne, toggleEmphasisCommand as re, toggleInlineCodeCommand as ie, toggleStrongCommand as ae, turnIntoTextCommand as U, wrapInBlockquoteCommand as W, wrapInBulletListCommand as G, wrapInHeadingCommand as K, wrapInOrderedListCommand as q } from "@milkdown/preset-commonmark";
6
+ import { Plugin as J, TextSelection as Y } from "@milkdown/prose/state";
7
+ import { $prose as X, $view as oe, replaceAll as se } from "@milkdown/utils";
8
+ import { addColAfterCommand as ce, addColBeforeCommand as le, addRowAfterCommand as ue, addRowBeforeCommand as de, deleteSelectedCellsCommand as fe, gfm as pe, insertTableCommand as me, toggleStrikethroughCommand as he } from "@milkdown/preset-gfm";
9
+ import { history as ge, redoCommand as _e, undoCommand as ve } from "@milkdown/plugin-history";
10
+ import { clipboard as ye } from "@milkdown/plugin-clipboard";
11
+ import { listener as be, listenerCtx as Z } from "@milkdown/plugin-listener";
12
12
  //#region src/toolbar-helpers.ts
13
- function re(e, t) {
14
- return t === void 0 ? !0 : t instanceof Set ? t.has(e) : t.includes(e);
13
+ function xe(e, t) {
14
+ return t === void 0 ? !0 : "has" in t ? t.has(e) : t.includes(e);
15
15
  }
16
- function ie(e) {
16
+ function Se(e) {
17
17
  let { target: t, inBulletList: n, inOrderedList: r } = e;
18
18
  return (t === "bullet_list" ? n : r) ? "lift" : (t === "bullet_list" ? r : n) ? "switch" : "wrap";
19
19
  }
20
20
  //#endregion
21
- //#region src/CoarMarkdownEditor.vue?vue&type=script&lang.ts
22
- var ae = [
21
+ //#region src/code-block-view/CodeBlockShell.vue?vue&type=script&setup=true&lang.ts
22
+ var Ce = { class: "coar-md-code-render" }, we = { class: "coar-md-code-edit" }, Te = { class: "coar-md-code-lang-row" }, Ee = /* @__PURE__ */ o({
23
+ __name: "CodeBlockShell",
24
+ props: {
25
+ text: {},
26
+ language: {},
27
+ editing: { type: Boolean },
28
+ contentDOM: {}
29
+ },
30
+ emits: ["enterEdit", "languageChange"],
31
+ setup(e, { emit: t }) {
32
+ let n = e, o = t, s = [
33
+ {
34
+ value: "",
35
+ label: "Plain text"
36
+ },
37
+ {
38
+ value: "typescript",
39
+ label: "TypeScript"
40
+ },
41
+ {
42
+ value: "javascript",
43
+ label: "JavaScript"
44
+ },
45
+ {
46
+ value: "json",
47
+ label: "JSON"
48
+ },
49
+ {
50
+ value: "css",
51
+ label: "CSS"
52
+ },
53
+ {
54
+ value: "scss",
55
+ label: "SCSS"
56
+ },
57
+ {
58
+ value: "html",
59
+ label: "HTML"
60
+ },
61
+ {
62
+ value: "bash",
63
+ label: "Bash"
64
+ }
65
+ ], c = _("contentMount");
66
+ return y([c, () => n.contentDOM], ([e, t]) => {
67
+ e && t && t.parentElement !== e && e.appendChild(t);
68
+ }, {
69
+ immediate: !0,
70
+ flush: "post"
71
+ }), (t, n) => (f(), r("div", { class: l(["coar-md-code-host", { "coar-md-code-host--editing": e.editing }]) }, [b(i("div", Ce, [a(h(j), {
72
+ code: e.text,
73
+ language: e.language || "text",
74
+ collapsible: !1,
75
+ "show-copy": !1
76
+ }, null, 8, ["code", "language"]), i("button", {
77
+ class: "coar-md-code-edit-btn",
78
+ type: "button",
79
+ title: "Edit code block",
80
+ onMousedown: n[0] ||= x((e) => o("enterEdit"), ["prevent"])
81
+ }, [a(h(M), {
82
+ name: "pencil",
83
+ size: "xs"
84
+ }), n[2] ||= i("span", null, "Edit", -1)], 32)], 512), [[v, !e.editing]]), b(i("div", we, [i("div", Te, [a(h(N), {
85
+ class: "coar-md-code-lang-select",
86
+ "model-value": e.language,
87
+ options: s,
88
+ size: "s",
89
+ "onUpdate:modelValue": n[1] ||= (e) => o("languageChange", String(e))
90
+ }, null, 8, ["model-value"])]), i("div", {
91
+ ref_key: "contentMount",
92
+ ref: c,
93
+ class: "coar-md-code-content"
94
+ }, null, 512)], 512), [[v, e.editing]])], 2));
95
+ }
96
+ }), Q = /* @__PURE__ */ new Set(), De = class {
97
+ dom;
98
+ contentDOM;
99
+ app;
100
+ text = p("");
101
+ language = p("");
102
+ editing = p(!1);
103
+ constructor(e, t, r) {
104
+ this.node = e, this.view = t, this.getPos = r, Q.add(this), this.dom = document.createElement("div"), this.dom.className = "coar-md-code-host-mount";
105
+ let i = document.createElement("pre"), a = document.createElement("code");
106
+ i.appendChild(a), this.contentDOM = a, this.text.value = e.textContent, this.language.value = e.attrs.language ?? "", this.app = n({
107
+ name: "CodeBlockShellRoot",
108
+ setup: () => () => s(Ee, {
109
+ text: this.text.value,
110
+ language: this.language.value,
111
+ editing: this.editing.value,
112
+ contentDOM: i,
113
+ onEnterEdit: this.handleEnterEdit,
114
+ onLanguageChange: this.handleLanguageChange
115
+ })
116
+ }), this.app.mount(this.dom);
117
+ }
118
+ update(e) {
119
+ return e.type === this.node.type ? (this.node = e, this.text.value = e.textContent, this.language.value = e.attrs.language ?? "", !0) : !1;
120
+ }
121
+ selectNode() {
122
+ this.editing.value = !0, queueMicrotask(() => {
123
+ this.contentDOM.focus();
124
+ });
125
+ }
126
+ deselectNode() {
127
+ this.editing.value = !1;
128
+ }
129
+ destroy() {
130
+ Q.delete(this), this.app.unmount();
131
+ }
132
+ notifySelectionChanged() {
133
+ let e = this.getPos();
134
+ if (e == null) return;
135
+ let t = this.view.state.selection, n = e, r = e + this.node.nodeSize, i = t.from >= n && t.to <= r;
136
+ this.editing.value !== i && (this.editing.value = i);
137
+ }
138
+ stopEvent() {
139
+ return !1;
140
+ }
141
+ ignoreMutation(e) {
142
+ return !this.contentDOM.contains(e.target);
143
+ }
144
+ handleEnterEdit = () => {
145
+ let e = this.getPos();
146
+ if (e == null) return;
147
+ let { tr: t } = this.view.state;
148
+ t.setSelection(Y.create(this.view.state.doc, e + 1)), this.view.dispatch(t), this.view.focus();
149
+ };
150
+ handleLanguageChange = (e) => {
151
+ let t = this.getPos();
152
+ t != null && this.view.dispatch(this.view.state.tr.setNodeAttribute(t, "language", e));
153
+ };
154
+ }, Oe = [oe(R.node, () => (e, t, n) => new De(e, t, n)), X(() => new J({ view: () => ({ update(e, t) {
155
+ e.state.selection.eq(t.selection) || Q.forEach((t) => {
156
+ t.view === e && t.notifySelectionChanged();
157
+ });
158
+ } }) }))].flat(), ke = [
23
159
  "bold",
24
160
  "italic",
25
161
  "strikethrough",
@@ -39,51 +175,51 @@ var ae = [
39
175
  "undo",
40
176
  "redo"
41
177
  ], $ = {
42
- bold: { command: M },
43
- italic: { command: A },
44
- strike: { command: G },
45
- code: { command: j },
46
- bulletList: { command: F },
47
- orderedList: { command: L },
48
- blockquote: { command: P },
49
- hr: { command: D },
50
- codeBlock: { command: E },
51
- table: { command: W },
52
- undo: { command: J },
53
- redo: { command: q },
54
- paragraph: { command: N },
55
- addRowBefore: { command: V },
56
- addRowAfter: { command: B },
57
- addColBefore: { command: z },
58
- addColAfter: { command: R },
59
- deleteCell: { command: H },
60
- indent: { command: k },
61
- outdent: { command: O },
178
+ bold: { command: ae },
179
+ italic: { command: re },
180
+ strike: { command: he },
181
+ code: { command: ie },
182
+ bulletList: { command: G },
183
+ orderedList: { command: q },
184
+ blockquote: { command: W },
185
+ hr: { command: V },
186
+ codeBlock: { command: B },
187
+ table: { command: me },
188
+ undo: { command: ve },
189
+ redo: { command: _e },
190
+ paragraph: { command: U },
191
+ addRowBefore: { command: de },
192
+ addRowAfter: { command: ue },
193
+ addColBefore: { command: le },
194
+ addColAfter: { command: ce },
195
+ deleteCell: { command: fe },
196
+ indent: { command: ne },
197
+ outdent: { command: H },
62
198
  h1: {
63
- command: I,
199
+ command: K,
64
200
  payload: 1
65
201
  },
66
202
  h2: {
67
- command: I,
203
+ command: K,
68
204
  payload: 2
69
205
  },
70
206
  h3: {
71
- command: I,
207
+ command: K,
72
208
  payload: 3
73
209
  },
74
210
  h4: {
75
- command: I,
211
+ command: K,
76
212
  payload: 4
77
213
  },
78
214
  h5: {
79
- command: I,
215
+ command: K,
80
216
  payload: 5
81
217
  },
82
218
  h6: {
83
- command: I,
219
+ command: K,
84
220
  payload: 6
85
221
  }
86
- }, oe = n({
222
+ }, Ae = o({
87
223
  props: {
88
224
  initialValue: {
89
225
  type: String,
@@ -139,29 +275,29 @@ var ae = [
139
275
  }
140
276
  },
141
277
  setup(e) {
142
- let t = s(e.initialValue);
143
- y((n) => d.make().config((r) => {
144
- r.set(g, n), r.set(p, e.initialValue), r.update(h, (t) => ({
278
+ let t = p(e.initialValue);
279
+ k((n) => S.make().config((r) => {
280
+ r.set(D, n), r.set(w, e.initialValue), r.update(E, (t) => ({
145
281
  ...t,
146
282
  editable: () => !e.readonly
147
283
  })), r.get(Z).markdownUpdated((n, r) => {
148
284
  r !== t.value && (t.value = r, e.onMarkdownChange(r));
149
285
  });
150
- }).use(T).use(U).use(K).use(Y).use(X));
151
- let [, n] = b();
152
- return u(() => e.externalValue.value, (e) => {
286
+ }).use(z).use(pe).use(ge).use(ye).use(be).use(Oe));
287
+ let [, n] = A();
288
+ return y(() => e.externalValue.value, (e) => {
153
289
  if (e === t.value) return;
154
290
  let r = n();
155
- r && (t.value = e, r.action(ne(e)));
156
- }), u(() => e.readonly, () => {
291
+ r && (t.value = e, r.action(se(e)));
292
+ }), y(() => e.readonly, () => {
157
293
  let t = n();
158
294
  t && t.action((t) => {
159
- t.update(h, (t) => ({
295
+ t.update(E, (t) => ({
160
296
  ...t,
161
297
  editable: () => !e.readonly
162
- })), t.get(m).update(t.get(m).props);
298
+ })), t.get(T).update(t.get(T).props);
163
299
  });
164
- }), () => r(se, {
300
+ }), () => s(je, {
165
301
  readonly: e.readonly,
166
302
  disabled: e.disabled,
167
303
  toolbarMode: e.toolbarMode,
@@ -174,7 +310,7 @@ var ae = [
174
310
  required: e.required
175
311
  });
176
312
  }
177
- }), se = n({
313
+ }), je = o({
178
314
  props: {
179
315
  readonly: {
180
316
  type: Boolean,
@@ -218,10 +354,10 @@ var ae = [
218
354
  }
219
355
  },
220
356
  setup(n) {
221
- let [, i] = b(), c = s(null), l = s(!1), u = s({
357
+ let [, r] = A(), i = p(null), a = p(!1), o = p({
222
358
  left: "0px",
223
359
  top: "0px"
224
- }), d = s("text"), p = s(!1), h = {
360
+ }), c = p("text"), l = p(!1), f = {
225
361
  strong: !1,
226
362
  emphasis: !1,
227
363
  strike_through: !1,
@@ -234,46 +370,46 @@ var ae = [
234
370
  table: !1,
235
371
  code_block: !1,
236
372
  list_item_depth: 0
237
- }, g = s({ ...h });
238
- function v(e) {
373
+ }, m = p({ ...f });
374
+ function h(e) {
239
375
  if (n.readonly) return;
240
- let t = i();
376
+ let t = r();
241
377
  t && (t.action((t) => {
242
- t.get(f).call(e.command.key, e.payload);
243
- }), k());
378
+ t.get(C).call(e.command.key, e.payload);
379
+ }), x());
244
380
  }
245
- function y(e) {
381
+ function g(e) {
246
382
  if (n.readonly) return;
247
- let t = e === "bullet_list" ? $.bulletList : $.orderedList, r = ie({
383
+ let t = e === "bullet_list" ? $.bulletList : $.orderedList, r = Se({
248
384
  target: e,
249
- inBulletList: g.value.bullet_list,
250
- inOrderedList: g.value.ordered_list
385
+ inBulletList: m.value.bullet_list,
386
+ inOrderedList: m.value.ordered_list
251
387
  });
252
388
  if (r === "lift") {
253
- v({ command: O });
389
+ h({ command: H });
254
390
  return;
255
391
  }
256
- r === "switch" && v({ command: O }), v(t);
392
+ r === "switch" && h({ command: H }), h(t);
257
393
  }
258
- let w = t(() => n.tools ? new Set(n.tools) : void 0);
259
- function T(e) {
260
- return re(e, w.value);
394
+ let _ = t(() => n.tools ? new Set(n.tools) : void 0);
395
+ function v(e) {
396
+ return xe(e, _.value);
261
397
  }
262
- function E() {
398
+ function y() {
263
399
  if (n.readonly) return;
264
- let e = i();
400
+ let e = r();
265
401
  e && e.action((e) => {
266
- let t = e.get(m), { state: n } = t, r = n.tr, { from: i, to: a, empty: o } = n.selection;
402
+ let t = e.get(T), { state: n } = t, r = n.tr, { from: i, to: a, empty: o } = n.selection;
267
403
  o ? r = r.setStoredMarks([]) : Object.values(n.schema.marks).forEach((e) => {
268
404
  r = r.removeMark(i, a, e);
269
- }), t.dispatch(r), e.get(f).call(N.key);
405
+ }), t.dispatch(r), e.get(C).call(U.key);
270
406
  });
271
407
  }
272
- function D() {
408
+ function b() {
273
409
  if (n.readonly) return;
274
- let e = i();
410
+ let e = r();
275
411
  e && e.action((t) => {
276
- let n = t.get(m), { $from: r } = n.state.selection;
412
+ let n = t.get(T), { $from: r } = n.state.selection;
277
413
  for (let e = r.depth; e > 0; e--) {
278
414
  let t = r.node(e);
279
415
  if (t.type.name === "list_item") {
@@ -282,9 +418,9 @@ var ae = [
282
418
  return;
283
419
  }
284
420
  }
285
- t.get(f).call(F.key), queueMicrotask(() => {
421
+ t.get(C).call(G.key), queueMicrotask(() => {
286
422
  e.action((e) => {
287
- let t = e.get(m), { $from: n } = t.state.selection;
423
+ let t = e.get(T), { $from: n } = t.state.selection;
288
424
  for (let e = n.depth; e > 0; e--) if (n.node(e).type.name === "list_item") {
289
425
  t.dispatch(t.state.tr.setNodeAttribute(n.before(e), "checked", !1));
290
426
  return;
@@ -293,11 +429,11 @@ var ae = [
293
429
  });
294
430
  });
295
431
  }
296
- function k() {
297
- let e = i();
432
+ function x() {
433
+ let e = r();
298
434
  if (e) try {
299
435
  e.action((e) => {
300
- let t = e.get(m).state, { from: n, to: r, empty: i, $from: a } = t.selection, o = t.storedMarks, s = { ...h }, c = (e) => {
436
+ let t = e.get(T).state, { from: n, to: r, empty: i, $from: a } = t.selection, o = t.storedMarks, s = { ...f }, c = (e) => {
301
437
  let s = t.schema.marks[e];
302
438
  if (!s) return !1;
303
439
  if (i) {
@@ -311,35 +447,35 @@ var ae = [
311
447
  let t = a.node(e), n = t.type.name;
312
448
  n === "bullet_list" ? s.bullet_list = !0 : n === "ordered_list" ? s.ordered_list = !0 : n === "blockquote" ? s.blockquote = !0 : n === "heading" ? s.heading = t.attrs.level ?? null : n === "table" ? s.table = !0 : n === "code_block" ? s.code_block = !0 : n === "list_item" && (s.list_item_depth += 1, t.attrs.checked != null && (s.task_list = !0));
313
449
  }
314
- g.value = s;
450
+ m.value = s;
315
451
  });
316
452
  } catch {
317
- g.value = { ...h };
453
+ m.value = { ...f };
318
454
  }
319
455
  }
320
- function A(e) {
456
+ function S(e) {
321
457
  if (n.readonly) return;
322
- let t = e.target, r = t.closest("li[data-item-type=\"task\"]");
323
- if (r) {
324
- let t = r.getBoundingClientRect();
458
+ let t = e.target, i = t.closest("li[data-item-type=\"task\"]");
459
+ if (i) {
460
+ let t = i.getBoundingClientRect();
325
461
  if (e.clientX - t.left < 18) {
326
- e.preventDefault(), j(r);
462
+ e.preventDefault(), w(i);
327
463
  return;
328
464
  }
329
465
  }
330
466
  if (t.closest(".ProseMirror")) return;
331
- let a = i();
467
+ let a = r();
332
468
  a && (e.preventDefault(), a.action((e) => {
333
- let t = e.get(m);
469
+ let t = e.get(T);
334
470
  t.focus();
335
- let n = t.state.tr.setSelection(Q.atEnd(t.state.doc));
471
+ let n = t.state.tr.setSelection(Y.atEnd(t.state.doc));
336
472
  t.dispatch(n);
337
473
  }));
338
474
  }
339
- function j(e) {
340
- let t = i();
475
+ function w(e) {
476
+ let t = r();
341
477
  t && t.action((t) => {
342
- let n = t.get(m), r = n.posAtDOM(e, 0);
478
+ let n = t.get(T), r = n.posAtDOM(e, 0);
343
479
  if (r < 0) return;
344
480
  let i = n.state.doc.resolve(r);
345
481
  for (let e = i.depth; e >= 0; e--) {
@@ -352,13 +488,13 @@ var ae = [
352
488
  }
353
489
  });
354
490
  }
355
- function M() {
356
- let e = i();
491
+ function E() {
492
+ let e = r();
357
493
  if (!e) return "text";
358
494
  try {
359
495
  let t = "text";
360
496
  return e.action((e) => {
361
- let { $from: n } = e.get(m).state.selection;
497
+ let { $from: n } = e.get(T).state.selection;
362
498
  for (let e = n.depth; e > 0; e--) if (n.node(e).type.name === "table") {
363
499
  t = "table";
364
500
  break;
@@ -368,190 +504,190 @@ var ae = [
368
504
  return "text";
369
505
  }
370
506
  }
371
- function P(e) {
507
+ function D(e) {
372
508
  let t = e.left + e.width / 2, n = e.top - 8;
373
- t = Math.max(108, Math.min(t, window.innerWidth - 108)), n < 50 && (n = e.bottom + 8), u.value = {
509
+ t = Math.max(108, Math.min(t, window.innerWidth - 108)), n < 50 && (n = e.bottom + 8), o.value = {
374
510
  left: `${t}px`,
375
511
  top: `${n}px`
376
512
  };
377
513
  }
378
- function I() {
514
+ function O() {
379
515
  if (n.readonly || n.toolbarMode === "fixed") {
380
- l.value = !1;
516
+ a.value = !1;
381
517
  return;
382
518
  }
383
519
  let e = window.getSelection();
384
520
  if (!e || e.isCollapsed || !e.rangeCount) {
385
- l.value = !1, p.value = !1;
521
+ a.value = !1, l.value = !1;
386
522
  return;
387
523
  }
388
- let t = e.getRangeAt(0), r = c.value?.querySelector(".coar-md-area .milkdown");
524
+ let t = e.getRangeAt(0), r = i.value?.querySelector(".coar-md-area .milkdown");
389
525
  if (!r || !r.contains(t.commonAncestorContainer)) {
390
- l.value = !1, p.value = !1;
526
+ a.value = !1, l.value = !1;
391
527
  return;
392
528
  }
393
- P(t.getBoundingClientRect()), d.value = M(), l.value = !0, p.value = !1;
529
+ D(t.getBoundingClientRect()), c.value = E(), a.value = !0, l.value = !1;
394
530
  }
395
- function L(e) {
531
+ function k(e) {
396
532
  let t = e.target;
397
- t.closest(".coar-md-floating-toolbar") || t.closest(".coar-md-float-submenu") || (!c.value || !c.value.contains(t)) && (l.value = !1, p.value = !1);
533
+ t.closest(".coar-md-floating-toolbar") || t.closest(".coar-md-float-submenu") || (!i.value || !i.value.contains(t)) && (a.value = !1, l.value = !1);
398
534
  }
399
- let R = null;
400
- function z(e = 20) {
401
- let t = i();
535
+ let j = null;
536
+ function N(e = 20) {
537
+ let t = r();
402
538
  if (!t) {
403
- e > 0 && setTimeout(() => z(e - 1), 50);
539
+ e > 0 && setTimeout(() => N(e - 1), 50);
404
540
  return;
405
541
  }
406
542
  try {
407
543
  t.action((e) => {
408
544
  let t = e.get(Z);
409
- R = () => queueMicrotask(k), t.selectionUpdated(R);
545
+ j = () => queueMicrotask(x), t.selectionUpdated(j);
410
546
  });
411
547
  } catch {
412
- e > 0 && setTimeout(() => z(e - 1), 50);
548
+ e > 0 && setTimeout(() => N(e - 1), 50);
413
549
  }
414
550
  }
415
- function B() {
416
- if (!R) return;
417
- let e = i();
551
+ function L() {
552
+ if (!j) return;
553
+ let e = r();
418
554
  if (e) {
419
555
  try {
420
556
  e.action((e) => {
421
- let t = e.get(Z).listeners.selectionUpdated, n = t.indexOf(R);
557
+ let t = e.get(Z).listeners.selectionUpdated, n = t.indexOf(j);
422
558
  n >= 0 && t.splice(n, 1);
423
559
  });
424
560
  } catch {}
425
- R = null;
561
+ j = null;
426
562
  }
427
563
  }
428
- o(() => {
429
- document.addEventListener("selectionchange", I), document.addEventListener("mousedown", L, !0), z();
430
- }), a(() => {
431
- document.removeEventListener("selectionchange", I), document.removeEventListener("mousedown", L, !0), B();
564
+ d(() => {
565
+ document.addEventListener("selectionchange", O), document.addEventListener("mousedown", k, !0), N();
566
+ }), u(() => {
567
+ document.removeEventListener("selectionchange", O), document.removeEventListener("mousedown", k, !0), L();
432
568
  });
433
- function V(e, t, n, i = {}) {
434
- return r(C, {
569
+ function R(e, t, n, r = {}) {
570
+ return s(I, {
435
571
  icon: e,
436
572
  label: t,
437
- active: i.active ?? !1,
438
- disabled: i.disabled ?? !1,
439
- onClick: i.disabled ? () => {} : i.onClick ?? (() => v(n))
573
+ active: r.active ?? !1,
574
+ disabled: r.disabled ?? !1,
575
+ onClick: r.disabled ? () => {} : r.onClick ?? (() => h(n))
440
576
  });
441
577
  }
442
- function H() {
443
- let e = g.value, t = e.heading != null;
444
- function i(e, t, n) {
445
- T(t) && e.push(n);
578
+ function z() {
579
+ let e = m.value, t = e.heading != null;
580
+ function r(e, t, n) {
581
+ v(t) && e.push(n);
446
582
  }
447
- function a(e) {
448
- e.length !== 0 && e[e.length - 1]?.type !== S && e.push(r(S));
583
+ function i(e) {
584
+ e.length !== 0 && e[e.length - 1]?.type !== P && e.push(s(P));
449
585
  }
450
- let o = [];
451
- return i(o, "bold", V("bold", "Bold", $.bold, { active: e.strong })), i(o, "italic", V("italic", "Italic", $.italic, { active: e.emphasis })), i(o, "strikethrough", V("strikethrough", "Strikethrough", $.strike, { active: e.strike_through })), i(o, "inlineCode", V("code", "Inline Code", $.code, { active: e.inlineCode })), i(o, "headings", r(te, {
586
+ let a = [];
587
+ return r(a, "bold", R("bold", "Bold", $.bold, { active: e.strong })), r(a, "italic", R("italic", "Italic", $.italic, { active: e.emphasis })), r(a, "strikethrough", R("strikethrough", "Strikethrough", $.strike, { active: e.strike_through })), r(a, "inlineCode", R("code", "Inline Code", $.code, { active: e.inlineCode })), r(a, "headings", s(F, {
452
588
  icon: "hash",
453
589
  label: t ? `Heading ${e.heading}` : "Headings",
454
590
  mode: "flyout",
455
591
  openOnHover: !0
456
592
  }, { default: () => [
457
- r(C, {
593
+ s(I, {
458
594
  icon: "pilcrow",
459
595
  label: "Paragraph",
460
596
  active: !t,
461
- onClick: () => v($.paragraph)
597
+ onClick: () => h($.paragraph)
462
598
  }),
463
- r(C, {
599
+ s(I, {
464
600
  icon: "heading",
465
601
  label: "Heading 1",
466
602
  active: e.heading === 1,
467
- onClick: () => v($.h1)
603
+ onClick: () => h($.h1)
468
604
  }),
469
- r(C, {
605
+ s(I, {
470
606
  icon: "heading",
471
607
  label: "Heading 2",
472
608
  active: e.heading === 2,
473
- onClick: () => v($.h2)
609
+ onClick: () => h($.h2)
474
610
  }),
475
- r(C, {
611
+ s(I, {
476
612
  icon: "heading",
477
613
  label: "Heading 3",
478
614
  active: e.heading === 3,
479
- onClick: () => v($.h3)
615
+ onClick: () => h($.h3)
480
616
  }),
481
- r(C, {
617
+ s(I, {
482
618
  icon: "heading",
483
619
  label: "Heading 4",
484
620
  active: e.heading === 4,
485
- onClick: () => v($.h4)
621
+ onClick: () => h($.h4)
486
622
  }),
487
- r(C, {
623
+ s(I, {
488
624
  icon: "heading",
489
625
  label: "Heading 5",
490
626
  active: e.heading === 5,
491
- onClick: () => v($.h5)
627
+ onClick: () => h($.h5)
492
628
  }),
493
- r(C, {
629
+ s(I, {
494
630
  icon: "heading",
495
631
  label: "Heading 6",
496
632
  active: e.heading === 6,
497
- onClick: () => v($.h6)
633
+ onClick: () => h($.h6)
498
634
  })
499
- ] })), a(o), i(o, "bulletList", V("list", "Bullet List", $.bulletList, {
635
+ ] })), i(a), r(a, "bulletList", R("list", "Bullet List", $.bulletList, {
500
636
  active: e.bullet_list,
501
- onClick: () => y("bullet_list")
502
- })), i(o, "orderedList", V("list-ordered", "Ordered List", $.orderedList, {
637
+ onClick: () => g("bullet_list")
638
+ })), r(a, "orderedList", R("list-ordered", "Ordered List", $.orderedList, {
503
639
  active: e.ordered_list,
504
- onClick: () => y("ordered_list")
505
- })), i(o, "taskList", V("clipboard-check", "Task List", $.bulletList, {
640
+ onClick: () => g("ordered_list")
641
+ })), r(a, "taskList", R("clipboard-check", "Task List", $.bulletList, {
506
642
  active: e.task_list,
507
- onClick: D
508
- })), i(o, "outdent", V("indent-decrease", "Outdent", $.outdent, { disabled: e.list_item_depth < 2 })), i(o, "indent", V("indent-increase", "Indent", $.indent, { disabled: e.list_item_depth < 1 })), i(o, "blockquote", V("text-quote", "Blockquote", $.blockquote, { active: e.blockquote })), i(o, "horizontalRule", V("minus", "Horizontal Rule", $.hr)), a(o), i(o, "codeBlock", V("square-code", "Code Block", $.codeBlock, { active: e.code_block })), i(o, "table", V("table", "Insert Table", $.table, { active: e.table })), e.table && T("tableOps") && (a(o), o.push(V("between-vertical-start", "Insert Row Above", $.addRowBefore)), o.push(V("between-vertical-end", "Insert Row Below", $.addRowAfter)), o.push(V("between-horizontal-start", "Insert Column Left", $.addColBefore)), o.push(V("between-horizontal-end", "Insert Column Right", $.addColAfter)), o.push(V("trash-2", "Delete Cell", $.deleteCell))), T("clearFormatting") && (a(o), o.push(V("eraser", "Clear Formatting", $.bold, { onClick: E }))), a(o), i(o, "undo", V("undo-2", "Undo", $.undo)), i(o, "redo", V("redo-2", "Redo", $.redo)), o[o.length - 1]?.type === S && o.pop(), r("div", {
643
+ onClick: b
644
+ })), r(a, "outdent", R("indent-decrease", "Outdent", $.outdent, { disabled: e.list_item_depth < 2 })), r(a, "indent", R("indent-increase", "Indent", $.indent, { disabled: e.list_item_depth < 1 })), r(a, "blockquote", R("text-quote", "Blockquote", $.blockquote, { active: e.blockquote })), r(a, "horizontalRule", R("minus", "Horizontal Rule", $.hr)), i(a), r(a, "codeBlock", R("square-code", "Code Block", $.codeBlock, { active: e.code_block })), r(a, "table", R("table", "Insert Table", $.table, { active: e.table })), e.table && v("tableOps") && (i(a), a.push(R("between-vertical-start", "Insert Row Above", $.addRowBefore)), a.push(R("between-vertical-end", "Insert Row Below", $.addRowAfter)), a.push(R("between-horizontal-start", "Insert Column Left", $.addColBefore)), a.push(R("between-horizontal-end", "Insert Column Right", $.addColAfter)), a.push(R("trash-2", "Delete Cell", $.deleteCell))), v("clearFormatting") && (i(a), a.push(R("eraser", "Clear Formatting", $.bold, { onClick: y }))), i(a), r(a, "undo", R("undo-2", "Undo", $.undo)), r(a, "redo", R("redo-2", "Redo", $.redo)), a[a.length - 1]?.type === P && a.pop(), s("div", {
509
645
  key: "sidebar",
510
646
  class: "coar-md-sidebar-wrap",
511
647
  onMousedown: (e) => e.preventDefault()
512
- }, [r(ee, {
648
+ }, [s(te, {
513
649
  collapsed: !0,
514
650
  position: n.toolbarPosition,
515
651
  size: "s",
516
652
  variant: "primary",
517
653
  borderless: !0
518
- }, { default: () => o })]);
654
+ }, { default: () => a })]);
519
655
  }
520
- function U() {
521
- let t = (e, t, n, i = {}) => r("button", {
656
+ function B() {
657
+ let t = (e, t, n, r = {}) => s("button", {
522
658
  class: [
523
659
  "coar-md-float-btn",
524
- i.isActive ? "coar-md-float-btn--active" : "",
525
- i.disabled ? "coar-md-float-btn--disabled" : ""
660
+ r.isActive ? "coar-md-float-btn--active" : "",
661
+ r.disabled ? "coar-md-float-btn--disabled" : ""
526
662
  ],
527
663
  title: t,
528
664
  type: "button",
529
- disabled: i.disabled ?? !1,
665
+ disabled: r.disabled ?? !1,
530
666
  onMousedown: (e) => {
531
- e.preventDefault(), !i.disabled && (i.onClick ?? (() => v(n)))();
667
+ e.preventDefault(), !r.disabled && (r.onClick ?? (() => h(n)))();
532
668
  }
533
- }, [r(x, {
669
+ }, [s(M, {
534
670
  name: e,
535
671
  size: "s"
536
- })]), n = () => r("div", { class: "coar-md-float-sep" }), i = g.value;
537
- function a(e, t, n) {
538
- T(t) && e.push(n);
672
+ })]), n = () => s("div", { class: "coar-md-float-sep" }), r = m.value;
673
+ function i(e, t, n) {
674
+ v(t) && e.push(n);
539
675
  }
540
- function o(e) {
676
+ function a(e) {
541
677
  e.length !== 0 && e[e.length - 1]?.props?.class !== "coar-md-float-sep" && e.push(n());
542
678
  }
543
- let s = [];
544
- a(s, "bold", t("bold", "Bold", $.bold, { isActive: i.strong })), a(s, "italic", t("italic", "Italic", $.italic, { isActive: i.emphasis })), a(s, "strikethrough", t("strikethrough", "Strikethrough", $.strike, { isActive: i.strike_through })), a(s, "inlineCode", t("code", "Inline Code", $.code, { isActive: i.inlineCode })), T("headings") && (o(s), s.push(r("div", { class: "coar-md-float-dropdown" }, [r("button", {
545
- class: ["coar-md-float-btn", p.value || i.heading != null ? "coar-md-float-btn--active" : ""],
546
- title: i.heading == null ? "Headings" : `Heading ${i.heading}`,
679
+ let u = [];
680
+ i(u, "bold", t("bold", "Bold", $.bold, { isActive: r.strong })), i(u, "italic", t("italic", "Italic", $.italic, { isActive: r.emphasis })), i(u, "strikethrough", t("strikethrough", "Strikethrough", $.strike, { isActive: r.strike_through })), i(u, "inlineCode", t("code", "Inline Code", $.code, { isActive: r.inlineCode })), v("headings") && (a(u), u.push(s("div", { class: "coar-md-float-dropdown" }, [s("button", {
681
+ class: ["coar-md-float-btn", l.value || r.heading != null ? "coar-md-float-btn--active" : ""],
682
+ title: r.heading == null ? "Headings" : `Heading ${r.heading}`,
547
683
  type: "button",
548
684
  onMousedown: (e) => {
549
- e.preventDefault(), p.value = !p.value;
685
+ e.preventDefault(), l.value = !l.value;
550
686
  }
551
- }, [r(x, {
687
+ }, [s(M, {
552
688
  name: "heading",
553
689
  size: "s"
554
- })]), p.value ? r("div", { class: "coar-md-float-submenu" }, [
690
+ })]), l.value ? s("div", { class: "coar-md-float-submenu" }, [
555
691
  {
556
692
  label: "Paragraph",
557
693
  cmd: $.paragraph,
@@ -594,28 +730,28 @@ var ae = [
594
730
  icon: "heading",
595
731
  activeLevel: 6
596
732
  }
597
- ].map(({ label: e, cmd: t, icon: n, activeLevel: a }) => r("button", {
598
- class: ["coar-md-float-submenu-item", (a === 0 ? i.heading == null : i.heading === a) ? "coar-md-float-submenu-item--active" : ""],
733
+ ].map(({ label: e, cmd: t, icon: n, activeLevel: i }) => s("button", {
734
+ class: ["coar-md-float-submenu-item", (i === 0 ? r.heading == null : r.heading === i) ? "coar-md-float-submenu-item--active" : ""],
599
735
  type: "button",
600
736
  onMousedown: (e) => {
601
- e.preventDefault(), v(t), p.value = !1;
737
+ e.preventDefault(), h(t), l.value = !1;
602
738
  }
603
- }, [r(x, {
739
+ }, [s(M, {
604
740
  name: n,
605
741
  size: "xs"
606
- }), r("span", null, e)]))) : null]))), o(s), a(s, "bulletList", t("list", "Bullet List", $.bulletList, {
607
- isActive: i.bullet_list,
608
- onClick: () => y("bullet_list")
609
- })), a(s, "orderedList", t("list-ordered", "Ordered List", $.orderedList, {
610
- isActive: i.ordered_list,
611
- onClick: () => y("ordered_list")
612
- })), a(s, "taskList", t("clipboard-check", "Task List", $.bulletList, {
613
- isActive: i.task_list,
614
- onClick: D
615
- })), a(s, "outdent", t("indent-decrease", "Outdent", $.outdent, { disabled: i.list_item_depth < 2 })), a(s, "indent", t("indent-increase", "Indent", $.indent, { disabled: i.list_item_depth < 1 })), o(s), a(s, "blockquote", t("text-quote", "Blockquote", $.blockquote, { isActive: i.blockquote })), T("clearFormatting") && (o(s), s.push(t("eraser", "Clear Formatting", $.bold, { onClick: E }))), s[s.length - 1]?.props?.class === "coar-md-float-sep" && s.pop();
616
- let c = {
617
- text: s,
618
- table: T("tableOps") ? [
742
+ }), s("span", null, e)]))) : null]))), a(u), i(u, "bulletList", t("list", "Bullet List", $.bulletList, {
743
+ isActive: r.bullet_list,
744
+ onClick: () => g("bullet_list")
745
+ })), i(u, "orderedList", t("list-ordered", "Ordered List", $.orderedList, {
746
+ isActive: r.ordered_list,
747
+ onClick: () => g("ordered_list")
748
+ })), i(u, "taskList", t("clipboard-check", "Task List", $.bulletList, {
749
+ isActive: r.task_list,
750
+ onClick: b
751
+ })), i(u, "outdent", t("indent-decrease", "Outdent", $.outdent, { disabled: r.list_item_depth < 2 })), i(u, "indent", t("indent-increase", "Indent", $.indent, { disabled: r.list_item_depth < 1 })), a(u), i(u, "blockquote", t("text-quote", "Blockquote", $.blockquote, { isActive: r.blockquote })), v("clearFormatting") && (a(u), u.push(t("eraser", "Clear Formatting", $.bold, { onClick: y }))), u[u.length - 1]?.props?.class === "coar-md-float-sep" && u.pop();
752
+ let d = {
753
+ text: u,
754
+ table: v("tableOps") ? [
619
755
  t("between-vertical-start", "Insert Row Above", $.addRowBefore),
620
756
  t("between-vertical-end", "Insert Row Below", $.addRowAfter),
621
757
  n(),
@@ -623,43 +759,43 @@ var ae = [
623
759
  t("between-horizontal-end", "Insert Column Right", $.addColAfter),
624
760
  n(),
625
761
  t("trash-2", "Delete", $.deleteCell),
626
- ...T("bold") || T("italic") || T("inlineCode") ? [n()] : [],
627
- ...T("bold") ? [t("bold", "Bold", $.bold)] : [],
628
- ...T("italic") ? [t("italic", "Italic", $.italic)] : [],
629
- ...T("inlineCode") ? [t("code", "Code", $.code)] : []
630
- ] : s,
631
- "col-selection": T("tableOps") ? [
762
+ ...v("bold") || v("italic") || v("inlineCode") ? [n()] : [],
763
+ ...v("bold") ? [t("bold", "Bold", $.bold)] : [],
764
+ ...v("italic") ? [t("italic", "Italic", $.italic)] : [],
765
+ ...v("inlineCode") ? [t("code", "Code", $.code)] : []
766
+ ] : u,
767
+ "col-selection": v("tableOps") ? [
632
768
  t("between-horizontal-start", "Insert Column Left", $.addColBefore),
633
769
  t("between-horizontal-end", "Insert Column Right", $.addColAfter),
634
770
  n(),
635
771
  t("trash-2", "Delete Column", $.deleteCell)
636
- ] : s,
637
- "row-selection": T("tableOps") ? [
772
+ ] : u,
773
+ "row-selection": v("tableOps") ? [
638
774
  t("between-vertical-start", "Insert Row Above", $.addRowBefore),
639
775
  t("between-vertical-end", "Insert Row Below", $.addRowAfter),
640
776
  n(),
641
777
  t("trash-2", "Delete Row", $.deleteCell)
642
- ] : s
778
+ ] : u
643
779
  };
644
- return r(e, { to: "body" }, r("div", {
780
+ return s(e, { to: "body" }, s("div", {
645
781
  class: "coar-md-floating-toolbar",
646
- style: `left:${u.value.left};top:${u.value.top};`
647
- }, c[d.value] || s));
782
+ style: `left:${o.value.left};top:${o.value.top};`
783
+ }, d[c.value] || u));
648
784
  }
649
785
  return () => {
650
- let e = n.toolbarMode === "fixed" || n.toolbarMode === "both", t = !n.readonly && (n.toolbarMode === "floating" || n.toolbarMode === "both"), i = [];
651
- return e && n.toolbarPosition === "left" && i.push(H()), i.push(r("div", {
786
+ let e = n.toolbarMode === "fixed" || n.toolbarMode === "both", t = !n.readonly && (n.toolbarMode === "floating" || n.toolbarMode === "both"), r = [];
787
+ return e && n.toolbarPosition === "left" && r.push(z()), r.push(s("div", {
652
788
  key: "area",
653
- class: "coar-md-area",
654
- onMousedown: A
655
- }, [r(_)])), e && n.toolbarPosition === "right" && i.push(H()), l.value && t && i.push(U()), r("div", {
789
+ class: ["coar-md-area", "coar-markdown"],
790
+ onMousedown: S
791
+ }, [s(ee)])), e && n.toolbarPosition === "right" && r.push(z()), a.value && t && r.push(B()), s("div", {
656
792
  class: {
657
793
  "coar-md-root": !0,
658
794
  "coar-md-root--disabled": n.disabled,
659
795
  "coar-md-root--readonly": n.readonly && !n.disabled,
660
796
  "coar-md-root--error": n.hasError
661
797
  },
662
- ref: c,
798
+ ref: i,
663
799
  id: n.inputId,
664
800
  "aria-invalid": n.hasError ? "true" : void 0,
665
801
  "aria-describedby": n.describedBy,
@@ -667,10 +803,10 @@ var ae = [
667
803
  "aria-readonly": n.readonly && !n.disabled ? "true" : void 0,
668
804
  "aria-required": n.required ? "true" : void 0,
669
805
  "data-name": n.name
670
- }, i);
806
+ }, r);
671
807
  };
672
808
  }
673
- }), ce = n({
809
+ }), Me = o({
674
810
  name: "CoarMarkdownEditor",
675
811
  props: {
676
812
  modelValue: {
@@ -716,22 +852,22 @@ var ae = [
716
852
  },
717
853
  emits: ["update:modelValue"],
718
854
  setup(e, { emit: n }) {
719
- let a = e.modelValue, o = c({ value: e.modelValue });
720
- u(() => e.modelValue, (e) => {
721
- o.value = { value: e };
855
+ let r = e.modelValue, i = m({ value: e.modelValue });
856
+ y(() => e.modelValue, (e) => {
857
+ i.value = { value: e };
722
858
  });
723
- let s = i(w, void 0), d = `coar-markdown-editor-${l()}`, f = t(() => e.id || s?.inputId.value || d), p = t(() => e.error || (s?.hasError.value ?? !1)), m = t(() => s?.messageId.value), h = t(() => e.disabled || (s?.disabled.value ?? !1)), g = t(() => e.readonly || h.value);
724
- return () => r(v, null, () => r(oe, {
725
- initialValue: a,
726
- externalValue: o.value,
727
- readonly: g.value,
728
- disabled: h.value,
859
+ let a = c(L, void 0), o = `coar-markdown-editor-${g()}`, l = t(() => e.id || a?.inputId.value || o), u = t(() => e.error || (a?.hasError.value ?? !1)), d = t(() => a?.messageId.value), f = t(() => e.disabled || (a?.disabled.value ?? !1)), p = t(() => e.readonly || f.value);
860
+ return () => s(O, null, () => s(Ae, {
861
+ initialValue: r,
862
+ externalValue: i.value,
863
+ readonly: p.value,
864
+ disabled: f.value,
729
865
  toolbarMode: e.toolbarMode,
730
866
  toolbarPosition: e.toolbarPosition,
731
867
  tools: e.tools,
732
- inputId: f.value,
733
- hasError: p.value,
734
- describedBy: m.value,
868
+ inputId: l.value,
869
+ hasError: u.value,
870
+ describedBy: d.value,
735
871
  name: e.name,
736
872
  required: e.required,
737
873
  onMarkdownChange: (e) => n("update:modelValue", e)
@@ -739,4 +875,4 @@ var ae = [
739
875
  }
740
876
  });
741
877
  //#endregion
742
- export { ae as COAR_MARKDOWN_EDITOR_ALL_TOOLS, ce as CoarMarkdownEditor };
878
+ export { ke as COAR_MARKDOWN_EDITOR_ALL_TOOLS, Me as CoarMarkdownEditor };
package/dist/toolbar-helpers.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"toolbar-helpers.d.ts","sourceRoot":"","sources":["../src/toolbar-helpers.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAEvE;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAC3B,IAAI,EAAE,sBAAsB,EAC5B,SAAS,EAAE,WAAW,CAAC,sBAAsB,CAAC,GAAG,SAAS,sBAAsB,EAAE,GAAG,SAAS,GAC7F,OAAO,CAIT;AAED;;;;;;;;;GASG;AACH,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE1D,wBAAgB,sBAAsB,CAAC,IAAI,EAAE;IAC3C,MAAM,EAAE,aAAa,GAAG,cAAc,CAAC;IACvC,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,OAAO,CAAC;CACxB,GAAG,gBAAgB,CAOnB"}
1
+ {"version":3,"file":"toolbar-helpers.d.ts","sourceRoot":"","sources":["../src/toolbar-helpers.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAEvE;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAC3B,IAAI,EAAE,sBAAsB,EAC5B,SAAS,EAAE,WAAW,CAAC,sBAAsB,CAAC,GAAG,SAAS,sBAAsB,EAAE,GAAG,SAAS,GAC7F,OAAO,CAST;AAED;;;;;;;;;GASG;AACH,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE1D,wBAAgB,sBAAsB,CAAC,IAAI,EAAE;IAC3C,MAAM,EAAE,aAAa,GAAG,cAAc,CAAC;IACvC,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,OAAO,CAAC;CACxB,GAAG,gBAAgB,CAOnB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cocoar/vue-markdown-editor",
3
- "version": "1.13.0-beta.6",
3
+ "version": "1.13.0",
4
4
  "description": "WYSIWYG Markdown editor for Vue 3 based on Milkdown, with Cocoar Design System styling",
5
5
  "license": "Apache-2.0",
6
6
  "repository": {
@@ -42,7 +42,8 @@
42
42
  "lint": "eslint src/"
43
43
  },
44
44
  "peerDependencies": {
45
- "@cocoar/vue-ui": "1.13.0-beta.6",
45
+ "@cocoar/vue-markdown": "1.13.0",
46
+ "@cocoar/vue-ui": "1.13.0",
46
47
  "vue": "^3.5.0"
47
48
  },
48
49
  "dependencies": {
@@ -59,6 +60,7 @@
59
60
  "@milkdown/vue": "^7.20.0"
60
61
  },
61
62
  "devDependencies": {
63
+ "@cocoar/vue-markdown": "workspace:*",
62
64
  "@cocoar/vue-ui": "workspace:*",
63
65
  "vue": "^3.5.32"
64
66
  }