@nxavis/pdf 0.1.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/README.md +180 -0
- package/dist/chunk-Z743L6FY.js +226 -0
- package/dist/chunk-Z743L6FY.js.map +1 -0
- package/dist/index-CvGTF-AE.d.ts +297 -0
- package/dist/index.d.ts +1608 -0
- package/dist/index.js +5014 -0
- package/dist/index.js.map +1 -0
- package/dist/themes/index.d.ts +1 -0
- package/dist/themes/index.js +3 -0
- package/dist/themes/index.js.map +1 -0
- package/package.json +70 -0
|
@@ -0,0 +1,297 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* PDFx Theme System — Type Definitions
|
|
3
|
+
*
|
|
4
|
+
* Defines the complete type hierarchy for the PDFx PDF theme system.
|
|
5
|
+
* All PDF components consume these tokens instead of hardcoding style values.
|
|
6
|
+
*
|
|
7
|
+
* Architecture:
|
|
8
|
+
* - PrimitiveTokens: Raw design scales (typography, spacing, weights, line heights)
|
|
9
|
+
* - ColorTokens: Semantic color mappings (foreground/background pairs)
|
|
10
|
+
* - TypographyTokens: Font family, size, weight, and line height decisions
|
|
11
|
+
* - SpacingTokens: Page margins, section/paragraph/component gaps
|
|
12
|
+
* - PageTokens: Default page size and orientation
|
|
13
|
+
* - PdfxTheme: The complete theme object combining all token layers
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* ```ts
|
|
17
|
+
* import type { PdfxTheme } from '../../types';
|
|
18
|
+
*
|
|
19
|
+
* const myTheme: PdfxTheme = {
|
|
20
|
+
* name: 'custom',
|
|
21
|
+
* primitives: { ... },
|
|
22
|
+
* colors: { foreground: '#1a1a1a', ... },
|
|
23
|
+
* typography: { body: { ... }, heading: { ... } },
|
|
24
|
+
* spacing: { page: { ... }, sectionGap: 24, ... },
|
|
25
|
+
* page: { size: 'A4', orientation: 'portrait' },
|
|
26
|
+
* };
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
/** Typography scale using a Major Third (1.25) ratio with 12pt base */
|
|
30
|
+
interface TypographyScale {
|
|
31
|
+
/** 10pt — Captions, footnotes */
|
|
32
|
+
xs: number;
|
|
33
|
+
/** 12pt — Body text (PDF standard) */
|
|
34
|
+
sm: number;
|
|
35
|
+
/** 15pt — Large body, small headings */
|
|
36
|
+
base: number;
|
|
37
|
+
/** 18pt — H4 equivalent */
|
|
38
|
+
lg: number;
|
|
39
|
+
/** 22pt — H3 equivalent */
|
|
40
|
+
xl: number;
|
|
41
|
+
/** 28pt — H2 equivalent */
|
|
42
|
+
'2xl': number;
|
|
43
|
+
/** 36pt — H1 equivalent */
|
|
44
|
+
'3xl': number;
|
|
45
|
+
}
|
|
46
|
+
/** Spacing scale based on a 4pt grid system */
|
|
47
|
+
interface SpacingScale {
|
|
48
|
+
/** 0pt */
|
|
49
|
+
0: number;
|
|
50
|
+
/** 2pt */
|
|
51
|
+
0.5: number;
|
|
52
|
+
/** 4pt */
|
|
53
|
+
1: number;
|
|
54
|
+
/** 8pt */
|
|
55
|
+
2: number;
|
|
56
|
+
/** 12pt */
|
|
57
|
+
3: number;
|
|
58
|
+
/** 16pt */
|
|
59
|
+
4: number;
|
|
60
|
+
/** 20pt */
|
|
61
|
+
5: number;
|
|
62
|
+
/** 24pt */
|
|
63
|
+
6: number;
|
|
64
|
+
/** 32pt */
|
|
65
|
+
8: number;
|
|
66
|
+
/** 40pt */
|
|
67
|
+
10: number;
|
|
68
|
+
/** 48pt */
|
|
69
|
+
12: number;
|
|
70
|
+
/** 64pt */
|
|
71
|
+
16: number;
|
|
72
|
+
}
|
|
73
|
+
/** Font weight scale */
|
|
74
|
+
interface FontWeights {
|
|
75
|
+
regular: number;
|
|
76
|
+
medium: number;
|
|
77
|
+
semibold: number;
|
|
78
|
+
bold: number;
|
|
79
|
+
}
|
|
80
|
+
/** Line height scale */
|
|
81
|
+
interface LineHeights {
|
|
82
|
+
/** 1.2 — Tight, for headings */
|
|
83
|
+
tight: number;
|
|
84
|
+
/** 1.4 — Normal, for body text */
|
|
85
|
+
normal: number;
|
|
86
|
+
/** 1.6 — Relaxed, for reading-heavy content */
|
|
87
|
+
relaxed: number;
|
|
88
|
+
}
|
|
89
|
+
/** Border radius scale for rounded corners */
|
|
90
|
+
interface BorderRadiusScale {
|
|
91
|
+
/** 0pt — Sharp corners */
|
|
92
|
+
none: number;
|
|
93
|
+
/** 2pt — Subtle rounding */
|
|
94
|
+
sm: number;
|
|
95
|
+
/** 4pt — Standard rounding */
|
|
96
|
+
md: number;
|
|
97
|
+
/** 8pt — Pronounced rounding */
|
|
98
|
+
lg: number;
|
|
99
|
+
/** 9999pt — Pill/circle shape */
|
|
100
|
+
full: number;
|
|
101
|
+
}
|
|
102
|
+
/** Letter spacing scale for typography adjustments */
|
|
103
|
+
interface LetterSpacingScale {
|
|
104
|
+
/** -0.025em — Tighter spacing */
|
|
105
|
+
tight: number;
|
|
106
|
+
/** 0em — Normal spacing */
|
|
107
|
+
normal: number;
|
|
108
|
+
/** 0.025em — Slightly wider spacing */
|
|
109
|
+
wide: number;
|
|
110
|
+
/** 0.05em — Much wider spacing (for uppercase) */
|
|
111
|
+
wider: number;
|
|
112
|
+
}
|
|
113
|
+
/** Raw design scales shared across themes */
|
|
114
|
+
interface PrimitiveTokens {
|
|
115
|
+
typography: TypographyScale;
|
|
116
|
+
spacing: SpacingScale;
|
|
117
|
+
fontWeights: FontWeights;
|
|
118
|
+
lineHeights: LineHeights;
|
|
119
|
+
borderRadius: BorderRadiusScale;
|
|
120
|
+
letterSpacing: LetterSpacingScale;
|
|
121
|
+
}
|
|
122
|
+
/**
|
|
123
|
+
* Semantic color tokens using the foreground/background pair convention.
|
|
124
|
+
* All values must be hex strings (e.g., '#1a1a1a').
|
|
125
|
+
* react-pdf supports hex, rgb(), and hsl() — but NOT oklch.
|
|
126
|
+
*/
|
|
127
|
+
interface ColorTokens {
|
|
128
|
+
/** Primary text and content color */
|
|
129
|
+
foreground: string;
|
|
130
|
+
/** Page background color */
|
|
131
|
+
background: string;
|
|
132
|
+
/** Subtle background for secondary areas (e.g., code blocks, table headers) */
|
|
133
|
+
muted: string;
|
|
134
|
+
/** Text on muted backgrounds (captions, footnotes, timestamps) */
|
|
135
|
+
mutedForeground: string;
|
|
136
|
+
/** Brand/accent color for emphasis and highlights */
|
|
137
|
+
primary: string;
|
|
138
|
+
/** Text on primary-colored backgrounds */
|
|
139
|
+
primaryForeground: string;
|
|
140
|
+
/** Table borders, dividers, rules */
|
|
141
|
+
border: string;
|
|
142
|
+
/** Secondary accent for call-to-action elements, badges */
|
|
143
|
+
accent: string;
|
|
144
|
+
/** Error text, warning indicators */
|
|
145
|
+
destructive: string;
|
|
146
|
+
/** Success states (e.g., badges, confirmations) */
|
|
147
|
+
success: string;
|
|
148
|
+
/** Warning states (e.g., badges, alerts) */
|
|
149
|
+
warning: string;
|
|
150
|
+
/** Info states (e.g., badges, informational alerts) */
|
|
151
|
+
info: string;
|
|
152
|
+
}
|
|
153
|
+
/** Typography semantic tokens — what fonts and sizes to use where */
|
|
154
|
+
interface TypographyTokens {
|
|
155
|
+
/** Body text settings */
|
|
156
|
+
body: {
|
|
157
|
+
/** Font family for body text (e.g., 'Helvetica') */
|
|
158
|
+
fontFamily: string;
|
|
159
|
+
/** Base font size in points */
|
|
160
|
+
fontSize: number;
|
|
161
|
+
/** Line height multiplier */
|
|
162
|
+
lineHeight: number;
|
|
163
|
+
};
|
|
164
|
+
/** Heading text settings */
|
|
165
|
+
heading: {
|
|
166
|
+
/** Font family for headings (e.g., 'Times-Roman', 'Courier') */
|
|
167
|
+
fontFamily: string;
|
|
168
|
+
/** Font weight as numeric value (400-700) */
|
|
169
|
+
fontWeight: number;
|
|
170
|
+
/** Line height multiplier for headings */
|
|
171
|
+
lineHeight: number;
|
|
172
|
+
/** Font sizes for each heading level in points */
|
|
173
|
+
fontSize: {
|
|
174
|
+
h1: number;
|
|
175
|
+
h2: number;
|
|
176
|
+
h3: number;
|
|
177
|
+
h4: number;
|
|
178
|
+
h5: number;
|
|
179
|
+
h6: number;
|
|
180
|
+
};
|
|
181
|
+
};
|
|
182
|
+
}
|
|
183
|
+
/** Spacing semantic tokens — consistent spacing across the document */
|
|
184
|
+
interface SpacingTokens {
|
|
185
|
+
/** Page margin settings in points */
|
|
186
|
+
page: {
|
|
187
|
+
marginTop: number;
|
|
188
|
+
marginRight: number;
|
|
189
|
+
marginBottom: number;
|
|
190
|
+
marginLeft: number;
|
|
191
|
+
};
|
|
192
|
+
/** Space between major document sections (after h2, before new sections) */
|
|
193
|
+
sectionGap: number;
|
|
194
|
+
/** Space between paragraphs and after text blocks */
|
|
195
|
+
paragraphGap: number;
|
|
196
|
+
/** Space between inline components, list items, table rows */
|
|
197
|
+
componentGap: number;
|
|
198
|
+
}
|
|
199
|
+
/** Page layout defaults */
|
|
200
|
+
interface PageTokens {
|
|
201
|
+
/** Default page size */
|
|
202
|
+
size: 'A4' | 'LETTER' | 'LEGAL';
|
|
203
|
+
/** Default page orientation */
|
|
204
|
+
orientation: 'portrait' | 'landscape';
|
|
205
|
+
}
|
|
206
|
+
/**
|
|
207
|
+
* The complete PDFx theme object.
|
|
208
|
+
*
|
|
209
|
+
* Components import this and use its tokens for all style values.
|
|
210
|
+
* Since React Context doesn't work in @react-pdf/renderer,
|
|
211
|
+
* the theme is a plain TypeScript object imported directly by components.
|
|
212
|
+
*
|
|
213
|
+
* @example
|
|
214
|
+
* ```tsx
|
|
215
|
+
* // In a component:
|
|
216
|
+
* import { theme } from '../lib/pdfx-theme';
|
|
217
|
+
*
|
|
218
|
+
* function createStyles(t: PdfxTheme) {
|
|
219
|
+
* return StyleSheet.create({
|
|
220
|
+
* text: {
|
|
221
|
+
* fontFamily: t.typography.body.fontFamily,
|
|
222
|
+
* fontSize: t.typography.body.fontSize,
|
|
223
|
+
* color: t.colors.foreground,
|
|
224
|
+
* },
|
|
225
|
+
* });
|
|
226
|
+
* }
|
|
227
|
+
*
|
|
228
|
+
* const styles = createStyles(theme);
|
|
229
|
+
* ```
|
|
230
|
+
*/
|
|
231
|
+
interface PdfxTheme {
|
|
232
|
+
/** Theme name identifier */
|
|
233
|
+
name: string;
|
|
234
|
+
/** Raw design scales */
|
|
235
|
+
primitives: PrimitiveTokens;
|
|
236
|
+
/** Semantic color mappings */
|
|
237
|
+
colors: ColorTokens;
|
|
238
|
+
/** Typography settings for body and headings */
|
|
239
|
+
typography: TypographyTokens;
|
|
240
|
+
/** Spacing settings for page, sections, and components */
|
|
241
|
+
spacing: SpacingTokens;
|
|
242
|
+
/** Page layout defaults */
|
|
243
|
+
page: PageTokens;
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
/**
|
|
247
|
+
* Default primitive tokens shared by all theme presets.
|
|
248
|
+
*
|
|
249
|
+
* These define the raw design scales — the "palette" of values available.
|
|
250
|
+
* Themes select from these scales when assigning semantic tokens.
|
|
251
|
+
*
|
|
252
|
+
* - Typography: Major Third (1.25) ratio, 12pt base
|
|
253
|
+
* - Spacing: 4pt grid system
|
|
254
|
+
* - Font weights: 400–700
|
|
255
|
+
* - Line heights: 1.2–1.6
|
|
256
|
+
* - Border radius: 0–8pt (plus full for pills)
|
|
257
|
+
* - Letter spacing: -0.025 to 0.05 (em-like ratios for PDF points)
|
|
258
|
+
*/
|
|
259
|
+
declare const defaultPrimitives: PrimitiveTokens;
|
|
260
|
+
|
|
261
|
+
/**
|
|
262
|
+
* Professional theme preset.
|
|
263
|
+
*
|
|
264
|
+
* Character: Serif headings (Times-Roman), refined zinc/slate palette,
|
|
265
|
+
* generous margins, formal document feel. shadcn-inspired minimal aesthetic.
|
|
266
|
+
* Ideal for business documents, reports, and official correspondence.
|
|
267
|
+
*/
|
|
268
|
+
declare const professionalTheme: PdfxTheme;
|
|
269
|
+
|
|
270
|
+
/**
|
|
271
|
+
* Modern theme preset.
|
|
272
|
+
*
|
|
273
|
+
* Character: All-Helvetica, slate-cool neutrals with subtle violet accent,
|
|
274
|
+
* clean spacing. shadcn-inspired contemporary feel.
|
|
275
|
+
* Ideal for startups, tech companies, and design-forward documents.
|
|
276
|
+
*/
|
|
277
|
+
declare const modernTheme: PdfxTheme;
|
|
278
|
+
|
|
279
|
+
/**
|
|
280
|
+
* Minimal theme preset.
|
|
281
|
+
*
|
|
282
|
+
* Character: Courier headings, zinc neutrals, maximum whitespace.
|
|
283
|
+
* shadcn-inspired restrained palette. Ideal for clean documentation,
|
|
284
|
+
* technical specs, and literary manuscripts.
|
|
285
|
+
*/
|
|
286
|
+
declare const minimalTheme: PdfxTheme;
|
|
287
|
+
|
|
288
|
+
/** Map of all built-in theme presets */
|
|
289
|
+
declare const themePresets: {
|
|
290
|
+
readonly professional: PdfxTheme;
|
|
291
|
+
readonly modern: PdfxTheme;
|
|
292
|
+
readonly minimal: PdfxTheme;
|
|
293
|
+
};
|
|
294
|
+
/** Valid theme preset names */
|
|
295
|
+
type ThemePresetName = keyof typeof themePresets;
|
|
296
|
+
|
|
297
|
+
export { type BorderRadiusScale as B, type ColorTokens as C, type FontWeights as F, type LetterSpacingScale as L, type PdfxTheme as P, type SpacingScale as S, type ThemePresetName as T, type LineHeights as a, type PageTokens as b, type PrimitiveTokens as c, type SpacingTokens as d, type TypographyScale as e, type TypographyTokens as f, defaultPrimitives as g, modernTheme as h, minimalTheme as m, professionalTheme as p, themePresets as t };
|