@krainovsd/markdown-editor 0.3.1 → 0.4.0

package/lib/cjs/{index-nRNnOuav.js → index-Dj0jRUGF.js}

@@ -2,6 +2,7 @@
 
 const view = require('@codemirror/view');
 const state = require('@codemirror/state');
+const autocomplete = require('@codemirror/autocomplete');
 const commands = require('@codemirror/commands');
 const language = require('@codemirror/language');
 const highlight = require('@lezer/highlight');
@@ -13,6 +14,59 @@ const ReadonlyCompartment = new state.Compartment();
 const VimModeCompartment = new state.Compartment();
 const ThemeCompartment = new state.Compartment();
 
+const CODE_OF_START_MENTION$1 = "@".codePointAt(0); // @
+const CODE_OF_SPACE$3 = " ".codePointAt(0);
+const CODE_OF_LINE_BREAK$1 = "\n".codePointAt(0);
+const tagAutoComplete = (tagOptions) => {
+    const options = tagOptions.map((user) => ({
+        label: `@${user}`,
+        type: "text",
+    }));
+    return (context) => {
+        const line = context.view?.lineBlockAt?.(context.pos);
+        if (!line)
+            return null;
+        const content = context.state.sliceDoc(line.from, context.pos);
+        let pos = content.length - 1;
+        while (pos > -1) {
+            const code = content.codePointAt(pos);
+            if (!code || code === CODE_OF_SPACE$3 || code === CODE_OF_LINE_BREAK$1)
+                return null;
+            if (code == CODE_OF_START_MENTION$1)
+                break;
+            pos--;
+        }
+        if (pos === -1)
+            return null;
+        return {
+            from: line.from + pos,
+            options,
+        };
+    };
+};
+
+const initAutoComplete = ({ autoCompleteTagOptions, autoCompleteConfig = {}, }) => {
+    if (!autoCompleteTagOptions)
+        return [];
+    return [
+        autocomplete.autocompletion({
+            activateOnTyping: true,
+            activateOnTypingDelay: 100,
+            selectOnOpen: true,
+            closeOnBlur: true,
+            maxRenderedOptions: 20,
+            aboveCursor: false,
+            defaultKeymap: true,
+            icons: false,
+            filterStrict: false,
+            interactionDelay: 75,
+            updateSyncTime: 100,
+            ...autoCompleteConfig,
+            override: [tagAutoComplete(autoCompleteTagOptions)],
+        }),
+    ];
+};
+
 function copyToClipboard(content) {
     if (navigator.clipboard && window.isSecureContext) {
         return navigator.clipboard.writeText(content);
@@ -92,6 +146,152 @@ function saveDispatch(dispatch) {
     });
 }
 
