monaco-editor11 1.1.1 → 1.1.2

package/dist/workers/guidesTextModelPart.js

@@ -0,0 +1,405 @@
+import { findLast } from '../../../base/common/arraysFind.js';
+import { firstNonWhitespaceIndex } from '../../../base/common/strings.js';
+import { CursorColumns } from '../core/cursorColumns.js';
+import { Range } from '../core/range.js';
+import { TextModelPart } from './textModelPart.js';
+import { computeIndentLevel } from './utils.js';
+import { HorizontalGuidesState, IndentGuide, IndentGuideHorizontalLine } from '../textModelGuides.js';
+import { BugIndicatingError } from '../../../base/common/errors.js';
+
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+class GuidesTextModelPart extends TextModelPart {
+    constructor(textModel, languageConfigurationService) {
+        super();
+        this.textModel = textModel;
+        this.languageConfigurationService = languageConfigurationService;
+    }
+    getLanguageConfiguration(languageId) {
+        return this.languageConfigurationService.getLanguageConfiguration(languageId);
+    }
+    _computeIndentLevel(lineIndex) {
+        return computeIndentLevel(this.textModel.getLineContent(lineIndex + 1), this.textModel.getOptions().tabSize);
+    }
+    getActiveIndentGuide(lineNumber, minLineNumber, maxLineNumber) {
+        this.assertNotDisposed();
+        const lineCount = this.textModel.getLineCount();
+        if (lineNumber < 1 || lineNumber > lineCount) {
+            throw new BugIndicatingError('Illegal value for lineNumber');
+        }
+        const foldingRules = this.getLanguageConfiguration(this.textModel.getLanguageId()).foldingRules;
+        const offSide = Boolean(foldingRules && foldingRules.offSide);
+        let up_aboveContentLineIndex = -2; /* -2 is a marker for not having computed it */
+        let up_aboveContentLineIndent = -1;
+        let up_belowContentLineIndex = -2; /* -2 is a marker for not having computed it */
+        let up_belowContentLineIndent = -1;
+        const up_resolveIndents = (lineNumber) => {
+            if (up_aboveContentLineIndex !== -1 &&
+                (up_aboveContentLineIndex === -2 ||
+                    up_aboveContentLineIndex > lineNumber - 1)) {
+                up_aboveContentLineIndex = -1;
+                up_aboveContentLineIndent = -1;
+                // must find previous line with content
+                for (let lineIndex = lineNumber - 2; lineIndex >= 0; lineIndex--) {
+                    const indent = this._computeIndentLevel(lineIndex);
+                    if (indent >= 0) {
+                        up_aboveContentLineIndex = lineIndex;
+                        up_aboveContentLineIndent = indent;
+                        break;
+                    }
+                }
+            }
+            if (up_belowContentLineIndex === -2) {
+                up_belowContentLineIndex = -1;
+                up_belowContentLineIndent = -1;
+                // must find next line with content
+                for (let lineIndex = lineNumber; lineIndex < lineCount; lineIndex++) {
+                    const indent = this._computeIndentLevel(lineIndex);
+                    if (indent >= 0) {
+                        up_belowContentLineIndex = lineIndex;
+                        up_belowContentLineIndent = indent;
+                        break;
+                    }
+                }
+            }
+        };
+        let down_aboveContentLineIndex = -2; /* -2 is a marker for not having computed it */
+        let down_aboveContentLineIndent = -1;
+        let down_belowContentLineIndex = -2; /* -2 is a marker for not having computed it */
+        let down_belowContentLineIndent = -1;
+        const down_resolveIndents = (lineNumber) => {
+            if (down_aboveContentLineIndex === -2) {
+                down_aboveContentLineIndex = -1;
+                down_aboveContentLineIndent = -1;
+                // must find previous line with content
+                for (let lineIndex = lineNumber - 2; lineIndex >= 0; lineIndex--) {
+                    const indent = this._computeIndentLevel(lineIndex);
+                    if (indent >= 0) {
+                        down_aboveContentLineIndex = lineIndex;
+                        down_aboveContentLineIndent = indent;
+                        break;
+                    }
+                }
+            }
+            if (down_belowContentLineIndex !== -1 &&
+                (down_belowContentLineIndex === -2 ||
+                    down_belowContentLineIndex < lineNumber - 1)) {
+                down_belowContentLineIndex = -1;
+                down_belowContentLineIndent = -1;
+                // must find next line with content
+                for (let lineIndex = lineNumber; lineIndex < lineCount; lineIndex++) {
+                    const indent = this._computeIndentLevel(lineIndex);
+                    if (indent >= 0) {
+                        down_belowContentLineIndex = lineIndex;
+                        down_belowContentLineIndent = indent;
+                        break;
+                    }
+                }
+            }
+        };
+        let startLineNumber = 0;
+        let goUp = true;
+        let endLineNumber = 0;
+        let goDown = true;
+        let indent = 0;
+        let initialIndent = 0;
+        for (let distance = 0; goUp || goDown; distance++) {
+            const upLineNumber = lineNumber - distance;
+            const downLineNumber = lineNumber + distance;
+            if (distance > 1 && (upLineNumber < 1 || upLineNumber < minLineNumber)) {
+                goUp = false;
+            }
+            if (distance > 1 &&
+                (downLineNumber > lineCount || downLineNumber > maxLineNumber)) {
+                goDown = false;
+            }
+            if (distance > 50000) {
+                // stop processing
+                goUp = false;
+                goDown = false;
+            }
+            let upLineIndentLevel = -1;
+            if (goUp && upLineNumber >= 1) {
+                // compute indent level going up
+                const currentIndent = this._computeIndentLevel(upLineNumber - 1);
+                if (currentIndent >= 0) {
+                    // This line has content (besides whitespace)
+                    // Use the line's indent
+                    up_belowContentLineIndex = upLineNumber - 1;
+                    up_belowContentLineIndent = currentIndent;
+                    upLineIndentLevel = Math.ceil(currentIndent / this.textModel.getOptions().indentSize);
+                }
+                else {
+                    up_resolveIndents(upLineNumber);
+                    upLineIndentLevel = this._getIndentLevelForWhitespaceLine(offSide, up_aboveContentLineIndent, up_belowContentLineIndent);
+                }
+            }
+            let downLineIndentLevel = -1;
+            if (goDown && downLineNumber <= lineCount) {
+                // compute indent level going down
+                const currentIndent = this._computeIndentLevel(downLineNumber - 1);
+                if (currentIndent >= 0) {
+                    // This line has content (besides whitespace)
+                    // Use the line's indent
+                    down_aboveContentLineIndex = downLineNumber - 1;
+                    down_aboveContentLineIndent = currentIndent;
+                    downLineIndentLevel = Math.ceil(currentIndent / this.textModel.getOptions().indentSize);
+                }
+                else {
+                    down_resolveIndents(downLineNumber);
+                    downLineIndentLevel = this._getIndentLevelForWhitespaceLine(offSide, down_aboveContentLineIndent, down_belowContentLineIndent);
+                }
+            }
+            if (distance === 0) {
+                initialIndent = upLineIndentLevel;
+                continue;
+            }
+            if (distance === 1) {
+                if (downLineNumber <= lineCount &&
+                    downLineIndentLevel >= 0 &&
+                    initialIndent + 1 === downLineIndentLevel) {
+                    // This is the beginning of a scope, we have special handling here, since we want the
+                    // child scope indent to be active, not the parent scope
+                    goUp = false;
+                    startLineNumber = downLineNumber;
+                    endLineNumber = downLineNumber;
+                    indent = downLineIndentLevel;
+                    continue;
+                }
+                if (upLineNumber >= 1 &&
+                    upLineIndentLevel >= 0 &&
+                    upLineIndentLevel - 1 === initialIndent) {
+                    // This is the end of a scope, just like above
+                    goDown = false;
+                    startLineNumber = upLineNumber;
+                    endLineNumber = upLineNumber;
+                    indent = upLineIndentLevel;
+                    continue;
+                }
+                startLineNumber = lineNumber;
+                endLineNumber = lineNumber;
+                indent = initialIndent;
+                if (indent === 0) {
+                    // No need to continue
+                    return { startLineNumber, endLineNumber, indent };
+                }
+            }
+            if (goUp) {
+                if (upLineIndentLevel >= indent) {
+                    startLineNumber = upLineNumber;
+                }
+                else {
+                    goUp = false;
+                }
+            }
+            if (goDown) {
+                if (downLineIndentLevel >= indent) {
+                    endLineNumber = downLineNumber;
+                }
+                else {
+                    goDown = false;
+                }
+            }
+        }
+        return { startLineNumber, endLineNumber, indent };
+    }
+    getLinesBracketGuides(startLineNumber, endLineNumber, activePosition, options) {
+        const result = [];
+        for (let lineNumber = startLineNumber; lineNumber <= endLineNumber; lineNumber++) {
+            result.push([]);
+        }
+        // If requested, this could be made configurable.
+        const includeSingleLinePairs = true;
+        const bracketPairs = this.textModel.bracketPairs.getBracketPairsInRangeWithMinIndentation(new Range(startLineNumber, 1, endLineNumber, this.textModel.getLineMaxColumn(endLineNumber))).toArray();
+        let activeBracketPairRange = undefined;
+        if (activePosition && bracketPairs.length > 0) {
+            const bracketsContainingActivePosition = (startLineNumber <= activePosition.lineNumber &&
+                activePosition.lineNumber <= endLineNumber
+                // We don't need to query the brackets again if the cursor is in the viewport
+                ? bracketPairs
+                : this.textModel.bracketPairs.getBracketPairsInRange(Range.fromPositions(activePosition)).toArray()).filter((bp) => Range.strictContainsPosition(bp.range, activePosition));
+            activeBracketPairRange = findLast(bracketsContainingActivePosition, (i) => includeSingleLinePairs)?.range;
+        }
+        const independentColorPoolPerBracketType = this.textModel.getOptions().bracketPairColorizationOptions.independentColorPoolPerBracketType;
+        const colorProvider = new BracketPairGuidesClassNames();
+        for (const pair of bracketPairs) {
+            /*
+
+
+                    {
+                    |
+                    }
+
+                    {
+                    |
+                    ----}
+
+                ____{
+                |test
+                ----}
+
+                renderHorizontalEndLineAtTheBottom:
+                    {
+                    |
+                    |x}
+                    --
+                renderHorizontalEndLineAtTheBottom:
+                ____{
+                |test
+                | x }
+                ----
+            */
+            if (!pair.closingBracketRange) {
+                continue;
+            }
+            const isActive = activeBracketPairRange && pair.range.equalsRange(activeBracketPairRange);
+            if (!isActive && !options.includeInactive) {
+                continue;
+            }
+            const className = colorProvider.getInlineClassName(pair.nestingLevel, pair.nestingLevelOfEqualBracketType, independentColorPoolPerBracketType) +
+                (options.highlightActive && isActive
+                    ? ' ' + colorProvider.activeClassName
+                    : '');
+            const start = pair.openingBracketRange.getStartPosition();
+            const end = pair.closingBracketRange.getStartPosition();
+            const horizontalGuides = options.horizontalGuides === HorizontalGuidesState.Enabled || (options.horizontalGuides === HorizontalGuidesState.EnabledForActive && isActive);
+            if (pair.range.startLineNumber === pair.range.endLineNumber) {
+                if (horizontalGuides) {
+                    result[pair.range.startLineNumber - startLineNumber].push(new IndentGuide(-1, pair.openingBracketRange.getEndPosition().column, className, new IndentGuideHorizontalLine(false, end.column), -1, -1));
+                }
+                continue;
+            }
+            const endVisibleColumn = this.getVisibleColumnFromPosition(end);
+            const startVisibleColumn = this.getVisibleColumnFromPosition(pair.openingBracketRange.getStartPosition());
+            const guideVisibleColumn = Math.min(startVisibleColumn, endVisibleColumn, pair.minVisibleColumnIndentation + 1);
+            let renderHorizontalEndLineAtTheBottom = false;
+            const firstNonWsIndex = firstNonWhitespaceIndex(this.textModel.getLineContent(pair.closingBracketRange.startLineNumber));
+            const hasTextBeforeClosingBracket = firstNonWsIndex < pair.closingBracketRange.startColumn - 1;
+            if (hasTextBeforeClosingBracket) {
+                renderHorizontalEndLineAtTheBottom = true;
+            }
+            const visibleGuideStartLineNumber = Math.max(start.lineNumber, startLineNumber);
+            const visibleGuideEndLineNumber = Math.min(end.lineNumber, endLineNumber);
+            const offset = renderHorizontalEndLineAtTheBottom ? 1 : 0;
+            for (let l = visibleGuideStartLineNumber; l < visibleGuideEndLineNumber + offset; l++) {
+                result[l - startLineNumber].push(new IndentGuide(guideVisibleColumn, -1, className, null, l === start.lineNumber ? start.column : -1, l === end.lineNumber ? end.column : -1));
+            }
+            if (horizontalGuides) {
+                if (start.lineNumber >= startLineNumber && startVisibleColumn > guideVisibleColumn) {
+                    result[start.lineNumber - startLineNumber].push(new IndentGuide(guideVisibleColumn, -1, className, new IndentGuideHorizontalLine(false, start.column), -1, -1));
+                }
+                if (end.lineNumber <= endLineNumber && endVisibleColumn > guideVisibleColumn) {
+                    result[end.lineNumber - startLineNumber].push(new IndentGuide(guideVisibleColumn, -1, className, new IndentGuideHorizontalLine(!renderHorizontalEndLineAtTheBottom, end.column), -1, -1));
+                }
+            }
+        }
+        for (const guides of result) {
+            guides.sort((a, b) => a.visibleColumn - b.visibleColumn);
+        }
+        return result;
+    }
+    getVisibleColumnFromPosition(position) {
+        return (CursorColumns.visibleColumnFromColumn(this.textModel.getLineContent(position.lineNumber), position.column, this.textModel.getOptions().tabSize) + 1);
+    }
+    getLinesIndentGuides(startLineNumber, endLineNumber) {
+        this.assertNotDisposed();
+        const lineCount = this.textModel.getLineCount();
+        if (startLineNumber < 1 || startLineNumber > lineCount) {
+            throw new Error('Illegal value for startLineNumber');
+        }
+        if (endLineNumber < 1 || endLineNumber > lineCount) {
+            throw new Error('Illegal value for endLineNumber');
+        }
+        const options = this.textModel.getOptions();
+        const foldingRules = this.getLanguageConfiguration(this.textModel.getLanguageId()).foldingRules;
+        const offSide = Boolean(foldingRules && foldingRules.offSide);
+        const result = new Array(endLineNumber - startLineNumber + 1);
+        let aboveContentLineIndex = -2; /* -2 is a marker for not having computed it */
+        let aboveContentLineIndent = -1;
+        let belowContentLineIndex = -2; /* -2 is a marker for not having computed it */
+        let belowContentLineIndent = -1;
+        for (let lineNumber = startLineNumber; lineNumber <= endLineNumber; lineNumber++) {
+            const resultIndex = lineNumber - startLineNumber;
+            const currentIndent = this._computeIndentLevel(lineNumber - 1);
+            if (currentIndent >= 0) {
+                // This line has content (besides whitespace)
+                // Use the line's indent
+                aboveContentLineIndex = lineNumber - 1;
+                aboveContentLineIndent = currentIndent;
+                result[resultIndex] = Math.ceil(currentIndent / options.indentSize);
+                continue;
+            }
+            if (aboveContentLineIndex === -2) {
+                aboveContentLineIndex = -1;
+                aboveContentLineIndent = -1;
+                // must find previous line with content
+                for (let lineIndex = lineNumber - 2; lineIndex >= 0; lineIndex--) {
+                    const indent = this._computeIndentLevel(lineIndex);
+                    if (indent >= 0) {
+                        aboveContentLineIndex = lineIndex;
+                        aboveContentLineIndent = indent;
+                        break;
+                    }
+                }
+            }
+            if (belowContentLineIndex !== -1 &&
+                (belowContentLineIndex === -2 || belowContentLineIndex < lineNumber - 1)) {
+                belowContentLineIndex = -1;
+                belowContentLineIndent = -1;
+                // must find next line with content
+                for (let lineIndex = lineNumber; lineIndex < lineCount; lineIndex++) {
+                    const indent = this._computeIndentLevel(lineIndex);
+                    if (indent >= 0) {
+                        belowContentLineIndex = lineIndex;
+                        belowContentLineIndent = indent;
+                        break;
+                    }
+                }
+            }
+            result[resultIndex] = this._getIndentLevelForWhitespaceLine(offSide, aboveContentLineIndent, belowContentLineIndent);
+        }
+        return result;
+    }
+    _getIndentLevelForWhitespaceLine(offSide, aboveContentLineIndent, belowContentLineIndent) {
+        const options = this.textModel.getOptions();
+        if (aboveContentLineIndent === -1 || belowContentLineIndent === -1) {
+            // At the top or bottom of the file
+            return 0;
+        }
+        else if (aboveContentLineIndent < belowContentLineIndent) {
+            // we are inside the region above
+            return 1 + Math.floor(aboveContentLineIndent / options.indentSize);
+        }
+        else if (aboveContentLineIndent === belowContentLineIndent) {
+            // we are in between two regions
+            return Math.ceil(belowContentLineIndent / options.indentSize);
+        }
+        else {
+            if (offSide) {
+                // same level as region below
+                return Math.ceil(belowContentLineIndent / options.indentSize);
+            }
+            else {
+                // we are inside the region that ends below
+                return 1 + Math.floor(belowContentLineIndent / options.indentSize);
+            }
+        }
+    }
+}
+class BracketPairGuidesClassNames {
+    constructor() {
+        this.activeClassName = 'indent-active';
+    }
+    getInlineClassName(nestingLevel, nestingLevelOfEqualBracketType, independentColorPoolPerBracketType) {
+        return this.getInlineClassNameOfLevel(independentColorPoolPerBracketType ? nestingLevelOfEqualBracketType : nestingLevel);
+    }
+    getInlineClassNameOfLevel(level) {
+        // To support a dynamic amount of colors up to 6 colors,
+        // we use a number that is a lcm of all numbers from 1 to 6.
+        return `bracket-indent-guide lvl-${level % 30}`;
+    }
+}
+
+export { BracketPairGuidesClassNames, GuidesTextModelPart };

