@codingame/monaco-vscode-katex-common 25.1.2 → 26.0.0

package/vscode/src/vs/workbench/contrib/markdown/browser/markedKatexSupport.js

@@ -7,39 +7,31 @@ class MarkedKatexSupport {
     static getSanitizerOptions(baseConfig) {
         return {
             allowedTags: {
-                override: [
-                    ...baseConfig.allowedTags,
-                    ...trustedMathMlTags,
-                ]
+                override: [...baseConfig.allowedTags, ...trustedMathMlTags]
             },
             allowedAttributes: {
-                override: [
-                    ...baseConfig.allowedAttributes,
-                    'stretchy',
-                    'encoding',
-                    'accent',
-                    katexContainerLatexAttributeName,
-                    'd',
-                    'viewBox',
-                    'preserveAspectRatio',
-                    'class',
-                    {
-                        attributeName: 'style',
-                        shouldKeep: (_el, data) => this.sanitizeKatexStyles(data.attrValue),
-                    },
-                ]
-            },
+                override: [...baseConfig.allowedAttributes,
+                "stretchy", "encoding", "accent", katexContainerLatexAttributeName,
+                "d", "viewBox", "preserveAspectRatio",
+                "class",
+                {
+                    attributeName: "style",
+                    shouldKeep: (_el, data) => this.sanitizeKatexStyles(data.attrValue)
+                }]
+            }
         };
     }
-    static { this.tempSanitizerRule = ( new Lazy(() => {
-        const styleSheet = ( new CSSStyleSheet());
-        styleSheet.insertRule(`.temp{}`);
-        const rule = styleSheet.cssRules[0];
-        if (!(rule instanceof CSSStyleRule)) {
-            throw ( new Error('Invalid CSS rule'));
-        }
-        return rule.style;
-    })); }
+    static {
+        this.tempSanitizerRule = ( new Lazy(() => {
+            const styleSheet = ( new CSSStyleSheet());
+            styleSheet.insertRule(`.temp{}`);
+            const rule = styleSheet.cssRules[0];
+            if (!(rule instanceof CSSStyleRule)) {
+                throw ( new Error("Invalid CSS rule"));
+            }
+            return rule.style;
+        }));
+    }
     static sanitizeStyles(styleString, allowedProperties) {
         const style = this.tempSanitizerRule.value;
         style.cssText = styleString;
@@ -53,56 +45,58 @@ class MarkedKatexSupport {
                 }
             }
         }
-        return sanitizedProps.join('; ');
+        return sanitizedProps.join("; ");
     }
     static sanitizeKatexStyles(styleString) {
         const allowedProperties = [
-            'display',
-            'position',
-            'font-family',
-            'font-style',
-            'font-weight',
-            'font-size',
-            'height',
-            'min-height',
-            'max-height',
-            'width',
-            'min-width',
-            'max-width',
-            'margin',
-            'margin-top',
-            'margin-right',
-            'margin-bottom',
-            'margin-left',
-            'padding',
-            'padding-top',
-            'padding-right',
-            'padding-bottom',
-            'padding-left',
-            'top',
-            'left',
-            'right',
-            'bottom',
-            'vertical-align',
-            'transform',
-            'border',
-            'border-top-width',
-            'border-right-width',
-            'border-bottom-width',
-            'border-left-width',
-            'color',
-            'white-space',
-            'text-align',
-            'line-height',
-            'float',
-            'clear',
+            "display",
+            "position",
+            "font-family",
+            "font-style",
+            "font-weight",
+            "font-size",
+            "height",
+            "min-height",
+            "max-height",
+            "width",
+            "min-width",
+            "max-width",
+            "margin",
+            "margin-top",
+            "margin-right",
+            "margin-bottom",
+            "margin-left",
+            "padding",
+            "padding-top",
+            "padding-right",
+            "padding-bottom",
+            "padding-left",
+            "top",
+            "left",
+            "right",
+            "bottom",
+            "vertical-align",
+            "transform",
+            "border",
+            "border-top-width",
+            "border-right-width",
+            "border-bottom-width",
+            "border-left-width",
+            "color",
+            "white-space",
+            "text-align",
+            "line-height",
+            "float",
+            "clear"
         ];
         return this.sanitizeStyles(styleString, allowedProperties);
     }
