@vscode/markdown-editor 0.0.2-113 → 0.0.2-115

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vscode/markdown-editor",
-  "version": "0.0.2-113",
+  "version": "0.0.2-115",
   "type": "module",
   "license": "MIT",
   "repository": {
@@ -36,7 +36,9 @@
     "src/view/themes/vscode-default.css",
     "src/contrib/comments/commentInput.css",
     "src/contrib/comments/commentWidget.css",
-    "src/contrib/find/find.css"
+    "src/contrib/find/find.css",
+    "src/contrib/rename/rename.css",
+    "src/contrib/suggest/suggest.css"
   ],
   "exports": {
     ".": {
@@ -61,13 +63,18 @@
     "./themes/vscode-github.css": "./src/view/themes/vscode-github.css",
     "./themes/vscode-default.css": "./src/view/themes/vscode-default.css",
     "./commentInput.css": "./src/contrib/comments/commentInput.css",
-    "./commentWidget.css": "./src/contrib/comments/commentWidget.css"
+    "./commentWidget.css": "./src/contrib/comments/commentWidget.css",
+    "./rename.css": "./src/contrib/rename/rename.css",
+    "./suggest.css": "./src/contrib/suggest/suggest.css"
   },
   "scripts": {
     "build": "pnpm run build:dependencies && vite build",
     "build:dependencies": "pnpm --filter @vscode/hubrpc build && pnpm --filter @vscode/web-editors build",
-    "build:fixture-dependencies": "pnpm run build:dependencies && pnpm --filter @vscode/component-explorer-vite-plugin... build && pnpm --filter @vscode/sample-web-editor build",
-    "build:fixtures": "vite build --config vite.fixture.config.ts --outDir dist-explorer --emptyOutDir",
+    "build:fixture-dependencies": "pnpm run build:dependencies && pnpm --filter @vscode/cmark-gfm-wasm build && pnpm --filter @vscode/component-explorer-vite-plugin... build && pnpm --filter @vscode/sample-web-editor build",
+    "typecheck:fixtures": "tsc --project tsconfig.fixtures.json",
+    "screenshots": "node scripts/screenshots.mjs render",
+    "test:screenshots": "node --test scripts/screenshots.test.mjs",
+    "build:fixtures": "pnpm run typecheck:fixtures && vite build --config vite.fixture.config.ts --outDir dist-explorer --emptyOutDir",
     "build:explorer": "pnpm run build:fixture-dependencies && pnpm run build:fixtures",
     "serve:e2e-fixtures": "vite preview --config vite.fixture.config.ts --outDir dist-explorer",
     "dev": "vite build --watch",
@@ -85,15 +92,17 @@
     "micromark": "^4.0.1",
     "micromark-extension-frontmatter": "^2.0.0",
     "micromark-extension-gfm": "^3.0.0",
+    "micromark-extension-gfm-autolink-literal": "^2.1.0",
     "micromark-extension-gfm-strikethrough": "^2.1.0",
     "micromark-extension-gfm-table": "^2.1.1",
     "micromark-extension-gfm-task-list-item": "^2.1.0",
     "micromark-extension-math": "^3.1.0"
   },
   "devDependencies": {
-    "@playwright/test": "^1.58.2",
+    "@playwright/test": "1.56.1",
     "@types/katex": "^0.16.8",
     "@types/markdown-it": "^14.1.2",
+    "@vscode/cmark-gfm-wasm": "workspace:*",
     "@vscode/component-explorer": "workspace:*",
     "@vscode/component-explorer-cli": "workspace:*",
     "@vscode/component-explorer-vite-plugin": "workspace:*",
@@ -110,5 +119,5 @@
     "vitest": "^4.1.0",
     "zod": "^4.3.6"
   },
-  "gitHead": "4445737237dc9e9f9e6a5ef7f28ed84c049478cf"
+  "gitHead": "80b9f58ae02c6bc7030d54db4b77cdb8ad263645"
 }

package/src/contrib/rename/rename.css

