@vectojs/markdown 0.9.0 → 0.11.0

package/dist/Markdown.d.ts

@@ -1,4 +1,4 @@
-import { Entity, type DevtoolsDescriptor, GlyphRasterAtlas, type GlyphRasterAtlasStats, IRenderer, type ContentProjection } from '@vectojs/core';
+import { type ContentProjectionHint, Entity, type DevtoolsDescriptor, GlyphRasterAtlas, type GlyphRasterAtlasStats, IRenderer, type ContentProjection } from '@vectojs/core';
 import { type Token } from 'marked';
 import { type StreamController, type StreamControllerOptions } from './StreamController';
 import { Stack, UIComponent } from '@vectojs/ui';
@@ -45,6 +45,8 @@ export declare class CodeBlock extends UIComponent {
     private rawLines;
     private cellWidth;
     private source;
+    /** Bumped by {@link buildLines} and {@link setSelectable}; read by `Scene`. */
+    private contentEpoch;
     private lang;
     private theme;
     private lineH;
@@ -56,6 +58,7 @@ export declare class CodeBlock extends UIComponent {
     setCode(code: string, lang?: string): this;
     /** Enable or disable browser-native selection for this code block. */
     setSelectable(selectable: boolean): this;
+    getContentEpoch(): number;
     /**
      * Change the block's box width.
      *
@@ -69,7 +72,7 @@ export declare class CodeBlock extends UIComponent {
      * @returns `this` for chaining.
      */
     setWidth(width: number): this;
-    getContentProjection(): ContentProjection | null;
+    getContentProjection(hint?: ContentProjectionHint): ContentProjection | null;
     /**
      * Re-highlight the code, reusing the highlight of any unchanged line prefix.
      *

package/dist/index.js

@@ -1127,6 +1127,8 @@ var CodeBlock = class extends import_ui.UIComponent {
   rawLines = null;
   cellWidth = 0;
   source;
+  /** Bumped by {@link buildLines} and {@link setSelectable}; read by `Scene`. */
+  contentEpoch = 0;
   lang;
   theme;
   lineH = 24;
@@ -1155,9 +1157,13 @@ var CodeBlock = class extends import_ui.UIComponent {
   /** Enable or disable browser-native selection for this code block. */
   setSelectable(selectable) {
     this.selectable = selectable;
+    this.contentEpoch++;
     this.scene?.markDirty();
     return this;
   }
+  getContentEpoch() {
+    return this.contentEpoch;
+  }
   /**
    * Change the block's box width.
    *
@@ -1177,9 +1183,25 @@ var CodeBlock = class extends import_ui.UIComponent {
     this.scene?.markDirty();
     return this;
   }
-  getContentProjection() {
+  getContentProjection(hint) {
     if (!this.source) return null;
     const grid = this.ensureGrid();
+    const rows = [];
+    rows.length = grid.lines.length;
+    for (let row = 0; row < grid.lines.length; row++) {
+      const line = grid.lines[row];
+      const y = this.pad + row * this.lineH;
+      if (!(0, import_core.contentLineInHint)(hint, y, this.lineH)) continue;
+      rows[row] = {
+        text: this.source.slice(line.sourceStart, line.sourceEnd),
+        separatorAfter: this.source.slice(line.sourceEnd, line.nextSourceStart) || void 0,
+        x: this.pad,
+        y,
+        baseline: this.lineH * 0.75,
+        font: this.codeFont,
+        lineHeight: this.lineH
+      };
+    }
     return {
       text: this.source,
       font: this.codeFont,
@@ -1187,15 +1209,8 @@ var CodeBlock = class extends import_ui.UIComponent {
       // Every row is absolutely positioned from the same local coordinates as
       // render(). A single pre-wrap DOM text node would introduce browser
       // wrapping for long source lines that canvas intentionally keeps intact.
-      lines: grid.lines.map((line, row) => ({
-        text: this.source.slice(line.sourceStart, line.sourceEnd),
-        separatorAfter: this.source.slice(line.sourceEnd, line.nextSourceStart) || void 0,
-        x: this.pad,
-        y: this.pad + row * this.lineH,
-        baseline: this.lineH * 0.75,
-        font: this.codeFont,
-        lineHeight: this.lineH
-      })),
+      //
+      lines: rows,
       selectable: this.selectable,
       // render() draws cell-by-cell (no ligatures can form); the DOM copy
       // must not ligate either or Firefox selection geometry drifts.
@@ -1216,6 +1231,7 @@ var CodeBlock = class extends import_ui.UIComponent {
    * lands mid-line, so that line's text (and therefore its tokenization) changes.
    */
   buildLines(code) {
+    this.contentEpoch++;
     const rawLines = code.split(/\r\n|\r|\n/);
     const previous = this.rawLines;
     let reusable = 0;

package/dist/index.mjs

@@ -1,5 +1,6 @@
 // src/Markdown.ts
 import {
+  contentLineInHint,
   BidiResolver,
   Entity,
   GlyphRasterAtlas,
@@ -1094,6 +1095,8 @@ var CodeBlock = class extends UIComponent {
   rawLines = null;
   cellWidth = 0;
   source;
+  /** Bumped by {@link buildLines} and {@link setSelectable}; read by `Scene`. */
+  contentEpoch = 0;
   lang;
   theme;
   lineH = 24;
@@ -1122,9 +1125,13 @@ var CodeBlock = class extends UIComponent {
   /** Enable or disable browser-native selection for this code block. */
   setSelectable(selectable) {
     this.selectable = selectable;
+    this.contentEpoch++;
     this.scene?.markDirty();
     return this;
   }
+  getContentEpoch() {
+    return this.contentEpoch;
+  }
   /**
    * Change the block's box width.
    *
@@ -1144,9 +1151,25 @@ var CodeBlock = class extends UIComponent {
     this.scene?.markDirty();
     return this;
   }
-  getContentProjection() {
+  getContentProjection(hint) {
     if (!this.source) return null;
     const grid = this.ensureGrid();
+    const rows = [];
+    rows.length = grid.lines.length;
+    for (let row = 0; row < grid.lines.length; row++) {
+      const line = grid.lines[row];
+      const y = this.pad + row * this.lineH;
+      if (!contentLineInHint(hint, y, this.lineH)) continue;
+      rows[row] = {
+        text: this.source.slice(line.sourceStart, line.sourceEnd),
+        separatorAfter: this.source.slice(line.sourceEnd, line.nextSourceStart) || void 0,
+        x: this.pad,
+        y,
+        baseline: this.lineH * 0.75,
+        font: this.codeFont,
+        lineHeight: this.lineH
+      };
+    }
     return {
       text: this.source,
       font: this.codeFont,
@@ -1154,15 +1177,8 @@ var CodeBlock = class extends UIComponent {
       // Every row is absolutely positioned from the same local coordinates as
       // render(). A single pre-wrap DOM text node would introduce browser
       // wrapping for long source lines that canvas intentionally keeps intact.
-      lines: grid.lines.map((line, row) => ({
-        text: this.source.slice(line.sourceStart, line.sourceEnd),
-        separatorAfter: this.source.slice(line.sourceEnd, line.nextSourceStart) || void 0,
-        x: this.pad,
-        y: this.pad + row * this.lineH,
-        baseline: this.lineH * 0.75,
-        font: this.codeFont,
-        lineHeight: this.lineH
-      })),
+      //
+      lines: rows,
       selectable: this.selectable,
       // render() draws cell-by-cell (no ligatures can form); the DOM copy
       // must not ligate either or Firefox selection geometry drifts.
@@ -1183,6 +1199,7 @@ var CodeBlock = class extends UIComponent {
    * lands mid-line, so that line's text (and therefore its tokenization) changes.
    */
   buildLines(code) {
+    this.contentEpoch++;
     const rawLines = code.split(/\r\n|\r|\n/);
     const previous = this.rawLines;
     let reusable = 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vectojs/markdown",
-  "version": "0.9.0",
+  "version": "0.11.0",
   "publishConfig": {
     "access": "public"
   },