@imontene/mdrender 2.4.0 → 2.6.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/CHANGELOG.md CHANGED
@@ -1,5 +1,28 @@
1
1
  # Cambios
2
2
 
3
+ ## 2.6.0 — 2026-10-22
4
+
5
+ - **Marcas de agua** con el degradado Anti-Gravity, solo en el PDF y desactivadas por defecto:
6
+ - `--watermark <texto>` (o `watermark:`): texto en diagonal en cada página, ajustado al
7
+ tamaño y la orientación de la hoja;
8
+ - `--watermark-field` (o `watermarkField: true`): campo de luz en la esquina de cada página.
9
+
10
+ Van detrás del contenido y funcionan con cualquier tema.
11
+
12
+ ## 2.5.0 — 2026-10-22
13
+
14
+ - **Nuevo estilo por defecto: Anti-Gravity**, tomado del design system del mismo nombre y
15
+ llevado a páginas. Incluye:
16
+ - colores del sistema y títulos en Manrope 600 con interletrado negativo;
17
+ - etiquetas en JetBrains Mono, en mayúsculas: autor y fecha sobre el título, índice,
18
+ encabezado y pie;
19
+ - código, tablas, citas y alertas como superficies suaves;
20
+ - diagramas Mermaid con los mismos colores;
21
+ - un campo de luz tenue junto al título de la primera página.
22
+ - `--theme antigravity-dark` es su versión oscura. **Para conservar el aspecto anterior:**
23
+ `--theme light` (o `theme: light` en `mdrender.config.json`); `--theme dark` sigue
24
+ disponible.
25
+
3
26
  ## 2.4.0 — 2026-10-22
4
27
 
5
28
  - **Párrafos justificados en el PDF**: los del texto, las citas y las alertas, con partición de
package/README.md CHANGED
@@ -23,7 +23,8 @@ Ejemplo: [`examples/ejemplo.md`](examples/ejemplo.md) → [`examples/ejemplo.pdf
23
23
  tabla de contenidos y marcadores del PDF.
24
24
  - 🗂️ **Lotes**: varios archivos, carpetas completas o patrones `docs/**/*.md`.
25
25
  - 🔁 **`--watch`** y **vista previa en vivo** en el navegador.
26
- - 🎨 Temas **claro** y **oscuro**, o tu propio CSS.
26
+ - 🎨 Estilo **Anti-Gravity** por defecto (con variante oscura), los temas clásicos **claro** y
27
+ **oscuro**, o tu propio CSS.
27
28
  - 🔌 **Sin conexión**: todo va empaquetado; por defecto no descarga nada de internet.
28
29
  - 💻 **Windows 10/11 y Linux** (x64; arm64 en Linux), probado en ambos en cada cambio.
29
30
 
@@ -93,8 +94,9 @@ mdrender preview documento.md
93
94
  # Más contenido por página
94
95
  mdrender documento.md --density compact --font-size 10pt
95
96
 
96
- # Tema oscuro, o un CSS propio que reemplaza el tema
97
- mdrender documento.md --theme dark
97
+ # Variante oscura de Anti-Gravity, el estilo clásico, o un CSS propio que reemplaza el tema
98
+ mdrender documento.md --theme antigravity-dark
99
+ mdrender documento.md --theme light
98
100
  mdrender documento.md --theme mi-tema.css
99
101
 
100
102
  # Descargar un navegador si no tienes Chrome, Edge ni Chromium
@@ -135,41 +137,43 @@ equipo); `--port` fija el puerto y `--no-open` no abre el navegador.
135
137
 
136
138
  ### Opciones
137
139
 
138
- | Opción | Descripción | Por defecto |
139
- | ------------------------------ | -------------------------------------------------------------------- | ------------------ |
140
- | `-o, --output <ruta>` | Archivo de salida, o carpeta con varios archivos | junto al `.md` |
141
- | `-f, --format <pdf\|html>` | Formato de salida | `pdf` |
142
- | `--page-size <tamaño>` | `Letter`, `A4`, `Legal` (también `A3`, `A5`, `Tabloid`) | `Letter` |
143
- | `--margin <valor>` | Las cuatro márgenes como en CSS: `10mm`, `15mm 20mm`… | `10mm` |
144
- | `--margin-top <medida>` | Margen superior, p. ej. `15mm` (prevalece sobre `--margin`) | `10mm` |
145
- | `--margin-right <medida>` | Margen derecho | `10mm` |
146
- | `--margin-bottom <medida>` | Margen inferior | `10mm` |
147
- | `--margin-left <medida>` | Margen izquierdo | `10mm` |
148
- | `--orientation <orientación>` | `portrait` (vertical) o `landscape` (horizontal) | `portrait` |
149
- | `--landscape` | Atajo de `--orientation landscape` | — |
150
- | `--toc` | Tabla de contenidos al inicio (o donde pongas `[[toc]]`) | — |
151
- | `--toc-depth <n>` | Nivel de título más profundo en la tabla de contenidos | `3` |
152
- | `--header <texto>` | Encabezado de página (ver abajo) | — |
153
- | `--footer <texto>` | Pie de página (ver abajo) | `{page} / {pages}` |
154
- | `--no-page-numbers` | Sin el pie con números de página | — |
155
- | `--font <manrope\|inter>` | Tipografía del texto (ver abajo) | `manrope` |
156
- | `--no-justify` | Párrafos alineados a la izquierda en el PDF (ver abajo) | justificado |
157
- | `--density <densidad>` | `normal` o `compact` (menos espacio entre líneas y bloques) | `normal` |
158
- | `--font-size <tamaño>` | Tamaño del texto en `pt` o `px`, de 6 a 24 pt; p. ej. `10pt` | `10.5pt` |
159
- | `--theme <light\|dark\|css>` | `light`, `dark` o un `.css` que reemplaza el tema | `light` |
160
- | `--css <archivo.css>` | CSS adicional (se puede repetir) | — |
161
- | `--mermaid-theme <tema>` | `default`, `neutral`, `dark`, `forest`, `base` | `neutral` / `dark` |
162
- | `--mermaid-flip <auto\|never>` | Si el autoajuste puede girar un diagrama de flujo de eje (ver abajo) | `auto` |
163
- | `--no-mermaid-autofit` | Dibujar los diagramas de flujo tal como están escritos | — |
164
- | `--lang <código>` | Idioma del documento; `en` para inglés (`pt`, `fr`, `de`…) | `es` |
165
- | `--title <texto>` | Título del documento (muestra un bloque de título) | primer `# título` |
166
- | `--config <archivo>` | Archivo de configuración | el más cercano |
167
- | `--no-config` | Ignorar `mdrender.config.json` | — |
168
- | `--browser <ruta>` | Ruta a Chrome/Edge/Chromium (o variable `MDRENDER_BROWSER`) | autodetección |
169
- | `--allow-remote` | Permitir que el PDF descargue imágenes/CSS de internet | bloqueado |
170
- | `-w, --watch` | Regenerar al guardar | — |
171
- | `-q, --quiet` | Mostrar solo advertencias y errores | — |
172
- | `-v, --verbose` | Mostrar también configuración, navegador y tiempos | — |
140
+ | Opción | Descripción | Por defecto |
141
+ | ------------------------------ | ------------------------------------------------------------------------------------------------ | --------------------- |
142
+ | `-o, --output <ruta>` | Archivo de salida, o carpeta con varios archivos | junto al `.md` |
143
+ | `-f, --format <pdf\|html>` | Formato de salida | `pdf` |
144
+ | `--page-size <tamaño>` | `Letter`, `A4`, `Legal` (también `A3`, `A5`, `Tabloid`) | `Letter` |
145
+ | `--margin <valor>` | Las cuatro márgenes como en CSS: `10mm`, `15mm 20mm`… | `10mm` |
146
+ | `--margin-top <medida>` | Margen superior, p. ej. `15mm` (prevalece sobre `--margin`) | `10mm` |
147
+ | `--margin-right <medida>` | Margen derecho | `10mm` |
148
+ | `--margin-bottom <medida>` | Margen inferior | `10mm` |
149
+ | `--margin-left <medida>` | Margen izquierdo | `10mm` |
150
+ | `--orientation <orientación>` | `portrait` (vertical) o `landscape` (horizontal) | `portrait` |
151
+ | `--landscape` | Atajo de `--orientation landscape` | — |
152
+ | `--toc` | Tabla de contenidos al inicio (o donde pongas `[[toc]]`) | — |
153
+ | `--toc-depth <n>` | Nivel de título más profundo en la tabla de contenidos | `3` |
154
+ | `--header <texto>` | Encabezado de página (ver abajo) | — |
155
+ | `--footer <texto>` | Pie de página (ver abajo) | `{page} / {pages}` |
156
+ | `--no-page-numbers` | Sin el pie con números de página | — |
157
+ | `--font <manrope\|inter>` | Tipografía del texto (ver abajo) | `manrope` |
158
+ | `--no-justify` | Párrafos alineados a la izquierda en el PDF (ver abajo) | justificado |
159
+ | `--watermark <texto>` | Marca de agua en diagonal en cada página del PDF, con el degradado Anti-Gravity | — |
160
+ | `--watermark-field` | Campo de luz con el degradado en la esquina de cada página del PDF | — |
161
+ | `--density <densidad>` | `normal` o `compact` (menos espacio entre líneas y bloques) | `normal` |
162
+ | `--font-size <tamaño>` | Tamaño del texto en `pt` o `px`, de 6 a 24 pt; p. ej. `10pt` | `10.5pt` |
163
+ | `--theme <tema\|css>` | `antigravity`, `antigravity-dark`, `light`, `dark` o un `.css` que reemplaza el tema (ver abajo) | `antigravity` |
164
+ | `--css <archivo.css>` | CSS adicional (se puede repetir) | — |
165
+ | `--mermaid-theme <tema>` | `default`, `neutral`, `dark`, `forest`, `base` | el del tema de página |
166
+ | `--mermaid-flip <auto\|never>` | Si el autoajuste puede girar un diagrama de flujo de eje (ver abajo) | `auto` |
167
+ | `--no-mermaid-autofit` | Dibujar los diagramas de flujo tal como están escritos | — |
168
+ | `--lang <código>` | Idioma del documento; `en` para inglés (`pt`, `fr`, `de`…) | `es` |
169
+ | `--title <texto>` | Título del documento (muestra un bloque de título) | primer `# título` |
170
+ | `--config <archivo>` | Archivo de configuración | el más cercano |
171
+ | `--no-config` | Ignorar `mdrender.config.json` | — |
172
+ | `--browser <ruta>` | Ruta a Chrome/Edge/Chromium (o variable `MDRENDER_BROWSER`) | autodetección |
173
+ | `--allow-remote` | Permitir que el PDF descargue imágenes/CSS de internet | bloqueado |
174
+ | `-w, --watch` | Regenerar al guardar | — |
175
+ | `-q, --quiet` | Mostrar solo advertencias y errores | — |
176
+ | `-v, --verbose` | Mostrar también configuración, navegador y tiempos | — |
173
177
 
174
178
  **Página**: por defecto hoja **Letter vertical con márgenes de 10 mm**. Las medidas aceptan
175
179
  `mm`, `cm`, `in` o `px`. `--margin` fija las cuatro márgenes a la vez y `--margin-top`,
@@ -178,6 +182,35 @@ equipo); `--port` fija el puerto y `--no-open` no abre el navegador.
178
182
  El encabezado y el pie se dibujan dentro de las márgenes superior e inferior: con menos de
