@vscode/markdown-editor 0.0.2-21 → 0.0.2-22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vscode/markdown-editor",
-  "version": "0.0.2-21",
+  "version": "0.0.2-22",
   "type": "module",
   "license": "MIT",
   "repository": {
@@ -53,7 +53,7 @@
   "scripts": {
     "build": "pnpm run build:dependencies && vite build",
     "build:dependencies": "pnpm --filter @vscode/hubrpc build",
-    "build:explorer": "pnpm run build:dependencies && pnpm --filter @vscode/sample-web-editor build && vite build --config vite.fixture.config.ts --outDir dist-explorer --emptyOutDir",
+    "build:explorer": "pnpm run build:dependencies && pnpm --filter @vscode/component-explorer-vite-plugin... build && pnpm --filter @vscode/sample-web-editor build && vite build --config vite.fixture.config.ts --outDir dist-explorer --emptyOutDir",
     "dev": "vite build --watch",
     "pack": "pnpm run build && pnpm pack",
     "test": "vitest --run",

package/src/view/editor.css

@@ -26,7 +26,6 @@
 .md-editor {
 	display: flow-root;
 	outline: none;
-	container: md-editor / inline-size;
 	/* The editor paints its own cursor (`.md-cursor`); hide the native caret. */
 	caret-color: transparent;
 }
@@ -63,9 +62,7 @@
 }
 
 .md-editor-content-with-readonly-toggle {
-	--md-editor-content-inline-end-padding: calc(
-		var(--md-readonly-toggle-width) + var(--md-readonly-toggle-gap) + var(--md-readonly-toggle-inset)
-	);
+	--md-editor-content-inline-end-padding: calc(var(--md-readonly-toggle-width) + var(--md-readonly-toggle-gap) + var(--md-readonly-toggle-inset));
 }
 
 .md-editor-content-with-readonly-toggle>.md-document :is(.md-heading, .md-paragraph) {
@@ -147,18 +144,14 @@
 /*
  * An unhandled block: a construct the parser does not model (setext heading,
  * frontmatter fence, an extension token). Its raw source is shown verbatim,
- * styled like a code block but visibly flagged as "not understood" — a dashed
- * warning border and a small badge naming the originating token type (from the
- * `data-unhandled-token` attribute) — so the content is preserved and editable
- * rather than silently dropped.
+ * styled like a code block but visibly flagged as "not understood" by a dashed
+ * warning border, so the content is preserved and editable rather than silently
+ * dropped.
  *
- * The wrapper is the non-scrolling box (border + block spacing + the badge); the
- * inner `.md-unhandled-scroll` <pre> is the horizontal scroller. Keeping the
- * badge on the wrapper (not the scroller) pins it to the visible top-right
- * corner instead of letting it drift with the scrolled content.
+ * The wrapper is the non-scrolling box (border + block spacing); the inner
+ * `.md-unhandled-scroll` <pre> is the horizontal scroller.
  */
 .md-unhandled-block {
-	position: relative;
 	margin: 0.5em 0;
 	border: 1px dashed #d0a000;
 	border-radius: 4px;
@@ -167,30 +160,12 @@
 /*
  * Inner scroller. Beats the per-theme `.md-theme-* .md-code-block` box rules
  * (same class count) via the extra `pre` type selector: no margin/border of its
- * own (those live on the wrapper), and top padding that reserves room for the
- * pinned badge so it never overlaps the first source line.
+ * own (those live on the wrapper).
  */
 pre.md-unhandled-scroll.md-code-block {
 	margin: 0;
 	border: 0;
 	border-radius: 4px;
-	padding-top: 1.7em;
-}
-
-.md-unhandled-block::after {
-	content: 'unhandled: ' attr(data-unhandled-token);
-	position: absolute;
-	top: 0;
-	right: 0;
-	padding: 1px 6px;
-	font-family: system-ui, sans-serif;
-	font-size: 10px;
-	line-height: 1.4;
-	color: #6b5200;
-	background: #f5e5a8;
-	border-bottom-left-radius: 4px;
-	pointer-events: none;
-	user-select: none;
 }
 
 /*
@@ -864,13 +839,9 @@ pre.md-unhandled-scroll.md-code-block {
  * unbreakable content nor later content scrolled through the viewport can ever
  * pass underneath the button.
  */
-@container md-editor (max-width: 320px) {
-	.md-readonly-toggle-host {
-		position: relative;
-		height: calc(
-			var(--md-readonly-toggle-height) + var(--md-readonly-toggle-inset) + var(--md-readonly-toggle-inset)
-		);
-	}
+.md-editor-narrow .md-readonly-toggle-host {
+	position: relative;
+	height: calc(var(--md-readonly-toggle-height) + var(--md-readonly-toggle-inset) + var(--md-readonly-toggle-inset));
 }
 
 .md-readonly-toggle::after {
@@ -962,6 +933,7 @@ pre.md-unhandled-scroll.md-code-block {
 }
 
 @media (prefers-reduced-motion: reduce) {
+
 	.md-readonly-toggle,
 	.md-readonly-toggle .md-readonly-toggle-indicator,
 	.md-readonly-toggle .md-readonly-toggle-icon,