-    static { this._katexPromise = ( new Lazy(async () => {
-        this._katex = (await import('katex')).default;
-        return this._katex;
-    })); }
+    static {
+        this._katexPromise = ( new Lazy(async () => {
+            this._katex = (await import('katex')).default;
+            return this._katex;
+        }));
+    }
     static getExtension(window, options = {}) {
         if (!this._katex) {
             return undefined;
@@ -117,85 +111,85 @@ class MarkedKatexSupport {
     }
     static ensureKatexStyles(window) {
         const doc = window.document;
-        if (!doc.querySelector('link.katex')) {
+        if (!doc.querySelector("link.katex")) {
             const katexStyle = createLinkElement();
-            katexStyle.classList.add('katex');
-            katexStyle.rel = 'stylesheet';
-            katexStyle.href = ( new URL('katex/dist/katex.min.css', import.meta.url)).href;
+            katexStyle.classList.add("katex");
+            katexStyle.rel = "stylesheet";
+            katexStyle.href = ( new URL("katex/dist/katex.min.css", import.meta.url)).href;
         }
     }
 }
 const trustedMathMlTags = ( Object.freeze([
-    'semantics',
-    'annotation',
-    'math',
-    'menclose',
-    'merror',
-    'mfenced',
-    'mfrac',
-    'mglyph',
-    'mi',
-    'mlabeledtr',
-    'mmultiscripts',
-    'mn',
-    'mo',
-    'mover',
-    'mpadded',
-    'mphantom',
-    'mroot',
-    'mrow',
-    'ms',
-    'mspace',
-    'msqrt',
-    'mstyle',
-    'msub',
-    'msup',
-    'msubsup',
-    'mtable',
-    'mtd',
-    'mtext',
-    'mtr',
-    'munder',
-    'munderover',
-    'mprescripts',
-    'svg',
-    'altglyph',
-    'altglyphdef',
-    'altglyphitem',
-    'circle',
-    'clippath',
-    'defs',
-    'desc',
-    'ellipse',
-    'filter',
-    'font',
-    'g',
-    'glyph',
-    'glyphref',
-    'hkern',
-    'line',
-    'lineargradient',
-    'marker',
-    'mask',
-    'metadata',
-    'mpath',
-    'path',
-    'pattern',
-    'polygon',
-    'polyline',
-    'radialgradient',
-    'rect',
-    'stop',
-    'style',
-    'switch',
-    'symbol',
-    'text',
-    'textpath',
-    'title',
-    'tref',
-    'tspan',
-    'view',
-    'vkern',
+    "semantics",
+    "annotation",
+    "math",
+    "menclose",
+    "merror",
+    "mfenced",
+    "mfrac",
+    "mglyph",
+    "mi",
+    "mlabeledtr",
+    "mmultiscripts",
+    "mn",
+    "mo",
+    "mover",
+    "mpadded",
+    "mphantom",
+    "mroot",
+    "mrow",
+    "ms",
+    "mspace",
+    "msqrt",
+    "mstyle",
+    "msub",
+    "msup",
+    "msubsup",
+    "mtable",
+    "mtd",
+    "mtext",
+    "mtr",
+    "munder",
+    "munderover",
+    "mprescripts",
+    "svg",
+    "altglyph",
+    "altglyphdef",
+    "altglyphitem",
+    "circle",
+    "clippath",
+    "defs",
+    "desc",
+    "ellipse",
+    "filter",
+    "font",
+    "g",
+    "glyph",
+    "glyphref",
+    "hkern",
+    "line",
+    "lineargradient",
+    "marker",
+    "mask",
+    "metadata",
+    "mpath",
+    "path",
+    "pattern",
+    "polygon",
+    "polyline",
+    "radialgradient",
+    "rect",
+    "stop",
+    "style",
+    "switch",
+    "symbol",
+    "text",
+    "textpath",
+    "title",
+    "tref",
+    "tspan",
+    "view",
+    "vkern"
 ]));
 
 export { MarkedKatexSupport };

package/vscode/src/vs/workbench/contrib/mcp/browser/mcpToolCallUI.d.ts

@@ -0,0 +1,64 @@
+import { CancellationToken } from "@codingame/monaco-vscode-api/vscode/vs/base/common/cancellation";
+import { Disposable } from "@codingame/monaco-vscode-api/vscode/vs/base/common/lifecycle";
+import { IObservable } from "@codingame/monaco-vscode-api/vscode/vs/base/common/observable";
+import { IThemeService } from "@codingame/monaco-vscode-api/vscode/vs/platform/theme/common/themeService.service";
+import { IMcpToolCallUIData } from "@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/mcp/common/mcpTypes";
+import { IMcpService } from "@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/mcp/common/mcpTypes.service";
+import { MCP } from "@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/mcp/common/modelContextProtocol";
+import { McpApps } from "../common/modelContextProtocolApps.js";
+/**
+ * Result from loading an MCP App UI resource.
+ */
+export interface IMcpAppResourceContent extends McpApps.McpUiResourceMeta {
+    /** The HTML content of the UI resource */
+    readonly html: string;
+    /** MIME type of the content */
+    readonly mimeType: string;
+}
+/**
+ * Wrapper class that "upgrades" serializable IMcpToolCallUIData into a functional
+ * object that can load UI resources and proxy tool/resource calls back to the MCP server.
+ */
+export declare class McpToolCallUI extends Disposable {
+    private readonly _uiData;
+    private readonly _mcpService;
+    /**
+     * Basic host context reflecting the current UI and theme. Notably lacks
+     * the `toolInfo` or `viewport` sizes.
+     */
+    readonly hostContext: IObservable<McpApps.McpUiHostContext>;
+    constructor(_uiData: IMcpToolCallUIData, _mcpService: IMcpService, themeService: IThemeService);
+    /**
+     * Gets the underlying UI data.
+     */
+    get uiData(): IMcpToolCallUIData;
+    /**
+     * Logs a message to the MCP server's logger.
+     */
+    log(log: MCP.LoggingMessageNotificationParams): Promise<void>;
+    /**
+     * Gets or finds the MCP server for this UI.
+     */
+    private _getServer;
+    /**
+     * Loads the UI resource from the MCP server.
+     * @param token Cancellation token
+     * @returns The HTML content and CSP configuration
+     */
+    loadResource(token: CancellationToken): Promise<IMcpAppResourceContent>;
+    /**
+     * Calls a tool on the MCP server.
+     * @param name Tool name
+     * @param params Tool parameters
+     * @param token Cancellation token
+     * @returns The tool call result
+     */
+    callTool(name: string, params: Record<string, unknown>, token: CancellationToken): Promise<MCP.CallToolResult>;
+    /**
+     * Reads a resource from the MCP server.
+     * @param uri Resource URI
+     * @param token Cancellation token
+     * @returns The resource content
+     */
+    readResource(uri: string, token: CancellationToken): Promise<MCP.ReadResourceResult>;
+}

package/vscode/src/vs/workbench/contrib/mcp/browser/mcpToolCallUI.js

@@ -0,0 +1,200 @@
+
+import { __decorate, __param } from '@codingame/monaco-vscode-api/external/tslib/tslib.es6';
+import { Gesture } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/touch';
+import { decodeBase64 } from '@codingame/monaco-vscode-api/vscode/vs/base/common/buffer';
+import { CancellationToken } from '@codingame/monaco-vscode-api/vscode/vs/base/common/cancellation';
+import { Disposable } from '@codingame/monaco-vscode-api/vscode/vs/base/common/lifecycle';
+import '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/index';
+import { locale, isWeb, isMobile } from '@codingame/monaco-vscode-api/vscode/vs/base/common/platform';
+import { hasKey } from '@codingame/monaco-vscode-api/vscode/vs/base/common/types';
+import { ColorScheme } from '@codingame/monaco-vscode-api/vscode/vs/platform/theme/common/theme';
+import { IThemeService } from '@codingame/monaco-vscode-api/vscode/vs/platform/theme/common/themeService.service';
+import { McpServer } from '@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/mcp/common/mcpServer';
+import { McpToolVisibility } from '@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/mcp/common/mcpTypes';
+import { IMcpService } from '@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/mcp/common/mcpTypes.service';
+import { translateMcpLogMessage, findMcpServer, startServerAndWaitForLiveTools } from '@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/mcp/common/mcpTypesUtils';
+import { observableFromEvent } from '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/observables/observableFromEvent';
+import { derived } from '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/observables/derived';
+
+let McpToolCallUI = class McpToolCallUI extends Disposable {
+    constructor(_uiData, _mcpService, themeService) {
+        super();
+        this._uiData = _uiData;
+        this._mcpService = _mcpService;
+        const colorTheme = observableFromEvent(themeService.onDidColorThemeChange, () => {
+            const type = themeService.getColorTheme().type;
+            return type === ColorScheme.DARK || type === ColorScheme.HIGH_CONTRAST_DARK ? "dark" : "light";
+        });
+        this.hostContext = derived(reader => {
+            return {
+                theme: colorTheme.read(reader),
+                styles: {
+                    variables: {
+                        "--color-background-primary": "var(--vscode-editor-background)",
+                        "--color-background-secondary": "var(--vscode-sideBar-background)",
+                        "--color-background-tertiary": "var(--vscode-activityBar-background)",
+                        "--color-background-inverse": "var(--vscode-editor-foreground)",
+                        "--color-background-ghost": "transparent",
+                        "--color-background-info": "var(--vscode-inputValidation-infoBackground)",
+                        "--color-background-danger": "var(--vscode-inputValidation-errorBackground)",
+                        "--color-background-success": "var(--vscode-diffEditor-insertedTextBackground)",
+                        "--color-background-warning": "var(--vscode-inputValidation-warningBackground)",
+                        "--color-background-disabled": "var(--vscode-editor-inactiveSelectionBackground)",
+                        "--color-text-primary": "var(--vscode-foreground)",
+                        "--color-text-secondary": "var(--vscode-descriptionForeground)",
+                        "--color-text-tertiary": "var(--vscode-disabledForeground)",
+                        "--color-text-inverse": "var(--vscode-editor-background)",
+                        "--color-text-info": "var(--vscode-textLink-foreground)",
+                        "--color-text-danger": "var(--vscode-errorForeground)",
+                        "--color-text-success": "var(--vscode-testing-iconPassed)",
+                        "--color-text-warning": "var(--vscode-editorWarning-foreground)",
+                        "--color-text-disabled": "var(--vscode-disabledForeground)",
+                        "--color-text-ghost": "var(--vscode-descriptionForeground)",
+                        "--color-border-primary": "var(--vscode-widget-border)",
+                        "--color-border-secondary": "var(--vscode-editorWidget-border)",
+                        "--color-border-tertiary": "var(--vscode-panel-border)",
+                        "--color-border-inverse": "var(--vscode-foreground)",
+                        "--color-border-ghost": "transparent",
+                        "--color-border-info": "var(--vscode-inputValidation-infoBorder)",
+                        "--color-border-danger": "var(--vscode-inputValidation-errorBorder)",
+                        "--color-border-success": "var(--vscode-testing-iconPassed)",
+                        "--color-border-warning": "var(--vscode-inputValidation-warningBorder)",
+                        "--color-border-disabled": "var(--vscode-disabledForeground)",
+                        "--color-ring-primary": "var(--vscode-focusBorder)",
+                        "--color-ring-secondary": "var(--vscode-focusBorder)",
+                        "--color-ring-inverse": "var(--vscode-focusBorder)",
+                        "--color-ring-info": "var(--vscode-inputValidation-infoBorder)",
+                        "--color-ring-danger": "var(--vscode-inputValidation-errorBorder)",
+                        "--color-ring-success": "var(--vscode-testing-iconPassed)",
+                        "--color-ring-warning": "var(--vscode-inputValidation-warningBorder)",
+                        "--font-sans": "var(--vscode-font-family)",
+                        "--font-mono": "var(--vscode-editor-font-family)",
+                        "--font-weight-normal": "normal",
+                        "--font-weight-medium": "500",
+                        "--font-weight-semibold": "600",
+                        "--font-weight-bold": "bold",
+                        "--font-text-xs-size": "10px",
+                        "--font-text-sm-size": "11px",
+                        "--font-text-md-size": "13px",
+                        "--font-text-lg-size": "14px",
+                        "--font-heading-xs-size": "16px",
+                        "--font-heading-sm-size": "18px",
+                        "--font-heading-md-size": "20px",
+                        "--font-heading-lg-size": "24px",
+                        "--font-heading-xl-size": "32px",
+                        "--font-heading-2xl-size": "40px",
+                        "--font-heading-3xl-size": "48px",
+                        "--border-radius-xs": "2px",
+                        "--border-radius-sm": "3px",
+                        "--border-radius-md": "4px",
+                        "--border-radius-lg": "6px",
+                        "--border-radius-xl": "8px",
+                        "--border-radius-full": "9999px",
+                        "--border-width-regular": "1px",
+                        "--font-text-xs-line-height": "1.5",
+                        "--font-text-sm-line-height": "1.5",
+                        "--font-text-md-line-height": "1.5",
+                        "--font-text-lg-line-height": "1.5",
+                        "--font-heading-xs-line-height": "1.25",
+                        "--font-heading-sm-line-height": "1.25",
+                        "--font-heading-md-line-height": "1.25",
+                        "--font-heading-lg-line-height": "1.25",
+                        "--font-heading-xl-line-height": "1.25",
+                        "--font-heading-2xl-line-height": "1.25",
+                        "--font-heading-3xl-line-height": "1.25",
+                        "--shadow-hairline": "0 0 0 1px var(--vscode-widget-shadow)",
+                        "--shadow-sm": "0 1px 2px 0 var(--vscode-widget-shadow)",
+                        "--shadow-md": "0 4px 6px -1px var(--vscode-widget-shadow)",
+                        "--shadow-lg": "0 10px 15px -3px var(--vscode-widget-shadow)"
+                    }
+                },
+                displayMode: "inline",
+                availableDisplayModes: ["inline"],
+                locale: locale,
+                platform: isWeb ? "web" : isMobile ? "mobile" : "desktop",
+                deviceCapabilities: {
+                    touch: Gesture.isTouchDevice(),
+                    hover: Gesture.isHoverDevice()
+                }
+            };
+        });
+    }
+    get uiData() {
+        return this._uiData;
+    }
+    async log(log) {
+        const server = await this._getServer(CancellationToken.None);
+        if (server) {
+            translateMcpLogMessage(server.logger, log, `[App UI]`);
+        }
+    }
+    async _getServer(token) {
+        return findMcpServer(
+            this._mcpService,
+            s => s.definition.id === this._uiData.serverDefinitionId && s.collection.id === this._uiData.collectionId,
+            token
+        );
+    }
+    async loadResource(token) {
+        const server = await this._getServer(token);
+        if (!server) {
+            throw ( new Error("MCP server not found for UI resource"));
+        }
+        const resourceResult = await McpServer.callOn(server, h => h.readResource({
+            uri: this._uiData.resourceUri
+        }, token), token);
+        if (!resourceResult.contents || resourceResult.contents.length === 0) {
+            throw ( new Error("UI resource not found on server"));
+        }
+        const content = resourceResult.contents[0];
+        let html;
+        const mimeType = content.mimeType || "text/html";
+        if (hasKey(content, {
+            text: true
+        })) {
+            html = content.text;
+        } else if (hasKey(content, {
+            blob: true
+        })) {
+            html = ( decodeBase64(content.blob).toString());
+        } else {
+            throw ( new Error("UI resource has no content"));
+        }
+        const meta = content._meta?.ui;
+        return {
+            ...meta,
+            html,
+            mimeType
+        };
+    }
+    async callTool(name, params, token) {
+        const server = await this._getServer(token);
+        if (!server) {
+            throw ( new Error("MCP server not found for tool call"));
+        }
+        await startServerAndWaitForLiveTools(server, undefined, token);
+        const tool = server.tools.get().find(t => t.definition.name === name);
+        if (!tool || !(tool.visibility & McpToolVisibility.App)) {
+            throw ( new Error(`Tool not found on server: ${name}`));
+        }
+        const res = await tool.call(params, undefined, token);
+        return {
+            content: res.content,
+            isError: res.isError,
+            _meta: res._meta,
+            structuredContent: res.structuredContent
+        };
+    }
+    async readResource(uri, token) {
+        const server = await this._getServer(token);
+        if (!server) {
+            throw ( new Error("MCP server not found"));
+        }
+        return await McpServer.callOn(server, h => h.readResource({
+            uri
+        }, token), token);
+    }
+};
+McpToolCallUI = ( __decorate([( __param(1, IMcpService)), ( __param(2, IThemeService))], McpToolCallUI));
+
+export { McpToolCallUI };