+function overlapMark({ marks, shift, state, requireMatched }) {
+    const { from, to, shiftAfterInner, shiftAfterOuter, shiftBeforeInner, shiftBeforeOuter, text } = processShiftContent(state, shift, marks);
+    const startIndex = findMarkIndex(text.substring(0, shiftBeforeInner + shiftBeforeOuter), marks, requireMatched, "right");
+    const endIndex = findMarkIndex(text.substring(text.length - shiftAfterInner - shiftAfterOuter), marks, requireMatched, "left");
+    const start = ~startIndex ? from - shiftBeforeOuter + startIndex : -1;
+    const end = ~endIndex ? to - shiftAfterInner + endIndex : -1;
+    // console.log({
+    //   from,
+    //   to,
+    //   shiftAfterInner,
+    //   shiftAfterOuter,
+    //   shiftBeforeInner,
+    //   shiftBeforeOuter,
+    //   text,
+    //   textStart: text.substring(0, shiftBeforeInner + shiftBeforeOuter),
+    //   textEnd: text.substring(text.length - shiftAfterInner - shiftAfterOuter),
+    //   startIndex,
+    //   endIndex,
+    //   end,
+    //   start,
+    // });
+    return {
+        start,
+        end,
+        marked: Boolean(~start || ~end),
+        originalText: text.substring(shiftBeforeOuter, text.length - shiftAfterOuter),
+    };
+}
+function findMarkIndex(text, marks, requireMatched, direction = "right") {
+    if (text.length === 0)
+        return -1;
+    const maxRequired = Math.max(...requireMatched);
+    const minRequired = Math.min(...requireMatched);
+    let pos = 0;
+    let matched = 0;
+    let start = -1;
+    for (const mark of marks) {
+        if (!mark)
+            continue;
+        while (pos < text.length) {
+            if (text.codePointAt(pos) === mark)
+                matched++;
+            else {
+                if (
+                // eslint-disable-next-line no-loop-func --  https://eslint.org/docs/latest/rules/no-loop-func#known-limitations
+                requireMatched.some((rm) => rm === matched) &&
+                    ((direction === "right" && pos - matched > start) ||
+                        (direction === "left" && (pos - matched < start || start === -1)))) {
+                    start = direction === "right" ? pos - minRequired : pos - matched;
+                    // console.log({ pos, matched, start, minRequired, maxRequired, direction });
+                }
+                else if (maxRequired < matched) {
+                    const posMin = pos - minRequired;
+                    const posMax = pos - matched;
+                    // console.log({ posMin, posMax, pos, minRequired, maxRequired, direction, matched });
+                    if (direction === "right" && posMin > start)
+                        start = posMin;
+                    if (direction === "left" && (posMax < start || start === -1))
+                        start = posMax;
+                }
+                matched = 0;
+            }
+            pos++;
+        }
+        if (
+        // eslint-disable-next-line no-loop-func --  https://eslint.org/docs/latest/rules/no-loop-func#known-limitations
+        requireMatched.some((rm) => rm === matched) &&
+            ((direction === "right" && pos - matched > start) ||
+                (direction === "left" && (pos - matched < start || start === -1)))) {
+            start = direction === "right" ? pos - minRequired : pos - matched;
+            // console.log({ pos, matched, start, minRequired, maxRequired, direction });
+        }
+        else if (maxRequired < matched) {
+            const posMin = pos - minRequired;
+            const posMax = pos - matched;
+            // console.log({ posMin, posMax, pos, minRequired, maxRequired, direction, matched });
+            if (direction === "right" && posMin > start)
+                start = posMin;
+            if (direction === "left" && (posMax < start || start === -1))
+                start = posMax;
+        }
+        pos = 0;
+        matched = 0;
+    }
+    return start;
+}
+function processShiftContent(state, shift, marks) {
+    const { from, to } = state.selection.ranges[0];
+    const linePoint = state.lineBreak.codePointAt(0);
+    let pos = 0;
+    /** processing outer shifts */
+    const initialTextBefore = state.sliceDoc(from - shift, from);
+    let shiftBeforeOuter = 0;
+    pos = initialTextBefore.length - 1;
+    while (pos > -1) {
+        if (initialTextBefore.codePointAt(pos) === linePoint)
+            break;
+        shiftBeforeOuter++;
+        pos--;
+    }
+    const initialTextAfter = state.sliceDoc(to, to + shift);
+    let shiftAfterOuter = 0;
+    pos = 0;
+    while (pos < initialTextAfter.length) {
+        if (initialTextAfter.codePointAt(pos) === linePoint)
+            break;
+        shiftAfterOuter++;
+        pos++;
+    }
+    /** processing inner shifts */
+    const initialText = state.sliceDoc(from, to);
+    let shiftBeforeInner = 0;
+    pos = 0;
+    if (initialText.length > 1)
+        while (pos < initialText.length) {
+            // eslint-disable-next-line no-loop-func --  https://eslint.org/docs/latest/rules/no-loop-func#known-limitations
+            if (marks.some((m) => m === initialText.codePointAt(pos)))
+                shiftBeforeInner++;
+            else
+                break;
+            pos++;
+        }
+    const initialTextWithoutBeforeShift = initialText.substring(shiftBeforeInner + 1);
+    let shiftAfterInner = 0;
+    pos = initialTextWithoutBeforeShift.length - 1;
+    if (initialText.length > 1 || shiftBeforeInner > 0)
+        while (pos > -1) {
+            // eslint-disable-next-line no-loop-func --  https://eslint.org/docs/latest/rules/no-loop-func#known-limitations
+            if (marks.some((m) => m === initialTextWithoutBeforeShift.codePointAt(pos)))
+                shiftAfterInner++;
+            else
+                break;
+            pos--;
+        }
+    const text = state.sliceDoc(from - shiftBeforeOuter, to + shiftAfterOuter);
+    return {
+        from,
+        to,
+        shiftBeforeOuter,
+        shiftBeforeInner,
+        shiftAfterOuter,
+        shiftAfterInner,
+        text,
+    };
+}
+
 /**
  * t.processingInstruction, t.meta - # () []
  * t.url, t.link - links
@@ -125,6 +325,8 @@ function getHighlightTemplate(config) {
 const CLASSES = {
     listCommon: "cm-list-common",
     code: "cm-code",
+    codeBlockLine: "cm-code-block-line",
+    codeBlock: "cm-code-block",
     codeButton: "cm-code-button",
     codeButtonSuccess: "cm-code-button-success",
     codeButtonFail: "cm-code-button-fail",
@@ -198,6 +400,12 @@ function getThemeTemplate(dark, config) {
         [`.${CLASSES.mention}`]: {
             color: config.mentionColor,
         },
+        [`.${CLASSES.codeBlockLine}`]: {
+            borderColor: config.codeBlockBorderColor,
+        },
+        [`.${CLASSES.codeBlock}`]: {
+            background: config.codeBlockBackground,
+        },
     }, { dark });
 }
 
@@ -229,6 +437,8 @@ const THEME_CONFIG$1 = {
     mentionColor: "#8A5CF5",
     vimSelection: "#1A1919FF",
     vimSelectionFocused: "#2E4B4BFF",
+    codeBlockBorderColor: "#7b7e81",
+    codeBlockBackground: "#24292e",
 };
 function getDarkTheme({ dark }) {
     const highlightConfig = { ...HIGHLIGHT_CONFIG$1, ...(dark?.highlightConfig || {}) };
@@ -264,6 +474,8 @@ const THEME_CONFIG = {
     mentionColor: "#8A5CF5",
     vimSelection: "#d9d9d9",
     vimSelectionFocused: "#d7d4f0",
+    codeBlockBackground: "#e1e2e7",
+    codeBlockBorderColor: "##CCCCCDFF",
 };
 function getLightTheme({ light }) {
     const highlightConfig = { ...HIGHLIGHT_CONFIG, ...(light?.highlightConfig || {}) };
@@ -279,13 +491,135 @@ const initTheme = (options) => {
     return extensions;
 };
 
+const BOLD_MARK_STAR = "*".codePointAt(0);
+const BOLD_MARK_DASH = "_".codePointAt(0);
+const SHIFT = 2;
+const insertBoldMarker = ({ state, dispatch }) => {
+    const changes = [];
+    const { from, to } = state.selection.ranges[0];
+    if (from === to)
+        return true;
+    const { end, start, marked, originalText } = overlapMark({
+        marks: [BOLD_MARK_DASH, BOLD_MARK_STAR],
+        requireMatched: [SHIFT],
+        shift: SHIFT,
+        state,
+    });
+    if (marked) {
+        if (~start) {
+            changes.push({ from: start, to: start + SHIFT, insert: "" });
+        }
+        if (~end) {
+            changes.push({ from: end, to: end + SHIFT, insert: "" });
+        }
+    }
+    else {
+        const markedText = `**${originalText}**`;
+        changes.push({ from, to, insert: markedText });
+    }
+    saveDispatch(() => {
+        const startSelection = ~start ? start : from;
+        const endSelection = ~end ? end - (~start ? SHIFT : 0) : to - (~start ? SHIFT : 0);
+        dispatch(state.update({
+            changes,
+            selection: !marked
+                ? {
+                    anchor: from + SHIFT,
+                    head: to + SHIFT,
+                }
+                : {
+                    anchor: startSelection,
+                    head: endSelection,
+                },
+        }));
+    });
+    return true;
+};
+const boldKeymap = {
+    key: "Mod-b",
+    run: insertBoldMarker,
+};
+
+const ITALIC_MARK_STAR = "*".codePointAt(0);
+const ITALIC_MARK_DASH = "_".codePointAt(0);
+const SHIFT_COUPLE = 3;
+const SHIFT_ALONE = 1;
+const insertItalicMarker = ({ state, dispatch }) => {
+    const changes = [];
+    const { from, to } = state.selection.ranges[0];
+    if (from === to)
+        return true;
+    const { end, start, marked, originalText } = overlapMark({
+        marks: [ITALIC_MARK_STAR, ITALIC_MARK_DASH],
+        requireMatched: [SHIFT_ALONE, SHIFT_COUPLE],
+        shift: SHIFT_COUPLE,
+        state,
+    });
+    if (marked) {
+        if (~start) {
+            changes.push({ from: start, to: start + SHIFT_ALONE, insert: "" });
+        }
+        if (~end) {
+            changes.push({ from: end, to: end + SHIFT_ALONE, insert: "" });
+        }
+    }
+    else {
+        const markedText = `*${originalText}*`;
+        changes.push({ from, to, insert: markedText });
+    }
+    saveDispatch(() => {
+        const startSelection = ~start ? start : from;
+        const endSelection = ~end ? end - (~start ? SHIFT_ALONE : 0) : to - (~start ? SHIFT_ALONE : 0);
+        dispatch(state.update({
+            changes,
+            selection: !marked
+                ? {
+                    anchor: from + SHIFT_ALONE,
+                    head: to + SHIFT_ALONE,
+                }
+                : {
+                    anchor: startSelection,
+                    head: endSelection,
+                },
+        }));
+    });
+    return true;
+};
+const italicKeymap = {
+    key: "Mod-i",
+    run: insertItalicMarker,
+};
+
+const insertLinkWrapper = ({ state, dispatch }) => {
+    const changes = [];
+    const { from, to } = state.selection.ranges[0];
+    if (from === to)
+        return true;
+    const content = state.sliceDoc(from, to);
+    const wrapper = `[${content}]()`;
+    changes.push({ from, to, insert: wrapper });
+    saveDispatch(() => {
+        dispatch(state.update({
+            changes,
+            selection: {
+                anchor: to + 3,
+            },
+        }));
+    });
+    return true;
+};
+const linkKeymap = {
+    key: "Mod-k",
+    run: insertLinkWrapper,
+};
+
 let vimMode = false;
 let theme = "light";
 const initKeyMaps = async ({ onEnter, onEscape, multiCursorMode, keyMaps, defaultKeyMaps, theme: initialTheme, vimMode: initialVimMode, dark, light, }) => {
     vimMode = initialVimMode;
     theme = initialTheme;
     /** tab */
