Revert folding

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" /><//

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";
@@ -169,19 +169,6 @@ const CodeEditor = styled.div`
       transform: translateX(-11px);
     }
   }
-
-  .fold-arrow {
-    padding: 0 4px;
-    cursor: pointer;
-
-    &.unfold {
-      rotate: -90deg;
-    }
-  }
-
-  .cm-foldPlaceholder {
-    margin-left: 4px;
-  }
 `;
 
 const setEditorText = (editor, text) => {
@@ -238,12 +225,11 @@ const CodeMirror = ({ text, id, root, mode, spellcheckOpts, highlights, collabor
         .useHighlighter(highlights)
         .useCompartment(suggestionCompartment, customHighlighter([]))
         .useSpellcheck(spellcheckOpts)
-        .useFoldArrows()
         .if(collaboration.opts.enabled, (b) => b.useCollaboration({ ...collaboration, editorRef }))
         .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 })

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,68 +342,6 @@ const Preview = styled.div`
     display: flex;
     justify-content: center;
   }
-
-  *:has(.fold) {
-    position: relative;
-    max-width: max-content;
-  }
-
-  .fold-arrow {
-    position: absolute;
-    transform: translate(-25px, -50%);
-    cursor: pointer;
-    background: transparent;
-    border: none;
-    padding: 0;
-    padding-right: 25px;
-    top: 50%;
-    opacity: 0;
-
-    img {
-      max-width: unset;
-      height: unset;
-    }
-
-    &:hover {
-      opacity: 1;
-    }
-  }
-
-  *:hover > *:not(aside) > .fold-arrow,
-  aside:hover > .fold-arrow {
-    opacity: 1 !important;
-  }
-
-  li > * > .fold-arrow {
-    transform: translate(-42px, -50%);
-  }
-
-  aside > .fold-arrow {
-    transform: translate(-28px, -50%);
-    top: 20px;
-  }
-
-  .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;
-
-    img {
-      rotate: -90deg;
-    }
-  }
 `;
 Preview.defaultProps = { className: "myst-preview" };
 

src/extensions/index.js

@@ -9,17 +9,11 @@ import { customHighlighter } from "./customHighlights";
 import { commentExtension } from "../comments";
 import { commentAuthoring } from "../comments/lineAuthors";
 import { suggestionPopup } from "./suggestions";
-import { foldEffect, unfoldEffect, foldable, ensureSyntaxTree } from "@codemirror/language";
+import { foldEffect, unfoldEffect, foldable } from "@codemirror/language";
 import { syncPreviewWithCursor } from "./syncDualPane";
 import { cursorIndicator } from "./cursorIndicator";
-import { customCommonMark, fenceFold, headerIndent } from "./markdownLang";
-import { foldArrowGutter } from "../hooks/markdownFoldButtons";
-
-const basicExclude = [
-  3, // history
-  4, // default fold gutter
-];
-const basicSetupWithoutHistory = basicSetup.filter((_, i) => !basicExclude.includes(i));
+
+const basicSetupWithoutHistory = basicSetup.filter((_, i) => i != 3);
 const minimalSetupWithoutHistory = minimalSetup.filter((_, i) => i != 1);
 
 const getRelativeCursorLocation = (view) => {
@@ -55,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) {
@@ -215,20 +202,13 @@ export class ExtensionBuilder {
     return this;
   }
 
-  useFoldArrows() {
-    this.extensions.push(foldArrowGutter);
-    return this;
-  }
-
   create() {
     return [...this.important, ...this.base, ...this.extensions];
   }
 }
 
 /** This function folds all top level syntax nodes, while skiping a number of them defined by the `skip` parameter */
 export function skipAndFoldAll(/** @type {EditorView} */ view, skip = 0) {
-  ensureSyntaxTree(window.myst_editor.main_editor.state, view.state.doc.length, 5000);
-  view.dispatch({});
   let { state } = view;
   let effects = [];
   let nProcessedFoldables = 0;