@theia/core 1.53.2 → 1.55.0-next.14

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@theia/core",
-  "version": "1.53.2",
+  "version": "1.55.0-next.14+d999fe031",
   "description": "Theia is a cloud & desktop IDE framework implemented in TypeScript.",
   "main": "lib/common/index.js",
   "typings": "lib/common/index.d.ts",
   "dependencies": {
     "@babel/runtime": "^7.10.0",
+    "@parcel/watcher": "^2.4.1",
     "@phosphor/algorithm": "1",
     "@phosphor/commands": "1",
     "@phosphor/coreutils": "1",
@@ -16,8 +17,8 @@
     "@phosphor/signaling": "1",
     "@phosphor/virtualdom": "1",
     "@phosphor/widgets": "1",
-    "@theia/application-package": "1.53.2",
-    "@theia/request": "1.53.2",
+    "@theia/application-package": "1.55.0-next.14+d999fe031",
+    "@theia/request": "1.55.0-next.14+d999fe031",
     "@types/body-parser": "^1.16.4",
     "@types/cookie": "^0.3.3",
     "@types/dompurify": "^2.2.2",
@@ -57,7 +58,6 @@
     "lodash.throttle": "^4.1.1",
     "markdown-it": "^12.3.2",
     "msgpackr": "^1.10.2",
-    "nsfw": "^2.2.4",
     "p-debounce": "^2.1.0",
     "perfect-scrollbar": "^1.3.0",
     "react": "^18.2.0",
@@ -119,11 +119,11 @@
         "vscode-uri"
       ],
       "export =": [
+        "@parcel/watcher as parcelWatcher",
         "dompurify as DOMPurify",
         "express",
         "lodash.debounce as debounce",
         "lodash.throttle as throttle",
-        "nsfw",
         "markdown-it as markdownit",
         "react as React",
         "ws as WebSocket",
@@ -210,13 +210,13 @@
     "watch": "theiaext watch"
   },
   "devDependencies": {
-    "@theia/ext-scripts": "1.53.2",
-    "@theia/re-exports": "1.53.2",
+    "@theia/ext-scripts": "1.54.0",
+    "@theia/re-exports": "1.54.0",
     "minimist": "^1.2.0",
     "nodejs-file-downloader": "4.13.0"
   },
   "nyc": {
     "extends": "../../configs/nyc.json"
   },
-  "gitHead": "4f6f158bd27c5dd608dddc036910698a51d8c953"
+  "gitHead": "d999fe0315a29bc5b154067621dbc1eb180fa567"
 }

package/shared/@parcel/watcher/index.d.ts

@@ -0,0 +1,2 @@
+import parcelWatcher = require('@parcel/watcher');
+export = parcelWatcher;

package/shared/@parcel/watcher/index.js

@@ -0,0 +1 @@
+module.exports = require('@parcel/watcher');

package/src/browser/authentication-service.ts

@@ -32,6 +32,13 @@ export interface AuthenticationSessionAccountInformation {
     readonly id: string;
     readonly label: string;
 }
