@theia/core 1.24.0 → 1.25.0-next.10

package/src/browser/shell/application-shell.ts

@@ -38,6 +38,7 @@ import { waitForRevealed, waitForClosed } from '../widgets';
 import { CorePreferences } from '../core-preferences';
 import { BreadcrumbsRendererFactory } from '../breadcrumbs/breadcrumbs-renderer';
 import { Deferred } from '../../common/promise-util';
+import { SaveResourceService } from '../save-resource-service';
 
 /** The class name added to ApplicationShell instances. */
 const APPLICATION_SHELL_CLASS = 'theia-ApplicationShell';
@@ -216,7 +217,8 @@ export class ApplicationShell extends Widget {
         @inject(SplitPositionHandler) protected splitPositionHandler: SplitPositionHandler,
         @inject(FrontendApplicationStateService) protected readonly applicationStateService: FrontendApplicationStateService,
         @inject(ApplicationShellOptions) @optional() options: RecursivePartial<ApplicationShell.Options> = {},
-        @inject(CorePreferences) protected readonly corePreferences: CorePreferences
+        @inject(CorePreferences) protected readonly corePreferences: CorePreferences,
+        @inject(SaveResourceService) protected readonly saveResourceService: SaveResourceService,
     ) {
         super(options as Widget.IOptions);
     }
@@ -688,6 +690,7 @@ export class ApplicationShell extends Widget {
                 this.collapseBottomPanel();
             }
             const widgets = toArray(this.bottomPanel.widgets());
