@codingame/monaco-vscode-api 2.1.4 → 2.2.0-next.2

package/vscode/src/vs/workbench/browser/parts/notifications/notificationsViewer.js

@@ -0,0 +1,436 @@
+import { __decorate, __param } from '../../../../../../../external/tslib/tslib.es6.js';
+import { clearNode, $, EventType, addDisposableListener, EventHelper, isEventLike } from '../../../../base/browser/dom.js';
+import { IOpenerService } from '../../../../platform/opener/common/opener.js';
+import { URI } from '../../../../base/common/uri.js';
+import { localizeWithPath } from '../../../../nls.js';
+import { ButtonBar } from '../../../../base/browser/ui/button/button.js';
+import { ActionBar } from '../../../../base/browser/ui/actionbar/actionbar.js';
+import { toAction, Separator, ActionRunner } from '../../../../base/common/actions.js';
+import { IInstantiationService } from '../../../../platform/instantiation/common/instantiation.js';
+import { DisposableStore, dispose, Disposable } from '../../../../base/common/lifecycle.js';
+import { IContextMenuService } from '../../../../platform/contextview/browser/contextView.js';
+import { NotificationViewItem, ChoiceAction } from '../../../common/notifications.js';
+import { ConfigureNotificationAction, ClearNotificationAction, ExpandNotificationAction, CollapseNotificationAction } from './notificationsActions.js';
+import { IKeybindingService } from '../../../../platform/keybinding/common/keybinding.js';
+import { ProgressBar } from '../../../../base/browser/ui/progressbar/progressbar.js';
+import { isNotificationSource, NotificationsFilter, Severity, INotificationService } from '../../../../platform/notification/common/notification.js';
+import { isNonEmptyArray } from '../../../../base/common/arrays.js';
+import { Codicon } from '../../../../base/common/codicons.js';
+import { ThemeIcon } from '../../../../base/common/themables.js';
+import { DropdownMenuActionViewItem } from '../../../../base/browser/ui/dropdown/dropdownActionViewItem.js';
+import { DomEmitter } from '../../../../base/browser/event.js';
+import { Gesture, EventType as EventType$1 } from '../../../../base/browser/touch.js';
+import { Event } from '../../../../base/common/event.js';
+import { defaultProgressBarStyles, defaultButtonStyles } from '../../../../platform/theme/browser/defaultStyles.js';
+import { StandardKeyboardEvent } from '../../../../base/browser/keyboardEvent.js';
+var NotificationRenderer_1, NotificationTemplateRenderer_1;
+class NotificationsListDelegate {
+    static { this.ROW_HEIGHT = 42; }
+    static { this.LINE_HEIGHT = 22; }
+    constructor(container) {
+        this.offsetHelper = this.createOffsetHelper(container);
+    }
+    createOffsetHelper(container) {
+        const offsetHelper = document.createElement('div');
+        offsetHelper.classList.add('notification-offset-helper');
+        container.appendChild(offsetHelper);
+        return offsetHelper;
+    }
+    getHeight(notification) {
+        if (!notification.expanded) {
+            return NotificationsListDelegate.ROW_HEIGHT;
+        }
+        let expandedHeight = NotificationsListDelegate.ROW_HEIGHT;
+        const preferredMessageHeight = this.computePreferredHeight(notification);
+        const messageOverflows = NotificationsListDelegate.LINE_HEIGHT < preferredMessageHeight;
+        if (messageOverflows) {
+            const overflow = preferredMessageHeight - NotificationsListDelegate.LINE_HEIGHT;
+            expandedHeight += overflow;
+        }
+        if (notification.source || isNonEmptyArray(notification.actions && notification.actions.primary)) {
+            expandedHeight += NotificationsListDelegate.ROW_HEIGHT;
+        }
+        if (expandedHeight === NotificationsListDelegate.ROW_HEIGHT) {
+            notification.collapse(true );
+        }
+        return expandedHeight;
+    }
+    computePreferredHeight(notification) {
+        let actions = 0;
+        if (!notification.hasProgress) {
+            actions++;
+        }
+        if (notification.canCollapse) {
+            actions++;
+        }
+        if (isNonEmptyArray(notification.actions && notification.actions.secondary)) {
+            actions++;
+        }
+        this.offsetHelper.style.width = `${450  - ((10  + 30  + (actions * 30)  - (Math.max(actions - 1, 0) * 4)) )}px`;
+        const renderedMessage = NotificationMessageRenderer.render(notification.message);
+        this.offsetHelper.appendChild(renderedMessage);
+        const preferredHeight = Math.max(this.offsetHelper.offsetHeight, this.offsetHelper.scrollHeight);
+        clearNode(this.offsetHelper);
+        return preferredHeight;
+    }
+    getTemplateId(element) {
+        if (element instanceof NotificationViewItem) {
+            return NotificationRenderer.TEMPLATE_ID;
+        }
+        throw new Error('unknown element type: ' + element);
+    }
+}
+class NotificationMessageRenderer {
+    static render(message, actionHandler) {
+        const messageContainer = document.createElement('span');
+        for (const node of message.linkedText.nodes) {
+            if (typeof node === 'string') {
+                messageContainer.appendChild(document.createTextNode(node));
+            }
+            else {
+                let title = node.title;
+                if (!title && node.href.startsWith('command:')) {
+                    title = ( localizeWithPath(
+                        'vs/workbench/browser/parts/notifications/notificationsViewer',
+                        'executeCommand',
+                        "Click to execute command '{0}'",
+                        node.href.substr('command:'.length)
+                    ));
+                }
+                else if (!title) {
+                    title = node.href;
+                }
+                const anchor = $('a', { href: node.href, title, tabIndex: 0 }, node.label);
+                if (actionHandler) {
+                    const handleOpen = (e) => {
+                        if (isEventLike(e)) {
+                            EventHelper.stop(e, true);
+                        }
+                        actionHandler.callback(node.href);
+                    };
+                    const onClick = actionHandler.toDispose.add(( new DomEmitter(anchor, EventType.CLICK))).event;
+                    const onKeydown = actionHandler.toDispose.add(( new DomEmitter(anchor, EventType.KEY_DOWN))).event;
+                    const onSpaceOrEnter = Event.chain(onKeydown, $ => $.filter(e => {
+                        const event = ( new StandardKeyboardEvent(e));
+                        return event.equals(10 ) || event.equals(3 );
+                    }));
+                    actionHandler.toDispose.add(Gesture.addTarget(anchor));
+                    const onTap = actionHandler.toDispose.add(( new DomEmitter(anchor, EventType$1.Tap))).event;
+                    Event.any(onClick, onTap, onSpaceOrEnter)(handleOpen, null, actionHandler.toDispose);
+                }
+                messageContainer.appendChild(anchor);
+            }
+        }
+        return messageContainer;
+    }
+}
+let NotificationRenderer = class NotificationRenderer {
+    static { NotificationRenderer_1 = this; }
+    static { this.TEMPLATE_ID = 'notification'; }
+    constructor(actionRunner, contextMenuService, instantiationService, notificationService) {
+        this.actionRunner = actionRunner;
+        this.contextMenuService = contextMenuService;
+        this.instantiationService = instantiationService;
+        this.notificationService = notificationService;
+    }
+    get templateId() {
+        return NotificationRenderer_1.TEMPLATE_ID;
+    }
+    renderTemplate(container) {
+        const data = Object.create(null);
+        data.toDispose = ( new DisposableStore());
+        data.container = document.createElement('div');
+        data.container.classList.add('notification-list-item');
+        data.mainRow = document.createElement('div');
+        data.mainRow.classList.add('notification-list-item-main-row');
+        data.icon = document.createElement('div');
+        data.icon.classList.add('notification-list-item-icon', 'codicon');
+        data.message = document.createElement('div');
+        data.message.classList.add('notification-list-item-message');
+        const that = this;
+        const toolbarContainer = document.createElement('div');
+        toolbarContainer.classList.add('notification-list-item-toolbar-container');
+        data.toolbar = ( new ActionBar(toolbarContainer, {
+            ariaLabel: ( localizeWithPath(
+                'vs/workbench/browser/parts/notifications/notificationsViewer',
+                'notificationActions',
+                "Notification Actions"
+            )),
+            actionViewItemProvider: action => {
+                if (action instanceof ConfigureNotificationAction) {
+                    return data.toDispose.add(( new DropdownMenuActionViewItem(action, {
+                        getActions() {
+                            const actions = [];
+                            const source = { id: action.notification.sourceId, label: action.notification.source };
+                            if (isNotificationSource(source)) {
+                                const isSourceFiltered = that.notificationService.getFilter(source) === NotificationsFilter.ERROR;
+                                actions.push(toAction({
+                                    id: source.id,
+                                    label: isSourceFiltered ? ( localizeWithPath(
+                                        'vs/workbench/browser/parts/notifications/notificationsViewer',
+                                        'turnOnNotifications',
+                                        "Turn On Notifications from '{0}'",
+                                        source.label
+                                    )) : ( localizeWithPath(
+                                        'vs/workbench/browser/parts/notifications/notificationsViewer',
+                                        'turnOffNotifications',
+                                        "Turn Off Notifications from '{0}'",
+                                        source.label
+                                    )),
+                                    run: () => that.notificationService.setFilter({ ...source, filter: isSourceFiltered ? NotificationsFilter.OFF : NotificationsFilter.ERROR })
+                                }));
+                                if (action.notification.actions?.secondary?.length) {
+                                    actions.push(( new Separator()));
+                                }
+                            }
+                            if (Array.isArray(action.notification.actions?.secondary)) {
+                                actions.push(...action.notification.actions.secondary);
+                            }
+                            return actions;
+                        },
+                    }, this.contextMenuService, {
+                        actionRunner: this.actionRunner,
+                        classNames: action.class
+                    })));
+                }
+                return undefined;
+            },
+            actionRunner: this.actionRunner
+        }));
+        data.toDispose.add(data.toolbar);
+        data.detailsRow = document.createElement('div');
+        data.detailsRow.classList.add('notification-list-item-details-row');
+        data.source = document.createElement('div');
+        data.source.classList.add('notification-list-item-source');
+        data.buttonsContainer = document.createElement('div');
+        data.buttonsContainer.classList.add('notification-list-item-buttons-container');
+        container.appendChild(data.container);
+        data.container.appendChild(data.detailsRow);
+        data.detailsRow.appendChild(data.source);
+        data.detailsRow.appendChild(data.buttonsContainer);
+        data.container.appendChild(data.mainRow);
+        data.mainRow.appendChild(data.icon);
+        data.mainRow.appendChild(data.message);
+        data.mainRow.appendChild(toolbarContainer);
+        data.progress = ( new ProgressBar(container, defaultProgressBarStyles));
+        data.toDispose.add(data.progress);
+        data.renderer = this.instantiationService.createInstance(NotificationTemplateRenderer, data, this.actionRunner);
+        data.toDispose.add(data.renderer);
+        return data;
+    }
+    renderElement(notification, index, data) {
+        data.renderer.setInput(notification);
+    }
+    disposeTemplate(templateData) {
+        dispose(templateData.toDispose);
+    }
+};
+NotificationRenderer = NotificationRenderer_1 = ( __decorate([
+    ( __param(1, IContextMenuService)),
+    ( __param(2, IInstantiationService)),
+    ( __param(3, INotificationService))
+], NotificationRenderer));
+let NotificationTemplateRenderer = class NotificationTemplateRenderer extends Disposable {
+    static { NotificationTemplateRenderer_1 = this; }
+    static { this.SEVERITIES = [Severity.Info, Severity.Warning, Severity.Error]; }
+    constructor(template, actionRunner, openerService, instantiationService, keybindingService, contextMenuService) {
+        super();
+        this.template = template;
+        this.actionRunner = actionRunner;
+        this.openerService = openerService;
+        this.instantiationService = instantiationService;
+        this.keybindingService = keybindingService;
+        this.contextMenuService = contextMenuService;
+        this.inputDisposables = this._register(( new DisposableStore()));
+        if (!NotificationTemplateRenderer_1.closeNotificationAction) {
+            NotificationTemplateRenderer_1.closeNotificationAction = instantiationService.createInstance(ClearNotificationAction, ClearNotificationAction.ID, ClearNotificationAction.LABEL);
+            NotificationTemplateRenderer_1.expandNotificationAction = instantiationService.createInstance(ExpandNotificationAction, ExpandNotificationAction.ID, ExpandNotificationAction.LABEL);
+            NotificationTemplateRenderer_1.collapseNotificationAction = instantiationService.createInstance(CollapseNotificationAction, CollapseNotificationAction.ID, CollapseNotificationAction.LABEL);
+        }
+    }
+    setInput(notification) {
+        this.inputDisposables.clear();
+        this.render(notification);
+    }
+    render(notification) {
+        this.template.container.classList.toggle('expanded', notification.expanded);
+        this.inputDisposables.add(addDisposableListener(this.template.container, EventType.MOUSE_UP, e => {
+            if (e.button === 1 ) {
+                EventHelper.stop(e, true);
+            }
+        }));
+        this.inputDisposables.add(addDisposableListener(this.template.container, EventType.AUXCLICK, e => {
+            if (!notification.hasProgress && e.button === 1 ) {
+                EventHelper.stop(e, true);
+                notification.close();
+            }
+        }));
+        this.renderSeverity(notification);
+        const messageOverflows = this.renderMessage(notification);
+        this.renderSecondaryActions(notification, messageOverflows);
+        this.renderSource(notification);
+        this.renderButtons(notification);
+        this.renderProgress(notification);
+        this.inputDisposables.add(notification.onDidChangeContent(event => {
+            switch (event.kind) {
+                case 0 :
+                    this.renderSeverity(notification);
+                    break;
+                case 3 :
+                    this.renderProgress(notification);
+                    break;
+                case 1 :
+                    this.renderMessage(notification);
+                    break;
+            }
+        }));
+    }
+    renderSeverity(notification) {
+        NotificationTemplateRenderer_1.SEVERITIES.forEach(severity => {
+            if (notification.severity !== severity) {
+                this.template.icon.classList.remove(...ThemeIcon.asClassNameArray(this.toSeverityIcon(severity)));
+            }
+        });
+        this.template.icon.classList.add(...ThemeIcon.asClassNameArray(this.toSeverityIcon(notification.severity)));
+    }
+    renderMessage(notification) {
+        clearNode(this.template.message);
+        this.template.message.appendChild(NotificationMessageRenderer.render(notification.message, {
+            callback: link => this.openerService.open(( URI.parse(link)), { allowCommands: true }),
+            toDispose: this.inputDisposables
+        }));
+        const messageOverflows = notification.canCollapse && !notification.expanded && this.template.message.scrollWidth > this.template.message.clientWidth;
+        if (messageOverflows) {
+            this.template.message.title = this.template.message.textContent + '';
+        }
+        else {
+            this.template.message.removeAttribute('title');
+        }
+        return messageOverflows;
+    }
+    renderSecondaryActions(notification, messageOverflows) {
+        const actions = [];
+        if (isNonEmptyArray(notification.actions?.secondary)) {
+            const configureNotificationAction = this.instantiationService.createInstance(ConfigureNotificationAction, ConfigureNotificationAction.ID, ConfigureNotificationAction.LABEL, notification);
+            actions.push(configureNotificationAction);
+            this.inputDisposables.add(configureNotificationAction);
+        }
+        let showExpandCollapseAction = false;
+        if (notification.canCollapse) {
+            if (notification.expanded) {
+                showExpandCollapseAction = true;
+            }
+            else if (notification.source) {
+                showExpandCollapseAction = true;
+            }
+            else if (messageOverflows) {
+                showExpandCollapseAction = true;
+            }
+        }
+        if (showExpandCollapseAction) {
+            actions.push(notification.expanded ? NotificationTemplateRenderer_1.collapseNotificationAction : NotificationTemplateRenderer_1.expandNotificationAction);
+        }
+        if (!notification.hasProgress) {
+            actions.push(NotificationTemplateRenderer_1.closeNotificationAction);
+        }
+        this.template.toolbar.clear();
+        this.template.toolbar.context = notification;
+        actions.forEach(action => this.template.toolbar.push(action, { icon: true, label: false, keybinding: this.getKeybindingLabel(action) }));
+    }
+    renderSource(notification) {
+        if (notification.expanded && notification.source) {
+            this.template.source.textContent = ( localizeWithPath(
+                'vs/workbench/browser/parts/notifications/notificationsViewer',
+                'notificationSource',
+                "Source: {0}",
+                notification.source
+            ));
+            this.template.source.title = notification.source;
+        }
+        else {
+            this.template.source.textContent = '';
+            this.template.source.removeAttribute('title');
+        }
+    }
+    renderButtons(notification) {
+        clearNode(this.template.buttonsContainer);
+        const primaryActions = notification.actions ? notification.actions.primary : undefined;
+        if (notification.expanded && isNonEmptyArray(primaryActions)) {
+            const that = this;
+            const actionRunner = new (class extends ActionRunner {
+                async runAction(action) {
+                    that.actionRunner.run(action, notification);
+                    if (!(action instanceof ChoiceAction) || !action.keepOpen) {
+                        notification.close();
+                    }
+                }
+            })();
+            const buttonToolbar = this.inputDisposables.add(( new ButtonBar(this.template.buttonsContainer)));
+            for (let i = 0; i < primaryActions.length; i++) {
+                const action = primaryActions[i];
+                const options = {
+                    title: true,
+                    secondary: i > 0,
+                    ...defaultButtonStyles
+                };
+                const dropdownActions = action instanceof ChoiceAction ? action.menu : undefined;
+                const button = this.inputDisposables.add(dropdownActions ?
+                    buttonToolbar.addButtonWithDropdown({
+                        ...options,
+                        contextMenuProvider: this.contextMenuService,
+                        actions: dropdownActions,
+                        actionRunner
+                    }) :
+                    buttonToolbar.addButton(options));
+                button.label = action.label;
+                this.inputDisposables.add(button.onDidClick(e => {
+                    if (e) {
+                        EventHelper.stop(e, true);
+                    }
+                    actionRunner.run(action);
+                }));
+            }
+        }
+    }
+    renderProgress(notification) {
+        if (!notification.hasProgress) {
+            this.template.progress.stop().hide();
+            return;
+        }
+        const state = notification.progress.state;
+        if (state.infinite) {
+            this.template.progress.infinite().show();
+        }
+        else if (typeof state.total === 'number' || typeof state.worked === 'number') {
+            if (typeof state.total === 'number' && !this.template.progress.hasTotal()) {
+                this.template.progress.total(state.total);
+            }
+            if (typeof state.worked === 'number') {
+                this.template.progress.setWorked(state.worked).show();
+            }
+        }
+        else {
+            this.template.progress.done().hide();
+        }
+    }
+    toSeverityIcon(severity) {
+        switch (severity) {
+            case Severity.Warning:
+                return Codicon.warning;
+            case Severity.Error:
+                return Codicon.error;
+        }
+        return Codicon.info;
+    }
+    getKeybindingLabel(action) {
+        const keybinding = this.keybindingService.lookupKeybinding(action.id);
+        return keybinding ? keybinding.getLabel() : null;
+    }
+};
+NotificationTemplateRenderer = NotificationTemplateRenderer_1 = ( __decorate([
+    ( __param(2, IOpenerService)),
+    ( __param(3, IInstantiationService)),
+    ( __param(4, IKeybindingService)),
+    ( __param(5, IContextMenuService))
+], NotificationTemplateRenderer));
+export { NotificationRenderer, NotificationTemplateRenderer, NotificationsListDelegate };