ntk 3.3.0 → 3.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/widgets/htmlview.js +16 -4
- package/lib/widgets/markdownview.js +16 -3
- package/package.json +1 -1
package/lib/widgets/htmlview.js
CHANGED
|
@@ -65,6 +65,9 @@ const VOID_SKIP = new Set(['script', 'style', 'head', 'title', 'meta', 'link', '
|
|
|
65
65
|
* Standalone (windowless) use mirrors MarkdownView:
|
|
66
66
|
* const view = new HtmlView(null, { fonts });
|
|
67
67
|
* view.setHtml(html); view.layout(width); view.draw(ctx, x, y);
|
|
68
|
+
* Content that arrives asynchronously (images) invalidates the layout —
|
|
69
|
+
* pass `onInvalidate` to re-layout/redraw when that happens (window mode
|
|
70
|
+
* repaints automatically).
|
|
68
71
|
*/
|
|
69
72
|
export default class HtmlView {
|
|
70
73
|
constructor(window, opts = {}) {
|
|
@@ -74,6 +77,10 @@ export default class HtmlView {
|
|
|
74
77
|
|
|
75
78
|
/** called with (href, event, element) when a link is activated */
|
|
76
79
|
this.onLink = opts.onLink ?? null;
|
|
80
|
+
/** called when async content (an image) invalidates the layout;
|
|
81
|
+
* standalone hosts re-layout/redraw here — window mode also repaints
|
|
82
|
+
* on its own */
|
|
83
|
+
this.onInvalidate = opts.onInvalidate ?? null;
|
|
77
84
|
/** extra author stylesheet(s) applied after document <style>s */
|
|
78
85
|
this._userSheets = [].concat(opts.stylesheet ?? []);
|
|
79
86
|
/**
|
|
@@ -407,13 +414,11 @@ export default class HtmlView {
|
|
|
407
414
|
if (res instanceof SvgView) entry.svg = res;
|
|
408
415
|
else entry.image = res;
|
|
409
416
|
if (!res) entry.failed = true;
|
|
410
|
-
this.
|
|
411
|
-
if (this.window && this.window._mapped) this.render();
|
|
417
|
+
this._invalidate();
|
|
412
418
|
},
|
|
413
419
|
() => {
|
|
414
420
|
entry.failed = true;
|
|
415
|
-
this.
|
|
416
|
-
if (this.window && this.window._mapped) this.render();
|
|
421
|
+
this._invalidate();
|
|
417
422
|
}
|
|
418
423
|
);
|
|
419
424
|
}
|
|
@@ -422,6 +427,13 @@ export default class HtmlView {
|
|
|
422
427
|
for (const child of box.children) this._collectImages(child);
|
|
423
428
|
}
|
|
424
429
|
|
|
430
|
+
/** async content arrived: drop the cached layout, repaint and/or notify */
|
|
431
|
+
_invalidate() {
|
|
432
|
+
this._layoutWidth = -1;
|
|
433
|
+
if (this.window && this.window._mapped) this.render();
|
|
434
|
+
if (this.onInvalidate) this.onInvalidate();
|
|
435
|
+
}
|
|
436
|
+
|
|
425
437
|
// decoded bytes -> Image (PNG/JPEG) or SvgView (sniffed SVG markup)
|
|
426
438
|
_decodeResource(buf) {
|
|
427
439
|
const head = buf.subarray(0, 1024).toString('utf8');
|
|
@@ -51,7 +51,10 @@ const DEFAULT_THEME = {
|
|
|
51
51
|
* wnd.map();
|
|
52
52
|
*
|
|
53
53
|
* Standalone use (no window attach): `view.layout(width)` then
|
|
54
|
-
* `view.draw(ctx, x, y)`; `view.contentHeight` after layout.
|
|
54
|
+
* `view.draw(ctx, x, y)`; `view.contentHeight` after layout. Content that
|
|
55
|
+
* arrives asynchronously (mermaid models) invalidates the layout — pass
|
|
56
|
+
* `onInvalidate` to re-layout/redraw when that happens (window mode
|
|
57
|
+
* repaints automatically).
|
|
55
58
|
*/
|
|
56
59
|
export default class MarkdownView {
|
|
57
60
|
constructor(window, opts = {}) {
|
|
@@ -70,6 +73,10 @@ export default class MarkdownView {
|
|
|
70
73
|
/** called with (href, event) when a rendered link is clicked (window
|
|
71
74
|
* mode wires mousedown automatically; standalone callers use linkAt) */
|
|
72
75
|
this.onLink = opts.onLink ?? null;
|
|
76
|
+
/** called when async content (a mermaid model) invalidates the layout;
|
|
77
|
+
* standalone hosts re-layout/redraw here — window mode also repaints
|
|
78
|
+
* on its own */
|
|
79
|
+
this.onInvalidate = opts.onInvalidate ?? null;
|
|
73
80
|
|
|
74
81
|
if (this.window) {
|
|
75
82
|
this._ctx = this.window.getContext('2d');
|
|
@@ -116,8 +123,7 @@ export default class MarkdownView {
|
|
|
116
123
|
parseMermaid(text).then(
|
|
117
124
|
(model) => {
|
|
118
125
|
entry.model = model;
|
|
119
|
-
this.
|
|
120
|
-
if (this.window && this.window._mapped) this.render();
|
|
126
|
+
this._invalidate();
|
|
121
127
|
},
|
|
122
128
|
() => {
|
|
123
129
|
entry.failed = true; // unsupported/invalid: stays a code block
|
|
@@ -127,6 +133,13 @@ export default class MarkdownView {
|
|
|
127
133
|
return entry;
|
|
128
134
|
}
|
|
129
135
|
|
|
136
|
+
/** async content arrived: drop the cached layout, repaint and/or notify */
|
|
137
|
+
_invalidate() {
|
|
138
|
+
this._layoutWidth = -1;
|
|
139
|
+
if (this.window && this.window._mapped) this.render();
|
|
140
|
+
if (this.onInvalidate) this.onInvalidate();
|
|
141
|
+
}
|
|
142
|
+
|
|
130
143
|
/** lay content out for a container width; returns total content height */
|
|
131
144
|
layout(width) {
|
|
132
145
|
const fonts = this._fonts();
|