@openstage/glyph-renderer 0.2.0 → 0.2.1
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/README.md +59 -0
- package/package.json +14 -3
package/README.md
ADDED
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
# @openstage/glyph-renderer
|
|
2
|
+
|
|
3
|
+
Read-only renderer for [Glyph](https://codeberg.org/open-stage/glyph)
|
|
4
|
+
documents. Turns a saved `EditorDocument` into DOM (or an HTML string) for
|
|
5
|
+
display **without loading the editor**, with lazy language-aware code
|
|
6
|
+
highlighting.
|
|
7
|
+
|
|
8
|
+
```bash
|
|
9
|
+
npm i @openstage/glyph-renderer
|
|
10
|
+
```
|
|
11
|
+
|
|
12
|
+
## Usage
|
|
13
|
+
|
|
14
|
+
```ts
|
|
15
|
+
import { renderToElement, highlightThemeCss } from '@openstage/glyph-renderer';
|
|
16
|
+
|
|
17
|
+
container.replaceChildren(renderToElement(savedDocument));
|
|
18
|
+
// renderToHTML(doc) returns an HTML string instead (SSR / caching)
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
Output is built with `createElement`/`textContent` only (never `innerHTML`),
|
|
22
|
+
link `href`s are scheme-allowlisted, control-obfuscated `javascript:`/`data:`
|
|
23
|
+
URLs are stripped, and highlighted code is assembled from a parsed token tree —
|
|
24
|
+
**untrusted documents render safely**. Rendered links open in a new tab
|
|
25
|
+
(`target="_blank"` + `rel="noopener noreferrer"`).
|
|
26
|
+
|
|
27
|
+
## Syntax highlighting
|
|
28
|
+
|
|
29
|
+
The renderer is style-free (the host owns CSS). For highlighted code, inject
|
|
30
|
+
the token stylesheet (re-themable via `--glyph-hl-*` custom properties):
|
|
31
|
+
|
|
32
|
+
```ts
|
|
33
|
+
const style = document.createElement('style');
|
|
34
|
+
style.textContent = highlightThemeCss;
|
|
35
|
+
document.head.appendChild(style);
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
`renderToElement` highlights progressively: it returns immediately with plain
|
|
39
|
+
code, then upgrades the block in place once the language's grammar chunk has
|
|
40
|
+
loaded. `renderToHTML` is **synchronous**, so preload grammars first for
|
|
41
|
+
SSR/snapshots:
|
|
42
|
+
|
|
43
|
+
```ts
|
|
44
|
+
import { preloadLanguages, renderToHTML } from '@openstage/glyph-renderer';
|
|
45
|
+
|
|
46
|
+
await preloadLanguages(['typescript', 'bash']);
|
|
47
|
+
const html = renderToHTML(savedDocument); // now highlighted
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
`ensureLanguage` / `isLanguageSupported` are also exported.
|
|
51
|
+
|
|
52
|
+
## Documentation
|
|
53
|
+
|
|
54
|
+
Full guide and supported-content reference:
|
|
55
|
+
<https://codeberg.org/open-stage/glyph#readme>
|
|
56
|
+
|
|
57
|
+
## License
|
|
58
|
+
|
|
59
|
+
MIT © Gabriel Bornea
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@openstage/glyph-renderer",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Gabriel Bornea",
|
|
6
6
|
"repository": {
|
|
@@ -36,9 +36,20 @@
|
|
|
36
36
|
"typecheck": "tsc -p tsconfig.json --noEmit"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@openstage/glyph-core": "0.2.
|
|
39
|
+
"@openstage/glyph-core": "0.2.1",
|
|
40
40
|
"highlight.js": "^11.11.1",
|
|
41
41
|
"lowlight": "^3.3.0",
|
|
42
42
|
"monadyssey": "^2.0.1"
|
|
43
|
-
}
|
|
43
|
+
},
|
|
44
|
+
"description": "XSS-safe read-only renderer (DOM/HTML) with lazy syntax highlighting for Glyph documents.",
|
|
45
|
+
"keywords": [
|
|
46
|
+
"editor",
|
|
47
|
+
"rich-text",
|
|
48
|
+
"renderer",
|
|
49
|
+
"html",
|
|
50
|
+
"syntax-highlighting",
|
|
51
|
+
"ssr",
|
|
52
|
+
"xss-safe",
|
|
53
|
+
"glyph"
|
|
54
|
+
]
|
|
44
55
|
}
|