@codingame/monaco-vscode-api 1.78.5 → 1.78.6-next.0

package/dist/vscode/vs/workbench/contrib/debug/browser/breakpointsView.js

@@ -2,23 +2,40 @@ import { __decorate, __param } from '../../../../../../node_modules/tslib/tslib.
 import * as dom from 'monaco-editor/esm/vs/base/browser/dom.js';
 import { Gesture } from 'monaco-editor/esm/vs/base/browser/touch.js';
 import { ActionBar } from 'monaco-editor/esm/vs/base/browser/ui/actionbar/actionbar.js';
+import { IconLabel } from 'monaco-editor/esm/vs/base/browser/ui/iconLabel/iconLabel.js';
+import { InputBox } from 'monaco-editor/esm/vs/base/browser/ui/inputbox/inputBox.js';
 import { Action } from 'monaco-editor/esm/vs/base/common/actions.js';
+import { equals } from 'monaco-editor/esm/vs/base/common/arrays.js';
+import { RunOnceScheduler } from 'monaco-editor/esm/vs/base/common/async.js';
 import { Codicon } from 'monaco-editor/esm/vs/base/common/codicons.js';
+import { MarkdownString } from 'monaco-editor/esm/vs/base/common/htmlContent.js';
 import { dispose } from 'monaco-editor/esm/vs/base/common/lifecycle.js';
 import * as resources from 'monaco-editor/esm/vs/base/common/resources.js';
 import { isCodeEditor } from 'monaco-editor/esm/vs/editor/browser/editorBrowser.js';
+import { ILanguageService } from 'monaco-editor/esm/vs/editor/common/languages/language.js';
 import { localize } from 'monaco-editor/esm/vs/nls.js';
-import { createAndFillInActionBarActions } from 'monaco-editor/esm/vs/platform/actions/browser/menuEntryActionViewItem.js';
-import { registerAction2, Action2, MenuId } from 'monaco-editor/esm/vs/platform/actions/common/actions.js';
-import { ContextKeyExpr } from 'monaco-editor/esm/vs/platform/contextkey/common/contextkey.js';
-import { IContextMenuService } from 'monaco-editor/esm/vs/platform/contextview/browser/contextView.js';
+import { createAndFillInContextMenuActions, createAndFillInActionBarActions } from 'monaco-editor/esm/vs/platform/actions/browser/menuEntryActionViewItem.js';
+import { registerAction2, Action2, MenuId, IMenuService } from 'monaco-editor/esm/vs/platform/actions/common/actions.js';
+import { IConfigurationService } from 'monaco-editor/esm/vs/platform/configuration/common/configuration.js';
+import { ContextKeyExpr, IContextKeyService } from 'monaco-editor/esm/vs/platform/contextkey/common/contextkey.js';
+import { IContextMenuService, IContextViewService } from 'monaco-editor/esm/vs/platform/contextview/browser/contextView.js';
+import { IInstantiationService } from 'monaco-editor/esm/vs/platform/instantiation/common/instantiation.js';
+import { IKeybindingService } from 'monaco-editor/esm/vs/platform/keybinding/common/keybinding.js';
 import { ILabelService } from 'monaco-editor/esm/vs/platform/label/common/label.js';
+import { WorkbenchList } from 'monaco-editor/esm/vs/platform/list/browser/listService.js';
+import { IOpenerService } from 'monaco-editor/esm/vs/platform/opener/common/opener.js';
+import { ITelemetryService } from 'monaco-editor/esm/vs/platform/telemetry/common/telemetry.js';
+import { defaultInputBoxStyles } from 'monaco-editor/esm/vs/platform/theme/browser/defaultStyles.js';
+import { IThemeService } from 'monaco-editor/esm/vs/platform/theme/common/themeService.js';
 import { ThemeIcon } from 'monaco-editor/esm/vs/base/common/themables.js';
-import { ViewAction } from '../../../browser/parts/views/viewPane.js';
+import { ViewAction, ViewPane } from '../../../browser/parts/views/viewPane.js';
+import { IViewDescriptorService } from '../../../common/views.js';
 import { watchExpressionsAddFuncBreakpoint, breakpointsActivate, breakpointsRemoveAll, debugBreakpointUnsupported, logBreakpoint, conditionalBreakpoint, dataBreakpoint, functionBreakpoint, breakpoint } from './debugIcons.js';
