123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180 |
- /*---------------------------------------------------------------------------------------------
- * Copyright (c) Microsoft Corporation. All rights reserved.
- * Licensed under the MIT License. See License.txt in the project root for license information.
- *--------------------------------------------------------------------------------------------*/
- var __decorate = (this && this.__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 = (this && this.__param) || function (paramIndex, decorator) {
- return function (target, key) { decorator(target, key, paramIndex); }
- };
- import { DisposableStore } from '../../../base/common/lifecycle.js';
- import './renameInputField.css';
- import { Position } from '../../common/core/position.js';
- import { localize } from '../../../nls.js';
- import { IContextKeyService, RawContextKey } from '../../../platform/contextkey/common/contextkey.js';
- import { IKeybindingService } from '../../../platform/keybinding/common/keybinding.js';
- import { editorWidgetBackground, inputBackground, inputBorder, inputForeground, widgetShadow } from '../../../platform/theme/common/colorRegistry.js';
- import { IThemeService } from '../../../platform/theme/common/themeService.js';
- export const CONTEXT_RENAME_INPUT_VISIBLE = new RawContextKey('renameInputVisible', false, localize('renameInputVisible', "Whether the rename input widget is visible"));
- let RenameInputField = class RenameInputField {
- constructor(_editor, _acceptKeybindings, _themeService, _keybindingService, contextKeyService) {
- this._editor = _editor;
- this._acceptKeybindings = _acceptKeybindings;
- this._themeService = _themeService;
- this._keybindingService = _keybindingService;
- this._disposables = new DisposableStore();
- this.allowEditorOverflow = true;
- this._visibleContextKey = CONTEXT_RENAME_INPUT_VISIBLE.bindTo(contextKeyService);
- this._editor.addContentWidget(this);
- this._disposables.add(this._editor.onDidChangeConfiguration(e => {
- if (e.hasChanged(43 /* fontInfo */)) {
- this._updateFont();
- }
- }));
- this._disposables.add(_themeService.onDidColorThemeChange(this._updateStyles, this));
- }
- dispose() {
- this._disposables.dispose();
- this._editor.removeContentWidget(this);
- }
- getId() {
- return '__renameInputWidget';
- }
- getDomNode() {
- if (!this._domNode) {
- this._domNode = document.createElement('div');
- this._domNode.className = 'monaco-editor rename-box';
- this._input = document.createElement('input');
- this._input.className = 'rename-input';
- this._input.type = 'text';
- this._input.setAttribute('aria-label', localize('renameAriaLabel', "Rename input. Type new name and press Enter to commit."));
- this._domNode.appendChild(this._input);
- this._label = document.createElement('div');
- this._label.className = 'rename-label';
- this._domNode.appendChild(this._label);
- const updateLabel = () => {
- var _a, _b;
- const [accept, preview] = this._acceptKeybindings;
- this._keybindingService.lookupKeybinding(accept);
- this._label.innerText = localize({ key: 'label', comment: ['placeholders are keybindings, e.g "F2 to Rename, Shift+F2 to Preview"'] }, "{0} to Rename, {1} to Preview", (_a = this._keybindingService.lookupKeybinding(accept)) === null || _a === void 0 ? void 0 : _a.getLabel(), (_b = this._keybindingService.lookupKeybinding(preview)) === null || _b === void 0 ? void 0 : _b.getLabel());
- };
- updateLabel();
- this._disposables.add(this._keybindingService.onDidUpdateKeybindings(updateLabel));
- this._updateFont();
- this._updateStyles(this._themeService.getColorTheme());
- }
- return this._domNode;
- }
- _updateStyles(theme) {
- var _a, _b, _c, _d;
- if (!this._input || !this._domNode) {
- return;
- }
- const widgetShadowColor = theme.getColor(widgetShadow);
- this._domNode.style.backgroundColor = String((_a = theme.getColor(editorWidgetBackground)) !== null && _a !== void 0 ? _a : '');
- this._domNode.style.boxShadow = widgetShadowColor ? ` 0 0 8px 2px ${widgetShadowColor}` : '';
- this._domNode.style.color = String((_b = theme.getColor(inputForeground)) !== null && _b !== void 0 ? _b : '');
- this._input.style.backgroundColor = String((_c = theme.getColor(inputBackground)) !== null && _c !== void 0 ? _c : '');
- // this._input.style.color = String(theme.getColor(inputForeground) ?? '');
- const border = theme.getColor(inputBorder);
- this._input.style.borderWidth = border ? '1px' : '0px';
- this._input.style.borderStyle = border ? 'solid' : 'none';
- this._input.style.borderColor = (_d = border === null || border === void 0 ? void 0 : border.toString()) !== null && _d !== void 0 ? _d : 'none';
- }
- _updateFont() {
- if (!this._input || !this._label) {
- return;
- }
- const fontInfo = this._editor.getOption(43 /* fontInfo */);
- this._input.style.fontFamily = fontInfo.fontFamily;
- this._input.style.fontWeight = fontInfo.fontWeight;
- this._input.style.fontSize = `${fontInfo.fontSize}px`;
- this._label.style.fontSize = `${fontInfo.fontSize * 0.8}px`;
- }
- getPosition() {
- if (!this._visible) {
- return null;
- }
- return {
- position: this._position,
- preference: [2 /* BELOW */, 1 /* ABOVE */]
- };
- }
- afterRender(position) {
- if (!position) {
- // cancel rename when input widget isn't rendered anymore
- this.cancelInput(true);
- }
- }
- acceptInput(wantsPreview) {
- if (this._currentAcceptInput) {
- this._currentAcceptInput(wantsPreview);
- }
- }
- cancelInput(focusEditor) {
- if (this._currentCancelInput) {
- this._currentCancelInput(focusEditor);
- }
- }
- getInput(where, value, selectionStart, selectionEnd, supportPreview, token) {
- this._domNode.classList.toggle('preview', supportPreview);
- this._position = new Position(where.startLineNumber, where.startColumn);
- this._input.value = value;
- this._input.setAttribute('selectionStart', selectionStart.toString());
- this._input.setAttribute('selectionEnd', selectionEnd.toString());
- this._input.size = Math.max((where.endColumn - where.startColumn) * 1.1, 20);
- const disposeOnDone = new DisposableStore();
- return new Promise(resolve => {
- this._currentCancelInput = (focusEditor) => {
- this._currentAcceptInput = undefined;
- this._currentCancelInput = undefined;
- resolve(focusEditor);
- return true;
- };
- this._currentAcceptInput = (wantsPreview) => {
- if (this._input.value.trim().length === 0 || this._input.value === value) {
- // empty or whitespace only or not changed
- this.cancelInput(true);
- return;
- }
- this._currentAcceptInput = undefined;
- this._currentCancelInput = undefined;
- resolve({
- newName: this._input.value,
- wantsPreview: supportPreview && wantsPreview
- });
- };
- token.onCancellationRequested(() => this.cancelInput(true));
- disposeOnDone.add(this._editor.onDidBlurEditorWidget(() => this.cancelInput(false)));
- this._show();
- }).finally(() => {
- disposeOnDone.dispose();
- this._hide();
- });
- }
- _show() {
- this._editor.revealLineInCenterIfOutsideViewport(this._position.lineNumber, 0 /* Smooth */);
- this._visible = true;
- this._visibleContextKey.set(true);
- this._editor.layoutContentWidget(this);
- setTimeout(() => {
- this._input.focus();
- this._input.setSelectionRange(parseInt(this._input.getAttribute('selectionStart')), parseInt(this._input.getAttribute('selectionEnd')));
- }, 100);
- }
- _hide() {
- this._visible = false;
- this._visibleContextKey.reset();
- this._editor.layoutContentWidget(this);
- }
- };
- RenameInputField = __decorate([
- __param(2, IThemeService),
- __param(3, IKeybindingService),
- __param(4, IContextKeyService)
- ], RenameInputField);
- export { RenameInputField };
|