package/dist/workers/gutterFeature.js

@@ -0,0 +1,238 @@
+import { h, addDisposableListener, EventType } from '../../../../../base/browser/dom.js';
+import { Disposable } from '../../../../../base/common/lifecycle.js';
+import '../../../../../base/common/observableInternal/index.js';
+import { MenuWorkbenchToolBar } from '../../../../../platform/actions/browser/toolbar.js';
+import { IMenuService, MenuId } from '../../../../../platform/actions/common/actions.js';
+import { IContextKeyService } from '../../../../../platform/contextkey/common/contextkey.js';
+import { WorkbenchHoverDelegate } from '../../../../../platform/hover/browser/hover.js';
+import { IInstantiationService } from '../../../../../platform/instantiation/common/instantiation.js';
+import { LineRangeSet, LineRange } from '../../../../common/core/ranges/lineRange.js';
+import { OffsetRange } from '../../../../common/core/ranges/offsetRange.js';
+import { Range } from '../../../../common/core/range.js';
+import { TextEdit } from '../../../../common/core/edits/textEdit.js';
+import { DetailedLineRangeMapping } from '../../../../common/diff/rangeMapping.js';
+import { TextModelText } from '../../../../common/model/textModelText.js';
+import { ActionRunnerWithContext } from '../../multiDiffEditor/utils.js';
+import { DiffEditorSash } from '../components/diffEditorSash.js';
+import { prependRemoveOnDispose, applyStyle, appendRemoveOnDispose } from '../utils.js';
+import { EditorGutter } from '../utils/editorGutter.js';
+import { derived, derivedDisposable, derivedWithSetter } from '../../../../../base/common/observableInternal/observables/derived.js';
+import { observableFromEvent } from '../../../../../base/common/observableInternal/observables/observableFromEvent.js';
+import { observableValue } from '../../../../../base/common/observableInternal/observables/observableValue.js';
+import { autorun, autorunWithStore } from '../../../../../base/common/observableInternal/reactions/autorun.js';
+
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __param = (undefined && undefined.__param) || function (paramIndex, decorator) {
+    return function (target, key) { decorator(target, key, paramIndex); }
+};
+const emptyArr = [];
+const width = 35;
+let DiffEditorGutter = class DiffEditorGutter extends Disposable {
+    constructor(diffEditorRoot, _diffModel, _editors, _options, _sashLayout, _boundarySashes, _instantiationService, _contextKeyService, _menuService) {
+        super();
+        this._diffModel = _diffModel;
+        this._editors = _editors;
+        this._options = _options;
+        this._sashLayout = _sashLayout;
+        this._boundarySashes = _boundarySashes;
+        this._instantiationService = _instantiationService;
+        this._contextKeyService = _contextKeyService;
+        this._menuService = _menuService;
+        this._menu = this._register(this._menuService.createMenu(MenuId.DiffEditorHunkToolbar, this._contextKeyService));
+        this._actions = observableFromEvent(this, this._menu.onDidChange, () => this._menu.getActions());
+        this._hasActions = this._actions.map(a => a.length > 0);
+        this._showSash = derived(this, reader => this._options.renderSideBySide.read(reader) && this._hasActions.read(reader));
+        this.width = derived(this, reader => this._hasActions.read(reader) ? width : 0);
+        this.elements = h('div.gutter@gutter', { style: { position: 'absolute', height: '100%', width: width + 'px' } }, []);
+        this._currentDiff = derived(this, (reader) => {
+            const model = this._diffModel.read(reader);
+            if (!model) {
+                return undefined;
+            }
+            const mappings = model.diff.read(reader)?.mappings;
+            const cursorPosition = this._editors.modifiedCursor.read(reader);
+            if (!cursorPosition) {
+                return undefined;
+            }
+            return mappings?.find(m => m.lineRangeMapping.modified.contains(cursorPosition.lineNumber));
+        });
+        this._selectedDiffs = derived(this, (reader) => {
+            /** @description selectedDiffs */
+            const model = this._diffModel.read(reader);
+            const diff = model?.diff.read(reader);
+            // Return `emptyArr` because it is a constant. [] is always a new array and would trigger a change.
+            if (!diff) {
+                return emptyArr;
+            }
+            const selections = this._editors.modifiedSelections.read(reader);
+            if (selections.every(s => s.isEmpty())) {
+                return emptyArr;
+            }
+            const selectedLineNumbers = new LineRangeSet(selections.map(s => LineRange.fromRangeInclusive(s)));
+            const selectedMappings = diff.mappings.filter(m => m.lineRangeMapping.innerChanges && selectedLineNumbers.intersects(m.lineRangeMapping.modified));
+            const result = selectedMappings.map(mapping => ({
+                mapping,
+                rangeMappings: mapping.lineRangeMapping.innerChanges.filter(c => selections.some(s => Range.areIntersecting(c.modifiedRange, s)))
+            }));
+            if (result.length === 0 || result.every(r => r.rangeMappings.length === 0)) {
+                return emptyArr;
+            }
+            return result;
+        });
+        this._register(prependRemoveOnDispose(diffEditorRoot, this.elements.root));
+        this._register(addDisposableListener(this.elements.root, 'click', () => {
+            this._editors.modified.focus();
+        }));
+        this._register(applyStyle(this.elements.root, { display: this._hasActions.map(a => a ? 'block' : 'none') }));
+        derivedDisposable(this, reader => {
+            const showSash = this._showSash.read(reader);
+            return !showSash ? undefined : new DiffEditorSash(diffEditorRoot, this._sashLayout.dimensions, this._options.enableSplitViewResizing, this._boundarySashes, derivedWithSetter(this, reader => this._sashLayout.sashLeft.read(reader) - width, (v, tx) => this._sashLayout.sashLeft.set(v + width, tx)), () => this._sashLayout.resetSash());
+        }).recomputeInitiallyAndOnChange(this._store);
+        const gutterItems = derived(this, reader => {
+            const model = this._diffModel.read(reader);
+            if (!model) {
+                return [];
+            }
+            const diffs = model.diff.read(reader);
+            if (!diffs) {
+                return [];
+            }
+            const selection = this._selectedDiffs.read(reader);
+            if (selection.length > 0) {
+                const m = DetailedLineRangeMapping.fromRangeMappings(selection.flatMap(s => s.rangeMappings));
+                return [
+                    new DiffGutterItem(m, true, MenuId.DiffEditorSelectionToolbar, undefined, model.model.original.uri, model.model.modified.uri)
+                ];
+            }
+            const currentDiff = this._currentDiff.read(reader);
+            return diffs.mappings.map(m => new DiffGutterItem(m.lineRangeMapping.withInnerChangesFromLineRanges(), m.lineRangeMapping === currentDiff?.lineRangeMapping, MenuId.DiffEditorHunkToolbar, undefined, model.model.original.uri, model.model.modified.uri));
+        });
+        this._register(new EditorGutter(this._editors.modified, this.elements.root, {
+            getIntersectingGutterItems: (range, reader) => gutterItems.read(reader),
+            createView: (item, target) => {
+                return this._instantiationService.createInstance(DiffToolBar, item, target, this);
+            },
+        }));
+        this._register(addDisposableListener(this.elements.gutter, EventType.MOUSE_WHEEL, (e) => {
+            if (this._editors.modified.getOption(117 /* EditorOption.scrollbar */).handleMouseWheel) {
+                this._editors.modified.delegateScrollFromMouseWheelEvent(e);
+            }
+        }, { passive: false }));
+    }
+    computeStagedValue(mapping) {
+        const c = mapping.innerChanges ?? [];
+        const modified = new TextModelText(this._editors.modifiedModel.get());
+        const original = new TextModelText(this._editors.original.getModel());
+        const edit = new TextEdit(c.map(c => c.toTextEdit(modified)));
+        const value = edit.apply(original);
+        return value;
+    }
+    layout(left) {
+        this.elements.gutter.style.left = left + 'px';
+    }
+};
+DiffEditorGutter = __decorate([
+    __param(6, IInstantiationService),
+    __param(7, IContextKeyService),
+    __param(8, IMenuService)
+], DiffEditorGutter);
+class DiffGutterItem {
+    constructor(mapping, showAlways, menuId, rangeOverride, originalUri, modifiedUri) {
+        this.mapping = mapping;
+        this.showAlways = showAlways;
+        this.menuId = menuId;
+        this.rangeOverride = rangeOverride;
+        this.originalUri = originalUri;
+        this.modifiedUri = modifiedUri;
+    }
+    get id() { return this.mapping.modified.toString(); }
+    get range() { return this.rangeOverride ?? this.mapping.modified; }
+}
+let DiffToolBar = class DiffToolBar extends Disposable {
+    constructor(_item, target, gutter, instantiationService) {
+        super();
+        this._item = _item;
+        this._elements = h('div.gutterItem', { style: { height: '20px', width: '34px' } }, [
+            h('div.background@background', {}, []),
+            h('div.buttons@buttons', {}, []),
+        ]);
+        this._showAlways = this._item.map(this, item => item.showAlways);
+        this._menuId = this._item.map(this, item => item.menuId);
+        this._isSmall = observableValue(this, false);
+        this._lastItemRange = undefined;
+        this._lastViewRange = undefined;
+        const hoverDelegate = this._register(instantiationService.createInstance(WorkbenchHoverDelegate, 'element', { instantHover: true }, { position: { hoverPosition: 1 /* HoverPosition.RIGHT */ } }));
+        this._register(appendRemoveOnDispose(target, this._elements.root));
+        this._register(autorun(reader => {
+            /** @description update showAlways */
+            const showAlways = this._showAlways.read(reader);
+            this._elements.root.classList.toggle('noTransition', true);
+            this._elements.root.classList.toggle('showAlways', showAlways);
+            setTimeout(() => {
+                this._elements.root.classList.toggle('noTransition', false);
+            }, 0);
+        }));
+        this._register(autorunWithStore((reader, store) => {
+            this._elements.buttons.replaceChildren();
+            const i = store.add(instantiationService.createInstance(MenuWorkbenchToolBar, this._elements.buttons, this._menuId.read(reader), {
+                orientation: 1 /* ActionsOrientation.VERTICAL */,
+                hoverDelegate,
+                toolbarOptions: {
+                    primaryGroup: g => g.startsWith('primary'),
+                },
+                overflowBehavior: { maxItems: this._isSmall.read(reader) ? 1 : 3 },
+                hiddenItemStrategy: 0 /* HiddenItemStrategy.Ignore */,
+                actionRunner: store.add(new ActionRunnerWithContext(() => {
+                    const item = this._item.read(undefined);
+                    const mapping = item.mapping;
+                    return {
+                        mapping,
+                        originalWithModifiedChanges: gutter.computeStagedValue(mapping),
+                        originalUri: item.originalUri,
+                        modifiedUri: item.modifiedUri,
+                    };
+                })),
+                menuOptions: {
+                    shouldForwardArgs: true,
+                },
+            }));
+            store.add(i.onDidChangeMenuItems(() => {
+                if (this._lastItemRange) {
+                    this.layout(this._lastItemRange, this._lastViewRange);
+                }
+            }));
+        }));
+    }
+    layout(itemRange, viewRange) {
+        this._lastItemRange = itemRange;
+        this._lastViewRange = viewRange;
+        let itemHeight = this._elements.buttons.clientHeight;
+        this._isSmall.set(this._item.get().mapping.original.startLineNumber === 1 && itemRange.length < 30, undefined);
+        // Item might have changed
+        itemHeight = this._elements.buttons.clientHeight;
+        const middleHeight = itemRange.length / 2 - itemHeight / 2;
+        const margin = itemHeight;
+        let effectiveCheckboxTop = itemRange.start + middleHeight;
+        const preferredViewPortRange = OffsetRange.tryCreate(margin, viewRange.endExclusive - margin - itemHeight);
+        const preferredParentRange = OffsetRange.tryCreate(itemRange.start + margin, itemRange.endExclusive - itemHeight - margin);
+        if (preferredParentRange && preferredViewPortRange && preferredParentRange.start < preferredParentRange.endExclusive) {
+            effectiveCheckboxTop = preferredViewPortRange.clip(effectiveCheckboxTop);
+            effectiveCheckboxTop = preferredParentRange.clip(effectiveCheckboxTop);
+        }
+        this._elements.buttons.style.top = `${effectiveCheckboxTop - itemRange.start}px`;
+    }
+};
+DiffToolBar = __decorate([
+    __param(3, IInstantiationService)
+], DiffToolBar);
+
+export { DiffEditorGutter };