@@ -0,0 +1,73 @@
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ * Visual design adapted from VS Code src/vs/editor/contrib/rename/browser/renameWidget.css.
+ */
+
+.md-rename-widget {
+	box-sizing: border-box;
+	width: 280px;
+	max-width: 100%;
+	max-height: 100%;
+	overflow: auto;
+	padding: 4px 4px 0;
+	border: 1px solid var(--vscode-widget-border, transparent);
+	border-radius: 4px;
+	box-shadow: var(--vscode-shadow-lg, 0 2px 8px var(--vscode-widget-shadow, #0003));
+	color: var(--vscode-editorWidget-foreground, #333);
+	background: var(--vscode-editorWidget-background, #f3f3f3);
+	font-family: var(--vscode-font-family, sans-serif);
+	font-size: var(--vscode-font-size, 13px);
+}
+
+.md-rename-widget[hidden] {
+	display: none;
+}
+
+.md-rename-widget.md-rename-overlay {
+	position: absolute;
+	z-index: 100;
+}
+
+.md-rename-widget .md-rename-input-shell {
+	display: flex;
+	padding: 3px;
+	border: 1px solid var(--vscode-input-border, transparent);
+	border-radius: 4px;
+	background: var(--vscode-input-background, #fff);
+}
+
+.md-rename-widget .md-rename-input-shell:focus-within {
+	border-color: var(--vscode-focusBorder, #007acc);
+}
+
+.md-rename-widget .md-rename-input {
+	box-sizing: border-box;
+	width: 100%;
+	min-width: 0;
+	padding: 0;
+	border: 0;
+	outline: none;
+	color: var(--vscode-input-foreground, #333);
+	caret-color: var(--vscode-editorCursor-foreground, currentColor);
+	background: transparent;
+	font-family: var(--vscode-editor-font-family, monospace);
+	font-size: var(--vscode-editor-font-size, 14px);
+	line-height: 20px;
+}
+
+.md-rename-widget .md-rename-message {
+	padding: 3px 0;
+	font-size: 11px;
+	line-height: 16px;
+	overflow-wrap: anywhere;
+}
+
+.md-rename-widget.md-rename-invalid .md-rename-input-shell {
+	border-color: var(--vscode-inputValidation-errorBorder, #be1100);
+}
+
+.md-rename-widget.md-rename-invalid .md-rename-message {
+	color: var(--vscode-inputValidation-errorForeground, var(--vscode-errorForeground, #be1100));
+	background: var(--vscode-inputValidation-errorBackground, transparent);
+}

package/src/contrib/suggest/suggest.css

@@ -0,0 +1,109 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See LICENSE in the repository root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+/* Adapted from VS Code's src/vs/editor/contrib/suggest/browser/media/suggest.css. */
+@import '@vscode/codicons/dist/codicon.css';
+
+.md-suggest-widget {
+	box-sizing: border-box;
+	width: 432px;
+	padding-bottom: 2px;
+	max-width: 100%;
+	overflow: hidden;
+	border: 1px solid var(--vscode-editorSuggestWidget-border, var(--vscode-editorWidget-border, #454545));
+	border-radius: var(--vscode-cornerRadius-large, 4px);
+	background: var(--vscode-editorSuggestWidget-background, var(--vscode-editorWidget-background, #252526));
+	color: var(--vscode-editorSuggestWidget-foreground, var(--vscode-editor-foreground, #cccccc));
+	box-shadow: 0 2px 8px var(--vscode-widget-shadow, #00000036);
+	font-family: var(--vscode-editor-font-family, monospace);
+	font-size: var(--vscode-editor-font-size, 14px);
+	line-height: var(--md-suggest-line-height, 19px);
+}
+
+.md-suggest-widget[hidden],
+.md-suggest-widget [hidden] {
+	display: none;
+}
+
+.md-suggest-widget .md-suggest-list {
+	position: relative;
+	max-height: min(calc(var(--md-suggest-line-height, 19px) * 12), var(--md-suggest-max-height, 100vh));
+	overflow-y: auto;
+	overscroll-behavior: contain;
+	scrollbar-width: thin;
+	scrollbar-color: var(--vscode-scrollbarSlider-background, #79797966) transparent;
+	user-select: none;
+}
+
+.md-suggest-widget .md-suggest-row {
+	box-sizing: border-box;
+	display: flex;
+	height: var(--md-suggest-line-height, 19px);
+	align-items: center;
+	padding: 0 10px 0 2px;
+	white-space: pre;
+	cursor: pointer;
+}
+
+.md-suggest-widget .md-suggest-row[aria-selected="true"] {
+	background: var(--vscode-editorSuggestWidget-selectedBackground, var(--vscode-list-activeSelectionBackground, #04395e));
+	color: var(--vscode-editorSuggestWidget-selectedForeground, var(--vscode-list-activeSelectionForeground, #ffffff));
+	outline: 1px solid var(--vscode-editorSuggestWidget-focusOutline, var(--vscode-contrastActiveBorder, transparent));
+	outline-offset: -1px;
+}
+
+.md-suggest-widget .md-suggest-label,
+.md-suggest-widget .md-suggest-detail,
+.md-suggest-widget .md-suggest-icon {
+	min-width: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+.md-suggest-widget .md-suggest-label {
+	flex: 0 1 auto;
+}
+
+.md-suggest-widget .md-suggest-detail {
+	display: none;
+	flex: 0 1 auto;
+	margin-left: auto;
+	padding-left: 1.1em;
+	font-size: 85%;
+}
+
+.md-suggest-widget .md-suggest-row[aria-selected="true"] .md-suggest-detail {
+	display: inline;
+}
+
+.md-suggest-widget .md-suggest-icon {
+	flex: 0 0 16px;
+	width: 16px;
+	margin-right: 4px;
+	font-size: 16px;
+}
+
+.md-suggest-widget .md-suggest-row[aria-selected="true"] .md-suggest-icon {
+	color: var(--vscode-editorSuggestWidget-selectedIconForeground, inherit);
+}
+
+.md-suggest-widget .md-suggest-match {
+	font-weight: bold;
+	color: var(--vscode-editorSuggestWidget-highlightForeground, inherit);
+}
+
+.md-suggest-widget .md-suggest-row[aria-selected="true"] .md-suggest-match {
+	color: var(--vscode-editorSuggestWidget-focusHighlightForeground, inherit);
+}
+
+.md-suggest-widget .md-suggest-message {
+	padding: 4px 10px 4px 22px;
+	white-space: pre-wrap;
+	overflow-wrap: anywhere;
+}
+
+.md-suggest-widget[data-state="error"] .md-suggest-message {
+	color: var(--vscode-errorForeground, #f48771);
+}