-    const keyBindings = [commands.indentWithTab];
+    const keyBindings = [commands.indentWithTab, boldKeymap, italicKeymap, linkKeymap];
     /** standard  */
     keyBindings.push(...commands.standardKeymap.map((keyMap) => {
         if (keyMap.key === "Enter" && onEnter) {
@@ -419,12 +753,12 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "._header_XFwV5{font-weight:700}._header_XFwV5._level_1_-KPph{font-size:2rem}._header_XFwV5._level_2_ecHlB{font-size:1.8rem}._header_XFwV5._level_3_SYcVr{font-size:1.6rem}._header_XFwV5._level_4_V3o5m{font-size:1.4rem}._header_XFwV5._level_5_I7eVk{font-size:1.3rem}._header_XFwV5._level_6_A3lbK{font-size:1.2rem}._bold_I8DT-{font-weight:700}._italic_72qBe{font-style:italic}._blockquote_Xq6O4{border-left:3px solid;margin-left:5px}._blockquote__inner_mjT0h{margin-left:1px;padding-left:5px;position:relative}._blockquote__inner_mjT0h:before{border-left:3px solid;content:\"\";height:140%;left:0;position:absolute;top:-3px}._blockquote__inner-deep_s6tNj{margin-left:5px}._strike-through_U64jP{text-decoration:line-through}._list_MHIjT._common_0GdDi{position:relative;visibility:hidden}._list_MHIjT._common_0GdDi:after{border-radius:100%;content:\"\";height:5px;left:0;position:absolute;top:50%;transform:translateY(-50%);visibility:visible;width:5px}._link_7U9wl{text-decoration:none;text-decoration:underline}._link__label_dHGGf{font-size:12px;position:relative;top:-4px}._image_KmBM8{display:inline-flex}._code__line_m3IiO{padding:5px;position:relative}._code__line_m3IiO,._code__single_hbMte{font-family:monospace}._code__button_WwYE-{background-color:transparent;border:none;border-radius:4px;box-shadow:none;cursor:pointer;min-width:30px;outline:none;padding:4px 10px;position:absolute;right:5px;top:5px;transition:all .3s ease;z-index:1}._code__button_WwYE-._pending_fgHgD:before{animation:_loading-btn--fade-in_8z5an .33s ease,_loading-btn--rotation_QaopN .66s linear 0s infinite;border:2px solid hsla(0,0%,100%,.33);border-radius:50%;border-top-color:#000;content:\"\";display:inline-block;height:10.5px;left:50%;position:absolute;top:50%;width:10.5px}._code__button_WwYE-._success_kUPnO:after{animation:_loading-btn--fade-in_8z5an .6s ease;border-color:currentcolor;border-style:solid;border-width:0 0 1px 1px;content:\"\";display:inline-block;height:7px;left:50%;position:absolute;top:50%;transform:translate(-50%,-75%) rotate(-45deg);width:11px}._code__button_WwYE-._fail_cOpap:after,._code__button_WwYE-._fail_cOpap:before{content:\" \";height:13px;left:50%;position:absolute;top:50%;width:1px}._code__button_WwYE-._fail_cOpap:before{transform:translate(-50%,-50%) rotate(45deg)}._code__button_WwYE-._fail_cOpap:after{transform:translate(-50%,-50%) rotate(-45deg)}@keyframes _loading-btn--fade-in_8z5an{0%{opacity:0}to{opacity:1}}@keyframes _loading-btn--rotation_QaopN{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}._code__span_iSCmj{opacity:1;transition:opacity .3s ease}._code__span_iSCmj._hide_uqpax{opacity:0}._horizontal_J1jU-{border-bottom:1px solid;margin:0 5px;position:relative;width:calc(100% - 10px)}._todo_m6MIP{align-items:flex-end;display:inline-flex;height:100%;padding-left:3px;padding-right:3px}._todo_m6MIP>input{margin:0}._todo__checked_kemjy{text-decoration:line-through}._mention_cpzik{font-weight:700}";
-const styles = {"header":"_header_XFwV5","level_1":"_level_1_-KPph","level_2":"_level_2_ecHlB","level_3":"_level_3_SYcVr","level_4":"_level_4_V3o5m","level_5":"_level_5_I7eVk","level_6":"_level_6_A3lbK","bold":"_bold_I8DT-","italic":"_italic_72qBe","blockquote":"_blockquote_Xq6O4","blockquote__inner":"_blockquote__inner_mjT0h","blockquote__inner-deep":"_blockquote__inner-deep_s6tNj","strike-through":"_strike-through_U64jP","list":"_list_MHIjT","common":"_common_0GdDi","link":"_link_7U9wl","link__label":"_link__label_dHGGf","image":"_image_KmBM8","code__line":"_code__line_m3IiO","code__single":"_code__single_hbMte","code__button":"_code__button_WwYE-","pending":"_pending_fgHgD","loading-btn--fade-in":"_loading-btn--fade-in_8z5an","loading-btn--rotation":"_loading-btn--rotation_QaopN","success":"_success_kUPnO","fail":"_fail_cOpap","code__span":"_code__span_iSCmj","hide":"_hide_uqpax","horizontal":"_horizontal_J1jU-","todo":"_todo_m6MIP","todo__checked":"_todo__checked_kemjy","mention":"_mention_cpzik"};
+var css_248z = "._header_XFwV5{font-weight:700}._header_XFwV5._level_1_-KPph{font-size:2em}._header_XFwV5._level_2_ecHlB{font-size:1.8em}._header_XFwV5._level_3_SYcVr{font-size:1.6em}._header_XFwV5._level_4_V3o5m{font-size:1.4em}._header_XFwV5._level_5_I7eVk{font-size:1.3em}._header_XFwV5._level_6_A3lbK{font-size:1.2em}._bold_I8DT-{font-weight:700}._italic_72qBe{font-style:italic}._blockquote_Xq6O4{border-left:3px solid;margin-left:5px}._blockquote__inner_mjT0h{margin-left:1px;padding-left:5px;position:relative}._blockquote__inner_mjT0h:before{border-left:3px solid;content:\"\";height:140%;left:0;position:absolute;top:-3px}._blockquote__inner-deep_s6tNj{margin-left:5px}._strike-through_U64jP{text-decoration:line-through}._list_MHIjT._common_0GdDi{position:relative;visibility:hidden}._list_MHIjT._common_0GdDi:after{border-radius:100%;content:\"\";height:5px;left:0;position:absolute;top:50%;transform:translateY(-50%);visibility:visible;width:5px}._link_7U9wl{text-decoration:none;text-decoration:underline}._link__label_dHGGf{font-size:12px;position:relative;top:-4px}._image_KmBM8{display:inline-flex}._code__line_m3IiO{padding:5px;position:relative}._code__line_m3IiO,._code__single_hbMte{font-family:monospace}._code__button_WwYE-{background-color:transparent;border:none;border-radius:4px;box-shadow:none;cursor:pointer;min-width:30px;outline:none;padding:4px 10px;position:absolute;right:5px;top:5px;transition:all .3s ease;z-index:1}._code__button_WwYE-._pending_fgHgD:before{animation:_loading-btn--fade-in_8z5an .33s ease,_loading-btn--rotation_QaopN .66s linear 0s infinite;border:2px solid hsla(0,0%,100%,.33);border-radius:50%;border-top-color:#000;content:\"\";display:inline-block;height:10.5px;left:50%;position:absolute;top:50%;width:10.5px}._code__button_WwYE-._success_kUPnO:after{animation:_loading-btn--fade-in_8z5an .6s ease;border-color:currentcolor;border-style:solid;border-width:0 0 1px 1px;content:\"\";display:inline-block;height:7px;left:50%;position:absolute;top:50%;transform:translate(-50%,-75%) rotate(-45deg);width:11px}._code__button_WwYE-._fail_cOpap:after,._code__button_WwYE-._fail_cOpap:before{content:\" \";height:13px;left:50%;position:absolute;top:50%;width:1px}._code__button_WwYE-._fail_cOpap:before{transform:translate(-50%,-50%) rotate(45deg)}._code__button_WwYE-._fail_cOpap:after{transform:translate(-50%,-50%) rotate(-45deg)}@keyframes _loading-btn--fade-in_8z5an{0%{opacity:0}to{opacity:1}}@keyframes _loading-btn--rotation_QaopN{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}._code__span_iSCmj{opacity:1;transition:opacity .3s ease}._code__span_iSCmj._hide_uqpax{opacity:0}._code__block_JehA4{padding:1px 5px}._code__block_line_U7lcQ{border-left:1px solid;margin-left:5px}._horizontal_J1jU-{border-bottom:1px solid;margin:0 5px;position:relative;width:calc(100% - 10px)}._todo_m6MIP{align-items:flex-end;display:inline-flex;height:100%;padding-left:3px;padding-right:3px}._todo_m6MIP>input{margin:0}._todo__checked_kemjy{text-decoration:line-through}._mention_cpzik{font-weight:700}";
+const styles = {"header":"_header_XFwV5","level_1":"_level_1_-KPph","level_2":"_level_2_ecHlB","level_3":"_level_3_SYcVr","level_4":"_level_4_V3o5m","level_5":"_level_5_I7eVk","level_6":"_level_6_A3lbK","bold":"_bold_I8DT-","italic":"_italic_72qBe","blockquote":"_blockquote_Xq6O4","blockquote__inner":"_blockquote__inner_mjT0h","blockquote__inner-deep":"_blockquote__inner-deep_s6tNj","strike-through":"_strike-through_U64jP","list":"_list_MHIjT","common":"_common_0GdDi","link":"_link_7U9wl","link__label":"_link__label_dHGGf","image":"_image_KmBM8","code__line":"_code__line_m3IiO","code__single":"_code__single_hbMte","code__button":"_code__button_WwYE-","pending":"_pending_fgHgD","loading-btn--fade-in":"_loading-btn--fade-in_8z5an","loading-btn--rotation":"_loading-btn--rotation_QaopN","success":"_success_kUPnO","fail":"_fail_cOpap","code__span":"_code__span_iSCmj","hide":"_hide_uqpax","code__block":"_code__block_JehA4","code__block_line":"_code__block_line_U7lcQ","horizontal":"_horizontal_J1jU-","todo":"_todo_m6MIP","todo__checked":"_todo__checked_kemjy","mention":"_mention_cpzik"};
 styleInject(css_248z);
 
 const NAME_OF_BLOCKQUOTE_MARK = "QuoteMark";
-const CODE_OF_SPACE$1 = 32;
+const CODE_OF_SPACE$2 = " ".codePointAt(0);
 const CODE_OF_BLOCKQUOTE_MARK = 62; // >
 
 class BlockquoteWidget extends view.WidgetType {
@@ -456,7 +790,7 @@ function getBlockquoteDecorations({ decorations, node, view }) {
         while (pos >= 0) {
             pos--;
             const currentCode = content.charCodeAt(pos);
-            if (currentCode === CODE_OF_SPACE$1)
+            if (currentCode === CODE_OF_SPACE$2)
                 continue;
             if (currentCode === CODE_OF_BLOCKQUOTE_MARK) {
                 if (!isHasMark) {
@@ -492,7 +826,7 @@ function getBlockquoteSelectionDecorations({ decorations, node, view, forceActiv
         while (pos >= 0) {
             pos--;
             const currentCode = content.charCodeAt(pos);
-            if (currentCode === CODE_OF_SPACE$1)
+            if (currentCode === CODE_OF_SPACE$2)
                 continue;
             if (currentCode === CODE_OF_BLOCKQUOTE_MARK) {
                 if (!isHasMark) {
@@ -529,7 +863,7 @@ const blockquoteDecorationPlugin = {
 };
 
 const NAME_OF_BOLD = "StrongEmphasis";
-const LIST_OF_BOLD_MARKS = new Set([95, 42]); // _  *
+const LIST_OF_BOLD_MARKS = new Set(["_".codePointAt(0), "*".codePointAt(0)]);
 
 function getBoldDecorations({ decorations, node, view }) {
     if (node.name !== NAME_OF_BOLD) {
@@ -566,6 +900,8 @@ const boldDecorationPlugin = {
 
 const NAME_OF_FENCED_CODE = "FencedCode";
 const NAME_OF_INLINE_CODE = "InlineCode";
+const NAME_OF_BLOCK_CODE = "CodeBlock";
+const CODE_OF_SPACE$1 = " ".codePointAt(0);
 const CODE_OF_CODE_MARK = 96; // `
 
 class CodeWidget extends view.WidgetType {
@@ -731,8 +1067,39 @@ function getCodeSelectionDecorations({ decorations, node, view, forceActive, })
         decorations.push(getHideDecoration({ range: [endMarkPosition.from, endMarkPosition.to] }));
     }
 }
+function getCodeBlockDecorations({ decorations, node, view }) {
+    if (node.name !== NAME_OF_BLOCK_CODE)
+        return;
+    const lines = view.viewportLineBlocks.filter((line) => {
+        const isOverlap = isRangeOverlap([node.from, node.to], [line.from, line.to]);
+        return isOverlap;
+    });
+    lines.forEach((line) => {
+        const content = view.state.sliceDoc(line.from, line.to);
+        let startContent = 0;
+        let pos = 0;
+        while (pos < content.length) {
+            if (content.codePointAt(pos) === CODE_OF_SPACE$1) {
+                pos++;
+            }
+            else {
+                startContent = pos;
+                break;
+            }
+        }
+        decorations.push(getMarkDecoration({
+            range: [line.from + startContent, line.to],
+            style: clsx(styles.code__block, CLASSES.codeBlock),
+        }));
+        decorations.push(getLineDecoration({
+            range: [line.from],
+            style: clsx(styles.code__block_line, CLASSES.codeBlockLine),
+        }));
+    });
+}
 const codeDecorationPlugin = {
     selectionDecorations: [getCodeSelectionDecorations],
+    decorations: [getCodeBlockDecorations],
 };
 
 const NAME_OF_HEADER = "ATXHeading";
@@ -817,12 +1184,10 @@ const horizontalDecorationPlugin = {
 
 const openedImageEffect = state.StateEffect.define();
 const openedLinkEffect = state.StateEffect.define();
-const imageSrcGetterEffect = state.StateEffect.define();
 const markdownState = state.StateField.define({
     create() {
         return {
             openedImage: undefined,
-            imageSrcGetter: undefined,
             openedLink: undefined,
             uniqueId: randomString(10),
         };
@@ -832,8 +1197,6 @@ const markdownState = state.StateField.define({
         for (const effect of transaction.effects) {
             if (effect.is(openedImageEffect))
                 newValue.openedImage = effect.value;
-            if (effect.is(imageSrcGetterEffect))
-                newValue.imageSrcGetter = effect.value;
             if (effect.is(openedLinkEffect))
                 newValue.openedLink = effect.value;
         }
@@ -848,6 +1211,9 @@ const CODE_OF_START_IMAGE_URL = 40; // (
 const CODE_OF_END_IMAGE_URL = 41; // )
 
 const IMAGE_NODES = {};
+const INTERVAL_DELAY = 10000;
+const EXISTING_WIDGETS = new Set();
+let interval = null;
 class ImageWidget extends view.WidgetType {
     text;
     link;
@@ -880,6 +1246,7 @@ class ImageWidget extends view.WidgetType {
         if (!image)
             return false;
         delete IMAGE_NODES[this.key];
+        EXISTING_WIDGETS.delete(this.key);
         if (image.src !== widget.src)
             image.src = widget.src;
         if (image.alt !== widget.text)
@@ -889,13 +1256,15 @@ class ImageWidget extends view.WidgetType {
         this.from = widget.from;
         this.to = widget.to;
         this.registerListeners(image);
-        IMAGE_NODES[this.key] = image;
+        IMAGE_NODES[this.key] = container;
+        EXISTING_WIDGETS.add(this.key);
         return true;
     }
     updateDOM() {
         return true;
     }
     toDOM() {
+        EXISTING_WIDGETS.add(this.key);
         let container = IMAGE_NODES[this.key];
         let image = container?.image;
         if (image && container) {
@@ -920,11 +1289,12 @@ class ImageWidget extends view.WidgetType {
         }
         this.registerListeners(container);
         IMAGE_NODES[this.key] = container;
+        if (!interval)
+            interval = setInterval(garbageCollectorInterval, INTERVAL_DELAY);
         return container;
     }
-    destroy(dom) {
-        delete IMAGE_NODES[this.key];
-        dom.destroy?.();
+    destroy() {
+        EXISTING_WIDGETS.delete(this.key);
     }
     registerListeners(image) {
         image.clearListeners?.();
@@ -939,6 +1309,19 @@ class ImageWidget extends view.WidgetType {
         };
     }
 }
+/** for disable cache */
+function garbageCollectorInterval() {
+    for (const [key, node] of Object.entries(IMAGE_NODES)) {
+        if (EXISTING_WIDGETS.has(key) || !node)
+            continue;
+        delete IMAGE_NODES[key];
+        node.destroy?.();
+    }
+    if (Object.keys(IMAGE_NODES).length === 0 && interval) {
+        clearInterval(interval);
+        interval = null;
+    }
+}
 /** recursively find the link text node in line */
 function getTextNode$1(text, link, key, line) {
     if (!line)
@@ -981,6 +1364,28 @@ function isCorrectNode$1(text, link, node) {
 function selectLink$1({ link, node, selection, start }) {
     const startPosition = start ?? (node.textContent?.indexOf?.(link) || 0);
     const endPosition = startPosition + link.length;
+    if (startPosition === 0 && endPosition === 0) {
+        const content = node.textContent;
+        if (!content)
+            return;
+        let startPosition = 0;
+        let pos = 0;
+        while (pos < content.length) {
+            if (content.codePointAt(pos) !== CODE_OF_START_IMAGE_URL) {
+                pos++;
+            }
+            else {
+                startPosition = pos + 1;
+                break;
+            }
+        }
+        const range = document.createRange();
+        range.setStart(node, startPosition);
+        range.collapse(true);
+        selection.removeAllRanges();
+        selection.addRange(range);
+        return;
+    }
     const range = document.createRange();
     range.setStart(node, startPosition);
     range.setEnd(node, endPosition);
@@ -1026,18 +1431,17 @@ function handleClick$1(view, text, link, key, event) {
     return false;
 }
 
-function getImageDecorations({ decorations, node, view }) {
+function getImageDecorations({ decorations, node, view, settings }) {
     if (node.name !== NAME_OF_IMAGE) {
         return;
     }
     const { text, url } = parseInfo(view, node);
-    const imageSrcGetter = view.state.field(markdownState).imageSrcGetter;
     const uniqueId = view.state.field(markdownState).uniqueId;
     const line = view.lineBlockAt(node.from);
     const fullLine = line.from === node.from && line.to === node.to;
     decorations.push(getWidgetDecorationOptions({
         range: [node.to],
-        widget: new ImageWidget(text, url, node.from, node.to, uniqueId, fullLine, imageSrcGetter, view),
+        widget: new ImageWidget(text, url, node.from, node.to, uniqueId, fullLine, settings.imageSrcGetter, view),
     }));
 }
 function getImageSelectionDecorations({ decorations, node, view, forceActive, }) {
@@ -1115,12 +1519,12 @@ function getItalicDecorations({ decorations, node }) {
         range: [node.from, node.to],
     }));
 }
-function getItalicSelectionDecorations({ decorations, node, view, forceActive, }) {
+function getItalicSelectionDecorations({ decorations, node, view, forceActive, settings, }) {
     if (node.name !== NAME_OF_ITALIC) {
         return;
     }
-    if (checkIsSeveralEmphasis({ decorations, node, view, forceActive })) {
-        return void splitEmphasis({ decorations, node, view, forceActive });
+    if (checkIsSeveralEmphasis({ decorations, node, view, forceActive, settings })) {
+        return void splitEmphasis({ decorations, node, view, forceActive, settings });
     }
     let step = 1;
     const startText = view.state.doc.sliceString(node.from, node.from + 3);
@@ -1149,7 +1553,7 @@ function checkIsSeveralEmphasis({ node, view }) {
         return true;
     return false;
 }
-function splitEmphasis({ decorations, node, view, forceActive }) {
+function splitEmphasis({ decorations, node, view, forceActive, settings, }) {
     const text = view.state.doc.sliceString(node.from, node.to);
     let marks = 0;
     let pos = 0;
@@ -1163,12 +1567,14 @@ function splitEmphasis({ decorations, node, view, forceActive }) {
         view,
         node: { ...node, name: node.name, from: node.from, to: node.from + pos },
         forceActive,
+        settings,
     });
     getItalicSelectionDecorations({
         decorations,
         view,
         node: { ...node, name: node.name, from: node.from + pos, to: node.to },
         forceActive,
+        settings,
     });
 }
 const italicDecorationPlugin = {
@@ -1308,6 +1714,28 @@ function isCorrectNode(text, link, node) {
 function selectLink({ link, node, selection, start }) {
     const startPosition = start ?? (node.textContent?.indexOf?.(link) || 0);
     const endPosition = startPosition + link.length;
+    if (startPosition === 0 && endPosition === 0) {
+        const content = node.textContent;
+        if (!content)
+            return;
+        let startPosition = 0;
+        let pos = 0;
+        while (pos < content.length) {
+            if (content.codePointAt(pos) !== CODE_OF_START_LINK_URL) {
+                pos++;
+            }
+            else {
+                startPosition = pos + 1;
+                break;
+            }
+        }
+        const range = document.createRange();
+        range.setStart(node, startPosition);
+        range.collapse(true);
+        selection.removeAllRanges();
+        selection.addRange(range);
+        return;
+    }
     const range = document.createRange();
     range.setStart(node, startPosition);
     range.setEnd(node, endPosition);
@@ -1360,7 +1788,7 @@ function handleClick(view, text, link, key, event) {
     return false;
 }
 
-function getLinkSelectionDecorations({ decorations, node, view, forceActive, }) {
+function getLinkSelectionDecorations({ decorations, node, view, forceActive, settings, }) {
     if (node.name !== NAME_OF_LINK) {
         return;
     }
@@ -1387,7 +1815,7 @@ function getLinkSelectionDecorations({ decorations, node, view, forceActive, })
             urlCoordinates.to = pos;
     }
     if (urlCoordinates.from === -1 || urlCoordinates.to === -1)
-        return void getLinkLabelSelectionDecoration({ decorations, forceActive, node, view });
+        return void getLinkLabelSelectionDecoration({ decorations, forceActive, node, view, settings });
     const text = content.substring(textCoordinates.from, textCoordinates.to);
     const url = content.substring(urlCoordinates.from, urlCoordinates.to);
     const openedLink = view.state.field(markdownState).openedLink;
@@ -1519,8 +1947,9 @@ const listDecorationPlugin = {
     selectionDecorations: [getListSelectionDecorations],
 };
 
-const CODE_OF_START_MENTION = 64; // @
-const CODE_OF_SPACE = 32;
+const CODE_OF_START_MENTION = "@".codePointAt(0); // @
+const CODE_OF_SPACE = " ".codePointAt(0);
+const CODE_OF_LINE_BREAK = "\n".codePointAt(0);
 const NAME_OF_MENTION = "Mention";
 
 function getMentionDecorations({ decorations, node }) {
@@ -1693,7 +2122,7 @@ const SKIP_MARKS = new Set([
     "HeaderMark",
     "TaskMarker",
 ]);
-function createDecorationsGetter() {
+function createDecorationsGetter(settings) {
     let markdownDecorationsCache = [];
     let markdownSelectionDecorationsCache = [];
     function getDecorations(view$1, isChanged, mouseReleased) {
@@ -1714,7 +2143,7 @@ function createDecorationsGetter() {
                         return;
                     /** Decoration by change content */
                     if (processDecorations)
-                        decorationFunctions.forEach((f) => f({ decorations, node, view: view$1 }));
+                        decorationFunctions.forEach((f) => f({ decorations, node, view: view$1, settings }));
                     /** Decoration by selection content  */
                     if (processSelectionDecorations)
                         selectionDecorationFunctions.forEach((f) => f({
@@ -1722,6 +2151,7 @@ function createDecorationsGetter() {
                             node,
                             view: view$1,
                             forceActive: isReadonly,
+                            settings,
                         }));
                 },
             });
@@ -1736,7 +2166,7 @@ function createDecorationsGetter() {
     }
     return getDecorations;
 }
-const markdownDecorationPlugin = (stateConfig) => {
+const markdownDecorationPlugin = (settings) => {
     return view.ViewPlugin.fromClass(class DecorationMarkdown {
         decorations;
         mouseReleased = true;
@@ -1744,17 +2174,12 @@ const markdownDecorationPlugin = (stateConfig) => {
         view;
         decorationGetter;
         constructor(view) {
-            this.decorationGetter = createDecorationsGetter();
+            this.decorationGetter = createDecorationsGetter(settings);
             this.decorations = this.decorationGetter(view, true, this.mouseReleased);
             this.dom = view.dom;
             this.view = view;
             document.addEventListener("mousedown", this.onMouseDown.bind(this));
             document.addEventListener("mouseup", this.onMouseUp.bind(this));
-            saveDispatch(() => {
-                this.view.dispatch(this.view.state.update({
-                    effects: [imageSrcGetterEffect.of(stateConfig.imageSrcGetter)],
-                }));
-            });
         }
         update(update) {
             const isDocumentChanged = update.docChanged ||
@@ -1795,7 +2220,7 @@ async function InitSettings({ readonly, vimMode, }) {
     ];
 }
 
-const initExtensions = async ({ onBlur, onChange, onFocus, onEnter, onEscape, readonly = true, vimMode = false, multiCursorText, provider, theme = "light", dark, light, languages, keyMaps, defaultKeyMaps, imageSrcGetter, }) => {
+const initExtensions = async ({ onBlur, onChange, onFocus, onEnter, onEscape, readonly = true, vimMode = false, multiCursorText, provider, theme = "light", dark, light, languages, keyMaps, defaultKeyMaps, imageSrcGetter, autoCompleteTagOptions, autoCompleteConfig, }) => {
     const multiCursorMode = Boolean(multiCursorText && provider);
     const asyncPlugins = await Promise.all([
         InitSettings({ readonly, vimMode }),
@@ -1811,10 +2236,11 @@ const initExtensions = async ({ onBlur, onChange, onFocus, onEnter, onEscape, re
             light,
         }),
         new Promise((resolve) => {
-            void Promise.resolve().then(() => require('./index-DXevyHeZ.js')).then(({ initMarkdown }) => {
+            void Promise.resolve().then(() => require('./index-CXENq_0E.js')).then(({ initMarkdown }) => {
                 resolve(initMarkdown({ languages, imageSrcGetter }));
             });
         }),
+        initAutoComplete({ autoCompleteConfig, autoCompleteTagOptions }),
     ]);
     const extensions = [
         ...asyncPlugins,
@@ -2006,10 +2432,11 @@ class Editor {
     };
 }
 
+exports.CODE_OF_LINE_BREAK = CODE_OF_LINE_BREAK;
 exports.CODE_OF_SPACE = CODE_OF_SPACE;
 exports.CODE_OF_START_MENTION = CODE_OF_START_MENTION;
 exports.Editor = Editor;
 exports.NAME_OF_MENTION = NAME_OF_MENTION;
 exports.markdownDecorationPlugin = markdownDecorationPlugin;
 exports.markdownState = markdownState;
-//# sourceMappingURL=index-nRNnOuav.js.map
+//# sourceMappingURL=index-Dj0jRUGF.js.map