@milkdown/crepe 7.5.0 → 7.5.1

package/lib/esm/{index-i79QMXpJ.js → index-Xzdc2jbA.js}

@@ -1,29 +1,5 @@
-import { w as withMeta, c as chevronDownIcon, s as searchIcon, a as clearIcon } from './todoList-M-PGJKde.js';
-import { html, c, useHost, useRef, useState, useMemo, useEffect, useLayoutEffect, h } from 'atomico';
-import { $ as $ctx, c as codeBlockSchema } from './index-LAdX6LsO.js';
-import { d as defIfNotExists } from './helper-wZAtC67x.js';
-import { undo as undo$1, redo as redo$1 } from '@milkdown/prose/history';
-import { exitCode } from '@milkdown/prose/commands';
-import { TextSelection } from '@milkdown/prose/state';
-import { c as computePosition } from './floating-ui.dom-CAYjY8Gv.js';
-import { c as clsx } from './clsx-RxCLxYpD.js';
-import { $ as $view } from './_view-IlZC8FA6.js';
-
-const defaultConfig$1 = {
-  extensions: [],
-  languages: [],
-  expandIcon: () => "\u2B07",
-  searchIcon: () => "\u{1F50D}",
-  clearSearchIcon: () => "\u232B",
-  searchPlaceholder: "Search language",
-  noResultText: "No result",
-  renderLanguage: (language) => html`${language}`
-};
-const codeBlockConfig = $ctx(defaultConfig$1, "codeBlockConfigCtx");
-withMeta(codeBlockConfig, {
-  displayName: "Config<code-block>",
-  group: "CodeBlock"
-});
+import { codeBlockConfig, codeBlockComponent } from '@milkdown/kit/component/code-block';
+import { c as chevronDownIcon, s as searchIcon, a as clearIcon } from './todoList-9QsDDcmB.js';
 
 /**
 The data structure for documents. @nonabstract
@@ -14753,429 +14729,6 @@ function highlightActiveLineGutter() {
     return activeLineGutterHighlighter;
 }
 
-class CodeMirrorBlock {
-  constructor(node, view, getPos, loader, config) {
-    this.node = node;
-    this.view = view;
-    this.getPos = getPos;
-    this.loader = loader;
-    this.config = config;
-    this.updating = false;
-    this.languageName = "";
-    this.forwardUpdate = (update) => {
-      var _a;
-      if (this.updating || !this.cm.hasFocus)
-        return;
-      let offset = ((_a = this.getPos()) != null ? _a : 0) + 1;
-      const { main } = update.state.selection;
-      const selFrom = offset + main.from;
-      const selTo = offset + main.to;
-      const pmSel = this.view.state.selection;
-      if (update.docChanged || pmSel.from !== selFrom || pmSel.to !== selTo) {
-        const tr = this.view.state.tr;
-        update.changes.iterChanges((fromA, toA, fromB, toB, text) => {
-          if (text.length)
-            tr.replaceWith(offset + fromA, offset + toA, this.view.state.schema.text(text.toString()));
-          else tr.delete(offset + fromA, offset + toA);
-          offset += toB - fromB - (toA - fromA);
-        });
-        tr.setSelection(TextSelection.create(tr.doc, selFrom, selTo));
-        this.view.dispatch(tr);
-      }
-    };
-    this.codeMirrorKeymap = () => {
-      const view = this.view;
-      return [
-        { key: "ArrowUp", run: () => this.maybeEscape("line", -1) },
-        { key: "ArrowLeft", run: () => this.maybeEscape("char", -1) },
-        { key: "ArrowDown", run: () => this.maybeEscape("line", 1) },
-        { key: "ArrowRight", run: () => this.maybeEscape("char", 1) },
-        {
-          key: "Mod-Enter",
-          run: () => {
-            if (!exitCode(view.state, view.dispatch))
-              return false;
-            view.focus();
-            return true;
-          }
-        },
-        { key: "Mod-z", run: () => undo$1(view.state, view.dispatch) },
-        { key: "Shift-Mod-z", run: () => redo$1(view.state, view.dispatch) },
-        { key: "Mod-y", run: () => redo$1(view.state, view.dispatch) },
-        {
-          key: "Backspace",
-          run: () => {
-            var _a;
-            const ranges = this.cm.state.selection.ranges;
-            if (ranges.length > 1)
-              return false;
-            const selection = ranges[0];
-            if (selection && (!selection.empty || selection.anchor > 0))
-              return false;
-            if (this.cm.state.doc.lines >= 2)
-              return false;
-            const state = this.view.state;
-            const pos = (_a = this.getPos()) != null ? _a : 0;
-            const tr = state.tr.replaceWith(pos, pos + this.node.nodeSize, state.schema.nodes.paragraph.createChecked({}, this.node.content));
-            tr.setSelection(TextSelection.near(tr.doc.resolve(pos)));
-            this.view.dispatch(tr);
-            this.view.focus();
-            return true;
-          }
-        }
-      ];
-    };
-    this.maybeEscape = (unit, dir) => {
-      var _a;
-      const { state } = this.cm;
-      let main = state.selection.main;
-      if (!main.empty)
-        return false;
-      if (unit === "line")
-        main = state.doc.lineAt(main.head);
-      if (dir < 0 ? main.from > 0 : main.to < state.doc.length)
-        return false;
-      const targetPos = ((_a = this.getPos()) != null ? _a : 0) + (dir < 0 ? 0 : this.node.nodeSize);
-      const selection = TextSelection.near(this.view.state.doc.resolve(targetPos), dir);
-      const tr = this.view.state.tr.setSelection(selection).scrollIntoView();
-      this.view.dispatch(tr);
-      this.view.focus();
-      return true;
-    };
-    this.setLanguage = (language) => {
-      var _a;
-      this.view.dispatch(
-        this.view.state.tr.setNodeAttribute((_a = this.getPos()) != null ? _a : 0, "language", language)
-      );
-    };
-    this.getAllLanguages = () => {
-      return this.loader.getAll();
-    };
-    this.languageConf = new Compartment();
-    this.readOnlyConf = new Compartment();
-    this.cm = new EditorView({
-      doc: this.node.textContent,
-      root: this.view.root,
-      extensions: [
-        this.readOnlyConf.of(EditorState.readOnly.of(!this.view.editable)),
-        keymap.of(this.codeMirrorKeymap()),
-        this.languageConf.of([]),
-        ...config.extensions,
-        EditorView.updateListener.of(this.forwardUpdate)
-      ]
-    });
-    this.dom = this.createDom();
-    this.updateLanguage();
-  }
-  createDom() {
-    const dom = document.createElement("milkdown-code-block");
-    dom.codemirror = this.cm;
-    dom.getAllLanguages = this.getAllLanguages;
-    dom.setLanguage = this.setLanguage;
-    dom.isEditorReadonly = () => !this.view.editable;
-    const {
-      languages,
-      extensions,
-      ...viewConfig
-    } = this.config;
-    dom.config = viewConfig;
-    return dom;
-  }
-  updateLanguage() {
-    const languageName = this.node.attrs.language;
-    if (languageName === this.languageName)
-      return;
-    this.dom.language = languageName;
-    const language = this.loader.load(languageName != null ? languageName : "");
-    language.then((lang) => {
-      if (lang) {
-        this.cm.dispatch({
-          effects: this.languageConf.reconfigure(lang)
-        });
-        this.languageName = languageName;
-      }
-    });
-  }
-  setSelection(anchor, head) {
-    if (!this.cm.dom.isConnected)
-      return;
-    this.cm.focus();
-    this.updating = true;
-    this.cm.dispatch({ selection: { anchor, head } });
-    this.updating = false;
-  }
-  update(node) {
-    if (node.type !== this.node.type)
-      return false;
-    if (this.updating)
-      return true;
-    this.node = node;
-    this.updateLanguage();
-    if (this.view.editable === this.cm.state.readOnly) {
-      this.cm.dispatch({
-        effects: this.readOnlyConf.reconfigure(EditorState.readOnly.of(!this.view.editable))
-      });
-    }
-    const change = computeChange(this.cm.state.doc.toString(), node.textContent);
-    if (change) {
-      this.updating = true;
-      this.cm.dispatch({
-        changes: { from: change.from, to: change.to, insert: change.text }
-      });
-      this.updating = false;
-    }
-    return true;
-  }
-  selectNode() {
-    this.dom.selected = true;
-    this.cm.focus();
-  }
-  deselectNode() {
-    this.dom.selected = false;
-  }
-  stopEvent() {
-    return true;
-  }
-  destroy() {
-    this.cm.destroy();
-  }
-}
-function computeChange(oldVal, newVal) {
-  if (oldVal === newVal)
-    return null;
-  let start = 0;
-  let oldEnd = oldVal.length;
-  let newEnd = newVal.length;
-  while (start < oldEnd && oldVal.charCodeAt(start) === newVal.charCodeAt(start))
-    ++start;
-  while (oldEnd > start && newEnd > start && oldVal.charCodeAt(oldEnd - 1) === newVal.charCodeAt(newEnd - 1)) {
-    oldEnd--;
-    newEnd--;
-  }
-  return { from: start, to: oldEnd, text: newVal.slice(start, newEnd) };
-}
-
-class LanguageLoader {
-  constructor(languages) {
-    this.languages = languages;
-    this.map = {};
-    languages.forEach((language) => {
-      language.alias.forEach((alias) => {
-        this.map[alias] = language;
-      });
-    });
-  }
-  getAll() {
-    return this.languages.map((language) => {
-      return {
-        name: language.name,
-        alias: language.alias
-      };
-    });
-  }
-  load(languageName) {
-    const languageMap = this.map;
-    const language = languageMap[languageName.toLowerCase()];
-    if (!language)
-      return Promise.resolve(void 0);
-    if (language.support)
-      return Promise.resolve(language.support);
-    return language.load();
-  }
-}
-
-const codeComponent = ({
-  selected = false,
-  codemirror,
-  getAllLanguages,
-  setLanguage,
-  language,
-  config,
-  isEditorReadonly
-}) => {
-  var _a, _b, _c;
-  const host = useHost();
-  const triggerRef = useRef();
-  const pickerRef = useRef();
-  const [filter, setFilter] = useState("");
-  const [showPicker, setShowPicker] = useState(false);
-  const root = useMemo(() => host.current.getRootNode(), [host]);
-  useEffect(() => {
-    var _a2;
-    const lang = (_a2 = getAllLanguages == null ? void 0 : getAllLanguages()) == null ? void 0 : _a2.find((languageInfo) => languageInfo.alias.some((alias) => alias.toLowerCase() === (language == null ? void 0 : language.toLowerCase())));
-    if (lang && lang.name !== language)
-      setLanguage == null ? void 0 : setLanguage(lang.name);
-  }, [language]);
-  useEffect(() => {
-    setShowPicker(false);
-  }, [language]);
-  useEffect(() => {
-    const clickHandler = (e) => {
-      const target = e.target;
-      if (triggerRef.current && triggerRef.current.contains(target))
-        return;
-      const picker = pickerRef.current;
-      if (!picker)
-        return;
-      if (picker.dataset.expanded !== "true")
-        return;
-      if (!picker.contains(target))
-        setShowPicker(false);
-    };
-    root.addEventListener("click", clickHandler);
-    return () => {
-      root.removeEventListener("click", clickHandler);
-    };
-  }, []);
-  useLayoutEffect(() => {
-    setFilter("");
-    const picker = triggerRef.current;
-    const languageList = pickerRef.current;
-    if (!picker || !languageList)
-      return;
-    computePosition(picker, languageList, {
-      placement: "bottom-start"
-    }).then(({ x, y }) => {
-      Object.assign(languageList.style, {
-        left: `${x}px`,
-        top: `${y}px`
-      });
-    });
-  }, [showPicker]);
-  const languages = useMemo(() => {
-    var _a2;
-    if (!showPicker)
-      return [];
-    const all = (_a2 = getAllLanguages == null ? void 0 : getAllLanguages()) != null ? _a2 : [];
-    const selected2 = all.find((languageInfo) => languageInfo.name.toLowerCase() === (language == null ? void 0 : language.toLowerCase()));
-    const filtered = all.filter((languageInfo) => {
-      return (languageInfo.name.toLowerCase().includes(filter.toLowerCase()) || languageInfo.alias.some((alias) => alias.toLowerCase().includes(filter.toLowerCase()))) && languageInfo !== selected2;
-    });
-    if (filtered.length === 0)
-      return [];
-    if (!selected2)
-      return filtered;
-    return [selected2, ...filtered];
-  }, [filter, showPicker, language]);
-  const changeFilter = (e) => {
-    const target = e.target;
-    setFilter(target.value);
-  };
-  const onTogglePicker = (e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    if (isEditorReadonly == null ? void 0 : isEditorReadonly())
-      return;
-    setShowPicker((show) => {
-      return !show;
-    });
-  };
-  const onClear = (e) => {
-    e.preventDefault();
-    setFilter("");
-  };
-  const onSearchKeydown = (e) => {
-    if (e.key === "Escape")
-      setFilter("");
-  };
-  const onListKeydown = (e) => {
-    if (e.key === "Enter") {
-      const active = document.activeElement;
-      if (active instanceof HTMLElement && active.dataset.language)
-        setLanguage == null ? void 0 : setLanguage(active.dataset.language);
-    }
-  };
-  const renderedLanguageList = useMemo(() => {
-    if (!(languages == null ? void 0 : languages.length))
-      return html`<li class="language-list-item no-result">${config == null ? void 0 : config.noResultText}</li>`;
-    return languages.map(
-      (languageInfo) => {
-        var _a2;
-        return html`<li
-        role="listitem"
-        tabindex="0"
-        class="language-list-item"
-        aria-selected=${languageInfo.name.toLowerCase() === (language == null ? void 0 : language.toLowerCase())}
-        data-language=${languageInfo.name}
-        onclick=${() => setLanguage == null ? void 0 : setLanguage(languageInfo.name)}
-      >
-        ${(_a2 = config == null ? void 0 : config.renderLanguage) == null ? void 0 : _a2.call(config, languageInfo.name, languageInfo.name.toLowerCase() === (language == null ? void 0 : language.toLowerCase()))}
-      </li>`;
-      }
-    );
-  }, [languages]);
-  return html`<host class=${clsx(selected && "selected")}>
-    <div class="tools">
-      <button
-        ref=${triggerRef}
-        class="language-button"
-        onpointerdown=${onTogglePicker}
-        data-expanded=${showPicker}
-      >
-        ${language || "Text"}
-        <div class="expand-icon">
-          ${(_a = config == null ? void 0 : config.expandIcon) == null ? void 0 : _a.call(config)}
-        </div>
-      </button>
-      <div ref=${pickerRef} data-expanded=${showPicker} class=${clsx("language-picker", showPicker && "show")}>
-        <div class="list-wrapper">
-          <div class="search-box">
-            <div class="search-icon">
-              ${(_b = config == null ? void 0 : config.searchIcon) == null ? void 0 : _b.call(config)}
-            </div>
-            <input
-              class="search-input"
-              placeholder=${config == null ? void 0 : config.searchPlaceholder}
-              value=${filter}
-              oninput=${changeFilter}
-              onkeydown=${onSearchKeydown}
-            />
-            <div class=${clsx("clear-icon", filter.length === 0 && "hidden")} onmousedown=${onClear}>
-              ${(_c = config == null ? void 0 : config.clearSearchIcon) == null ? void 0 : _c.call(config)}
-            </div>
-          </div>
-          <ul class="language-list" role="listbox" onkeydown=${onListKeydown}>
-            ${renderedLanguageList}
-          </ul>
-        </div>
-      </div>
-    </div>
-    <div class="codemirror-host">${h(codemirror == null ? void 0 : codemirror.dom, {})}</div>
-  </host>`;
-};
-codeComponent.props = {
-  selected: Boolean,
-  codemirror: Object,
-  language: String,
-  getAllLanguages: Function,
-  setLanguage: Function,
-  isEditorReadonly: Function,
-  config: Object
-};
-const CodeElement = c(codeComponent);
-
-defIfNotExists("milkdown-code-block", CodeElement);
-const codeBlockView = $view(codeBlockSchema.node, (ctx) => {
-  const config = ctx.get(codeBlockConfig.key);
-  const languageLoader = new LanguageLoader(config.languages);
-  return (node, view, getPos) => new CodeMirrorBlock(
-    node,
-    view,
-    getPos,
-    languageLoader,
-    config
-  );
-});
-withMeta(codeBlockView, {
-  displayName: "NodeView<code-block>",
-  group: "CodeBlock"
-});
-
-const codeBlockComponent = [
-  codeBlockView,
-  codeBlockConfig
-];
-
 /**
 The default maximum length of a `TreeBuffer` node.
 */
