@codingame/monaco-vscode-chat-service-override 32.0.2 → 33.0.4

package/vscode/src/vs/workbench/contrib/imageCarousel/browser/imageCarouselEditor.js

@@ -0,0 +1,600 @@
+
+import { __decorate, __param } from '@codingame/monaco-vscode-api/external/tslib/tslib.es6';
+import { h, clearNode, addDisposableListener, EventType, createElement } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/dom';
+import { StandardKeyboardEvent } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/keyboardEvent';
+import { KeyCode } from '@codingame/monaco-vscode-api/vscode/vs/base/common/keyCodes';
+import { DisposableStore } from '@codingame/monaco-vscode-api/vscode/vs/base/common/lifecycle';
+import { clamp } from '@codingame/monaco-vscode-api/vscode/vs/base/common/numbers';
+import { isMacintosh } from '@codingame/monaco-vscode-api/vscode/vs/base/common/platform';
+import { generateUuid } from '@codingame/monaco-vscode-api/vscode/vs/base/common/uuid';
+import { localize } from '@codingame/monaco-vscode-api/vscode/vs/nls';
+import { IFileService } from '@codingame/monaco-vscode-api/vscode/vs/platform/files/common/files.service';
+import { IThemeService } from '@codingame/monaco-vscode-api/vscode/vs/platform/theme/common/themeService.service';
+import { EditorPane } from '@codingame/monaco-vscode-api/vscode/vs/workbench/browser/parts/editor/editorPane';
+import { ITelemetryService } from '@codingame/monaco-vscode-api/vscode/vs/platform/telemetry/common/telemetry.service';
+import { IStorageService } from '@codingame/monaco-vscode-api/vscode/vs/platform/storage/common/storage.service';
+import { IWebviewService } from '@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/webview/browser/webview.service';
+import { ImageCarouselEditorInput } from './imageCarouselEditorInput.js';
+import { isVideoMimeType } from './imageCarouselTypes.js';
+
+var ImageCarouselEditor_1;
+const SCALE_PINCH_FACTOR = 0.075;
+const MAX_SCALE = 20;
+const MIN_SCALE = 0.1;
+const PIXELATION_THRESHOLD = 3;
+const ZOOM_LEVELS = [
+    0.1,
+    0.2,
+    0.3,
+    0.4,
+    0.5,
+    0.6,
+    0.7,
+    0.8,
+    0.9,
+    1,
+    1.5,
+    2,
+    3,
+    5,
+    7,
+    10,
+    15,
+    20
+];
+let ImageCarouselEditor = class ImageCarouselEditor extends EditorPane {
+    static {
+        ImageCarouselEditor_1 = this;
+    }
+    static {
+        this.ID = "workbench.editor.imageCarousel";
+    }
+    constructor(
+        group,
+        telemetryService,
+        themeService,
+        storageService,
+        _fileService,
+        _webviewService
+    ) {
+        super(
+            ImageCarouselEditor_1.ID,
+            group,
+            telemetryService,
+            themeService,
+            storageService
+        );
+        this._fileService = _fileService;
+        this._webviewService = _webviewService;
+        this._currentIndex = 0;
+        this._zoomScale = "fit";
+        this._sections = [];
+        this._flatImages = [];
+        this._contentDisposables = this._register(( new DisposableStore()));
+        this._imageDisposables = this._register(( new DisposableStore()));
+        this._blobUrlCache = ( new Map());
+        this._thumbnailElements = [];
+    }
+    createEditor(parent) {
+        this._container = h("div.image-carousel-editor").root;
+        parent.appendChild(this._container);
+    }
+    async setInput(input, options, context, token) {
+        await super.setInput(input, options, context, token);
+        this._sections = input.collection.sections;
+        this._flatImages = [];
+        for (let s = 0; s < this._sections.length; s++) {
+            for (let i = 0; i < this._sections[s].images.length; i++) {
+                this._flatImages.push({
+                    sectionIndex: s,
+                    imageIndexInSection: i,
+                    image: this._sections[s].images[i]
+                });
+            }
+        }
+        this._currentIndex = Math.min(input.startIndex, Math.max(0, this._flatImages.length - 1));
+        this.buildSlideshow();
+    }
+    clearInput() {
+        this._videoWebview?.dispose();
+        this._videoWebview = undefined;
+        this._contentDisposables.clear();
+        this._imageDisposables.clear();
+        this._revokeCachedBlobUrls();
+        this._zoomScale = "fit";
+        if (this._container) {
+            clearNode(this._container);
+        }
+        this._elements = undefined;
+        this._thumbnailElements = [];
+        super.clearInput();
+    }
+    _isCurrentVideo() {
+        const entry = this._flatImages[this._currentIndex];
+        return !!entry && isVideoMimeType(entry.image.mimeType);
+    }
+    buildSlideshow() {
+        if (!this._container) {
+            return;
+        }
+        this._contentDisposables.clear();
+        this._imageDisposables.clear();
+        this._revokeCachedBlobUrls();
+        clearNode(this._container);
+        if (this._flatImages.length === 0) {
+            const empty = h("div.empty-message");
+            empty.root.textContent = ( localize(10519, "No images to display"));
+            this._container.appendChild(empty.root);
+            return;
+        }
+        const elements = h("div.slideshow-container", [h("div.image-area@imageArea", [h(
+            "div.main-image-container@mainImageContainer",
+            [h("img.main-image@mainImage"), h("div.video-container@videoContainer")]
+        ), h("button.nav-arrow.prev-arrow@prevBtn", {
+            ariaLabel: ( localize(10520, "Previous image"))
+        }, [h("span.codicon.codicon-chevron-left", {
+            ariaHidden: "true"
+        })]), h("button.nav-arrow.next-arrow@nextBtn", {
+            ariaLabel: ( localize(10521, "Next image"))
+        }, [h("span.codicon.codicon-chevron-right", {
+            ariaHidden: "true"
+        })])]), h("div.bottom-bar@bottomBar", [h("div.image-info-bar", [
+            h("span.caption-text@captionText"),
+            h("span.caption-separator@captionSeparator"),
+            h("span.image-counter@counter")
+        ]), h("div.sections-container@sectionsContainer"), h("span.sr-only@ariaStatus")])]);
+        elements.root.setAttribute("role", "group");
+        elements.root.setAttribute("aria-label", ( localize(10522, "Images Preview")));
+        elements.captionSeparator.setAttribute("aria-hidden", "true");
+        elements.ariaStatus.setAttribute("aria-live", "polite");
+        elements.ariaStatus.setAttribute("aria-atomic", "true");
+        elements.sectionsContainer.setAttribute("role", "group");
+        elements.sectionsContainer.setAttribute("aria-label", ( localize(10523, "Image thumbnails")));
+        this._elements = {
+            root: elements.root,
+            imageArea: elements.imageArea,
+            mainImageContainer: elements.mainImageContainer,
+            mainImage: elements.mainImage,
+            videoContainer: elements.videoContainer,
+            captionText: elements.captionText,
+            captionSeparator: elements.captionSeparator,
+            counter: elements.counter,
+            ariaStatus: elements.ariaStatus,
+            prevBtn: elements.prevBtn,
+            nextBtn: elements.nextBtn,
+            sectionsContainer: elements.sectionsContainer
+        };
+        this._elements.mainImage.classList.add("scale-to-fit");
+        this._elements.mainImage.alt = "";
+        this._elements.videoContainer.style.display = "none";
+        this._contentDisposables.add(addDisposableListener(this._elements.prevBtn, "click", () => {
+            if (this._currentIndex > 0) {
+                this._currentIndex--;
+                this.updateCurrentImage();
+            }
+        }));
+        this._contentDisposables.add(addDisposableListener(this._elements.nextBtn, "click", () => {
+            if (this._currentIndex < this._flatImages.length - 1) {
+                this._currentIndex++;
+                this.updateCurrentImage();
+            }
+        }));
+        this._contentDisposables.add(addDisposableListener(elements.root, EventType.KEY_DOWN, e => {
+            const event = ( new StandardKeyboardEvent(e));
+            if (event.keyCode === KeyCode.LeftArrow) {
+                this.previous();
+                event.stopPropagation();
+                event.preventDefault();
+            } else if (event.keyCode === KeyCode.RightArrow) {
+                this.next();
+                event.stopPropagation();
+                event.preventDefault();
+            }
+        }));
+        elements.root.tabIndex = 0;
+        this._contentDisposables.add(
+            addDisposableListener(this._elements.imageArea, EventType.MOUSE_WHEEL, e => {
+                if (this._isCurrentVideo()) {
+                    return;
+                }
+                const isZoomModifier = isMacintosh ? e.altKey : e.ctrlKey;
+                if (!isZoomModifier && !e.ctrlKey) {
+                    return;
+                }
+                e.preventDefault();
+                if (e.deltaY === 0) {
+                    return;
+                }
+                if (this._zoomScale === "fit") {
+                    this._initZoomFromFit();
+                }
+                const delta = e.deltaY > 0 ? 1 : -1;
+                this._applyZoom(this._zoomScale * (1 - delta * SCALE_PINCH_FACTOR));
+            }, {
+                passive: false
+            })
+        );
+        let clickCtrlPressed = false;
+        let clickAltPressed = false;
+        this._contentDisposables.add(
+            addDisposableListener(this._elements.mainImageContainer, EventType.MOUSE_DOWN, e => {
+                if (e.button !== 0) {
+                    return;
+                }
+                clickCtrlPressed = e.ctrlKey;
+                clickAltPressed = e.altKey;
+            })
+        );
+        this._contentDisposables.add(
+            addDisposableListener(this._elements.mainImageContainer, EventType.CLICK, e => {
+                if (e.button !== 0 || this._isCurrentVideo()) {
+                    return;
+                }
+                const isZoomOut = isMacintosh ? clickAltPressed : clickCtrlPressed;
+                if (isZoomOut) {
+                    this._zoomOut();
+                } else {
+                    this._zoomIn();
+                }
+            })
+        );
+        const updateZoomCursor = e => {
+            const isZoomOut = isMacintosh ? e.altKey : e.ctrlKey;
+            this._elements.mainImageContainer.classList.toggle("zoom-out", isZoomOut);
+        };
+        this._contentDisposables.add(addDisposableListener(elements.root, EventType.KEY_DOWN, updateZoomCursor));
+        this._contentDisposables.add(addDisposableListener(elements.root, EventType.KEY_UP, updateZoomCursor));
+        this._thumbnailElements = [];
+        let flatIndex = 0;
+        for (let s = 0; s < this._sections.length; s++) {
+            const section = this._sections[s];
+            if (s > 0 && this._sections.length > 1) {
+                const separator = h("div.thumbnail-separator").root;
+                separator.setAttribute("aria-hidden", "true");
+                this._elements.sectionsContainer.appendChild(separator);
+            }
+            for (let i = 0; i < section.images.length; i++) {
+                const image = section.images[i];
+                const currentFlatIndex = flatIndex;
+                const isItemVideo = isVideoMimeType(image.mimeType);
+                const btn = createElement("button");
+                btn.className = isItemVideo ? "thumbnail video-thumbnail" : "thumbnail";
+                btn.ariaLabel = isItemVideo ? ( localize(10524, "Video {0} of {1}", currentFlatIndex + 1, this._flatImages.length)) : ( localize(10525, "Image {0} of {1}", currentFlatIndex + 1, this._flatImages.length));
+                if (isItemVideo) {
+                    const icon = h("span.codicon.codicon-play.thumbnail-play-icon");
+                    icon.root.setAttribute("aria-hidden", "true");
+                    btn.appendChild(icon.root);
+                } else {
+                    const img = createElement("img");
+                    img.className = "thumbnail-image";
+                    img.alt = image.name;
+                    const thumbnailDisposables = this._contentDisposables.add(( new DisposableStore()));
+                    const markBroken = () => {
+                        if (thumbnailDisposables.isDisposed) {
+                            return;
+                        }
+                        if (!btn.classList.contains("broken")) {
+                            btn.classList.add("broken");
+                            img.removeAttribute("src");
+                            img.alt = "";
+                            img.remove();
+                            const fallback = h("span.codicon.codicon-warning.thumbnail-broken-icon");
+                            fallback.root.setAttribute("aria-hidden", "true");
+                            btn.appendChild(fallback.root);
+                        }
+                    };
+                    this._loadBlobUrl(image).then(url => {
+                        if (thumbnailDisposables.isDisposed) {
+                            return;
+                        }
+                        if (url) {
+                            const preloader = ( new Image());
+                            thumbnailDisposables.add(addDisposableListener(preloader, "load", () => {
+                                if (btn.classList.contains("broken")) {
+                                    return;
+                                }
+                                img.src = url;
+                                if (!img.parentElement) {
+                                    btn.appendChild(img);
+                                }
+                            }));
+                            thumbnailDisposables.add(addDisposableListener(preloader, "error", () => {
+                                markBroken();
+                            }));
+                            preloader.src = url;
+                        } else {
+                            markBroken();
+                        }
+                    }, () => {
+                        markBroken();
+                    });
+                    thumbnailDisposables.add(addDisposableListener(img, "error", () => {
+                        markBroken();
+                    }));
+                }
+                this._contentDisposables.add(addDisposableListener(btn, "click", () => {
+                    this._currentIndex = currentFlatIndex;
+                    this.updateCurrentImage();
+                }));
+                this._elements.sectionsContainer.appendChild(btn);
+                this._thumbnailElements.push(btn);
+                flatIndex++;
+            }
+        }
+        this._container.appendChild(elements.root);
+        this.updateCurrentImage();
+    }
+    async updateCurrentImage() {
+        if (!this._elements) {
+            return;
+        }
+        const navigationIndex = this._currentIndex;
+        const entry = this._flatImages[navigationIndex];
+        const currentImage = entry.image;
+        const isVideo = isVideoMimeType(currentImage.mimeType);
+        if (isVideo) {
+            this._elements.mainImage.style.display = "none";
+            this._elements.videoContainer.style.display = "";
+            this._elements.mainImageContainer.classList.remove("zoomed");
+            this._elements.mainImageContainer.style.cursor = "default";
+            const rawData = await this._loadRawData(currentImage);
+            if (this._currentIndex !== navigationIndex) {
+                return;
+            }
+            const nonce = generateUuid();
+            const videoHtml = `<!DOCTYPE html>
+<html><head>
+<meta charset="utf-8">
+<meta http-equiv="Content-Security-Policy" content="default-src 'none'; media-src blob: data:; script-src 'nonce-${nonce}'; style-src 'nonce-${nonce}';">
+<style nonce="${nonce}">html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:transparent}
+video{width:100%;height:100%;object-fit:contain;outline:none}</style>
+</head><body>
+<video id="v" controls></video>
+<script nonce="${nonce}">
+window.addEventListener("message",function(e){var m=e.data;if(m.type==="loadVideo"){var b=new Blob([m.data],{type:m.mimeType});document.getElementById("v").src=URL.createObjectURL(b);}});
+</script>
+</body></html>`;
+            let webview;
+            if (!this._videoWebview) {
+                webview = this._contentDisposables.add(this._webviewService.createWebviewElement({
+                    title: currentImage.name,
+                    options: {
+                        disableServiceWorker: true
+                    },
+                    contentOptions: {
+                        allowScripts: true
+                    },
+                    extension: undefined
+                }));
+                webview.mountTo(this._elements.videoContainer, this.window);
+                this._videoWebview = webview;
+            } else {
+                webview = this._videoWebview;
+            }
+            webview.setHtml(videoHtml);
+            const buffer = rawData.buffer;
+            webview.postMessage({
+                type: "loadVideo",
+                data: buffer,
+                mimeType: currentImage.mimeType
+            }, [buffer]);
+        } else {
+            this._elements.videoContainer.style.display = "none";
+            this._elements.mainImage.style.display = "";
+            this._elements.mainImageContainer.style.cursor = "";
+            const url = await this._loadBlobUrl(currentImage);
+            if (this._currentIndex !== navigationIndex) {
+                return;
+            }
+            const tmp = ( new Image());
+            tmp.src = url;
+            tmp.decode().then(() => {
+                if (this._currentIndex === navigationIndex && this._elements) {
+                    this._elements.mainImage.src = url;
+                    this._elements.mainImage.alt = currentImage.name;
+                }
+            }, () => {
+                if (this._currentIndex === navigationIndex && this._elements) {
+                    this._elements.mainImage.src = url;
+                    this._elements.mainImage.alt = currentImage.name;
+                }
+            });
+        }
+        this._applyZoom("fit");
+        if (currentImage.caption) {
+            this._elements.captionText.textContent = currentImage.caption;
+            this._elements.captionText.style.display = "";
+            this._elements.captionSeparator.style.display = "";
+        } else {
+            this._elements.captionText.textContent = "";
+            this._elements.captionText.style.display = "none";
+            this._elements.captionSeparator.style.display = "none";
+        }
+        this._elements.counter.textContent = ( localize(10526, "{0} / {1}", navigationIndex + 1, this._flatImages.length));
+        const itemKind = isVideo ? ( localize(10527, "Video")) : ( localize(10528, "Image"));
+        this._elements.ariaStatus.textContent = currentImage.caption ? ( localize(
+            10529,
+            "{0} {1} of {2}: {3}",
+            itemKind,
+            navigationIndex + 1,
+            this._flatImages.length,
+            currentImage.caption
+        )) : ( localize(
+            10530,
+            "{0} {1} of {2}: {3}",
+            itemKind,
+            navigationIndex + 1,
+            this._flatImages.length,
+            currentImage.name
+        ));
+        this._elements.prevBtn.disabled = navigationIndex === 0;
+        this._elements.nextBtn.disabled = navigationIndex === this._flatImages.length - 1;
+        for (let i = 0; i < this._thumbnailElements.length; i++) {
+            const isActive = i === navigationIndex;
+            const thumbnail = this._thumbnailElements[i];
+            thumbnail.classList.toggle("active", isActive);
+            if (isActive) {
+                thumbnail.setAttribute("aria-current", "page");
+            } else {
+                thumbnail.removeAttribute("aria-current");
+            }
+        }
+        const activeThumbnail = this._thumbnailElements[navigationIndex];
+        if (activeThumbnail) {
+            activeThumbnail.scrollIntoView({
+                block: "nearest",
+                inline: "nearest"
+            });
+        }
+        if (this.input instanceof ImageCarouselEditorInput) {
+            const currentSection = this._sections[entry.sectionIndex];
+            this.input.setName(currentSection.title || this.input.collection.title);
+        }
+        this._preloadAdjacentImages();
+    }
+    async _loadBlobUrl(image) {
+        const cached = this._blobUrlCache.get(image.id);
+        if (cached) {
+            return cached;
+        }
+        let buffer;
+        if (image.data) {
+            buffer = image.data instanceof Uint8Array ? image.data : image.data.buffer;
+        } else if (image.uri) {
+            const content = await this._fileService.readFile(image.uri);
+            buffer = content.value.buffer;
+        } else {
+            return "";
+        }
+        const blob = ( new Blob([buffer], {
+            type: image.mimeType
+        }));
+        const url = URL.createObjectURL(blob);
+        this._blobUrlCache.set(image.id, url);
+        return url;
+    }
+    _revokeCachedBlobUrls() {
+        for (const url of ( this._blobUrlCache.values())) {
+            URL.revokeObjectURL(url);
+        }
+        this._blobUrlCache.clear();
+    }
+    async _loadRawData(image) {
+        if (image.data) {
+            return image.data instanceof Uint8Array ? image.data : image.data.buffer;
+        } else if (image.uri) {
+            const content = await this._fileService.readFile(image.uri);
+            return content.value.buffer;
+        }
+        return ( new Uint8Array(0));
+    }
+    _preloadAdjacentImages() {
+        for (const idx of [this._currentIndex - 1, this._currentIndex + 1]) {
+            if (idx >= 0 && idx < this._flatImages.length) {
+                const adjacentImage = this._flatImages[idx].image;
+                if (isVideoMimeType(adjacentImage.mimeType)) {
+                    this._loadRawData(adjacentImage).catch(() => {});
+                } else {
+                    this._loadBlobUrl(adjacentImage).then(url => {
+                        const img = ( new Image());
+                        img.src = url;
+                        img.decode().catch(() => {});
+                    });
+                }
+            }
+        }
+    }
+    previous() {
+        if (this._currentIndex > 0) {
+            this._currentIndex--;
+            this.updateCurrentImage();
+        }
+    }
+    next() {
+        if (this._currentIndex < this._flatImages.length - 1) {
+            this._currentIndex++;
+            this.updateCurrentImage();
+        }
+    }
+    _initZoomFromFit() {
+        if (!this._elements) {
+            return;
+        }
+        const img = this._elements.mainImage;
+        if (img.naturalWidth > 0) {
+            this._zoomScale = img.clientWidth / img.naturalWidth;
+        } else {
+            this._zoomScale = 1;
+        }
+    }
+    _zoomIn() {
+        if (this._zoomScale === "fit") {
+            this._initZoomFromFit();
+        }
+        const scale = this._zoomScale;
+        let i = 0;
+        for (; i < ZOOM_LEVELS.length; ++i) {
+            if (ZOOM_LEVELS[i] > scale) {
+                break;
+            }
+        }
+        this._applyZoom(ZOOM_LEVELS[i] ?? MAX_SCALE);
+    }
+    _zoomOut() {
+        if (this._zoomScale === "fit") {
+            this._initZoomFromFit();
+        }
+        const scale = this._zoomScale;
+        let i = ZOOM_LEVELS.length - 1;
+        for (; i >= 0; --i) {
+            if (ZOOM_LEVELS[i] < scale) {
+                break;
+            }
+        }
+        this._applyZoom(ZOOM_LEVELS[i] ?? MIN_SCALE);
+    }
+    _applyZoom(newScale) {
+        if (!this._elements) {
+            return;
+        }
+        const container = this._elements.mainImageContainer;
+        const img = this._elements.mainImage;
+        if (newScale === "fit") {
+            this._zoomScale = "fit";
+            img.classList.add("scale-to-fit");
+            img.classList.remove("pixelated");
+            img.style.zoom = "";
+            const wasZoomed = container.classList.contains("zoomed");
+            container.classList.remove("zoomed");
+            container.classList.remove("zoom-out");
+            if (wasZoomed) {
+                container.scrollTo(0, 0);
+            }
+        } else {
+            const scale = clamp(newScale, MIN_SCALE, MAX_SCALE);
+            this._zoomScale = scale;
+            const dx = container.scrollWidth > 0 ? (container.scrollLeft + container.clientWidth / 2) / container.scrollWidth : 0.5;
+            const dy = container.scrollHeight > 0 ? (container.scrollTop + container.clientHeight / 2) / container.scrollHeight : 0.5;
+            img.classList.remove("scale-to-fit");
+            img.classList.toggle("pixelated", scale >= PIXELATION_THRESHOLD);
+            img.style.zoom = String(scale);
+            container.classList.add("zoomed");
+            const newScrollX = container.scrollWidth * dx - container.clientWidth / 2;
+            const newScrollY = container.scrollHeight * dy - container.clientHeight / 2;
+            container.scrollTo(newScrollX, newScrollY);
+        }
+    }
+    focus() {
+        super.focus();
+        this._elements?.root.focus();
+    }
+    layout(dimension) {
+        if (this._container) {
+            this._container.style.width = `${dimension.width}px`;
+            this._container.style.height = `${dimension.height}px`;
+        }
+    }
+};
+ImageCarouselEditor = ImageCarouselEditor_1 = ( __decorate([( __param(1, ITelemetryService)), ( __param(2, IThemeService)), ( __param(3, IStorageService)), ( __param(4, IFileService)), ( __param(5, IWebviewService))], ImageCarouselEditor));
+
+export { ImageCarouselEditor };

