Revert preview folding

This reverts commit 2420142. Revert "[#66012] Empty array fallback for null foldedLines" This reverts commit 0553955. Revert "[#64933] show fold arrows on hover" This reverts commit 1d0c461. [#64933] rev Revert "[#64933] do not use visibleRanges for folding" This reverts commit 3686ce9. Revert "[#64933] fix text.refresh" This reverts commit 96f43d9. Revert "[#64933] account for folding in source mapping" This reverts commit 1f39e05. Revert "[#64933] fix unfold button positioning" This reverts commit 2ba65cd. [#64933] simplify Revert "[#64933] fix indicator zindex" This reverts commit dc9db5f. Revert "[#64933] clear lineMap before render" This reverts commit 3216180. Revert "[#64933] make fenceFold service more configurable" This reverts commit 4fb0824. Revert "[#64933] fix folding fenced blocks" This reverts commit e0068e7. Revert "[#64933] place unfold dots button at the end of a line" This reverts commit d63512e. [#64933] rev information codemirror Revert "[#64933] use toggleFold" This reverts commit 472871d. [#64933] rev initial folding [#64933] rev mutlitlne Revert "[#64933] simplify getting unfolded markdown" This reverts commit 191a2b1. Revert "[#64933] fix update checks" This reverts commit f8f3666. [#64933] rev Revert "[#64933] fix headings" This reverts commit 78f4d10. Revert "[#64933] fix lists" This reverts commit c1bc868. Revert "[#64933] keep closing line of code blocks unfolded" This reverts commit c57cf46. [#64933] rev [#64933] rev
antmicro · Sep 25, 2024 · 77769f7 · 77769f7
1 parent dad8dd8
commit 77769f7
Show file tree

Hide file tree

Showing 9 changed files with 25 additions and 309 deletions.
diff --git a/src/MystEditor.js b/src/MystEditor.js
@@ -11,7 +11,6 @@ import { EditorTopbar } from "./components/Topbar";
 import useCollaboration from "./hooks/useCollaboration";
 import useComments from "./hooks/useComments";
 import ResolvedComments from "./components/Resolved";
-import { handlePreviewFold } from "./hooks/markdownFoldButtons";
 import { handlePreviewClickToScroll } from "./extensions/syncDualPane";
 
 if (!window.myst_editor?.isFresh) {
@@ -233,7 +232,6 @@ const MystEditor = ({
               ref=${preview}
               mode=${mode}
               onClick=${(ev) => {
-                handlePreviewFold(ev, text.lineMap);
                 handlePreviewClickToScroll(ev, text.lineMap, preview);
               }}
               ><${PreviewFocusHighlight} className="cm-previewFocus" /><//

diff --git a/src/components/CodeMirror.js b/src/components/CodeMirror.js
@@ -3,7 +3,7 @@ import { html } from "htm/preact";
 import { EditorView } from "codemirror";
 import { EditorState } from "@codemirror/state";
 import styled from "styled-components";
-import { ExtensionBuilder, skipAndFoldAll, folded } from "../extensions";
+import { ExtensionBuilder, skipAndFoldAll } from "../extensions";
 import { YCommentsParent } from "../components/Comment";
 import commentIcon from "../icons/comment.svg?raw";
 import { customHighlighter } from "../extensions/customHighlights";
@@ -229,7 +229,7 @@ const CodeMirror = ({ text, id, root, mode, spellcheckOpts, highlights, collabor
         .if(collaboration.opts.commentsEnabled, (b) =>
           b.useComments({ ycomments: collaboration.ycomments }).useSuggestionPopup({ ycomments: collaboration.ycomments, editorMountpoint }),
         )
-        .addUpdateListener((update) => (update.docChanged || folded(update)) && text.set(view.state.doc.toString(), update))
+        .addUpdateListener((update) => update.docChanged && text.set(view.state.doc.toString(), update))
         .useFixFoldingScroll(focusScroll)
         .useMoveCursorAfterFold()
         .useCursorIndicator({ lineMap: text.lineMap, preview })

diff --git a/src/components/Preview.js b/src/components/Preview.js
@@ -3,7 +3,6 @@ import styled from "styled-components";
 const Preview = styled.div`
   background-color: white;
   padding: 20px;
-  padding-left: 40px;
   box-sizing: border-box;
   height: 100%;
   border: 1px solid var(--gray-400);
@@ -105,7 +104,6 @@ const Preview = styled.div`
   pre {
     white-space: pre-wrap;
     padding: 16px;
-    max-width: calc(100% - 40px) !important;
     & > code {
       padding: 0px;
     }
@@ -116,7 +114,6 @@ const Preview = styled.div`
   }
   aside {
     border-radius: var(--border-radius);
-    max-width: 100% !important;
 
     &.admonition {
       border: var(--border-2) solid var(--green-500);
@@ -337,8 +334,6 @@ const Preview = styled.div`
 
   .cm-previewFocus {
     display: ${(props) => (props.mode === "Both" ? "block" : "none")};
-    z-index: 1;
-    pointer-events: none;
   }
 
   .mermaid {
@@ -347,67 +342,6 @@ const Preview = styled.div`
     display: flex;
     justify-content: center;
   }
-
-  *:has(.fold) {
-    position: relative;
-    max-width: max-content;
-  }
-
-  .fold-arrow {
-    position: absolute;
-    font-size: inherit;
-    transform: translate(-25px);
-    cursor: pointer;
-    background: transparent;
-    border: none;
-    padding: 0;
-    padding-right: 25px;
-    opacity: 0;
-
-    &:hover {
-      opacity: 1;
-    }
-
-    span {
-      font-size: initial;
-    }
-  }
-
-  *:hover > .fold-arrow:first-child {
-    opacity: 1;
-  }
-
-  .fold-arrow:has(*:hover) {
-    opacity: 1;
-  }
-
-  li > .fold-arrow {
-    transform: translate(-42px);
-  }
-
-  .fold-dots {
-    background-color: rgb(238, 238, 238);
-    border: 1px solid rgb(221, 221, 221);
-    color: rgb(136, 136, 136);
-    border-radius: 0.2rem;
-    margin: 0;
-    padding: 0 1px;
-    cursor: pointer;
-    position: absolute;
-    right: -23px;
-    top: 50%;
-    transform: translateY(-50%);
-  }
-
-  .unfold {
-    opacity: 1;
-
-    span {
-      rotate: -90deg;
-      transform: translateY(-3px);
-      display: inline-block;
-    }
-  }
 `;
 Preview.defaultProps = { className: "myst-preview" };
 

diff --git a/src/extensions/index.js b/src/extensions/index.js
@@ -12,7 +12,6 @@ import { suggestionPopup } from "./suggestions";
 import { foldEffect, unfoldEffect, foldable } from "@codemirror/language";
 import { syncPreviewWithCursor } from "./syncDualPane";
 import { cursorIndicator } from "./cursorIndicator";
-import { customCommonMark, fenceFold, headerIndent } from "./markdownLang";
 
 const basicSetupWithoutHistory = basicSetup.filter((_, i) => i != 3);
 const minimalSetupWithoutHistory = minimalSetup.filter((_, i) => i != 1);
@@ -50,14 +49,7 @@ export class ExtensionBuilder {
   }
 
   static defaultPlugins() {
-    return [
-      EditorView.lineWrapping,
-      markdown({ base: customCommonMark }),
-      highlightActiveLine(),
-      headerIndent,
-      fenceFold,
-      keymap.of([indentWithTab, { key: "Mod-Z", run: redo }]),
-    ];
+    return [EditorView.lineWrapping, markdown(), highlightActiveLine(), keymap.of([indentWithTab, { key: "Mod-Z", run: redo }])];
   }
 
   disable(keys) {

diff --git a/src/extensions/markdownLang.js b/src/extensions/markdownLang.js
diff --git a/src/hooks/markdownFoldButtons.js b/src/hooks/markdownFoldButtons.js
diff --git a/src/hooks/markdownSourceMap.js b/src/hooks/markdownSourceMap.js
@@ -1,21 +1,11 @@
 import markdownIt from "markdown-it";
 import { escapeHtml } from "markdown-it/lib/common/utils";
 
-export const SRC_LINE_ID = "data-line-id";
+const SRC_LINE_ID = "data-line-id";
 const randomLineId = () => Math.random().toString().replace(".", "");
 
-function getLineForToken(token, env) {
-  let line = token.map[0] + env.startLine - (env.chunkId !== 0);
-  for (const range of env.foldedLines ?? []) {
-    if (range.start > line) break;
-
-    line += range.end - range.start + 1;
-  }
-  return line;
-}
-
 /** @param {markdownIt} md  */
-export default function markdownSourceMap(md, transform = (token, out, env) => out) {
+export default function markdownSourceMap(md) {
   md.use(overrideDefaultDirectives);
   md.use(overrideDefaultRole);
   md.use(wrapTextInSpan);
@@ -33,11 +23,11 @@ export default function markdownSourceMap(md, transform = (token, out, env) => o
 
   for (const rule of overrideRules) {
     const temp = md.renderer.rules[rule];
-    md.renderer.rules[rule] = addLineNumberToTokens(temp, transform);
+    md.renderer.rules[rule] = addLineNumberToTokens(temp);
   }
 }
 
-function addLineNumberToTokens(defaultRule, transform) {
+function addLineNumberToTokens(defaultRule) {
   /**
    * @param {import("markdown-it/index.js").Token[]} tokens
    * @param {number} idx
@@ -69,15 +59,15 @@ function addLineNumberToTokens(defaultRule, transform) {
         }
       }
     } else if (tokens[idx].map) {
-      const line = getLineForToken(tokens[idx], env);
+      const line = tokens[idx].map[0] + env.startLine - (env.chunkId !== 0);
       const id = randomLineId();
       if (!env.lineMap.current.has(line)) {
         env.lineMap.current.set(line, id);
         tokens[idx].attrSet(SRC_LINE_ID, id);
       }
     }
 
-    return transform(tokens[idx], rule(tokens, idx, options, env, self), env);
+    return rule(tokens, idx, options, env, self);
   };
 }
 
@@ -132,18 +122,14 @@ function wrapFencedLinesInSpan(/** @type {markdownIt} */ md) {
     }
 
     const sanitizedContent = escapeHtml(token.content);
-    const startLine = getLineForToken(token, env);
+    const startLine = token.map[0] + env.startLine - (env.chunkId !== 0);
     let htmlContent = sanitizedContent
       .split("\n")
       .filter((_, i, lines) => i !== lines.length - 1)
       .map((l, i) => {
         const id = randomLineId();
-        if (!env.lineMap.current.has(startLine + i + 1)) {
-          env.lineMap.current.set(startLine + i + 1, id);
-          return `<span ${SRC_LINE_ID}="${id}">${l}</span>`;
-        } else {
-          return `<span>${l}</span>`;
-        }
+        env.lineMap.current.set(startLine + i + 1, id);
+        return `<span ${SRC_LINE_ID}="${id}">${l}</span>`;
       })
       .join("\n");