@@ -25617,11 +25170,11 @@ const defineFeature = (editor, config = {}) => {
       theme
     } = config;
     if (!languages) {
-      const { languages: langList } = await import('./index-6GrVnloh.js');
+      const { languages: langList } = await import('./index-2I_xbjAZ.js');
       languages = langList;
     }
     if (!theme) {
-      const { nord } = await import('./index-Vl0W0S3h.js');
+      const { nord } = await import('./index-ftnOhuRS.js');
       theme = nord;
     }
     ctx.update(codeBlockConfig.key, (defaultConfig) => {
@@ -25646,9 +25199,9 @@ const defineFeature = (editor, config = {}) => {
 };
 
 var index = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  defineFeature: defineFeature
+   __proto__: null,
+   defineFeature: defineFeature
 });
 
 export { languageDataProp as A, foldService as B, CompletionContext as C, ParseContext as D, EditorView as E, NodeWeakMap as F, snippetCompletion as G, HighlightStyle as H, IterMode as I, bracketMatchingHandle as J, DefaultBufferLength as K, LanguageDescription as L, sublanguageProp as M, NodeType as N, index as O, Parser as P, StreamLanguage as S, Tag as T, LanguageSupport as a, styleTags as b, continuedIndent as c, LRLanguage as d, ifNotIn as e, foldNodeProp as f, completeFromList as g, syntaxTree as h, indentNodeProp as i, flatIndent as j, delimitedIndent as k, foldInside as l, EditorSelection as m, NodeProp as n, NodeSet as o, parseMixed as p, Tree as q, countColumn as r, syntaxHighlighting as s, tags as t, Prec as u, keymap as v, EditorState as w, Language as x, indentUnit as y, defineLanguageFacet as z };
-//# sourceMappingURL=index-i79QMXpJ.js.map
+//# sourceMappingURL=index-Xzdc2jbA.js.map