-import { BREAKPOINTS_VIEW_ID, CONTEXT_DEBUGGERS_AVAILABLE, IDebugService, CONTEXT_BREAKPOINT_ITEM_TYPE, CONTEXT_BREAKPOINTS_EXIST, CONTEXT_IN_DEBUG_MODE, CONTEXT_BREAKPOINT_SUPPORTS_CONDITION, BREAKPOINT_EDITOR_CONTRIBUTION_ID, DEBUG_SCHEME } from '../common/debug.js';
-import { Breakpoint, FunctionBreakpoint, DataBreakpoint, InstructionBreakpoint } from '../common/debugModel.js';
+import { BREAKPOINTS_VIEW_ID, CONTEXT_DEBUGGERS_AVAILABLE, IDebugService, CONTEXT_BREAKPOINT_ITEM_TYPE, CONTEXT_BREAKPOINTS_EXIST, CONTEXT_IN_DEBUG_MODE, CONTEXT_BREAKPOINT_SUPPORTS_CONDITION, BREAKPOINT_EDITOR_CONTRIBUTION_ID, CONTEXT_BREAKPOINT_INPUT_FOCUSED, CONTEXT_BREAKPOINTS_FOCUSED, DEBUG_SCHEME, DebuggerString } from '../common/debug.js';
+import { Breakpoint, FunctionBreakpoint, DataBreakpoint, InstructionBreakpoint, ExceptionBreakpoint } from '../common/debugModel.js';
+import { DisassemblyViewInput } from '../common/disassemblyViewInput.js';
 import { IEditorService, SIDE_GROUP, ACTIVE_GROUP } from '../../../services/editor/common/editorService.js';