package/vscode/src/vs/workbench/contrib/imageCarousel/browser/imageCarouselEditorInput.d.ts

@@ -0,0 +1,18 @@
+import { EditorInput } from "@codingame/monaco-vscode-api/vscode/vs/workbench/common/editor/editorInput";
+import { EditorInputCapabilities, IUntypedEditorInput } from "@codingame/monaco-vscode-api/vscode/vs/workbench/common/editor";
+import { URI } from "@codingame/monaco-vscode-api/vscode/vs/base/common/uri";
+import { IImageCarouselCollection } from "./imageCarouselTypes.js";
+export declare class ImageCarouselEditorInput extends EditorInput {
+    readonly collection: IImageCarouselCollection;
+    readonly startIndex: number;
+    static readonly ID = "workbench.input.imageCarousel";
+    private _resource;
+    private _name;
+    get capabilities(): EditorInputCapabilities;
+    constructor(collection: IImageCarouselCollection, startIndex?: number);
+    get typeId(): string;
+    get resource(): URI;
+    getName(): string;
+    setName(name: string): void;
+    matches(other: EditorInput | IUntypedEditorInput): boolean;
+}

package/vscode/src/vs/workbench/contrib/imageCarousel/browser/imageCarouselEditorInput.js

@@ -0,0 +1,47 @@
+
+import { EditorInput } from '@codingame/monaco-vscode-api/vscode/vs/workbench/common/editor/editorInput';
+import { EditorInputCapabilities } from '@codingame/monaco-vscode-api/vscode/vs/workbench/common/editor';
+import { URI } from '@codingame/monaco-vscode-api/vscode/vs/base/common/uri';
+import { Schemas } from '@codingame/monaco-vscode-api/vscode/vs/base/common/network';
+
+class ImageCarouselEditorInput extends EditorInput {
+    static {
+        this.ID = "workbench.input.imageCarousel";
+    }
+    get capabilities() {
+        return super.capabilities | EditorInputCapabilities.Singleton | EditorInputCapabilities.RequiresModal;
+    }
+    constructor(collection, startIndex = 0) {
+        super();
+        this.collection = collection;
+        this.startIndex = startIndex;
+        this._resource = ( URI.from({
+            scheme: Schemas.vscodeImageCarousel,
+            path: `/${encodeURIComponent(collection.id)}`
+        }));
+        this._name = collection.title;
+    }
+    get typeId() {
+        return ImageCarouselEditorInput.ID;
+    }
+    get resource() {
+        return this._resource;
+    }
+    getName() {
+        return this._name;
+    }
+    setName(name) {
+        if (this._name !== name) {
+            this._name = name;
+            this._onDidChangeLabel.fire();
+        }
+    }
+    matches(other) {
+        if (other instanceof ImageCarouselEditorInput) {
+            return other.collection.id === this.collection.id;
+        }
+        return false;
+    }
+}
+
+export { ImageCarouselEditorInput };

package/vscode/src/vs/workbench/contrib/imageCarousel/browser/imageCarouselTypes.d.ts

@@ -0,0 +1,22 @@
+import { URI } from "@codingame/monaco-vscode-api/vscode/vs/base/common/uri";
+import { VSBuffer } from "@codingame/monaco-vscode-api/vscode/vs/base/common/buffer";
+export interface ICarouselImage {
+    readonly id: string;
+    readonly name: string;
+    readonly mimeType: string;
+    /** In-memory image data. Omit when the image can be loaded lazily from `uri`. */
+    readonly data?: VSBuffer;
+    readonly uri?: URI;
+    readonly source?: string;
+    readonly caption?: string;
+}
+export interface ICarouselSection {
+    readonly title: string;
+    readonly images: ReadonlyArray<ICarouselImage>;
+}
+export interface IImageCarouselCollection {
+    readonly id: string;
+    readonly title: string;
+    readonly sections: ReadonlyArray<ICarouselSection>;
+}
+export declare function isVideoMimeType(mimeType: string): boolean;