179
183
  10 mm pueden tocar el texto y mdrender lo advierte.
180
184
 
185
+ **Temas**: por defecto los documentos usan el estilo **Anti-Gravity**, tomado del design system
186
+ del mismo nombre y llevado de diapositivas a páginas:
187
+
188
+ - Manrope 600 en títulos con interletrado negativo, Manrope 400 en el texto.
189
+ - Etiquetas en JetBrains Mono, en mayúsculas: autor y fecha sobre el título, el índice, el
190
+ encabezado y el pie.
191
+ - Un único azul de acento para enlaces y etiquetas, superficies suaves sin bordes gruesos, y
192
+ alertas como tarjetas.
193
+ - Los diagramas Mermaid llevan los mismos colores.
194
+ - En la primera página, junto al título, un campo de luz muy tenue en azul, cian y violeta.
195
+
196
+ `--theme antigravity-dark` es su versión oscura. `--theme light` conserva el estilo de las
197
+ versiones anteriores y `--theme dark` su variante oscura. El design system pide texto alineado
198
+ a la izquierda: con este tema, usa `--no-justify` si quieres seguirlo al pie de la letra.
199
+
200
+ **Marca de agua**: dos marcas con el degradado azul → cian → violeta del design system
201
+ Anti-Gravity, cada una por separado y solo en el PDF:
202
+
203
+ ```bash
204
+ mdrender informe.md --watermark "Borrador" # texto en diagonal en cada página
205
+ mdrender informe.md --watermark-field # campo de luz en la esquina de cada página
206
+ ```
207
+
208
+ También como `watermark: Borrador` y `watermarkField: true` en el front matter o en
209
+ `mdrender.config.json`. Van muy tenues y detrás del contenido: no tapan el texto, y las
210
+ imágenes, tablas y tarjetas quedan por encima. Según la versión de Chrome, el texto de la marca
211
+ puede formar parte del texto del PDF (aparecer al copiar o buscar). Funcionan con cualquier tema
212
+ y son algo más intensas en los oscuros.
213
+
181
214
  **Tipografía**: el texto usa [Manrope](https://fonts.google.com/specimen/Manrope);
182
215
  `--font inter` (o `font: inter` en el front matter o en `mdrender.config.json`) vuelve a
183
216
  [Inter](https://fonts.google.com/specimen/Inter), la tipografía de las versiones anteriores.
@@ -0,0 +1,37 @@
1
+ /* mdrender Anti-Gravity dark stage: loaded after theme-antigravity.css, swaps its colours. */
2
+
3
+ :root {
4
+ --ag-canvas: #0b0e13;
5
+ --ag-surface-subtle: #10141b;
6
+ --ag-surface-raised: #141922;
7
+ --ag-ink: #eef1f6;
8
+ --ag-ink-secondary: #b6bdc9;
9
+ --ag-ink-muted: #8f98a7;
10
+ --ag-hairline: #232a35;
11
+ --ag-hairline-strong: #3a4352;
12
+ --ag-accent: #7ea4ff;
13
+ --ag-accent-soft: #16213b;
14
+ --ag-opacity-field: 0.22;
15
+ --ag-shadow-card: 0 1px 2px rgba(0, 0, 0, 0.4), 0 12px 32px rgba(0, 0, 0, 0.35);
16
+
17
+ --alert-warning: #e3b341;
18
+ --alert-caution: #ff8a8a;
19
+ --color-error: #ffa198;
20
+ --color-error-bg: #2d1416;
21
+ --color-error-border: #8e1519;
22
+
23
+ --code-title: #b9a6ff;
24
+ --code-constant: #b9a6ff;
25
+ --code-string: #6fd3ec;
26
+ --code-builtin: #6fd3ec;
27
+ --code-added: #aff5b4;
28
+ --code-added-bg: #0d2e19;
29
+ --code-removed: #ffdcd7;
30
+ --code-removed-bg: #4a0f16;
31
+ color-scheme: dark;
32
+ }
33
+
34
+ /* Paint the whole sheet, margins included (the root background stops at the margins). */
35
+ @page {
36
+ background: #0b0e13;
37
+ }
@@ -0,0 +1,239 @@
1
+ /*
2
+ * mdrender Anti-Gravity theme (the default): loaded after theme.css. Colours, type and surfaces
3
+ * follow the Anti-Gravity design system (tokens.json), drawn for 1920 × 1080 slides and scaled
4
+ * here to a printed page. theme-antigravity-dark.css swaps the colours for its dark stage.
5
+ */
6
+
7
+ :root {
8
+ /* Design system tokens */
9
+ --ag-canvas: #ffffff;
10
+ --ag-surface-subtle: #f6f8fb;
11
+ --ag-surface-raised: #ffffff;
12
+ --ag-ink: #0f1419;
13
+ --ag-ink-secondary: #454e5c;
14
+ --ag-ink-muted: #636c7a;
15
+ --ag-hairline: #e6e9ef;
16
+ --ag-hairline-strong: #c9d0db;
17
+ --ag-accent: #2456d3;
18
+ --ag-accent-soft: #ecf1fd;
19
+ --ag-field-blue: #4f7cff;
20
+ --ag-field-cyan: #22c3e6;
21
+ --ag-field-violet: #8c6cf0;
22
+ --ag-opacity-field: 0.16;
23
+ --ag-shadow-card: 0 1px 2px rgba(15, 20, 25, 0.04), 0 12px 32px rgba(15, 20, 25, 0.06);
24
+
25
+ /* The variables theme.css is written with */
26
+ --color-text: var(--ag-ink);
27
+ --color-muted: var(--ag-ink-muted);
28
+ --color-heading: var(--ag-ink);
29
+ --color-link: var(--ag-accent);
30
+ --color-border: var(--ag-hairline);
31
+ --color-subtle-bg: var(--ag-surface-subtle);
32
+ --color-accent: var(--ag-accent);
33
+ --color-bg: var(--ag-canvas);
34
+ --color-stripe: var(--ag-canvas);
35
+ /* Notes, tips and important points in the one accent. Warnings and cautions keep amber and
36
+ red: they carry risk, a deliberate exception to the system's single blue. */
37
+ --alert-note: var(--ag-accent);
38
+ --alert-tip: var(--ag-accent);
39
+ --alert-important: var(--ag-accent);
40
+ --alert-warning: #8a5d00;
41
+ --alert-caution: #c0262d;
42
+
43
+ /* Syntax highlighting: restrained, from the accent and the field hues (4.5:1 or better on
44
+ surface-subtle). */
45
+ --code-keyword: var(--ag-accent);
46
+ --code-title: #5b3fc4;
47
+ --code-constant: #5b3fc4;
48
+ --code-string: #0a6580;
49
+ --code-builtin: #0a6580;
50
+ --code-comment: var(--ag-ink-muted);
51
+ --code-tag: var(--ag-accent);
52
+ --code-text: var(--ag-ink);
53
+ --code-added: #116329;
54
+ --code-added-bg: #e6f6ea;
55
+ --code-removed: #a40e26;
56
+ --code-removed-bg: #fdecee;
57
+ }
58
+
59
+ /* Headings: Manrope 600, negative tracking, separated by white space rather than rules. */
60
+ h1,
61
+ h2,
62
+ h3,
63
+ h4,
64
+ h5,
65
+ h6 {
66
+ font-weight: 600;
67
+ }
68
+
69
+ h1 {
70
+ font-size: 2.1em;
71
+ letter-spacing: -0.025em;
72
+ padding-bottom: 0;
73
+ border-bottom: 0;
74
+ }
75
+
76
+ h2 {
77
+ font-size: 1.55em;
78
+ letter-spacing: -0.02em;
79
+ padding-bottom: 0;
80
+ border-bottom: 0;
81
+ }
82
+
83
+ h3 {
84
+ font-size: 1.15em;
85
+ letter-spacing: -0.01em;
86
+ }
87
+
88
+ h4,
89
+ h5,
90
+ h6 {
91
+ font-size: 1em;
92
+ letter-spacing: 0;
93
+ }
94
+
95
+ h6 {
96
+ color: var(--ag-ink-secondary);
97
+ }
98
+
99
+ /* Title block as the system's TitleBlock: eyebrow (author · date), display title, lead. */
100
+ .doc-header {
101
+ display: flex;
102
+ flex-direction: column;
103
+ margin-bottom: 2.4em;
104
+ }
105
+
106
+ .doc-header .doc-meta {
107
+ order: -1;
108
+ margin: 0 0 1em;
109
+ padding-bottom: 0;
110
+ border-bottom: 0;
111
+ font-family: var(--font-code);
112
+ font-size: 0.78em;
113
+ font-weight: 500;
114
+ letter-spacing: 0.14em;
115
+ text-transform: uppercase;
116
+ color: var(--ag-accent);
117
+ }
118
+
119
+ .doc-header .doc-title {
120
+ margin: 0 0 0.35em;
121
+ font-size: 2.6em;
122
+ letter-spacing: -0.03em;
123
+ line-height: 1.12;
124
+ }
125
+
126
+ .doc-subtitle {
127
+ margin: 0;
128
+ font-size: 1.23em;
129
+ line-height: 1.4;
130
+ color: var(--ag-ink-secondary);
131
+ }
132
+
133
+ /*
134
+ * The gradient field: soft light in the top-right corner of the title block (so only on the
135
+ * first page, and only when there is one), never under text: the title block's text keeps to
136
+ * the left 64%, the system's text measure. Each light fades out inside the box, so no edge shows.
137
+ */
138
+ .doc-header {
139
+ position: relative;
140
+ z-index: 0;
141
+ }
142
+
143
+ .doc-header > * {
144
+ max-width: 64%;
145
+ }
146
+
147
+ .doc-header::before {
148
+ content: "";
149
+ position: absolute;
150
+ z-index: -1;
151
+ top: 0;
152
+ right: 0;
153
+ bottom: 0;
154
+ width: 36%;
155
+ opacity: var(--ag-opacity-field);
156
+ pointer-events: none;
157
+ background:
158
+ radial-gradient(28% 38% at 58% 45%, var(--ag-field-blue), transparent),
159
+ radial-gradient(16% 26% at 78% 58%, var(--ag-field-cyan), transparent),
160
+ radial-gradient(25% 30% at 40% 32%, var(--ag-field-violet), transparent);
161
+ }
162
+
163
+ /* Text */
164
+ li::marker {
165
+ color: var(--ag-ink-muted);
166
+ }
167
+
168
+ blockquote {
169
+ padding: 0.8em 1.1em;
170
+ color: var(--ag-ink-secondary);
171
+ border-left: 0;
172
+ border-radius: 8px;
173
+ background: var(--ag-surface-subtle);
174
+ }
175
+
176
+ hr {
177
+ background: var(--ag-hairline);
178
+ }
179
+
180
+ /* Code */
181
+ code {
182
+ border-radius: 4px;
183
+ background: var(--ag-accent-soft);
184
+ }
185
+
186
+ pre {
187
+ border: 1px solid var(--ag-hairline);
188
+ border-radius: 8px;
189
+ background: var(--ag-surface-subtle);
190
+ }
191
+
192
+ /* Tables: header on surface-subtle, hairline rules, no stripes. */
193
+ th,
194
+ td {
195
+ border-color: var(--ag-hairline);
196
+ }
197
+
198
+ th {
199
+ background: var(--ag-surface-subtle);
200
+ }
201
+
202
+ /* Alerts as raised cards with a mono label; no left-border accents. */
203
+ .markdown-alert {
204
+ padding: 0.8em 1.1em;
205
+ color: var(--ag-ink);
206
+ border: 1px solid var(--ag-hairline);
207
+ border-radius: 12px;
208
+ background: var(--ag-surface-raised);
209
+ box-shadow: var(--ag-shadow-card);
210
+ }
211
+
212
+ .markdown-alert-title {
213
+ font-family: var(--font-code);
214
+ font-size: 0.78em;
215
+ font-weight: 500;
216
+ letter-spacing: 0.14em;
217
+ text-transform: uppercase;
218
+ }
219
+
220
+ /* Table of contents as a quiet panel with a mono label. */
221
+ .toc {
222
+ border-color: var(--ag-hairline);
223
+ border-radius: 12px;
224
+ background: var(--ag-surface-subtle);
225
+ }
226
+
227
+ .toc-title {
228
+ font-family: var(--font-code);
229
+ font-size: 0.78em;
230
+ font-weight: 500;
231
+ letter-spacing: 0.14em;
232
+ text-transform: uppercase;
233
+ color: var(--ag-accent);
234
+ }
235
+
236
+ /* Footnotes */
237
+ .footnotes {
238
+ color: var(--ag-ink-muted);
239
+ }
package/dist/assets.js CHANGED
@@ -94,6 +94,8 @@ export const MERMAID_JS = "mermaid/dist/mermaid.min.js";
94
94
  export const THEMES = [
95
95
  "mdrender/assets/theme.css",
96
96
  "mdrender/assets/theme-dark.css",
97
+ "mdrender/assets/theme-antigravity.css",
98
+ "mdrender/assets/theme-antigravity-dark.css",
97
99
  "mdrender/assets/density-compact.css",
98
100
  ];
99
101
  export const PACKAGE_JSON = "mdrender/package.json";
package/dist/cli.js CHANGED
@@ -27,6 +27,8 @@ const DOCUMENT_FLAGS = [
27
27
  "pageNumbers",
28
28
  "font",
29
29
  "justify",
30
+ "watermark",
31
+ "watermarkField",
30
32
  "density",
31
33
  "fontSize",
32
34
  "css",
@@ -63,11 +65,15 @@ function addDocumentOptions(command) {
63
65
  .option("--no-page-numbers", "no default page-number footer")
64
66
  .option("--font <font>", "text typeface: manrope or inter (default: manrope)")
65
67
  .option("--no-justify", "align paragraphs left in the PDF instead of justifying them")
68
+ .option("--watermark <text>", "text across every PDF page, in the Anti-Gravity gradient")
69
+ .option("--watermark-field", "a soft field of light in the corner of every PDF page")
66
70
  .option("--density <density>", "normal or compact (tighter spacing) (default: normal)")
67
71
  .option("--font-size <size>", "text size, e.g. 10pt or 11pt (default: 10.5pt)")
68
- .option("--theme <theme>", "light, dark, or a .css file replacing the theme (default: light)")
72
+ .option("--theme <theme>", "antigravity, antigravity-dark, light, dark, or a .css file replacing the theme " +
73
+ "(default: antigravity)")
69
74
  .option("--css <file>", "extra stylesheet (repeatable)", collect)
70
- .option("--mermaid-theme <theme>", `Mermaid theme: ${MERMAID_THEMES.join(", ")} (default: neutral; dark with --theme dark)`)
75
+ .option("--mermaid-theme <theme>", `Mermaid theme: ${MERMAID_THEMES.join(", ")} ` +
76
+ "(default: the page theme's — base in Anti-Gravity colours, neutral for light, dark for dark)")
71
77
  .option("--no-mermaid-autofit", "draw flowcharts exactly as written (no layout search)")
72
78
  .option("--mermaid-flip <mode>", "auto: turn a flowchart to the other axis if its text prints too small; never (default: auto)")
73
79
  .option("--lang <tag>", "document language, e.g. es or en (default: es)")
package/dist/convert.js CHANGED
@@ -7,12 +7,14 @@ import { extractFrontMatter } from "./frontmatter.js";
7
7
  import { strings } from "./i18n.js";
8
8
  import { renderMarkdown } from "./markdown/index.js";
9
9
  import { buildToc, tocPlaceholder } from "./markdown/toc.js";
10
- import { DEFAULT_FONT_SIZE, fontSizePx, mergeOptions, normalizeOptions, OptionsError, resolveMargins, } from "./options.js";
10
+ import { BUILTIN_THEMES, DEFAULT_FONT_SIZE, fontSizePx, isDarkTheme, mergeOptions, normalizeOptions, OptionsError, resolveMargins, } from "./options.js";
11
11
  import { BrowserSession } from "./render/browser.js";
12
12
  import { DEFAULT_FOOTER, headerFooterTemplate } from "./render/header-footer.js";
13
13
  import { fillMermaid, renderMermaid } from "./render/mermaid.js";
14
14
  import { SMALL_SCALE } from "./render/mermaid-fit.js";
15
+ import { headerFooterStyle, mermaidThemeVariables } from "./render/antigravity.js";
15
16
  import { FONT_FAMILIES, fontStack } from "./render/fonts.js";
17
+ import { WATERMARK_CSS, watermarkHtml } from "./render/watermark.js";
16
18
  import { contentHeightPx, contentWidthPx, lengthToPx, textWidthPx } from "./render/page.js";
17
19
  import { buildHtmlDocument, builtinThemeCss, densityCss } from "./render/template.js";
18
20
  import { writeFileAtomic } from "./write.js";
@@ -52,7 +54,8 @@ function readStylesheet(file) {
52
54
  }
53
55
  }
54
56
  function themeStylesheets(theme) {
55
- return theme === "light" || theme === "dark" ? builtinThemeCss(theme) : [readStylesheet(theme)];
57
+ const builtin = BUILTIN_THEMES.find((name) => name === theme);
58
+ return builtin ? builtinThemeCss(builtin) : [readStylesheet(theme)];
56
59
  }
57
60
  /**
58
61
  * Chrome draws the header and footer inside the top and bottom margins. Measured: below about
@@ -111,6 +114,17 @@ function layoutCss(options, margin) {
111
114
  rules.push(`html { font-size: ${options.fontSize}; }`);
112
115
  return rules.join("\n");
113
116
  }
117
+ /** The watermarks asked for (PDF only), sized to the page's text area. */
118
+ function watermarks(options, margin) {
119
+ const landscape = options.orientation === "landscape";
120
+ return watermarkHtml({
121
+ text: options.watermark,
122
+ field: options.watermarkField,
123
+ widthPx: textWidthPx(options.pageSize, landscape, margin),
124
+ heightPx: contentHeightPx(options.pageSize, landscape, margin),
125
+ dark: isDarkTheme(options.theme),
126
+ });
127
+ }
114
128
  const fixed2 = (n) => n.toFixed(2);
115
129
  /** "Mermaid autofit: wrap 300, turned LR→TB, scale 0.33 → 1.00, height 81 → 903 px". */
116
130
  export function describeLayout(layout) {
@@ -126,7 +140,11 @@ export function describeLayout(layout) {
126
140
  }
127
141
  /** Mermaid theme: explicit choice, else dark diagrams for the dark page theme. */
128
142
  export function effectiveMermaidTheme(options) {
129
- return options.mermaidTheme ?? (options.theme === "dark" ? "dark" : "neutral");
143
+ if (options.mermaidTheme)
144
+ return options.mermaidTheme;
145
+ if (options.theme.startsWith("antigravity"))
146
+ return "base";
147
+ return isDarkTheme(options.theme) ? "dark" : "neutral";
130
148
  }
131
149
  /**
132
150
  * Render a Markdown file to a complete HTML document. A browser is only started (through
@@ -188,6 +206,7 @@ paged = false) {
188
206
  autofit: options.mermaidAutofit,
189
207
  flip: options.mermaidFlip,
190
208
  font: options.font,
209
+ themeVariables: theme === "base" ? mermaidThemeVariables(options.theme) : undefined,
191
210
  });
192
211
  const filled = fillMermaid(body, md.nonce, md.mermaid, results);
193
212
  body = filled.html;
@@ -208,6 +227,7 @@ paged = false) {
208
227
  }
209
228
  });
210
229
  }
230
+ const watermark = paged ? watermarks(options, margin) : "";
211
231
  const html = buildHtmlDocument({
212
232
  title,
213
233
  body,
@@ -219,7 +239,12 @@ paged = false) {
219
239
  showTitle: options.title !== undefined,
220
240
  themeCss,
221
241
  font: options.font,
222
- layoutCss: [...densityCss(options.density), layoutCss(options, margin)],
242
+ beforeBody: watermark || undefined,
243
+ layoutCss: [
244
+ ...densityCss(options.density),
245
+ layoutCss(options, margin),
246
+ ...(watermark ? [WATERMARK_CSS] : []),
247
+ ],
223
248
  extraCss,
224
249
  });
225
250
  diagnostics.sort((a, b) => (a.line ?? 0) - (b.line ?? 0));
@@ -243,16 +268,17 @@ export async function convertFile(convert) {
243
268
  const footer = options.footer ?? (options.pageNumbers ? DEFAULT_FOOTER : undefined);
244
269
  const hasHeaderFooter = options.header !== undefined || footer !== undefined;
245
270
  doc.diagnostics.push(...headerFooterSpaceWarnings(margin, options.header !== undefined, footer !== undefined));
271
+ const pageLook = headerFooterStyle(options.theme);
246
272
  const session = await browsers.get();
247
273
  const { pdf, blocked } = await session.printPdf(doc.html, {
248
274
  format: options.pageSize,
249
275
  landscape: options.orientation === "landscape",
250
276
  margin,
251
277
  headerTemplate: hasHeaderFooter
252
- ? headerFooterTemplate(options.header, values, margin, options.font)
278
+ ? headerFooterTemplate(options.header, values, margin, options.font, pageLook)
253
279
  : undefined,
254
280
  footerTemplate: hasHeaderFooter
255
- ? headerFooterTemplate(footer, values, margin, options.font)
281
+ ? headerFooterTemplate(footer, values, margin, options.font, pageLook)
256
282
  : undefined,
257
283
  allowRemote: convert.allowRemote,
258
284
  softHyphensWidthPx: options.justify
package/dist/doctor.js CHANGED
@@ -138,6 +138,8 @@ function settingsCheck(options) {
138
138
  `${m.left} (top right bottom left), ${options.font} ` +
139
139
  `${options.fontSize ?? DEFAULT_FONT_SIZE}, ${options.density} density, ` +
140
140
  `${options.justify ? "justified" : "ragged"} paragraphs, ` +
141
+ (options.watermark?.trim() ? `watermark "${options.watermark.trim()}", ` : "") +
142
+ (options.watermarkField ? "watermark field, " : "") +
141
143
  `language ${options.lang}, theme ` +
142
144
  path.basename(options.theme),
143
145
  };
package/dist/options.d.ts CHANGED
@@ -13,7 +13,10 @@ export declare const MERMAID_THEMES: readonly ["default", "neutral", "dark", "fo
13
13
  export type MermaidTheme = (typeof MERMAID_THEMES)[number];
14
14
  export declare const MERMAID_FLIPS: readonly ["auto", "never"];
15
15
  export type MermaidFlip = (typeof MERMAID_FLIPS)[number];
16
- export declare const BUILTIN_THEMES: readonly ["light", "dark"];
16
+ export declare const BUILTIN_THEMES: readonly ["antigravity", "antigravity-dark", "light", "dark"];
17
+ export type BuiltinTheme = (typeof BUILTIN_THEMES)[number];
18
+ /** Built-in themes with a dark page. */
19
+ export declare const isDarkTheme: (theme: string) => boolean;
17
20
  export declare const TEXT_FONTS: readonly ["manrope", "inter"];
18
21
  export type TextFont = (typeof TEXT_FONTS)[number];
19
22
  export declare const DENSITIES: readonly ["normal", "compact"];
@@ -37,12 +40,19 @@ export interface DocumentOptions {
37
40
  /** Header/footer text; see render/header-footer.ts for placeholders and `|` columns. */
38
41
  header?: string;
39
42
  footer?: string;
40
- /** Mermaid theme; when unset, "neutral" for light pages and "dark" for the dark theme. */
43
+ /**
44
+ * Mermaid theme; when unset, the page theme's: "base" coloured from the Anti-Gravity tokens,
45
+ * else "neutral" for light pages and "dark" for dark ones.
46
+ */
41
47
  mermaidTheme?: MermaidTheme;
42
48
  /** Try several layouts of each flowchart and keep the one whose text prints largest. */
43
49
  mermaidAutofit: boolean;
44
50
  /** Whether autofit may turn a flowchart to the other axis (LR ↔ TB) when it reads far better. */
45
51
  mermaidFlip: MermaidFlip;
52
+ /** Text set diagonally across every page of the PDF, in the Anti-Gravity gradient. */
53
+ watermark?: string;
54
+ /** A soft field of light (the Anti-Gravity gradient) in the corner of every PDF page. */
55
+ watermarkField: boolean;
46
56
  /** Justify paragraphs in the PDF (body, quotes, alerts), breaking long words with hyphens. */
47
57
  justify: boolean;
48
58
  /** Typeface of the text: Manrope or Inter (code is always JetBrains Mono). */
@@ -51,7 +61,7 @@ export interface DocumentOptions {
51
61
  density: Density;
52
62
  /** Base font size of the text, e.g. "10pt"; when unset, the theme's (10.5pt). */
53
63
  fontSize?: string;
54
- /** "light", "dark", or the absolute path of a stylesheet that replaces the built-in theme. */
64
+ /** A built-in theme (BUILTIN_THEMES), or the absolute path of a stylesheet replacing it. */
55
65
  theme: string;
56
66
  /** Extra stylesheets (absolute paths), applied after the built-in theme. */
57
67
  css: string[];
package/dist/options.js CHANGED
@@ -6,7 +6,9 @@ export const PAGE_SIZES = ["A3", "A4", "A5", "Letter", "Legal", "Tabloid"];
6
6
  export const ORIENTATIONS = ["portrait", "landscape"];
7
7
  export const MERMAID_THEMES = ["default", "neutral", "dark", "forest", "base"];
8
8
  export const MERMAID_FLIPS = ["auto", "never"];
9
- export const BUILTIN_THEMES = ["light", "dark"];
9
+ export const BUILTIN_THEMES = ["antigravity", "antigravity-dark", "light", "dark"];
10
+ /** Built-in themes with a dark page. */
11
+ export const isDarkTheme = (theme) => theme === "dark" || theme === "antigravity-dark";
10
12
  export const TEXT_FONTS = ["manrope", "inter"];
11
13
  export const DENSITIES = ["normal", "compact"];
12
14
  export const DEFAULT_OPTIONS = {
@@ -20,8 +22,9 @@ export const DEFAULT_OPTIONS = {
20
22
  mermaidFlip: "auto",
21
23
  font: "manrope",
22
24
  justify: true,
25
+ watermarkField: false,
23
26
  density: "normal",
24
- theme: "light",
27
+ theme: "antigravity",
25
28
  css: [],
26
29
  lang: DEFAULT_LANG,
27
30
  };
@@ -120,6 +123,8 @@ const VALIDATORS = {
120
123
  mermaidFlip: oneOf(MERMAID_FLIPS),
121
124
  font: oneOf(TEXT_FONTS),
122
125
  justify: bool,
126
+ watermark: text,
127
+ watermarkField: bool,
123
128
  density: oneOf(DENSITIES),
124
129
  fontSize,
125
130
  theme: (value, describe, baseDir) => {
@@ -129,7 +134,7 @@ const VALIDATORS = {
129
134
  return builtin;
130
135
  if (/\.css$/i.test(theme))
131
136
  return path.resolve(baseDir, theme);
132
- throw new OptionsError(`${describe} must be light, dark or a .css file`);
137
+ throw new OptionsError(`${describe} must be ${BUILTIN_THEMES.join(", ")} or a .css file`);
133
138
  },
134
139
  css: (value, describe, baseDir) => {
135
140
  const list = Array.isArray(value) ? value : [value];
@@ -0,0 +1,13 @@
1
+ export declare const isAntigravityTheme: (theme: string) => boolean;
2
+ /**
3
+ * Mermaid "base" theme variables for an Anti-Gravity page: nodes on accent-soft outlined in
4
+ * accent, edges and arrows in ink-muted, groups on surface-subtle. Undefined for other themes.
5
+ */
6
+ export declare function mermaidThemeVariables(theme: string): Record<string, string | boolean> | undefined;
7
+ export interface HeaderFooterStyle {
8
+ color: string;
9
+ /** Set in the mono family, uppercase and tracked, like the system's slide footers. */
10
+ mono: boolean;
11
+ }
12
+ /** How page headers and footers look for a page theme. */
13
+ export declare function headerFooterStyle(theme: string): HeaderFooterStyle;
@@ -0,0 +1,82 @@
1
+ import { isDarkTheme } from "../options.js";
2
+ /**
3
+ * Anti-Gravity design system tokens needed outside the stylesheets (theme-antigravity.css):
4
+ * Mermaid draws its diagrams in a page of its own, and Chrome renders page headers and footers
5
+ * apart from the document, so neither sees the CSS variables.
6
+ */
7
+ const TOKENS = {
8
+ light: {
9
+ canvas: "#ffffff",
10
+ surfaceSubtle: "#f6f8fb",
11
+ ink: "#0f1419",
12
+ inkSecondary: "#454e5c",
13
+ inkMuted: "#636c7a",
14
+ hairline: "#e6e9ef",
15
+ hairlineStrong: "#c9d0db",
16
+ accent: "#2456d3",
17
+ accentSoft: "#ecf1fd",
18
+ },
19
+ dark: {
20
+ canvas: "#0b0e13",
21
+ surfaceSubtle: "#10141b",
22
+ ink: "#eef1f6",
23
+ inkSecondary: "#b6bdc9",
24
+ inkMuted: "#8f98a7",
25
+ hairline: "#232a35",
26
+ hairlineStrong: "#3a4352",
27
+ accent: "#7ea4ff",
28
+ accentSoft: "#16213b",
29
+ },
30
+ };
31
+ export const isAntigravityTheme = (theme) => theme.startsWith("antigravity");
32
+ const tokensFor = (theme) => (isDarkTheme(theme) ? TOKENS.dark : TOKENS.light);
33
+ /**
34
+ * Mermaid "base" theme variables for an Anti-Gravity page: nodes on accent-soft outlined in
35
+ * accent, edges and arrows in ink-muted, groups on surface-subtle. Undefined for other themes.
36
+ */
37
+ export function mermaidThemeVariables(theme) {
38
+ if (!isAntigravityTheme(theme))
39
+ return undefined;
40
+ const t = tokensFor(theme);
41
+ return {
42
+ darkMode: isDarkTheme(theme),
43
+ background: t.canvas,
44
+ primaryColor: t.accentSoft,
45
+ primaryBorderColor: t.accent,
46
+ primaryTextColor: t.ink,
47
+ secondaryColor: t.surfaceSubtle,
48
+ secondaryBorderColor: t.hairlineStrong,
49
+ secondaryTextColor: t.ink,
50
+ tertiaryColor: t.canvas,
51
+ tertiaryBorderColor: t.hairlineStrong,
52
+ tertiaryTextColor: t.ink,
53
+ mainBkg: t.accentSoft,
54
+ nodeBorder: t.accent,
55
+ nodeTextColor: t.ink,
56
+ lineColor: t.inkMuted,
57
+ textColor: t.ink,
58
+ titleColor: t.ink,
59
+ clusterBkg: t.surfaceSubtle,
60
+ clusterBorder: t.hairlineStrong,
61
+ edgeLabelBackground: t.canvas,
62
+ noteBkgColor: t.surfaceSubtle,
63
+ noteBorderColor: t.hairlineStrong,
64
+ noteTextColor: t.ink,
65
+ actorBkg: t.accentSoft,
66
+ actorBorder: t.accent,
67
+ actorTextColor: t.ink,
68
+ actorLineColor: t.hairlineStrong,
69
+ signalColor: t.inkMuted,
70
+ signalTextColor: t.ink,
71
+ labelBoxBkgColor: t.surfaceSubtle,
72
+ labelBoxBorderColor: t.hairlineStrong,
73
+ labelTextColor: t.ink,
74
+ };
75
+ }
76
+ /** How page headers and footers look for a page theme. */
77
+ export function headerFooterStyle(theme) {
78
+ if (isAntigravityTheme(theme))
79
+ return { color: tokensFor(theme).inkMuted, mono: true };
80
+ return { color: "#59636e", mono: false };
81
+ }
82
+ //# sourceMappingURL=antigravity.js.map
@@ -20,5 +20,7 @@ export declare function fontStack(font: TextFont): string;
20
20
  export declare function inlineFontStylesheet(cssKey: string): string;
21
21
  /** @font-face rules for every font a document uses, with the font files embedded. */
22
22
  export declare function fontFaceCss(font?: TextFont): string;
23
+ /** JetBrains Mono Regular alone, for page headers/footers set in the mono family. */
24
+ export declare function monoRegularFontFace(): string;
23
25
  /** The text font's regular weight alone, for page headers/footers (rendered apart from the page). */
24
26
  export declare function regularFontFace(font?: TextFont): string;
@@ -64,6 +64,12 @@ export function fontFaceCss(font = "manrope") {
64
64
  }
65
65
  return css;
66
66
  }
67
+ let monoRegular;
68
+ /** JetBrains Mono Regular alone, for page headers/footers set in the mono family. */
69
+ export function monoRegularFontFace() {
70
+ monoRegular ??= inlineFontStylesheet(MONO_STYLESHEETS[0]);
71
+ return monoRegular;
72
+ }
67
73
  const regularFaces = new Map();
68
74
  /** The text font's regular weight alone, for page headers/footers (rendered apart from the page). */
69
75
  export function regularFontFace(font = "manrope") {
@@ -1,4 +1,5 @@
1
1
  import type { TextFont } from "../options.js";
2
+ import type { HeaderFooterStyle } from "./antigravity.js";
2
3
  /**
3
4
  * Header/footer text with placeholders, in up to three columns separated by `|`:
4
5
  *
@@ -19,5 +20,5 @@ export interface HeaderFooterValues {
19
20
  export declare function headerFooterTemplate(spec: string | undefined, values: HeaderFooterValues, horizontalMargin: {
20
21
  left: string;
21
22
  right: string;
22
- }, font?: TextFont): string;
23
+ }, font?: TextFont, style?: HeaderFooterStyle): string;
23
24
  export declare const DEFAULT_FOOTER = "{page} / {pages}";
@@ -1,5 +1,5 @@
1
1
  import { escapeHtml } from "../html.js";
2
- import { fontStack, regularFontFace } from "./fonts.js";
2
+ import { fontStack, monoRegularFontFace, regularFontFace } from "./fonts.js";
3
3
  const CHROME_CLASSES = { page: "pageNumber", pages: "totalPages" };
4
4
  function renderText(text, values) {
5
5
  return escapeHtml(text.trim()).replace(/\{(\w+)\}/g, (match, name) => {
@@ -23,13 +23,18 @@ function columns(spec) {
23
23
  * Chrome header/footer template. Chrome renders it apart from the page, so it carries its own
24
24
  * styles and its own copy of the text font.
25
25
  */
26
- export function headerFooterTemplate(spec, values, horizontalMargin, font = "manrope") {
26
+ export function headerFooterTemplate(spec, values, horizontalMargin, font = "manrope", style = { color: "#59636e", mono: false }) {
27
27
  if (!spec)
28
28
  return "<span></span>";
29
29
  const [left, center, right] = columns(spec).map((c) => renderText(c, values));
30
- return `<style>${regularFontFace(font)}</style>
30
+ // The font list sits in a style="…" attribute: single quotes only.
31
+ const look = style.mono
32
+ ? `font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 7pt; ` +
33
+ `letter-spacing: 0.14em; text-transform: uppercase;`
34
+ : `font-family: ${fontStack(font).replaceAll('"', "'")}; font-size: 8pt;`;
35
+ return `<style>${style.mono ? monoRegularFontFace() : regularFontFace(font)}</style>
31
36
  <div style="box-sizing: border-box; width: 100%; display: flex; padding: 0 ${horizontalMargin.right} 0 ${horizontalMargin.left};
32
- font-family: ${fontStack(font).replaceAll('"', "'")}; font-size: 8pt; color: #59636e;">
37
+ ${look} color: ${style.color};">
33
38
  <span style="flex: 1; text-align: left;">${left}</span>
34
39
  <span style="flex: 1; text-align: center;">${center}</span>
35
40
  <span style="flex: 1; text-align: right;">${right}</span>
@@ -39,6 +39,8 @@ export interface MermaidRenderOptions {
39
39
  flip?: MermaidFlip;
40
40
  /** Text font of the document, used for diagram labels too. */
41
41
  font?: TextFont;
42
+ /** Extra Mermaid theme variables (the Anti-Gravity colours for the "base" theme). */
43
+ themeVariables?: Record<string, string | boolean>;
42
44
  }
43
45
  /**
44
46
  * Room kept for a heading printed together with the diagram below it (see keep-with-heading in
@@ -14,7 +14,7 @@ const DEFAULT_FONT_PX = 14;
14
14
  */
15
15
  export const HEADING_ALLOWANCE_EM = 5;
16
16
  let mermaidJs;
17
- function mermaidConfig(theme, font, fontPx, wrap) {
17
+ function mermaidConfig(theme, font, fontPx, wrap, themeVariables = {}) {
18
18
  const fontFamily = fontStack(font);
19
19
  return {
20
20
  startOnLoad: false,
@@ -23,7 +23,7 @@ function mermaidConfig(theme, font, fontPx, wrap) {
23
23
  fontFamily,
24
24
  // Sequence diagrams take their text sizes from here, the others from themeVariables.
25
25
  fontSize: fontPx,
26
- themeVariables: { fontFamily, fontSize: `${fontPx}px` },
26
+ themeVariables: { ...themeVariables, fontFamily, fontSize: `${fontPx}px` },
27
27
  htmlLabels: true,
28
28
  // Actors only at the top of sequence diagrams: repeating them below costs height.
29
29
  sequence: { mirrorActors: false },
@@ -61,7 +61,7 @@ body { margin: 0; width: ${widthPx}px; font-family: ${fontStack(font)}; }</style
61
61
  catch (error) {
62
62
  return { error: String(error?.message ?? error) };
63
63
  }
64
- }, source, id, mermaidConfig(theme, font, fontPx, wrap));
64
+ }, source, id, mermaidConfig(theme, font, fontPx, wrap, options.themeVariables));
65
65
  const results = [];
66
66
  for (const [i, block] of blocks.entries()) {
67
67
  const id = `mermaid-${i + 1}`;
@@ -1,8 +1,8 @@
1
1
  import { escapeHtml } from "../html.js";
2
- import type { TextFont } from "../options.js";
2
+ import type { BuiltinTheme, TextFont } from "../options.js";
3
3
  export { escapeHtml };
4
- /** Stylesheets of a built-in theme ("light" or "dark"). */
5
- export declare function builtinThemeCss(theme: "light" | "dark"): string[];
4
+ /** Stylesheets of a built-in theme. */
5
+ export declare function builtinThemeCss(theme: BuiltinTheme): string[];
6
6
  /** Stylesheet for a density other than "normal", applied after the theme. */
7
7
  export declare function densityCss(density: "normal" | "compact"): string[];
8
8
  export interface DocumentParts {
@@ -20,6 +20,8 @@ export interface DocumentParts {
20
20
  themeCss?: string[];
21
21
  /** Text font to embed. Defaults to Manrope. */
22
22
  font?: TextFont;
23
+ /** HTML placed before the document body (the watermarks). */
24
+ beforeBody?: string;
23
25
  /** Layout stylesheets (density, font size, page height), applied after the theme. */
24
26
  layoutCss?: string[];
25
27
  /** Extra stylesheet contents, applied after the theme and layout. */
@@ -13,9 +13,16 @@ function asset(name) {
13
13
  }
14
14
  return css;
15
15
  }
16
- /** Stylesheets of a built-in theme ("light" or "dark"). */
16
+ /** Stylesheets of each built-in theme, applied in order. */
17
+ const THEME_FILES = {
18
+ antigravity: ["theme.css", "theme-antigravity.css"],
19
+ "antigravity-dark": ["theme.css", "theme-antigravity.css", "theme-antigravity-dark.css"],
20
+ light: ["theme.css"],
21
+ dark: ["theme.css", "theme-dark.css"],
22
+ };
23
+ /** Stylesheets of a built-in theme. */
17
24
  export function builtinThemeCss(theme) {
18
- return theme === "dark" ? [asset("theme.css"), asset("theme-dark.css")] : [asset("theme.css")];
25
+ return THEME_FILES[theme].map(asset);
19
26
  }
20
27
  /** Stylesheet for a density other than "normal", applied after the theme. */
21
28
  export function densityCss(density) {
@@ -54,7 +61,7 @@ ${author ? `<meta name="author" content="${escapeHtml(author)}">\n` : ""}<title>
54
61
  ${styles.map((css) => `<style>\n${css}\n</style>`).join("\n")}
55
62
  </head>
56
63
  <body>
57
- <main class="markdown-body">
64
+ ${parts.beforeBody ? parts.beforeBody + "\n" : ""}<main class="markdown-body">
58
65
  ${parts.showTitle ? titleBlock(parts) + "\n" : ""}${body}
59
66
  </main>
60
67
  </body>
@@ -0,0 +1,24 @@
1
+ export interface WatermarkOptions {
2
+ /** Text set across every page; undefined or blank for none. */
3
+ text?: string;
4
+ /** A field of light in the corner of every page. */
5
+ field: boolean;
6
+ /** Size of the text area in CSS px (the text runs along its diagonal). */
7
+ widthPx: number;
8
+ heightPx: number;
9
+ /** Dark page: the marks are a little stronger, as the design system's dark stage. */
10
+ dark: boolean;
11
+ }
12
+ /** Angle (degrees, counter-clockwise) and font size (px) that fit `text` on the diagonal. */
13
+ export declare function diagonalText(text: string, widthPx: number, heightPx: number): {
14
+ angle: number;
15
+ fontSize: number;
16
+ };
17
+ /** HTML of the requested marks, to go before the document body; "" when none is requested. */
18
+ export declare function watermarkHtml(options: WatermarkOptions): string;
19
+ /**
20
+ * Print-only placement: fixed over the text area of every page, under the content (the body
21
+ * becomes a stacking layer above it). Hidden on screen. With the field on every page, the title
22
+ * block's own field (Anti-Gravity) is dropped so the first page does not get two.
23
+ */
24
+ export declare const WATERMARK_CSS: string;
@@ -0,0 +1,86 @@
1
+ import { escapeHtml } from "../html.js";
2
+ /**
3
+ * Watermarks in the Anti-Gravity gradient (field-blue → field-cyan → field-violet), PDF only:
4
+ * a text set diagonally across every page, and a soft field of light in the top-right corner of
5
+ * every page. Both sit behind the content. Chrome repeats a `position: fixed` element on every
6
+ * printed page, at the same place in the text area, so pagination is left alone.
7
+ */
8
+ const FIELD = { blue: "#4f7cff", cyan: "#22c3e6", violet: "#8c6cf0" };
9
+ /** Angle (degrees, counter-clockwise) and font size (px) that fit `text` on the diagonal. */
10
+ export function diagonalText(text, widthPx, heightPx) {
11
+ const angle = (Math.atan2(heightPx, widthPx) * 180) / Math.PI;
12
+ const diagonal = Math.hypot(widthPx, heightPx);
13
+ // Manrope 600 capitals average about 0.68 em; the text takes ~70% of the diagonal.
14
+ const chars = Math.max(1, [...text].length);
15
+ const fontSize = Math.min(heightPx * 0.2, (diagonal * 0.7) / (chars * 0.68));
16
+ return { angle, fontSize: Math.round(fontSize) };
17
+ }
18
+ function textMark(text, widthPx, heightPx, dark) {
19
+ const { angle, fontSize } = diagonalText(text, widthPx, heightPx);
20
+ // HTML rather than SVG text: Chrome paints the SVG text of a fixed element on the first page
21
+ // only, while HTML is repeated on every page like the rest of the element.
22
+ return `<div class="mdr-watermark-text" style="opacity: ${dark ? 0.14 : 0.1}"><span style="font-size: ${fontSize}px; transform: rotate(${(-angle).toFixed(2)}deg)">${escapeHtml(text.toUpperCase())}</span></div>`;
23
+ }
24
+ function fieldMark(dark) {
25
+ // The same three lights as the title block's field (theme-antigravity.css), each fading out
26
+ // inside the box so no edge shows.
27
+ return `<div class="mdr-watermark-field" style="opacity: ${dark ? 0.22 : 0.16}"></div>`;
28
+ }
29
+ /** HTML of the requested marks, to go before the document body; "" when none is requested. */
30
+ export function watermarkHtml(options) {
31
+ const text = options.text?.trim();
32
+ if (!text && !options.field)
33
+ return "";
34
+ const parts = [
35
+ options.field ? fieldMark(options.dark) : "",
36
+ text ? textMark(text, options.widthPx, options.heightPx, options.dark) : "",
37
+ ].filter(Boolean);
38
+ return `<div class="mdr-watermark" aria-hidden="true">\n${parts.join("\n")}\n</div>`;
39
+ }
40
+ /**
41
+ * Print-only placement: fixed over the text area of every page, under the content (the body
42
+ * becomes a stacking layer above it). Hidden on screen. With the field on every page, the title
43
+ * block's own field (Anti-Gravity) is dropped so the first page does not get two.
44
+ */
45
+ export const WATERMARK_CSS = `.mdr-watermark { display: none; }
46
+ @media print {
47
+ .mdr-watermark {
48
+ display: block;
49
+ position: fixed;
50
+ inset: 0;
51
+ z-index: 0;
52
+ pointer-events: none;
53
+ }
54
+ .markdown-body { position: relative; z-index: 1; }
55
+ .mdr-watermark-text {
56
+ position: absolute;
57
+ inset: 0;
58
+ display: flex;
59
+ align-items: center;
60
+ justify-content: center;
61
+ }
62
+ .mdr-watermark-text span {
63
+ font-family: var(--font-text);
64
+ font-weight: 600;
65
+ letter-spacing: 0.02em;
66
+ line-height: 1;
67
+ white-space: nowrap;
68
+ color: transparent;
69
+ background: linear-gradient(90deg, ${FIELD.blue}, ${FIELD.cyan}, ${FIELD.violet});
70
+ -webkit-background-clip: text;
71
+ background-clip: text;
72
+ }
73
+ .mdr-watermark-field {
74
+ position: absolute;
75
+ top: 0;
76
+ right: 0;
77
+ width: 40%;
78
+ height: 230px;
79
+ background:
80
+ radial-gradient(28% 38% at 58% 45%, ${FIELD.blue}, transparent),
81
+ radial-gradient(16% 26% at 78% 58%, ${FIELD.cyan}, transparent),
82
+ radial-gradient(25% 30% at 40% 32%, ${FIELD.violet}, transparent);
83
+ }
84
+ .mdr-watermark:has(.mdr-watermark-field) ~ .markdown-body .doc-header::before { display: none; }
85
+ }`;
86
+ //# sourceMappingURL=watermark.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@imontene/mdrender",
3
- "version": "2.4.0",
3
+ "version": "2.6.0",
4
4
  "description": "Command-line app for Windows and Linux that renders Markdown — with LaTeX equations and Mermaid diagrams — to PDF and HTML set in Manrope or Inter",
5
5
  "keywords": [
6
6
  "markdown",