+import { IHoverService } from '../../../services/hover/browser/hover.js';
 const $ = dom.$;
 function createCheckbox(disposables) {
     const checkbox = $('input');
@@ -27,6 +44,310 @@ function createCheckbox(disposables) {
     disposables.push(Gesture.ignoreTarget(checkbox));
     return checkbox;
 }
+const MAX_VISIBLE_BREAKPOINTS = 9;
+function getExpandedBodySize(model, sessionId, countLimit) {
+    const length = model.getBreakpoints().length + model.getExceptionBreakpointsForSession(sessionId).length + model.getFunctionBreakpoints().length + model.getDataBreakpoints().length + model.getInstructionBreakpoints().length;
+    return Math.min(countLimit, length) * 22;
+}
+let BreakpointsView = class BreakpointsView extends ViewPane {
+    constructor(options, contextMenuService, debugService, keybindingService, instantiationService, themeService, editorService, contextViewService, configurationService, viewDescriptorService, contextKeyService, openerService, telemetryService, labelService, menuService, hoverService, languageService) {
+        super(options, keybindingService, contextMenuService, configurationService, contextKeyService, viewDescriptorService, instantiationService, openerService, themeService, telemetryService);
+        this.debugService = debugService;
+        this.editorService = editorService;
+        this.contextViewService = contextViewService;
+        this.labelService = labelService;
+        this.hoverService = hoverService;
+        this.languageService = languageService;
+        this.needsRefresh = false;
+        this.needsStateChange = false;
+        this.ignoreLayout = false;
+        this.autoFocusedIndex = -1;
+        this.menu = menuService.createMenu(MenuId.DebugBreakpointsContext, contextKeyService);
+        this._register(this.menu);
+        this.breakpointItemType = CONTEXT_BREAKPOINT_ITEM_TYPE.bindTo(contextKeyService);
+        this.breakpointSupportsCondition = CONTEXT_BREAKPOINT_SUPPORTS_CONDITION.bindTo(contextKeyService);
+        this.breakpointInputFocused = CONTEXT_BREAKPOINT_INPUT_FOCUSED.bindTo(contextKeyService);
+        this._register(this.debugService.getModel().onDidChangeBreakpoints(() => this.onBreakpointsChange()));
+        this._register(this.debugService.getViewModel().onDidFocusSession(() => this.onBreakpointsChange()));
+        this._register(this.debugService.onDidChangeState(() => this.onStateChange()));
+        this.hintDelayer = this._register(( new RunOnceScheduler(() => this.updateBreakpointsHint(true), 4000)));
+    }
+    renderBody(container) {
+        super.renderBody(container);
+        this.element.classList.add('debug-pane');
+        container.classList.add('debug-breakpoints');
+        const delegate = ( new BreakpointsDelegate(this));
+        this.list = this.instantiationService.createInstance(WorkbenchList, 'Breakpoints', container, delegate, [
+            this.instantiationService.createInstance(BreakpointsRenderer, this.menu, this.breakpointSupportsCondition, this.breakpointItemType),
+            ( new ExceptionBreakpointsRenderer(
+                this.menu,
+                this.breakpointSupportsCondition,
+                this.breakpointItemType,
+                this.debugService
+            )),
+            ( new ExceptionBreakpointInputRenderer(this, this.debugService, this.contextViewService)),
+            this.instantiationService.createInstance(FunctionBreakpointsRenderer, this.menu, this.breakpointSupportsCondition, this.breakpointItemType),
+            this.instantiationService.createInstance(DataBreakpointsRenderer),
+            ( new FunctionBreakpointInputRenderer(this, this.debugService, this.contextViewService, this.labelService)),
+            this.instantiationService.createInstance(InstructionBreakpointsRenderer),
+        ], {
+            identityProvider: { getId: (element) => element.getId() },
+            multipleSelectionSupport: false,
+            keyboardNavigationLabelProvider: { getKeyboardNavigationLabel: (e) => e },
+            accessibilityProvider: ( new BreakpointsAccessibilityProvider(this.debugService, this.labelService)),
+            overrideStyles: {
+                listBackground: this.getBackgroundColor()
+            }
+        });
+        CONTEXT_BREAKPOINTS_FOCUSED.bindTo(this.list.contextKeyService);
+        this._register(this.list.onContextMenu(this.onListContextMenu, this));
+        this.list.onMouseMiddleClick(async ({ element }) => {
+            if (element instanceof Breakpoint) {
+                await this.debugService.removeBreakpoints(element.getId());
+            }
+            else if (element instanceof FunctionBreakpoint) {
+                await this.debugService.removeFunctionBreakpoints(element.getId());
+            }
+            else if (element instanceof DataBreakpoint) {
+                await this.debugService.removeDataBreakpoints(element.getId());
+            }
+            else if (element instanceof InstructionBreakpoint) {
+                await this.debugService.removeInstructionBreakpoints(element.instructionReference);
+            }
+        });
+        this._register(this.list.onDidOpen(async (e) => {
+            if (!e.element) {
+                return;
+            }
+            if (e.browserEvent instanceof MouseEvent && e.browserEvent.button === 1) {
+                return;
+            }
+            if (e.element instanceof Breakpoint) {
+                openBreakpointSource(e.element, e.sideBySide, e.editorOptions.preserveFocus || false, e.editorOptions.pinned || !e.editorOptions.preserveFocus, this.debugService, this.editorService);
+            }
+            if (e.element instanceof InstructionBreakpoint) {
+                const disassemblyView = await this.editorService.openEditor(DisassemblyViewInput.instance);
+                disassemblyView.goToAddress(e.element.instructionReference, e.browserEvent instanceof MouseEvent && e.browserEvent.detail === 2);
+            }
+            if (e.browserEvent instanceof MouseEvent && e.browserEvent.detail === 2 && e.element instanceof FunctionBreakpoint && e.element !== this.inputBoxData?.breakpoint) {
+                this.renderInputBox({ breakpoint: e.element, type: 'name' });
+            }
+        }));
+        this.list.splice(0, this.list.length, this.elements);
+        this._register(this.onDidChangeBodyVisibility(visible => {
+            if (visible) {
+                if (this.needsRefresh) {
+                    this.onBreakpointsChange();
+                }
+                if (this.needsStateChange) {
+                    this.onStateChange();
+                }
+            }
+        }));
+        const containerModel = this.viewDescriptorService.getViewContainerModel(this.viewDescriptorService.getViewContainerByViewId(this.id));
+        this._register(containerModel.onDidChangeAllViewDescriptors(() => {
+            this.updateSize();
+        }));
+    }
+    renderHeaderTitle(container, title) {
+        super.renderHeaderTitle(container, title);
+        const iconLabelContainer = dom.append(container, $('span.breakpoint-warning'));
+        this.hintContainer = this._register(( new IconLabel(iconLabelContainer, {
+            supportIcons: true, hoverDelegate: {
+                showHover: (options, focus) => this.hoverService.showHover({ content: options.content, target: this.hintContainer.element }, focus),
+                delay: this.configurationService.getValue('workbench.hover.delay')
+            }
+        })));
+        dom.hide(this.hintContainer.element);
+    }
+    focus() {
+        super.focus();
+        this.list?.domFocus();
+    }
+    renderInputBox(data) {
+        this._inputBoxData = data;
+        this.onBreakpointsChange();
+        this._inputBoxData = undefined;
+    }
+    get inputBoxData() {
+        return this._inputBoxData;
+    }
+    layoutBody(height, width) {
+        if (this.ignoreLayout) {
+            return;
+        }
+        super.layoutBody(height, width);
+        this.list?.layout(height, width);
+        try {
+            this.ignoreLayout = true;
+            this.updateSize();
+        }
+        finally {
+            this.ignoreLayout = false;
+        }
+    }
+    onListContextMenu(e) {
+        const element = e.element;
+        const type = element instanceof Breakpoint ? 'breakpoint' : element instanceof ExceptionBreakpoint ? 'exceptionBreakpoint' :
+            element instanceof FunctionBreakpoint ? 'functionBreakpoint' : element instanceof DataBreakpoint ? 'dataBreakpoint' :
+                element instanceof InstructionBreakpoint ? 'instructionBreakpoint' : undefined;
+        this.breakpointItemType.set(type);
+        const session = this.debugService.getViewModel().focusedSession;
+        const conditionSupported = element instanceof ExceptionBreakpoint ? element.supportsCondition : (!session || !!session.capabilities.supportsConditionalBreakpoints);
+        this.breakpointSupportsCondition.set(conditionSupported);
+        const secondary = [];
+        createAndFillInContextMenuActions(this.menu, { arg: e.element, shouldForwardArgs: false }, { primary: [], secondary }, 'inline');
+        this.contextMenuService.showContextMenu({
+            getAnchor: () => e.anchor,
+            getActions: () => secondary,
+            getActionsContext: () => element
+        });
+    }
+    updateSize() {
+        const containerModel = this.viewDescriptorService.getViewContainerModel(this.viewDescriptorService.getViewContainerByViewId(this.id));
+        const sessionId = this.debugService.getViewModel().focusedSession?.getId();
+        this.minimumBodySize = this.orientation === 0  ? getExpandedBodySize(this.debugService.getModel(), sessionId, MAX_VISIBLE_BREAKPOINTS) : 170;
+        this.maximumBodySize = this.orientation === 0  && containerModel.visibleViewDescriptors.length > 1 ? getExpandedBodySize(this.debugService.getModel(), sessionId, Number.POSITIVE_INFINITY) : Number.POSITIVE_INFINITY;
+    }
+    updateBreakpointsHint(delayed = false) {
+        if (!this.hintContainer) {
+            return;
+        }
+        const currentType = this.debugService.getViewModel().focusedSession?.configuration.type;
+        const dbg = currentType ? this.debugService.getAdapterManager().getDebugger(currentType) : undefined;
+        const message = dbg?.strings?.[DebuggerString.UnverifiedBreakpoints];
+        const debuggerHasUnverifiedBps = message && this.debugService.getModel().getBreakpoints().filter(bp => {
+            if (bp.verified || !bp.enabled) {
+                return false;
+            }
+            const langId = this.languageService.guessLanguageIdByFilepathOrFirstLine(bp.uri);
+            return langId && dbg.interestedInLanguage(langId);
+        });
+        if (message && debuggerHasUnverifiedBps?.length && this.debugService.getModel().areBreakpointsActivated()) {
+            if (delayed) {
+                const mdown = ( new MarkdownString(undefined, { isTrusted: true })).appendMarkdown(message);
+                this.hintContainer.setLabel('$(warning)', undefined, { title: { markdown: mdown, markdownNotSupportedFallback: message } });
+                dom.show(this.hintContainer.element);
+            }
+            else {
+                this.hintDelayer.schedule();
+            }
+        }
+        else {
+            dom.hide(this.hintContainer.element);
+        }
+    }
+    onBreakpointsChange() {
+        if (this.isBodyVisible()) {
+            this.updateSize();
+            if (this.list) {
+                const lastFocusIndex = this.list.getFocus()[0];
+                const needsRefocus = lastFocusIndex && !this.elements.includes(this.list.element(lastFocusIndex));
+                this.list.splice(0, this.list.length, this.elements);
+                this.needsRefresh = false;
+                if (needsRefocus) {
+                    this.list.focusNth(Math.min(lastFocusIndex, this.list.length - 1));
+                }
+            }
+            this.updateBreakpointsHint();
+        }
+        else {
+            this.needsRefresh = true;
+        }
+    }
+    onStateChange() {
+        if (this.isBodyVisible()) {
+            this.needsStateChange = false;
+            const thread = this.debugService.getViewModel().focusedThread;
+            let found = false;
+            if (thread && thread.stoppedDetails && thread.stoppedDetails.hitBreakpointIds && thread.stoppedDetails.hitBreakpointIds.length > 0) {
+                const hitBreakpointIds = thread.stoppedDetails.hitBreakpointIds;
+                const elements = this.elements;
+                const index = elements.findIndex(e => {
+                    const id = e.getIdFromAdapter(thread.session.getId());
+                    return typeof id === 'number' && hitBreakpointIds.indexOf(id) !== -1;
+                });
+                if (index >= 0) {
+                    this.list.setFocus([index]);
+                    this.list.setSelection([index]);
+                    found = true;
+                    this.autoFocusedIndex = index;
+                }
+            }
+            if (!found) {
+                const focus = this.list.getFocus();
+                const selection = this.list.getSelection();
+                if (this.autoFocusedIndex >= 0 && equals(focus, selection) && focus.indexOf(this.autoFocusedIndex) >= 0) {
+                    this.list.setFocus([]);
+                    this.list.setSelection([]);
+                }
+                this.autoFocusedIndex = -1;
+            }
+            this.updateBreakpointsHint();
+        }
+        else {
+            this.needsStateChange = true;
+        }
+    }
+    get elements() {
+        const model = this.debugService.getModel();
+        const sessionId = this.debugService.getViewModel().focusedSession?.getId();
+        const elements = model.getExceptionBreakpointsForSession(sessionId).concat(model.getFunctionBreakpoints()).concat(model.getDataBreakpoints()).concat(model.getBreakpoints()).concat(model.getInstructionBreakpoints());
+        return elements;
+    }
+};
+BreakpointsView = ( __decorate([
+    ( __param(1, IContextMenuService)),
+    ( __param(2, IDebugService)),
+    ( __param(3, IKeybindingService)),
+    ( __param(4, IInstantiationService)),
+    ( __param(5, IThemeService)),
+    ( __param(6, IEditorService)),
+    ( __param(7, IContextViewService)),
+    ( __param(8, IConfigurationService)),
+    ( __param(9, IViewDescriptorService)),
+    ( __param(10, IContextKeyService)),
+    ( __param(11, IOpenerService)),
+    ( __param(12, ITelemetryService)),
+    ( __param(13, ILabelService)),
+    ( __param(14, IMenuService)),
+    ( __param(15, IHoverService)),
+    ( __param(16, ILanguageService))
+], BreakpointsView));
+class BreakpointsDelegate {
+    constructor(view) {
+        this.view = view;
+    }
+    getHeight(_element) {
+        return 22;
+    }
+    getTemplateId(element) {
+        if (element instanceof Breakpoint) {
+            return BreakpointsRenderer.ID;
+        }
+        if (element instanceof FunctionBreakpoint) {
+            const inputBoxBreakpoint = this.view.inputBoxData?.breakpoint;
+            if (!element.name || (inputBoxBreakpoint && inputBoxBreakpoint.getId() === element.getId())) {
+                return FunctionBreakpointInputRenderer.ID;
+            }
+            return FunctionBreakpointsRenderer.ID;
+        }
+        if (element instanceof ExceptionBreakpoint) {
+            const inputBoxBreakpoint = this.view.inputBoxData?.breakpoint;
+            if (inputBoxBreakpoint && inputBoxBreakpoint.getId() === element.getId()) {
+                return ExceptionBreakpointInputRenderer.ID;
+            }
+            return ExceptionBreakpointsRenderer.ID;
+        }
+        if (element instanceof DataBreakpoint) {
+            return DataBreakpointsRenderer.ID;
+        }
+        if (element instanceof InstructionBreakpoint) {
+            return InstructionBreakpointsRenderer.ID;
+        }
+        return '';
+    }
+}
 const breakpointIdToActionBarDomeNode = ( new Map());
 let BreakpointsRenderer = class BreakpointsRenderer {
     constructor(menu, breakpointSupportsCondition, breakpointItemType, debugService, labelService) {
@@ -93,6 +414,57 @@ BreakpointsRenderer = ( __decorate([
     ( __param(3, IDebugService)),
     ( __param(4, ILabelService))
 ], BreakpointsRenderer));
+class ExceptionBreakpointsRenderer {
+    constructor(menu, breakpointSupportsCondition, breakpointItemType, debugService) {
+        this.menu = menu;
+        this.breakpointSupportsCondition = breakpointSupportsCondition;
+        this.breakpointItemType = breakpointItemType;
+        this.debugService = debugService;
+    }
+    get templateId() {
+        return ExceptionBreakpointsRenderer.ID;
+    }
+    renderTemplate(container) {
+        const data = Object.create(null);
+        data.toDispose = [];
+        data.breakpoint = dom.append(container, $('.breakpoint'));
+        data.checkbox = createCheckbox(data.toDispose);
+        data.toDispose.push(dom.addStandardDisposableListener(data.checkbox, 'change', (e) => {
+            this.debugService.enableOrDisableBreakpoints(!data.context.enabled, data.context);
+        }));
+        dom.append(data.breakpoint, data.checkbox);
+        data.name = dom.append(data.breakpoint, $('span.name'));
+        data.condition = dom.append(data.breakpoint, $('span.condition'));
+        data.breakpoint.classList.add('exception');
+        data.actionBar = ( new ActionBar(data.breakpoint));
+        data.toDispose.push(data.actionBar);
+        return data;
+    }
+    renderElement(exceptionBreakpoint, index, data) {
+        data.context = exceptionBreakpoint;
+        data.name.textContent = exceptionBreakpoint.label || `${exceptionBreakpoint.filter} exceptions`;
+        data.breakpoint.title = exceptionBreakpoint.verified ? (exceptionBreakpoint.description || data.name.textContent) : exceptionBreakpoint.message || ( localize('unverifiedExceptionBreakpoint', "Unverified Exception Breakpoint"));
+        data.breakpoint.classList.toggle('disabled', !exceptionBreakpoint.verified);
+        data.checkbox.checked = exceptionBreakpoint.enabled;
+        data.condition.textContent = exceptionBreakpoint.condition || '';
+        data.condition.title = ( localize(
+            'expressionCondition',
+            "Expression condition: {0}",
+            exceptionBreakpoint.condition
+        ));
+        const primary = [];
+        this.breakpointSupportsCondition.set(exceptionBreakpoint.supportsCondition);
+        this.breakpointItemType.set('exceptionBreakpoint');
+        createAndFillInActionBarActions(this.menu, { arg: exceptionBreakpoint, shouldForwardArgs: true }, { primary, secondary: [] }, 'inline');
+        data.actionBar.clear();
+        data.actionBar.push(primary, { icon: true, label: false });
+        breakpointIdToActionBarDomeNode.set(exceptionBreakpoint.getId(), data.actionBar.domNode);
+    }
+    disposeTemplate(templateData) {
+        dispose(templateData.toDispose);
+    }
+}
+ExceptionBreakpointsRenderer.ID = 'exceptionbreakpoints';
 let FunctionBreakpointsRenderer = class FunctionBreakpointsRenderer {
     constructor(menu, breakpointSupportsCondition, breakpointItemType, debugService, labelService) {
         this.menu = menu;
@@ -268,6 +640,211 @@ InstructionBreakpointsRenderer = ( __decorate([
     ( __param(0, IDebugService)),
     ( __param(1, ILabelService))
 ], InstructionBreakpointsRenderer));
+class FunctionBreakpointInputRenderer {
+    constructor(view, debugService, contextViewService, labelService) {
+        this.view = view;
+        this.debugService = debugService;
+        this.contextViewService = contextViewService;
+        this.labelService = labelService;
+    }
+    get templateId() {
+        return FunctionBreakpointInputRenderer.ID;
+    }
+    renderTemplate(container) {
+        const template = Object.create(null);
+        const toDispose = [];
+        const breakpoint = dom.append(container, $('.breakpoint'));
+        template.icon = $('.icon');
+        template.checkbox = createCheckbox(toDispose);
+        dom.append(breakpoint, template.icon);
+        dom.append(breakpoint, template.checkbox);
+        this.view.breakpointInputFocused.set(true);
+        const inputBoxContainer = dom.append(breakpoint, $('.inputBoxContainer'));
+        const inputBox = ( new InputBox(
+            inputBoxContainer,
+            this.contextViewService,
+            { inputBoxStyles: defaultInputBoxStyles }
+        ));
+        const wrapUp = (success) => {
+            template.updating = true;
+            try {
+                this.view.breakpointInputFocused.set(false);
+                const id = template.breakpoint.getId();
+                if (success) {
+                    if (template.type === 'name') {
+                        this.debugService.updateFunctionBreakpoint(id, { name: inputBox.value });
+                    }
+                    if (template.type === 'condition') {
+                        this.debugService.updateFunctionBreakpoint(id, { condition: inputBox.value });
+                    }
+                    if (template.type === 'hitCount') {
+                        this.debugService.updateFunctionBreakpoint(id, { hitCondition: inputBox.value });
+                    }
+                }
+                else {
+                    if (template.type === 'name' && !template.breakpoint.name) {
+                        this.debugService.removeFunctionBreakpoints(id);
+                    }
+                    else {
+                        this.view.renderInputBox(undefined);
+                    }
+                }
+            }
+            finally {
+                template.updating = false;
+            }
+        };
+        toDispose.push(dom.addStandardDisposableListener(inputBox.inputElement, 'keydown', (e) => {
+            const isEscape = e.equals(9 );
+            const isEnter = e.equals(3 );
+            if (isEscape || isEnter) {
+                e.preventDefault();
+                e.stopPropagation();
+                wrapUp(isEnter);
+            }
+        }));
+        toDispose.push(dom.addDisposableListener(inputBox.inputElement, 'blur', () => {
+            if (!template.updating) {
+                wrapUp(!!inputBox.value);
+            }
+        }));
+        template.inputBox = inputBox;
+        template.toDispose = toDispose;
+        return template;
+    }
+    renderElement(functionBreakpoint, _index, data) {
+        data.breakpoint = functionBreakpoint;
+        data.type = this.view.inputBoxData?.type || 'name';
+        const { icon, message } = getBreakpointMessageAndIcon(this.debugService.state, this.debugService.getModel().areBreakpointsActivated(), functionBreakpoint, this.labelService);
+        data.icon.className = ThemeIcon.asClassName(icon);
+        data.icon.title = message ? message : '';
+        data.checkbox.checked = functionBreakpoint.enabled;
+        data.checkbox.disabled = true;
+        data.inputBox.value = functionBreakpoint.name || '';
+        let placeholder = ( localize('functionBreakpointPlaceholder', "Function to break on"));
+        let ariaLabel = ( localize('functionBreakPointInputAriaLabel', "Type function breakpoint."));
+        if (data.type === 'condition') {
+            data.inputBox.value = functionBreakpoint.condition || '';
+            placeholder = ( localize(
+                'functionBreakpointExpressionPlaceholder',
+                "Break when expression evaluates to true"
+            ));
+            ariaLabel = ( localize(
+                'functionBreakPointExpresionAriaLabel',
+                "Type expression. Function breakpoint will break when expression evaluates to true"
+            ));
+        }
+        else if (data.type === 'hitCount') {
+            data.inputBox.value = functionBreakpoint.hitCondition || '';
+            placeholder = ( localize('functionBreakpointHitCountPlaceholder', "Break when hit count is met"));
+            ariaLabel = ( localize(
+                'functionBreakPointHitCountAriaLabel',
+                "Type hit count. Function breakpoint will break when hit count is met."
+            ));
+        }
+        data.inputBox.setAriaLabel(ariaLabel);
+        data.inputBox.setPlaceHolder(placeholder);
+        setTimeout(() => {
+            data.inputBox.focus();
+            data.inputBox.select();
+        }, 0);
+    }
+    disposeTemplate(templateData) {
+        dispose(templateData.toDispose);
+    }
+}
+FunctionBreakpointInputRenderer.ID = 'functionbreakpointinput';
+class ExceptionBreakpointInputRenderer {
+    constructor(view, debugService, contextViewService) {
+        this.view = view;
+        this.debugService = debugService;
+        this.contextViewService = contextViewService;
+    }
+    get templateId() {
+        return ExceptionBreakpointInputRenderer.ID;
+    }
+    renderTemplate(container) {
+        const template = Object.create(null);
+        const toDispose = [];
+        const breakpoint = dom.append(container, $('.breakpoint'));
+        breakpoint.classList.add('exception');
+        template.checkbox = createCheckbox(toDispose);
+        dom.append(breakpoint, template.checkbox);
+        this.view.breakpointInputFocused.set(true);
+        const inputBoxContainer = dom.append(breakpoint, $('.inputBoxContainer'));
+        const inputBox = ( new InputBox(inputBoxContainer, this.contextViewService, {
+            ariaLabel: ( localize('exceptionBreakpointAriaLabel', "Type exception breakpoint condition")),
+            inputBoxStyles: defaultInputBoxStyles
+        }));
+        const wrapUp = (success) => {
+            this.view.breakpointInputFocused.set(false);
+            let newCondition = template.breakpoint.condition;
+            if (success) {
+                newCondition = inputBox.value !== '' ? inputBox.value : undefined;
+            }
+            this.debugService.setExceptionBreakpointCondition(template.breakpoint, newCondition);
+        };
+        toDispose.push(dom.addStandardDisposableListener(inputBox.inputElement, 'keydown', (e) => {
+            const isEscape = e.equals(9 );
+            const isEnter = e.equals(3 );
+            if (isEscape || isEnter) {
+                e.preventDefault();
+                e.stopPropagation();
+                wrapUp(isEnter);
+            }
+        }));
+        toDispose.push(dom.addDisposableListener(inputBox.inputElement, 'blur', () => {
+            setTimeout(() => {
+                wrapUp(true);
+            });
+        }));
+        template.inputBox = inputBox;
+        template.toDispose = toDispose;
+        return template;
+    }
+    renderElement(exceptionBreakpoint, _index, data) {
+        const placeHolder = exceptionBreakpoint.conditionDescription || ( localize(
+            'exceptionBreakpointPlaceholder',
+            "Break when expression evaluates to true"
+        ));
+        data.inputBox.setPlaceHolder(placeHolder);
+        data.breakpoint = exceptionBreakpoint;
+        data.checkbox.checked = exceptionBreakpoint.enabled;
+        data.checkbox.disabled = true;
+        data.inputBox.value = exceptionBreakpoint.condition || '';
+        setTimeout(() => {
+            data.inputBox.focus();
+            data.inputBox.select();
+        }, 0);
+    }
+    disposeTemplate(templateData) {
+        dispose(templateData.toDispose);
+    }
+}
+ExceptionBreakpointInputRenderer.ID = 'exceptionbreakpointinput';
+class BreakpointsAccessibilityProvider {
+    constructor(debugService, labelService) {
+        this.debugService = debugService;
+        this.labelService = labelService;
+    }
+    getWidgetAriaLabel() {
+        return ( localize('breakpoints', "Breakpoints"));
+    }
+    getRole() {
+        return 'checkbox';
+    }
+    isChecked(breakpoint) {
+        return breakpoint.enabled;
+    }
+    getAriaLabel(element) {
+        if (element instanceof ExceptionBreakpoint) {
+            return ( element.toString());
+        }
+        const { message } = getBreakpointMessageAndIcon(this.debugService.state, this.debugService.getModel().areBreakpointsActivated(), element, this.labelService);
+        const toString = ( element.toString());
+        return message ? `${toString}, ${message}` : toString;
+    }
+}
 function openBreakpointSource(breakpoint, sideBySide, preserveFocus, pinned, debugService, editorService) {
     if (breakpoint.uri.scheme === DEBUG_SCHEME && debugService.state === 0 ) {
         return Promise.resolve(undefined);
@@ -711,4 +1288,4 @@ registerAction2(class extends ViewAction {
         view.renderInputBox({ breakpoint, type: 'hitCount' });
     }
 });
-export { getBreakpointMessageAndIcon, openBreakpointSource };
+export { BreakpointsView, getBreakpointMessageAndIcon, getExpandedBodySize, openBreakpointSource };