@lvce-editor/editor-worker 19.60.1 → 19.60.2

package/dist/editorWorkerMain.js

@@ -1855,6 +1855,13 @@ const clamp = (num, min, max) => {
   return Math.min(Math.max(num, min), max);
 };
 
+const getScrollOffset = (deltaY, rowHeight) => {
+  return rowHeight > 0 ? deltaY % rowHeight : 0;
+};
+const getRenderedLineCount = (height, rowHeight, deltaY) => {
+  return height > 0 && rowHeight > 0 ? Math.ceil((height + getScrollOffset(deltaY, rowHeight)) / rowHeight) : 0;
+};
+
 const toMergeConflictActionsRow = rowIndex => ~rowIndex;
 const isMergeConflictActionsRow = viewRow => viewRow < 0;
 const getMergeConflictRowIndex = viewRow => ~viewRow;
@@ -2080,10 +2087,11 @@ const updateLayout = (editor, foldingRanges) => {
   const viewLineIndices = hasMergeConflictRows ? getViewLineIndices(lines.length, rowIndex => isRowHidden(rowIndex, foldingRanges), mergeConflicts) : [];
   const visibleLineCount = hasMergeConflictRows ? viewLineIndices.length : getVisibleLineCount(lines.length, foldingRanges);
   const finalY = Math.max(visibleLineCount - numberOfVisibleLines, 0);
-  const finalDeltaY = finalY * itemHeight;
+  const finalDeltaY = Math.max(visibleLineCount * itemHeight - height, 0);
   const deltaY = clamp(editor.deltaY, 0, finalDeltaY);
   const startVisualRow = Math.floor(deltaY / itemHeight);
-  const visibleViewLineIndices = hasMergeConflictRows ? getVisibleViewLineIndices(viewLineIndices, startVisualRow, numberOfVisibleLines) : getViewportLineIndices(lines.length, foldingRanges, startVisualRow, numberOfVisibleLines);
+  const renderedLineCount = getRenderedLineCount(height, itemHeight, deltaY);
+  const visibleViewLineIndices = hasMergeConflictRows ? getVisibleViewLineIndices(viewLineIndices, startVisualRow, renderedLineCount) : getViewportLineIndices(lines.length, foldingRanges, startVisualRow, renderedLineCount);
   const visibleLineIndices = hasMergeConflictRows ? getVisibleLineIndices(visibleViewLineIndices) : visibleViewLineIndices;
   const minLineY = visibleLineIndices[0] ?? 0;
   const maxLineY = visibleLineIndices.length === 0 ? 0 : visibleLineIndices.at(-1) + 1;
@@ -3214,7 +3222,7 @@ const getVisible$1 = async (editor, syncIncremental) => {
     width
   } = editor;
   const visibleLineIndices = editor.visibleLineIndices || Array.from({
-    length: Math.min(editor.numberOfVisibleLines, lines.length - editor.minLineY)
+    length: Math.min(editor.maxLineY ?? editor.minLineY + editor.numberOfVisibleLines, lines.length) - editor.minLineY
   }, (_, index) => editor.minLineY + index);
   if (visibleLineIndices.length === 0) {
     return {
@@ -3272,7 +3280,6 @@ const setDeltaY$1 = async (state, value) => {
     finalDeltaY,
     height,
     itemHeight,
-    numberOfVisibleLines,
     scrollBarHeight
   } = state;
   const newDeltaY = clamp(value, 0, finalDeltaY);
@@ -3280,8 +3287,9 @@ const setDeltaY$1 = async (state, value) => {
     return state;
   }
   const startVisualRow = Math.floor(newDeltaY / itemHeight);
+  const renderedLineCount = getRenderedLineCount(height, itemHeight, newDeltaY);
   const hasMergeConflictRows = state.viewLineIndices?.length > 0;
-  const visibleViewLineIndices = hasMergeConflictRows ? getVisibleViewLineIndices(state.viewLineIndices, startVisualRow, numberOfVisibleLines) : getViewportLineIndices(state.lines.length, state.foldingRanges || [], startVisualRow, numberOfVisibleLines);
+  const visibleViewLineIndices = hasMergeConflictRows ? getVisibleViewLineIndices(state.viewLineIndices, startVisualRow, renderedLineCount) : getViewportLineIndices(state.lines.length, state.foldingRanges || [], startVisualRow, renderedLineCount);
   const visibleLineIndices = hasMergeConflictRows ? getVisibleLineIndices(visibleViewLineIndices) : visibleViewLineIndices;
   const minLineY = visibleLineIndices[0] ?? 0;
   const maxLineY = visibleLineIndices.length === 0 ? 0 : visibleLineIndices.at(-1) + 1;
@@ -3666,10 +3674,10 @@ const resize = (state, dimensions, columnWidth = state.columnWidth) => {
   if (!('foldingRanges' in state)) {
     const total = state.lines.length;
     const finalY = Math.max(total - numberOfVisibleLines, 0);
-    const finalDeltaY = finalY * state.itemHeight;
+    const finalDeltaY = Math.max(total * state.itemHeight - height, 0);
     const deltaY = Math.min(state.deltaY, finalDeltaY);
     const minLineY = Math.floor(deltaY / state.itemHeight);
-    const maxLineY = Math.min(minLineY + numberOfVisibleLines, total);
+    const maxLineY = Math.min(minLineY + getRenderedLineCount(height, state.itemHeight, deltaY), total);
     const contentHeight = total * state.rowHeight;
     const scrollBarHeight = getScrollBarSize(height, contentHeight, state.minimumSliderSize);
     return {
@@ -14873,8 +14881,10 @@ const renderAdditionalFocusContext$1 = (oldState, newState) => {
   return ['Viewlet.unsetAdditionalFocus', newState.uid, oldState.additionalFocus];
 };
 
-const getCss = (uid, rowHeight, scrollBarHeight, scrollBarTop, scrollBarWidth, scrollBarLeft) => {
+const getCss = (uid, rowHeight, scrollBarHeight, scrollBarTop, scrollBarWidth, scrollBarLeft, deltaY = 0) => {
   const editorSelector = `.Editor[data-uid="${uid}"]`;
+  const scrollOffset = getScrollOffset(deltaY, rowHeight);
+  const translate = scrollOffset === 0 ? 'none' : `0px -${scrollOffset}px`;
   return `${editorSelector} {
   --EditorRowHeight: ${rowHeight}px;
   --ScrollBarHeight: ${scrollBarHeight}px;
@@ -14882,6 +14892,25 @@ const getCss = (uid, rowHeight, scrollBarHeight, scrollBarTop, scrollBarWidth, s
   --ScrollBarWidth: ${scrollBarWidth}px;
   --ScrollBarLeft: ${scrollBarLeft}px;
 }
+${editorSelector} .EditorLayers {
+  height: calc(100% + var(--EditorRowHeight));
+  translate: ${translate};
+}
+${editorSelector} .GutterRows {
+  flex: none;
+  width: 100%;
+  translate: ${translate};
+}
+${editorSelector} .EditorRows,
+${editorSelector} .GutterRows {
+  display: flex;
+  flex-direction: column;
+}
+${editorSelector} .EditorRow,
+${editorSelector} .LineNumber {
+  contain: size style;
+  flex: none;
+}
 ${editorSelector} .EditorRow {
   height: var(--EditorRowHeight);
   line-height: var(--EditorRowHeight);
@@ -14889,6 +14918,7 @@ ${editorSelector} .EditorRow {
 ${editorSelector} .MergeConflictActions,
 ${editorSelector} .MergeConflictActionsGutter {
   box-sizing: border-box;
+  flex: none;
   height: var(--EditorRowHeight);
   line-height: var(--EditorRowHeight);
 }
@@ -14989,7 +15019,7 @@ const renderCss$1 = (oldState, newState) => {
   const scrollBarTop = getScrollBarY(deltaY, finalDeltaY, height, scrollBarHeight);
   const scrollBarWidth = getScrollBarSize(width, longestLineWidth, minimumSliderSize);
   const scrollBarLeft = getScrollBarLeft(deltaX, longestLineWidth, width);
-  const css = getCss(uid, rowHeight, scrollBarHeight, scrollBarTop, scrollBarWidth, scrollBarLeft);
+  const css = getCss(uid, rowHeight, scrollBarHeight, scrollBarTop, scrollBarWidth, scrollBarLeft, deltaY);
   return [SetCss$1, uid, css];
 };
 
@@ -15457,13 +15487,20 @@ const getGutterInfoVirtualDom = (gutterInfo, activeLineNumber) => {
 };
 const getEditorGutterVirtualDom$1 = (gutterInfos, activeLineNumber = -1) => {
   const dom = gutterInfos.flatMap(gutterInfo => getGutterInfoVirtualDom(gutterInfo, activeLineNumber));
-  return dom;
+  if (gutterInfos.length === 0) {
+    return [];
+  }
+  return [{
+    childCount: gutterInfos.length,
+    className: 'GutterRows',
+    type: Div
+  }, ...dom];
 };
 
 const getEditorGutterVirtualDom = (gutterInfos, activeLineNumber = -1) => {
   const gutterDom = getEditorGutterVirtualDom$1([...gutterInfos], activeLineNumber);
   return [{
-    childCount: gutterInfos.length,
+    childCount: gutterInfos.length === 0 ? 0 : 1,
     className: 'Gutter',
     type: Div
   }, ...gutterDom];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/editor-worker",
-  "version": "19.60.1",
+  "version": "19.60.2",
   "repository": {
     "type": "git",
     "url": "git@github.com:lvce-editor/editor-worker.git"