+export interface AuthenticationProviderSessionOptions {
+    /**
+     * The account that is being asked about. If this is passed in, the provider should
+     * attempt to return the sessions that are only related to this account.
+     */
+    account?: AuthenticationSessionAccountInformation;
+}
 
 export interface AuthenticationSession {
     id: string;
@@ -82,16 +89,6 @@ export interface AuthenticationProvider {
 
     updateSessionItems(event: AuthenticationProviderAuthenticationSessionsChangeEvent): Promise<void>;
 
-    /**
-     * @deprecated use `createSession` instead.
-     */
-    login(scopes: string[]): Promise<AuthenticationSession>;
-
-    /**
-     * @deprecated use `removeSession` instead.
-     */
-    logout(sessionId: string): Promise<void>;
-
     /**
      * An [event](#Event) which fires when the array of sessions has changed, or data
      * within a session has changed.
@@ -102,16 +99,18 @@ export interface AuthenticationProvider {
      * Get a list of sessions.
      * @param scopes An optional list of scopes. If provided, the sessions returned should match
      * these permissions, otherwise all sessions should be returned.
+     * @param account The optional account that you would like to get the session for
      * @returns A promise that resolves to an array of authentication sessions.
      */
-    getSessions(scopes?: string[]): Thenable<ReadonlyArray<AuthenticationSession>>;
+    getSessions(scopes: string[] | undefined, account?: AuthenticationSessionAccountInformation): Thenable<ReadonlyArray<AuthenticationSession>>;
 
     /**
      * Prompts a user to login.
      * @param scopes A list of scopes, permissions, that the new session should be created with.
+     * @param options The options for createing the session
      * @returns A promise that resolves to an authentication session.
      */
-    createSession(scopes: string[]): Thenable<AuthenticationSession>;
+    createSession(scopes: string[], options: AuthenticationProviderSessionOptions): Thenable<AuthenticationSession>;
 
     /**
      * Removes the session corresponding to session id.
@@ -134,10 +133,10 @@ export interface AuthenticationService {
 
     readonly onDidChangeSessions: Event<{ providerId: string, label: string, event: AuthenticationProviderAuthenticationSessionsChangeEvent }>;
     readonly onDidUpdateSignInCount: Event<number>;
-    getSessions(providerId: string, scopes?: string[]): Promise<ReadonlyArray<AuthenticationSession>>;
+    getSessions(providerId: string, scopes?: string[], user?: AuthenticationSessionAccountInformation): Promise<ReadonlyArray<AuthenticationSession>>;
     getLabel(providerId: string): string;
     supportsMultipleAccounts(providerId: string): boolean;
-    login(providerId: string, scopes: string[]): Promise<AuthenticationSession>;
+    login(providerId: string, scopes: string[], options?: AuthenticationProviderSessionOptions): Promise<AuthenticationSession>;
     logout(providerId: string, sessionId: string): Promise<void>;
 
     signOutOfAccount(providerId: string, accountName: string): Promise<void>;
@@ -300,7 +299,7 @@ export class AuthenticationServiceImpl implements AuthenticationService {
         }
 
         const previousSize = this.signInRequestItems.size;
-        const sessions = await provider.getSessions();
+        const sessions = await provider.getSessions(undefined);
         Object.keys(existingRequestsForProvider).forEach(requestedScopes => {
             if (sessions.some(session => session.scopes.slice().sort().join('') === requestedScopes)) {
                 const sessionRequest = existingRequestsForProvider[requestedScopes];
@@ -411,19 +410,19 @@ export class AuthenticationServiceImpl implements AuthenticationService {
         }
     }
 
-    async getSessions(id: string, scopes?: string[]): Promise<ReadonlyArray<AuthenticationSession>> {
+    async getSessions(id: string, scopes?: string[], user?: AuthenticationSessionAccountInformation): Promise<ReadonlyArray<AuthenticationSession>> {
         const authProvider = this.authenticationProviders.get(id);
         if (authProvider) {
-            return authProvider.getSessions(scopes);
+            return authProvider.getSessions(scopes, user);
         } else {
             throw new Error(`No authentication provider '${id}' is currently registered.`);
         }
     }
 
-    async login(id: string, scopes: string[]): Promise<AuthenticationSession> {
+    async login(id: string, scopes: string[], options?: AuthenticationProviderSessionOptions): Promise<AuthenticationSession> {
         const authProvider = this.authenticationProviders.get(id);
         if (authProvider) {
-            return authProvider.createSession(scopes);
+            return authProvider.createSession(scopes, options || {});
         } else {
             throw new Error(`No authentication provider '${id}' is currently registered.`);
         }

package/src/browser/core-preferences.ts

@@ -281,6 +281,15 @@ export const corePreferenceSchema: PreferenceSchema = {
             default: 200,
             minimum: 10,
             description: nls.localize('theia/core/tabDefaultSize', 'Specifies the default size for tabs.')
+        },
+        'workbench.editorAssociations': {
+            type: 'object',
+            markdownDescription: nls.localizeByDefault('Configure [glob patterns](https://aka.ms/vscode-glob-patterns) to editors (for example `"*.hex": "hexEditor.hexedit"`). These have precedence over the default behavior.'),
+            patternProperties: {
+                '.*': {
+                    type: 'string'
+                }
+            }
         }
     }
 };

package/src/browser/frontend-application-module.ts

@@ -144,6 +144,7 @@ import { bindTreePreferences } from './tree';
 import { OpenWithService } from './open-with-service';
 import { ViewColumnService } from './shell/view-column-service';
 import { DomInputUndoRedoHandler, UndoRedoHandler, UndoRedoHandlerService } from './undo-redo-handler';
+import { WidgetStatusBarContribution, WidgetStatusBarService } from './widget-status-bar-service';
 
 export { bindResourceProvider, bindMessageService, bindPreferenceService };
 
@@ -471,4 +472,8 @@ export const frontendApplicationModule = new ContainerModule((bind, _unbind, _is
     bindContributionProvider(bind, UndoRedoHandler);
     bind(DomInputUndoRedoHandler).toSelf().inSingletonScope();
     bind(UndoRedoHandler).toService(DomInputUndoRedoHandler);
+
+    bind(WidgetStatusBarService).toSelf().inSingletonScope();
+    bind(FrontendApplicationContribution).toService(WidgetStatusBarService);
+    bindContributionProvider(bind, WidgetStatusBarContribution);
 });

package/src/browser/index.ts

@@ -48,3 +48,4 @@ export * from './styling-service';
 export * from './hover-service';
 export * from './saveable-service';
 export * from './undo-redo-handler';
+export * from './widget-status-bar-service';

package/src/browser/open-with-service.ts

@@ -19,7 +19,9 @@ import { Disposable } from '../common/disposable';
 import { nls } from '../common/nls';
 import { MaybePromise } from '../common/types';
 import { URI } from '../common/uri';
-import { QuickInputService } from './quick-input';
+import { QuickInputService, QuickPickItem, QuickPickItemOrSeparator } from './quick-input';
+import { PreferenceScope, PreferenceService } from './preferences';
+import { getDefaultHandler } from './opener-service';
 
 export interface OpenWithHandler {
     /**
@@ -46,6 +48,11 @@ export interface OpenWithHandler {
      * A returned value indicating a priority of this handler.
      */
     canHandle(uri: URI): number;
+    /**
+     * Test whether this handler and open the given URI
+     * and return the order of this handler in the list.
+     */
+    getOrder?(uri: URI): number;
     /**
      * Open a widget for the given URI and options.
      * Resolve to an opened widget or undefined, e.g. if a page is opened.
@@ -54,15 +61,26 @@ export interface OpenWithHandler {
     open(uri: URI): MaybePromise<object | undefined>;
 }
 
+export interface OpenWithQuickPickItem extends QuickPickItem {
+    handler: OpenWithHandler;
+}
+
 @injectable()
 export class OpenWithService {
 
     @inject(QuickInputService)
     protected readonly quickInputService: QuickInputService;
 
+    @inject(PreferenceService)
+    protected readonly preferenceService: PreferenceService;
+
     protected readonly handlers: OpenWithHandler[] = [];
 
     registerHandler(handler: OpenWithHandler): Disposable {
+        if (this.handlers.some(h => h.id === handler.id)) {
+            console.warn('Duplicate OpenWithHandler registration: ' + handler.id);
+            return Disposable.NULL;
+        }
         this.handlers.push(handler);
         return Disposable.create(() => {
             const index = this.handlers.indexOf(handler);
@@ -73,17 +91,50 @@ export class OpenWithService {
     }
 
     async openWith(uri: URI): Promise<object | undefined> {
+        // Clone the object, because all objects returned by the preferences service are frozen.
+        const associations: Record<string, unknown> = { ...this.preferenceService.get('workbench.editorAssociations') };
+        const ext = `*${uri.path.ext}`;
         const handlers = this.getHandlers(uri);
-        const result = await this.quickInputService.pick(handlers.map(handler => ({
-            handler: handler,
-            label: handler.label ?? handler.id,
-            detail: handler.providerName
-        })), {
+        const ordered = handlers.slice().sort((a, b) => this.getOrder(b, uri) - this.getOrder(a, uri));
+        const defaultHandler = getDefaultHandler(uri, this.preferenceService) ?? handlers[0]?.id;
+        const items = this.getQuickPickItems(ordered, defaultHandler);
+        // Only offer to select a default editor when the file has a file extension
+        const extraItems: QuickPickItemOrSeparator[] = uri.path.ext ? [{
+            type: 'separator'
+        }, {
+            label: nls.localizeByDefault("Configure default editor for '{0}'...", ext)
+        }] : [];
+        const result = await this.quickInputService.pick<OpenWithQuickPickItem | { label: string }>([...items, ...extraItems], {
             placeHolder: nls.localizeByDefault("Select editor for '{0}'", uri.path.base)
         });
         if (result) {
-            return result.handler.open(uri);
+            if ('handler' in result) {
+                return result.handler.open(uri);
+            } else if (result.label) {
+                const configureResult = await this.quickInputService.pick(items, {
+                    placeHolder: nls.localizeByDefault("Select new default editor for '{0}'", ext)
+                });
+                if (configureResult) {
+                    associations[ext] = configureResult.handler.id;
+                    this.preferenceService.set('workbench.editorAssociations', associations, PreferenceScope.User);
+                    return configureResult.handler.open(uri);
+                }
+            }
         }
+        return undefined;
+    }
+
+    protected getQuickPickItems(handlers: OpenWithHandler[], defaultHandler?: string): OpenWithQuickPickItem[] {
+        return handlers.map(handler => ({
+            handler,
+            label: handler.label ?? handler.id,
+            detail: handler.providerName ?? '',
+            description: handler.id === defaultHandler ? nls.localizeByDefault('Default') : undefined
+        }));
+    }
+
+    protected getOrder(handler: OpenWithHandler, uri: URI): number {
+        return handler.getOrder ? handler.getOrder(uri) : handler.canHandle(uri);
     }
 
     getHandlers(uri: URI): OpenWithHandler[] {

package/src/browser/opener-service.ts

@@ -17,6 +17,8 @@
 import { named, injectable, inject } from 'inversify';
 import URI from '../common/uri';
 import { ContributionProvider, Prioritizeable, MaybePromise, Emitter, Event, Disposable } from '../common';
+import { PreferenceService } from './preferences';
+import { match } from '../common/glob';
 
 export interface OpenerOptions {
 }
@@ -96,6 +98,17 @@ export async function open(openerService: OpenerService, uri: URI, options?: Ope
     return opener.open(uri, options);
 }
 
+export function getDefaultHandler(uri: URI, preferenceService: PreferenceService): string | undefined {
+    const associations = preferenceService.get('workbench.editorAssociations', {});
+    const defaultHandler = Object.entries(associations).find(([key]) => match(key, uri.path.base))?.[1];
+    if (typeof defaultHandler === 'string') {
+        return defaultHandler;
+    }
+    return undefined;
+}
+
+export const defaultHandlerPriority = 100_000;
+
 @injectable()
 export class DefaultOpenerService implements OpenerService {
     // Collection of open-handlers for custom-editor contributions.

package/src/browser/style/tabs.css

@@ -9,10 +9,7 @@
   --theia-private-horizontal-tab-scrollbar-height: 5px;
   --theia-tabbar-toolbar-z-index: 1001;
   --theia-toolbar-active-transform-scale: 1.272019649;
-  --theia-horizontal-toolbar-height: calc(
-    var(--theia-private-horizontal-tab-height) +
-      var(--theia-private-horizontal-tab-scrollbar-rail-height) / 2
-  );
+  --theia-horizontal-toolbar-height: calc(var(--theia-private-horizontal-tab-height) + var(--theia-private-horizontal-tab-scrollbar-rail-height) / 2);
   --theia-dragover-tab-border-width: 2px;
 }
 
@@ -75,9 +72,7 @@
   border-left: var(--theia-border-width) solid var(--theia-editorGroup-border);
 }
 
-#theia-main-content-panel
-  .p-DockPanel-handle[data-orientation="vertical"]
-  + .p-TabBar {
+#theia-main-content-panel .p-DockPanel-handle[data-orientation="vertical"]+.p-TabBar {
   border-top: var(--theia-border-width) solid var(--theia-editorGroup-border);
 }
 
@@ -142,11 +137,9 @@
 
   -webkit-appearance: none;
   -moz-appearance: none;
-  background-image: linear-gradient(
-      45deg,
+  background-image: linear-gradient(45deg,
       transparent 50%,
-      var(--theia-icon-foreground) 50%
-    ),
+      var(--theia-icon-foreground) 50%),
     linear-gradient(135deg, var(--theia-icon-foreground) 50%, transparent 50%);
   background-position: calc(100% - 6px) 8px, calc(100% - 2px) 8px, 100% 0;
   background-size: 4px 5px;
@@ -225,12 +218,8 @@
   visibility: hidden;
 }
 
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.p-mod-closable
-  > .p-TabBar-tabCloseIcon,
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.theia-mod-pinned
-  > .p-TabBar-tabCloseIcon {
+.p-TabBar.theia-app-centers .p-TabBar-tab.p-mod-closable>.p-TabBar-tabCloseIcon,
+.p-TabBar.theia-app-centers .p-TabBar-tab.theia-mod-pinned>.p-TabBar-tabCloseIcon {
   padding: 2px;
   margin-top: 2px;
   margin-left: 4px;
@@ -248,31 +237,19 @@
   -ms-user-select: none;
 }
 
-.p-TabBar.theia-app-centers.dynamic-tabs
-  .p-TabBar-tab.p-mod-closable
-  > .p-TabBar-tabCloseIcon,
-.p-TabBar.theia-app-centers.dynamic-tabs
-  .p-TabBar-tab.theia-mod-pinned
-  > .p-TabBar-tabCloseIcon {
+.p-TabBar.theia-app-centers.dynamic-tabs .p-TabBar-tab.p-mod-closable>.p-TabBar-tabCloseIcon,
+.p-TabBar.theia-app-centers.dynamic-tabs .p-TabBar-tab.theia-mod-pinned>.p-TabBar-tabCloseIcon {
   /* hide close icon for dynamic tabs strategy*/
   display: none;
 }
 
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.p-mod-current
-  > .p-TabBar-tabCloseIcon,
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab:hover.p-mod-closable
-  > .p-TabBar-tabCloseIcon,
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab:hover.theia-mod-pinned
-  > .p-TabBar-tabCloseIcon {
+.p-TabBar.theia-app-centers .p-TabBar-tab.p-mod-current>.p-TabBar-tabCloseIcon,
+.p-TabBar.theia-app-centers .p-TabBar-tab:hover.p-mod-closable>.p-TabBar-tabCloseIcon,
+.p-TabBar.theia-app-centers .p-TabBar-tab:hover.theia-mod-pinned>.p-TabBar-tabCloseIcon {
   display: inline-block;
 }
 
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.p-mod-closable
-  > .p-TabBar-tabCloseIcon:hover {
+.p-TabBar.theia-app-centers .p-TabBar-tab.p-mod-closable>.p-TabBar-tabCloseIcon:hover {
   border-radius: 5px;
   background-color: rgba(50%, 50%, 50%, 0.2);
 }
@@ -282,33 +259,21 @@
   padding-right: 4px;
 }
 
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.p-mod-closable:not(.theia-mod-dirty):hover
-  > .p-TabBar-tabCloseIcon:before,
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.p-mod-closable:not(.theia-mod-dirty).p-TabBar-tab.p-mod-current
-  > .p-TabBar-tabCloseIcon:before,
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.p-mod-closable.theia-mod-dirty
-  > .p-TabBar-tabCloseIcon:hover:before {
+.p-TabBar.theia-app-centers .p-TabBar-tab.p-mod-closable:not(.theia-mod-dirty):hover>.p-TabBar-tabCloseIcon:before,
+.p-TabBar.theia-app-centers .p-TabBar-tab.p-mod-closable:not(.theia-mod-dirty).p-TabBar-tab.p-mod-current>.p-TabBar-tabCloseIcon:before,
+.p-TabBar.theia-app-centers .p-TabBar-tab.p-mod-closable.theia-mod-dirty>.p-TabBar-tabCloseIcon:hover:before {
   content: "\ea76";
 }
 
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.p-mod-closable.theia-mod-dirty
-  > .p-TabBar-tabCloseIcon:before {
+.p-TabBar.theia-app-centers .p-TabBar-tab.p-mod-closable.theia-mod-dirty>.p-TabBar-tabCloseIcon:before {
   content: "\ea71";
 }
 
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.theia-mod-pinned
-  > .p-TabBar-tabCloseIcon:before {
+.p-TabBar.theia-app-centers .p-TabBar-tab.theia-mod-pinned>.p-TabBar-tabCloseIcon:before {
   content: "\eba0";
 }
 
-.p-TabBar.theia-app-centers
-  .p-TabBar-tab.theia-mod-pinned.theia-mod-dirty
-  > .p-TabBar-tabCloseIcon:before {
+.p-TabBar.theia-app-centers .p-TabBar-tab.theia-mod-pinned.theia-mod-dirty>.p-TabBar-tabCloseIcon:before {
   content: "\ebb2";
 }
 
@@ -351,72 +316,35 @@
 | Perfect scrollbar
 |----------------------------------------------------------------------------*/
 
-.p-TabBar[data-orientation="horizontal"]
-  .p-TabBar-content-container
-  > .ps__rail-x {
+.p-TabBar[data-orientation="horizontal"] .p-TabBar-content-container>.ps__rail-x {
   height: var(--theia-private-horizontal-tab-scrollbar-rail-height);
   z-index: 1000;
 }
 
-.p-TabBar[data-orientation="horizontal"]
-  .p-TabBar-content-container
-  > .ps__rail-x
-  > .ps__thumb-x {
+.p-TabBar[data-orientation="horizontal"] .p-TabBar-content-container>.ps__rail-x>.ps__thumb-x {
   height: var(--theia-private-horizontal-tab-scrollbar-height) !important;
-  bottom: calc(
-    (
-        var(--theia-private-horizontal-tab-scrollbar-rail-height) -
-          var(--theia-private-horizontal-tab-scrollbar-height)
-      ) / 2
-  );
-}
-
-.p-TabBar[data-orientation="horizontal"]
-  .p-TabBar-content-container
-  > .ps__rail-x:hover,
-.p-TabBar[data-orientation="horizontal"]
-  .p-TabBar-content-container
-  > .ps__rail-x:focus {
+  bottom: calc((var(--theia-private-horizontal-tab-scrollbar-rail-height) - var(--theia-private-horizontal-tab-scrollbar-height)) / 2);
+}
+
+.p-TabBar[data-orientation="horizontal"] .p-TabBar-content-container>.ps__rail-x:hover,
+.p-TabBar[data-orientation="horizontal"] .p-TabBar-content-container>.ps__rail-x:focus {
   height: var(--theia-private-horizontal-tab-scrollbar-rail-height) !important;
 }
 
-.p-TabBar[data-orientation="horizontal"]
-  .p-TabBar-content-container
-  > .ps__rail-x:hover
-  > .ps__thumb-x,
-.p-TabBar[data-orientation="horizontal"]
-  .p-TabBar-content-container
-  > .ps__rail-x:focus
-  > .ps__thumb-x {
-  height: calc(
-    var(--theia-private-horizontal-tab-scrollbar-height) / 2
-  ) !important;
-  bottom: calc(
-    (
-        var(--theia-private-horizontal-tab-scrollbar-rail-height) -
-          var(--theia-private-horizontal-tab-scrollbar-height)
-      ) / 2
-  );
-}
-
-.p-TabBar[data-orientation="vertical"]
-  .p-TabBar-content-container
-  > .ps__rail-y {
+.p-TabBar[data-orientation="horizontal"] .p-TabBar-content-container>.ps__rail-x:hover>.ps__thumb-x,
+.p-TabBar[data-orientation="horizontal"] .p-TabBar-content-container>.ps__rail-x:focus>.ps__thumb-x {
+  height: calc(var(--theia-private-horizontal-tab-scrollbar-height) / 2) !important;
+  bottom: calc((var(--theia-private-horizontal-tab-scrollbar-rail-height) - var(--theia-private-horizontal-tab-scrollbar-height)) / 2);
+}
+
+.p-TabBar[data-orientation="vertical"] .p-TabBar-content-container>.ps__rail-y {
   width: var(--theia-private-horizontal-tab-scrollbar-rail-height);
   z-index: 1000;
 }
 
-.p-TabBar[data-orientation="vertical"]
-  .p-TabBar-content-container
-  > .ps__rail-y
-  > .ps__thumb-y {
+.p-TabBar[data-orientation="vertical"] .p-TabBar-content-container>.ps__rail-y>.ps__thumb-y {
   width: var(--theia-private-horizontal-tab-scrollbar-height) !important;
-  right: calc(
-    (
-        var(--theia-private-horizontal-tab-scrollbar-rail-height) -
-          var(--theia-private-horizontal-tab-scrollbar-height)
-      ) / 2
-  );
+  right: calc((var(--theia-private-horizontal-tab-scrollbar-rail-height) - var(--theia-private-horizontal-tab-scrollbar-height)) / 2);
 }
 
 .p-TabBar[data-orientation="vertical"] .p-TabBar-content-container {
@@ -447,9 +375,8 @@
 |----------------------------------------------------------------------------*/
 
 .p-TabBar-toolbar {
-  z-index: var(
-    --theia-tabbar-toolbar-z-index
-  ); /* Due to the scrollbar (`z-index: 1000;`) it has a greater `z-index`. */
+  z-index: var(--theia-tabbar-toolbar-z-index);
+  /* Due to the scrollbar (`z-index: 1000;`) it has a greater `z-index`. */
   display: flex;
   flex-direction: row-reverse;
   padding: 4px;
@@ -460,7 +387,8 @@
 .p-TabBar-content-container {
   display: flex;
   flex: 1;
-  position: relative; /* This is necessary for perfect-scrollbar */
+  position: relative;
+  /* This is necessary for perfect-scrollbar */
 }
 
 .p-TabBar-toolbar .item {
@@ -473,7 +401,7 @@
 }
 
 .p-TabBar-toolbar .item>div {
-    height: 100%;
+  height: 100%;
 }
 
 .p-TabBar-toolbar .item.enabled {
@@ -491,14 +419,14 @@
   background-color: var(--theia-inputOption-activeBackground);
 }
 
-.p-TabBar-toolbar .item > div {
-  line-height: calc(var(--theia-icon-size)+2px);
-  height: calc(var(--theia-icon-size)+2px);
+.p-TabBar-toolbar .item>div {
+  line-height: calc(var(--theia-icon-size) + 2px);
+  height: calc(var(--theia-icon-size) + 2px);
   background-repeat: no-repeat;
   line-height: 18px;
 }
 
-.p-TabBar-toolbar .item > div.no-icon {
+.p-TabBar-toolbar .item>div.no-icon {
   /* Make room for a text label instead of an icon. */
   width: 100%;
 }
@@ -532,9 +460,7 @@
   vertical-align: bottom;
 }
 
-#theia-main-content-panel
-  .p-TabBar:not(.theia-tabBar-active)
-  .p-TabBar-toolbar {
+#theia-main-content-panel .p-TabBar:not(.theia-tabBar-active) .p-TabBar-toolbar {
   display: none;
 }
 
@@ -543,9 +469,7 @@
 }
 
 .p-TabBar.theia-tabBar-multirow[data-orientation="horizontal"] {
-  min-height: calc(
-    var(--theia-breadcrumbs-height) + var(--theia-horizontal-toolbar-height)
-  );
+  min-height: calc(var(--theia-breadcrumbs-height) + var(--theia-horizontal-toolbar-height));
   flex-direction: column;
 }
 
@@ -569,19 +493,14 @@
   flex-direction: column;
 }
 
-.p-TabBar.theia-app-centers[data-orientation="horizontal"].dynamic-tabs
-  .p-TabBar-tabLabel {
+.p-TabBar.theia-app-centers[data-orientation="horizontal"].dynamic-tabs .p-TabBar-tabLabel {
   /* fade out text with dynamic tabs strategy */
-  mask-image: linear-gradient(
-    to left,
-    rgba(0, 0, 0, 0.3),
-    rgba(0, 0, 0, 1) 15px
-  );
-  -webkit-mask-image: linear-gradient(
-    to left,
-    rgba(0, 0, 0, 0.3),
-    rgba(0, 0, 0, 1) 15px
-  );
+  mask-image: linear-gradient(to left,
+      rgba(0, 0, 0, 0.3),
+      rgba(0, 0, 0, 1) 15px);
+  -webkit-mask-image: linear-gradient(to left,
+      rgba(0, 0, 0, 0.3),
+      rgba(0, 0, 0, 1) 15px);
   flex: 1;
 }
 
@@ -625,13 +544,11 @@
 /*-----------------------------------------------------------------------------
 | Open tabs dropdown
 |----------------------------------------------------------------------------*/
-.theia-tabBar-open-tabs
-  > .theia-select-component
-  .theia-select-component-label {
+.theia-tabBar-open-tabs>.theia-select-component .theia-select-component-label {
   display: none;
 }
 
-.theia-tabBar-open-tabs > .theia-select-component {
+.theia-tabBar-open-tabs>.theia-select-component {
   min-width: auto;
   height: 100%;
 }
@@ -644,4 +561,4 @@
 
 .theia-tabBar-open-tabs.p-mod-hidden {
   display: none;
-}
+}