+            this.bottomPanel.markActiveTabBar(widgets[0]?.title);
             if (bottomPanel.pinned && bottomPanel.pinned.length === widgets.length) {
                 widgets.forEach((a, i) => {
                     if (bottomPanel.pinned![i]) {
@@ -704,6 +707,9 @@ export class ApplicationShell extends Widget {
             this.mainPanel.restoreLayout(mainPanel);
             this.registerWithFocusTracker(mainPanel.main);
             const widgets = toArray(this.mainPanel.widgets());
+            // We don't store information about the last active tabbar
+            // So we simply mark the first as being active
+            this.mainPanel.markActiveTabBar(widgets[0]?.title);
             if (mainPanelPinned && mainPanelPinned.length === widgets.length) {
                 widgets.forEach((a, i) => {
                     if (mainPanelPinned[i]) {
@@ -1070,7 +1076,11 @@ export class ApplicationShell extends Widget {
         }
         this.tracker.add(widget);
         this.checkActivation(widget);
-        Saveable.apply(widget, () => this.widgets.filter((maybeSaveable): maybeSaveable is Widget & SaveableSource => !!Saveable.get(maybeSaveable)));
+        Saveable.apply(
+            widget,
+            () => this.widgets.filter((maybeSaveable): maybeSaveable is Widget & SaveableSource => !!Saveable.get(maybeSaveable)),
+            (toSave, options) => this.saveResourceService.save(toSave, options),
+        );
         if (ApplicationShell.TrackableWidgetProvider.is(widget)) {
             for (const toTrack of widget.getTrackableWidgets()) {
                 this.track(toTrack);
@@ -1412,6 +1422,10 @@ export class ApplicationShell extends Widget {
                 alignment: StatusBarAlignment.RIGHT,
                 tooltip: 'Toggle Bottom Panel',
                 command: 'core.toggle.bottom.panel',
+                accessibilityInformation: {
+                    label: 'Toggle Bottom Panel',
+                    role: 'button'
+                },
                 priority: -1000
             };
             this.statusBar.setElement(BOTTOM_PANEL_TOGGLE_ID, element);
@@ -1831,32 +1845,32 @@ export class ApplicationShell extends Widget {
      * Test whether the current widget is dirty.
      */
     canSave(): boolean {
-        return Saveable.isDirty(this.currentWidget);
+        return this.saveResourceService.canSave(this.currentWidget);
     }
 
     /**
      * Save the current widget if it is dirty.
      */
     async save(options?: SaveOptions): Promise<void> {
-        await Saveable.save(this.currentWidget, options);
+        await this.saveResourceService.save(this.currentWidget, options);
     }
 
     /**
      * Test whether there is a dirty widget.
      */
     canSaveAll(): boolean {
-        return this.tracker.widgets.some(Saveable.isDirty);
+        return this.tracker.widgets.some(widget => this.saveResourceService.canSave(widget));
     }
 
     /**
      * Save all dirty widgets.
      */
     async saveAll(options?: SaveOptions): Promise<void> {
-        await Promise.all(this.tracker.widgets.map(widget => {
-            if (Saveable.isDirty(widget)) {
-                Saveable.save(widget, options);
+        for (const widget of this.widgets) {
+            if (this.saveResourceService.canSaveNotSaveAs(widget)) {
+                await this.saveResourceService.save(widget, options);
             }
-        }));
+        }
     }
 
     /**

package/src/browser/shell/theia-dock-panel.ts

@@ -24,6 +24,7 @@ import { inject } from 'inversify';
 import { Emitter, environment } from '../../common';
 
 export const MAXIMIZED_CLASS = 'theia-maximized';
+export const ACTIVE_TABBAR_CLASS = 'theia-tabBar-active';
 const VISIBLE_MENU_MAXIMIZED_CLASS = 'theia-visible-menu-maximized';
 
 export const MAIN_AREA_ID = 'theia-main-content-panel';
@@ -106,6 +107,7 @@ export class TheiaDockPanel extends DockPanel {
     markAsCurrent(title: Title<Widget> | undefined): void {
         this.toDisposeOnMarkAsCurrent.dispose();
         this._currentTitle = title;
+        this.markActiveTabBar(title);
         if (title) {
             const resetCurrent = () => this.markAsCurrent(undefined);
             title.owner.disposed.connect(resetCurrent);
@@ -115,17 +117,31 @@ export class TheiaDockPanel extends DockPanel {
         }
     }
 
+    markActiveTabBar(title?: Title<Widget>): void {
+        const tabBars = toArray(this.tabBars());
+        tabBars.forEach(tabBar => tabBar.removeClass(ACTIVE_TABBAR_CLASS));
+        const activeTabBar = title && this.findTabBar(title);
+        if (activeTabBar) {
+            activeTabBar.addClass(ACTIVE_TABBAR_CLASS);
+        } else if (tabBars.length > 0) {
+            // At least one tabbar needs to be active
+            tabBars[0].addClass(ACTIVE_TABBAR_CLASS);
+        }
+    }
+
     override addWidget(widget: Widget, options?: DockPanel.IAddOptions): void {
         if (this.mode === 'single-document' && widget.parent === this) {
             return;
         }
         super.addWidget(widget, options);
         this.widgetAdded.emit(widget);
+        this.markActiveTabBar(widget.title);
     }
 
     override activateWidget(widget: Widget): void {
         super.activateWidget(widget);
         this.widgetActivated.emit(widget);
+        this.markActiveTabBar(widget.title);
     }
 
     protected override onChildRemoved(msg: Widget.ChildMessage): void {

package/src/browser/status-bar/status-bar.tsx

@@ -22,6 +22,7 @@ import { ReactWidget } from '../widgets/react-widget';
 import { FrontendApplicationStateService } from '../frontend-application-state';
 import { LabelParser, LabelIcon } from '../label-parser';
 import { PreferenceService } from '../preferences';
+import { AccessibilityInformation } from '../../common/accessibility';
 
 export interface StatusBarEntry {
     /**
@@ -44,6 +45,7 @@ export interface StatusBarEntry {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     arguments?: any[];
     priority?: number;
+    accessibilityInformation?: AccessibilityInformation;
     onclick?: (e: MouseEvent) => void;
 }
 
@@ -51,13 +53,6 @@ export enum StatusBarAlignment {
     LEFT, RIGHT
 }
 
-export interface StatusBarEntryAttributes {
-    className?: string;
-    title?: string;
-    style?: object;
-    onClick?: (e: MouseEvent) => void;
-}
-
 export const STATUSBAR_WIDGET_FACTORY_ID = 'statusBar';
 
 export const StatusBar = Symbol('StatusBar');
@@ -169,15 +164,15 @@ export class StatusBarImpl extends ReactWidget implements StatusBar {
         };
     }
 
-    protected createAttributes(entry: StatusBarEntry): StatusBarEntryAttributes {
-        const attrs: StatusBarEntryAttributes = {};
+    protected createAttributes(entry: StatusBarEntry): React.Attributes & React.HTMLAttributes<HTMLElement> {
+        const attrs: React.Attributes & React.HTMLAttributes<HTMLElement> = {};
 
         if (entry.command) {
             attrs.onClick = this.onclick(entry);
             attrs.className = 'element hasCommand';
         } else if (entry.onclick) {
             attrs.onClick = e => {
-                if (entry.onclick) {
+                if (entry.onclick && e instanceof MouseEvent) {
                     entry.onclick(e);
                 }
             };
@@ -189,15 +184,20 @@ export class StatusBarImpl extends ReactWidget implements StatusBar {
         if (entry.tooltip) {
             attrs.title = entry.tooltip;
         }
+        if (entry.className) {
+            attrs.className += ' ' + entry.className;
+        }
+        if (entry.accessibilityInformation) {
+            attrs['aria-label'] = entry.accessibilityInformation.label;
+            attrs.role = entry.accessibilityInformation.role;
+        } else {
+            attrs['aria-label'] = [entry.text, entry.tooltip].join(', ');
+        }
 
         attrs.style = {
             color: entry.color || this.color
         };
 
-        if (entry.className) {
-            attrs.className += ' ' + entry.className;
-        }
-
         return attrs;
     }
 

package/src/browser/style/sidepanel.css

@@ -90,19 +90,11 @@
   border-top-color: transparent;
 }
 
-.p-TabBar.theia-app-left .p-TabBar-tab.p-mod-current.theia-mod-active {
-    border-left: var(--theia-panel-border-width) solid var(--theia-focusBorder);
-}
-
 .p-TabBar.theia-app-right .p-TabBar-tab.p-mod-current {
     border-right: var(--theia-panel-border-width) solid var(--theia-activityBar-activeBorder);
     border-top-color: transparent;
 }
 
-.p-TabBar.theia-app-right .p-TabBar-tab.p-mod-current.theia-mod-active {
-    border-right: var(--theia-panel-border-width) solid var(--theia-focusBorder);
-}
-
 .p-TabBar.theia-app-sides .p-TabBar-tabLabel,
 .p-TabBar.theia-app-sides .p-TabBar-tabCloseIcon {
   display: none;
@@ -285,16 +277,19 @@
 
 #theia-bottom-content-panel .p-TabBar-tab:not(.p-mod-current) {
     color: var(--theia-panelTitle-inactiveForeground);
-    border-top: var(--theia-border-width) solid  var(--theia-panel-background);
 }
 
 #theia-bottom-content-panel .p-TabBar-tab.p-mod-current {
     color: var(--theia-panelTitle-activeForeground);
-    border-top: var(--theia-border-width) solid var(--theia-panelTitle-activeBorder);
+    box-shadow: 0 var(--theia-border-width) 0 var(--theia-panelTitle-activeBorder) inset;
+}
+
+#theia-bottom-content-panel .p-TabBar:not(.theia-tabBar-active) .p-TabBar-tab .theia-tab-icon-label {
+    color: var(--theia-tab-unfocusedInactiveForeground);
 }
 
-#theia-bottom-content-panel .p-TabBar-tab.p-mod-current.theia-mod-active {
-    border-top-color: var(--theia-focusBorder);
+#theia-bottom-content-panel .p-TabBar:not(.theia-tabBar-active) .p-TabBar-tab.p-mod-current .theia-tab-icon-label {
+    color: var(--theia-tab-unfocusedActiveForeground);
 }
 
 /*-----------------------------------------------------------------------------

package/src/browser/style/tabs.css

@@ -80,65 +80,34 @@
 
 #theia-main-content-panel .p-TabBar .p-TabBar-tab {
     border-right: 1px solid var(--theia-tab-border);
+    background: var(--theia-tab-inactiveBackground);
+    color: var(--theia-tab-inactiveForeground);
 }
 
-#theia-main-content-panel .p-TabBar .p-TabBar-tab:hover.theia-mod-active {
-    background: var(--theia-tab-hoverBackground) !important;
-    box-shadow: var(--theia-tab-hoverBorder) 0 -1px inset !important;
-}
-
-#theia-main-content-panel .p-TabBar .p-TabBar-tab:hover:not(.theia-mod-active) {
-    background: var(--theia-tab-unfocusedHoverBackground) !important;
-    box-shadow: var(--theia-tab-unfocusedHoverBorder) 0 -1px inset !important;
+#theia-main-content-panel .p-TabBar .p-TabBar-tab:hover {
+    background: var(--theia-tab-hoverBackground);
+    box-shadow: 0 1px 0 var(--theia-tab-hoverBorder) inset;
 }
 
-/* active tab in an active group */
-body.theia-editor-highlightModifiedTabs
-#theia-main-content-panel .p-TabBar .p-TabBar-tab.p-mod-current.theia-mod-active.theia-mod-dirty {
-    border-top: 1px solid var(--theia-tab-activeModifiedBorder);
+#theia-main-content-panel .p-TabBar:not(.theia-tabBar-active) .p-TabBar-tab:hover {
+    background: var(--theia-tab-unfocusedHoverBackground);
+    box-shadow: 0 1px 0 var(--theia-tab-unfocusedHoverBorder) inset;
 }
 
-#theia-main-content-panel .p-TabBar .p-TabBar-tab.p-mod-current.theia-mod-active {
+#theia-main-content-panel .p-TabBar .p-TabBar-tab.p-mod-current {
     background: var(--theia-tab-activeBackground);
     color: var(--theia-tab-activeForeground);
-    border-top: 1px solid var(--theia-tab-activeBorderTop);
-    border-bottom: 1px solid var(--theia-tab-activeBorder);
-}
-
-/* inactive tab in an active group */
-body.theia-editor-highlightModifiedTabs
-#theia-main-content-panel .p-TabBar .p-TabBar-tab:not(.p-mod-current).theia-mod-active.theia-mod-dirty {
-    border-top: 1px solid var(--theia-tab-inactiveModifiedBorder);
-}
-
-#theia-main-content-panel .p-TabBar .p-TabBar-tab:not(.p-mod-current).theia-mod-active {
-    background: var(--theia-tab-inactiveBackground);
-    color: var(--theia-tab-inactiveForeground);
+    box-shadow: 0 1px 0 var(--theia-tab-activeBorderTop) inset, 0 -1px 0 var(--theia-tab-activeBorder) inset;
 }
 
-/* active tab in an unfocused group */
-body.theia-editor-highlightModifiedTabs
-#theia-main-content-panel .p-TabBar .p-TabBar-tab.p-mod-current:not(.theia-mod-active).theia-mod-dirty {
-    border-top: 1px solid var(--theia-tab-unfocusedActiveModifiedBorder);
+#theia-main-content-panel .p-TabBar:not(.theia-tabBar-active) .p-TabBar-tab {
+    color: var(--theia-tab-unfocusedInactiveForeground);
 }
 
-#theia-main-content-panel .p-TabBar .p-TabBar-tab.p-mod-current:not(.theia-mod-active) {
+#theia-main-content-panel .p-TabBar:not(.theia-tabBar-active) .p-TabBar-tab.p-mod-current {
     background: var(--theia-tab-unfocusedActiveBackground);
     color: var(--theia-tab-unfocusedActiveForeground);
-    border-top: 1px solid var(--theia-tab-unfocusedActiveBorderTop);
-    border-bottom: 1px solid var(--theia-tab-unfocusedActiveBorder);
-}
-
-/* inactive tab in an unfocused group */
-body.theia-editor-highlightModifiedTabs
-#theia-main-content-panel .p-TabBar .p-TabBar-tab:not(.p-mod-current):not(.theia-mod-active).theia-mod-dirty {
-    border-top: 1px solid var(--theia-tab-unfocusedInactiveModifiedBorder);
-}
-
-#theia-main-content-panel .p-TabBar .p-TabBar-tab:not(.p-mod-current):not(.theia-mod-active) {
-    background: var(--theia-tab-inactiveBackground);
-    color: var(--theia-tab-inactiveForeground);
-    border-top: 1px solid var(--theia-tab-inactiveBackground);
+    box-shadow: 0 1px 0 var(--theia-tab-unfocusedActiveBorderTop) inset, 0 -1px 0 var(--theia-tab-unfocusedActiveBorder) inset;
 }
 
 .p-TabBar.theia-app-centers {

package/src/browser/user-working-directory-provider.ts

@@ -0,0 +1,48 @@
+// *****************************************************************************
+// Copyright (C) 2022 Ericsson and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+// *****************************************************************************
+
+import { inject, injectable } from 'inversify';
+import URI from '../common/uri';
+import { MaybePromise, SelectionService, UriSelection } from '../common';
+import { EnvVariablesServer } from '../common/env-variables';
+
+@injectable()
+export class UserWorkingDirectoryProvider {
+    @inject(SelectionService) protected readonly selectionService: SelectionService;
+    @inject(EnvVariablesServer) protected readonly envVariables: EnvVariablesServer;
+
+    /**
+     * @returns A {@link URI} that represents a good guess about the directory in which the user is currently operating.
+     *
+     * Factors considered may include the current widget, current selection, user home directory, or other application state.
+     */
+    async getUserWorkingDir(): Promise<URI> {
+        return await this.getFromSelection()
+            ?? this.getFromUserHome();
+    }
+
+    protected getFromSelection(): MaybePromise<URI | undefined> {
+        return this.ensureIsDirectory(UriSelection.getUri(this.selectionService.selection));
+    }
+
+    protected getFromUserHome(): MaybePromise<URI> {
+        return this.envVariables.getHomeDirUri().then(home => new URI(home));
+    }
+
+    protected ensureIsDirectory(uri?: URI): MaybePromise<URI | undefined> {
+        return uri?.parent;
+    }
+}

package/src/common/accessibility.ts

@@ -0,0 +1,33 @@
+// *****************************************************************************
+// Copyright (C) 2022 STMicroelectronics and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+// *****************************************************************************
+
+/**
+ * Accessibility information which controls screen reader behavior.
+ */
+export interface AccessibilityInformation {
+    /**
+     * Label to be read out by a screen reader once the item has focus.
+     */
+    readonly label: string;
+
+    /**
+     * Role of the widget which defines how a screen reader interacts with it.
+     * The role should be set in special cases when for example a tree-like element behaves like a checkbox.
+     * If role is not specified the editor will pick the appropriate role automatically.
+     * More about aria roles can be found here https://w3c.github.io/aria/#widget_roles
+     */
+    readonly role?: string;
+}

package/src/common/quick-pick-service.ts

@@ -201,6 +201,7 @@ export interface QuickPick<T extends QuickPickItemOrSeparator> extends QuickInpu
     canSelectMany: boolean;
     matchOnDescription: boolean;
     matchOnDetail: boolean;
+    keepScrollPosition: boolean;
     readonly onDidAccept: Event<{ inBackground: boolean } | undefined>;
     readonly onDidChangeValue: Event<string>;
     readonly onDidTriggerButton: Event<QuickInputButton>;
@@ -261,6 +262,7 @@ export interface QuickPickOptions<T extends QuickPickItemOrSeparator> {
     matchOnDetail?: boolean;
     matchOnLabel?: boolean;
     sortByLabel?: boolean;
+    keepScrollPosition?: boolean;
     autoFocusOnList?: boolean;
     ignoreFocusOut?: boolean;
     valueSelection?: Readonly<[number, number]>;

package/src/common/resource.ts

@@ -317,3 +317,82 @@ export class InMemoryTextResourceResolver implements ResourceResolver {
         return new InMemoryTextResource(uri);
     }
 }
+
+export const UNTITLED_SCHEME = 'untitled';
+
+let untitledResourceSequenceIndex = 0;
+
+@injectable()
+export class UntitledResourceResolver implements ResourceResolver {
+
+    protected readonly resources = new Map<string, UntitledResource>();
+
+    async resolve(uri: URI): Promise<UntitledResource> {
+        if (uri.scheme !== UNTITLED_SCHEME) {
+            throw new Error('The given uri is not untitled file uri: ' + uri);
+        } else {
+            const untitledResource = this.resources.get(uri.toString());
+            if (!untitledResource) {
+                return this.createUntitledResource('', '', uri);
+            } else {
+                return untitledResource;
+            }
+        }
+    }
+
+    async createUntitledResource(content?: string, extension?: string, uri?: URI): Promise<UntitledResource> {
+        return new UntitledResource(this.resources, uri ? uri : new URI().withScheme(UNTITLED_SCHEME).withPath(`/Untitled-${untitledResourceSequenceIndex++}${extension ?? ''}`),
+            content);
+    }
+}
+
+export class UntitledResource implements Resource {
+
+    protected readonly onDidChangeContentsEmitter = new Emitter<void>();
+    get onDidChangeContents(): Event<void> {
+        return this.onDidChangeContentsEmitter.event;
+    }
+
+    constructor(private resources: Map<string, UntitledResource>, public uri: URI, private content?: string) {
+        this.resources.set(this.uri.toString(), this);
+    }
+
+    dispose(): void {
+        this.resources.delete(this.uri.toString());
+        this.onDidChangeContentsEmitter.dispose();
+    }
+
+    async readContents(options?: { encoding?: string | undefined; } | undefined): Promise<string> {
+        if (this.content) {
+            return this.content;
+        } else {
+            return '';
+        }
+    }
+
+    async saveContents(content: string, options?: { encoding?: string, overwriteEncoding?: boolean }): Promise<void> {
+        // This function must exist to ensure readOnly is false for the Monaco editor.
+        // However it should not be called because saving 'untitled' is always processed as 'Save As'.
+        throw Error('Untitled resources cannot be saved.');
+    }
+
+    protected fireDidChangeContents(): void {
+        this.onDidChangeContentsEmitter.fire(undefined);
+    }
+
+    get version(): ResourceVersion | undefined {
+        return undefined;
+    }
+
+    get encoding(): string | undefined {
+        return undefined;
+    }
+}
+
+export function createUntitledURI(extension?: string, parent?: URI): URI {
+    const name = `Untitled-${untitledResourceSequenceIndex++}${extension ?? ''}`;
+    if (parent) {
+        return parent.resolve(name).withScheme(UNTITLED_SCHEME);
+    }
+    return new URI().resolve(name).withScheme(UNTITLED_SCHEME);
+}