@brianyu28/dialexis 0.5.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/dist/dialexis.mjs +349 -0
- package/dist/index.d.ts +5 -0
- package/dist/objects/CodeBlock.d.ts +115 -0
- package/dist/themes/spark/Spark.d.ts +66 -0
- package/dist/themes/spark/SparkConstants.d.ts +55 -0
- package/dist/themes/spark/SparkLine.d.ts +2 -0
- package/dist/themes/spark/SparkPresentation.d.ts +2 -0
- package/dist/themes/spark/SparkRectangle.d.ts +2 -0
- package/dist/themes/spark/SparkText.d.ts +4 -0
- package/dist/types/CodeBlockContent.d.ts +12 -0
- package/dist/types/CodeBlockTheme.d.ts +8 -0
- package/dist/types/CodeFragment.d.ts +9 -0
- package/dist/utils/getCodeBlockTextUnits.d.ts +4 -0
- package/package.json +55 -0
|
@@ -0,0 +1,349 @@
|
|
|
1
|
+
import { FontWeight as L, Color as t, Text as h, getTextContentLength as Co, Rectangle as k, Group as z, Mask as No, Line as To, Presentation as xo } from "presenter";
|
|
2
|
+
const Ao = "#0a0a0a", ko = { "": { color: "#e6edf3", bold: !1 }, Error: { color: "#f85149", bold: !1 }, Keyword: { color: "#ff7b72", bold: !1 }, "Keyword.Constant": { color: "#79c0ff", bold: !1 }, "Keyword.Pseudo": { color: "#79c0ff", bold: !1 }, Name: { color: "#e6edf3", bold: !1 }, "Name.Class": { color: "#f0883e", bold: !0 }, "Name.Constant": { color: "#79c0ff", bold: !0 }, "Name.Decorator": { color: "#d2a8ff", bold: !0 }, "Name.Entity": { color: "#ffa657", bold: !1 }, "Name.Exception": { color: "#f0883e", bold: !0 }, "Name.Function": { color: "#d2a8ff", bold: !0 }, "Name.Label": { color: "#79c0ff", bold: !0 }, "Name.Namespace": { color: "#ff7b72", bold: !1 }, "Name.Property": { color: "#79c0ff", bold: !1 }, "Name.Tag": { color: "#7ee787", bold: !1 }, "Name.Variable": { color: "#79c0ff", bold: !1 }, Literal: { color: "#a5d6ff", bold: !1 }, "Literal.Date": { color: "#79c0ff", bold: !1 }, "Literal.String": { color: "#a5d6ff", bold: !1 }, "Literal.String.Affix": { color: "#79c0ff", bold: !1 }, "Literal.String.Delimiter": { color: "#79c0ff", bold: !1 }, "Literal.String.Escape": { color: "#79c0ff", bold: !1 }, "Literal.String.Heredoc": { color: "#79c0ff", bold: !1 }, "Literal.String.Regex": { color: "#79c0ff", bold: !1 }, "Literal.Number": { color: "#a5d6ff", bold: !1 }, Comment: { color: "#8b949e", bold: !1 }, "Comment.Preproc": { color: "#8b949e", bold: !0 }, "Comment.Special": { color: "#8b949e", bold: !0 }, Operator: { color: "#ff7b72", bold: !0 }, Generic: { color: "#e6edf3", bold: !1 }, "Generic.Deleted": { color: "#ffa198", bold: !1 }, "Generic.Emph": { color: null, bold: !1 }, "Generic.Error": { color: "#ffa198", bold: !1 }, "Generic.Heading": { color: "#79c0ff", bold: !0 }, "Generic.Inserted": { color: "#56d364", bold: !1 }, "Generic.Output": { color: "#8b949e", bold: !1 }, "Generic.Prompt": { color: "#8b949e", bold: !1 }, "Generic.Strong": { color: null, bold: !0 }, "Generic.EmphStrong": { color: null, bold: !0 }, "Generic.Subheading": { color: "#79c0ff", bold: !1 }, "Generic.Traceback": { color: "#ff7b72", bold: !1 }, "Generic.Underline": { color: null, bold: !1 }, "Text.Whitespace": { color: "#6e7681", bold: !1 } }, Po = {
|
|
3
|
+
backgroundColor: Ao,
|
|
4
|
+
"//comment": "Pygments GitHub Dark theme with a darker background color.",
|
|
5
|
+
styles: ko
|
|
6
|
+
};
|
|
7
|
+
function K(o, e, r = !1) {
|
|
8
|
+
if (typeof o == "string") {
|
|
9
|
+
const c = P(e, "");
|
|
10
|
+
return o.split(`
|
|
11
|
+
`).map((a) => [{ text: a, color: c, fontWeight: L.NORMAL }]);
|
|
12
|
+
}
|
|
13
|
+
return o.map(
|
|
14
|
+
(c) => c.map((a) => ({
|
|
15
|
+
text: a.content,
|
|
16
|
+
color: P(e, a.type),
|
|
17
|
+
fontWeight: r && j(e, a.type) ? L.BOLD : L.NORMAL
|
|
18
|
+
}))
|
|
19
|
+
);
|
|
20
|
+
}
|
|
21
|
+
function P(o, e) {
|
|
22
|
+
const r = o.styles[e];
|
|
23
|
+
if (r !== void 0 && r.color !== null)
|
|
24
|
+
return t(r.color);
|
|
25
|
+
if (e === "")
|
|
26
|
+
throw new Error(`Theme did not define a style for token type: ${e}`);
|
|
27
|
+
const c = e.split(".").slice(0, -1).join(".");
|
|
28
|
+
return P(o, c);
|
|
29
|
+
}
|
|
30
|
+
function j(o, e) {
|
|
31
|
+
const r = o.styles[e];
|
|
32
|
+
if (r !== void 0)
|
|
33
|
+
return r.bold;
|
|
34
|
+
if (e === "")
|
|
35
|
+
throw new Error(`Theme did not define a style for token type: ${e}`);
|
|
36
|
+
const c = e.split(".").slice(0, -1).join(".");
|
|
37
|
+
return j(o, c);
|
|
38
|
+
}
|
|
39
|
+
const Go = "'Noto Sans Mono', monospace", A = 2, Oo = 0.29, yo = 0.6, Do = 1.07;
|
|
40
|
+
function Wo(o, e) {
|
|
41
|
+
const {
|
|
42
|
+
areLineNumbersVisible: r = !1,
|
|
43
|
+
backgroundColor: c = null,
|
|
44
|
+
backgroundRounding: a = 10,
|
|
45
|
+
characterDescentHeight: O = Oo,
|
|
46
|
+
characterWidth: d = yo,
|
|
47
|
+
colCount: q = null,
|
|
48
|
+
firstLineNumber: y = 1,
|
|
49
|
+
focusColor: J = t(21, 52, 104),
|
|
50
|
+
focusLineStart: Q = 1,
|
|
51
|
+
focusLineEnd: Z = 1,
|
|
52
|
+
focusColStart: oo = 1,
|
|
53
|
+
focusColEnd: eo = 1,
|
|
54
|
+
focusPaddingX: D = 0,
|
|
55
|
+
focusPaddingY: M = 0,
|
|
56
|
+
focusOffsetX: F = 0,
|
|
57
|
+
focusOffsetY: U = 0,
|
|
58
|
+
focusRounding: to = 0,
|
|
59
|
+
fontFamily: S = Go,
|
|
60
|
+
fragments: no = [],
|
|
61
|
+
groupProps: ro = {},
|
|
62
|
+
isBackgroundVisible: lo = !0,
|
|
63
|
+
isFocusVisible: co = !1,
|
|
64
|
+
lineNumberColor: io = t.WHITE,
|
|
65
|
+
padding: f = 10,
|
|
66
|
+
scrollCol: ao = 1,
|
|
67
|
+
scrollLine: so = 1,
|
|
68
|
+
lineCount: fo = null,
|
|
69
|
+
lineHeight: u = Do,
|
|
70
|
+
textProps: m = {},
|
|
71
|
+
theme: C = Po
|
|
72
|
+
} = e, n = m.fontSize ?? 100, s = m.lineSpacing ?? 1.15, b = K(o, C), uo = String(y + b.length - 1), g = r ? uo.length + A : 0, bo = Math.max(
|
|
73
|
+
...b.map((l) => l.reduce((i, E) => i + E.text.length, 0))
|
|
74
|
+
), N = ((q ?? bo) + g) * d * n, T = V({
|
|
75
|
+
descenderHeight: O,
|
|
76
|
+
fontSize: n,
|
|
77
|
+
lineCount: fo ?? b.length,
|
|
78
|
+
lineHeight: u,
|
|
79
|
+
lineSpacing: s
|
|
80
|
+
});
|
|
81
|
+
let x = null;
|
|
82
|
+
r && (x = h(
|
|
83
|
+
b.map((l, i) => [
|
|
84
|
+
{
|
|
85
|
+
text: String(y + i).padStart(
|
|
86
|
+
g - A,
|
|
87
|
+
" "
|
|
88
|
+
) + " ".repeat(A),
|
|
89
|
+
color: io
|
|
90
|
+
}
|
|
91
|
+
]),
|
|
92
|
+
{
|
|
93
|
+
fontFamily: S,
|
|
94
|
+
fontSize: n,
|
|
95
|
+
lineSpacing: s,
|
|
96
|
+
...m,
|
|
97
|
+
length: null,
|
|
98
|
+
x: 0,
|
|
99
|
+
y: 0
|
|
100
|
+
}
|
|
101
|
+
));
|
|
102
|
+
const go = Co(b), w = h(b, {
|
|
103
|
+
fontFamily: S,
|
|
104
|
+
fontSize: n,
|
|
105
|
+
lineSpacing: s,
|
|
106
|
+
...m,
|
|
107
|
+
x: g * d * n,
|
|
108
|
+
y: 0
|
|
109
|
+
}), H = no.map((l) => {
|
|
110
|
+
const i = K(l.code, C);
|
|
111
|
+
return h(i, {
|
|
112
|
+
fontFamily: S,
|
|
113
|
+
fontSize: n,
|
|
114
|
+
lineSpacing: s,
|
|
115
|
+
...l.textProps,
|
|
116
|
+
x: (g + l.startCol - 1) * d * n,
|
|
117
|
+
y: (l.startLine - 1) * u * s * n
|
|
118
|
+
});
|
|
119
|
+
});
|
|
120
|
+
function ho(l, i) {
|
|
121
|
+
return {
|
|
122
|
+
x: (g + i - 1) * d * n,
|
|
123
|
+
y: (l - 1) * u * s * n
|
|
124
|
+
};
|
|
125
|
+
}
|
|
126
|
+
const Lo = k({
|
|
127
|
+
width: N + f * 2,
|
|
128
|
+
height: T + f * 2,
|
|
129
|
+
fill: c ?? t(C.backgroundColor),
|
|
130
|
+
rounding: a,
|
|
131
|
+
opacity: lo ? 1 : 0
|
|
132
|
+
});
|
|
133
|
+
function I(l, i, E, mo, Eo) {
|
|
134
|
+
const {
|
|
135
|
+
focusPaddingX: W = D,
|
|
136
|
+
focusPaddingY: X = M,
|
|
137
|
+
focusOffsetX: Ro = F,
|
|
138
|
+
focusOffsetY: So = U
|
|
139
|
+
} = Eo ?? {};
|
|
140
|
+
return {
|
|
141
|
+
x: (g + E - 1) * d * n - W + Ro,
|
|
142
|
+
y: (l - 1) * u * s * n - X + So,
|
|
143
|
+
width: (mo - E + 1) * d * n + W * 2,
|
|
144
|
+
height: V({
|
|
145
|
+
descenderHeight: O,
|
|
146
|
+
fontSize: n,
|
|
147
|
+
lineCount: i - l + 1,
|
|
148
|
+
lineHeight: u,
|
|
149
|
+
lineSpacing: s
|
|
150
|
+
}) + X * 2
|
|
151
|
+
};
|
|
152
|
+
}
|
|
153
|
+
const Y = k({
|
|
154
|
+
...I(Q, Z, oo, eo, {
|
|
155
|
+
focusOffsetX: F,
|
|
156
|
+
focusOffsetY: U,
|
|
157
|
+
focusPaddingX: D,
|
|
158
|
+
focusPaddingY: M
|
|
159
|
+
}),
|
|
160
|
+
fill: J,
|
|
161
|
+
rounding: to,
|
|
162
|
+
opacity: co ? 1 : 0
|
|
163
|
+
});
|
|
164
|
+
function _(l, i = 1) {
|
|
165
|
+
return {
|
|
166
|
+
x: f - (i - 1) * d * n,
|
|
167
|
+
y: f - (l - 1) * u * s * n
|
|
168
|
+
};
|
|
169
|
+
}
|
|
170
|
+
const B = z(
|
|
171
|
+
[...x !== null ? [x] : [], Y, w, ...H],
|
|
172
|
+
{
|
|
173
|
+
..._(so, ao)
|
|
174
|
+
}
|
|
175
|
+
), po = No([B], {
|
|
176
|
+
width: N + f * 2,
|
|
177
|
+
height: T + f * 2
|
|
178
|
+
});
|
|
179
|
+
return {
|
|
180
|
+
block: z([Lo, po], {
|
|
181
|
+
height: T + f * 2,
|
|
182
|
+
width: N + f * 2,
|
|
183
|
+
...ro
|
|
184
|
+
}),
|
|
185
|
+
content: B,
|
|
186
|
+
focus: Y,
|
|
187
|
+
fragments: H,
|
|
188
|
+
getContentPosition: _,
|
|
189
|
+
getFocusPosition: I,
|
|
190
|
+
getFragmentPosition: ho,
|
|
191
|
+
length: go,
|
|
192
|
+
text: w
|
|
193
|
+
};
|
|
194
|
+
}
|
|
195
|
+
function V({
|
|
196
|
+
descenderHeight: o = 0,
|
|
197
|
+
fontSize: e,
|
|
198
|
+
lineCount: r,
|
|
199
|
+
lineHeight: c,
|
|
200
|
+
lineSpacing: a
|
|
201
|
+
}) {
|
|
202
|
+
return e * // Each line takes up its height
|
|
203
|
+
(r * c + // Each line other than the last line takes up extra space for line spacing
|
|
204
|
+
Math.max(r - 1, 0) * c * (a - 1) + // Add space for descenders
|
|
205
|
+
o);
|
|
206
|
+
}
|
|
207
|
+
const p = {
|
|
208
|
+
BACKGROUND: t(28, 28, 28),
|
|
209
|
+
PRIMARY: t(255, 255, 255),
|
|
210
|
+
TEXT: t(255, 255, 255),
|
|
211
|
+
BLACK: t(0, 0, 0),
|
|
212
|
+
WHITE: t(255, 255, 255),
|
|
213
|
+
GRAY1: t(106, 106, 106),
|
|
214
|
+
// Medium gray
|
|
215
|
+
GRAY2: t(65, 65, 65),
|
|
216
|
+
// Dark gray
|
|
217
|
+
GRAY3: t(224, 224, 224),
|
|
218
|
+
// Light gray
|
|
219
|
+
BLUE1: t(125, 157, 224),
|
|
220
|
+
// Light blue
|
|
221
|
+
BLUE2: t(51, 56, 215),
|
|
222
|
+
// Dark blue
|
|
223
|
+
GREEN1: t(102, 208, 89),
|
|
224
|
+
// Light green
|
|
225
|
+
GREEN2: t(73, 143, 64),
|
|
226
|
+
// Dark green
|
|
227
|
+
PURPLE1: t(136, 83, 173),
|
|
228
|
+
// Medium purple
|
|
229
|
+
PURPLE2: t(178, 126, 215),
|
|
230
|
+
// Light purple
|
|
231
|
+
RED1: t(225, 103, 103),
|
|
232
|
+
// Light red
|
|
233
|
+
RED2: t(182, 75, 75),
|
|
234
|
+
// Dark red
|
|
235
|
+
YELLOW1: t(240, 243, 90),
|
|
236
|
+
// Medium yellow
|
|
237
|
+
YELLOW2: t(231, 249, 147)
|
|
238
|
+
// Lighter yellow
|
|
239
|
+
}, v = {
|
|
240
|
+
PRIMARY: "'Open Sans', sans-serif",
|
|
241
|
+
CODE: "'Noto Sans Mono', monospace"
|
|
242
|
+
}, R = {
|
|
243
|
+
SMALL: 80,
|
|
244
|
+
NORMAL: 110,
|
|
245
|
+
MEDIUM: 160,
|
|
246
|
+
LARGE: 200,
|
|
247
|
+
XLARGE: 230
|
|
248
|
+
}, $ = {
|
|
249
|
+
SMALL: 10,
|
|
250
|
+
NORMAL: 20,
|
|
251
|
+
LARGE: 30
|
|
252
|
+
}, Mo = {
|
|
253
|
+
PRIMARY: {
|
|
254
|
+
width: 3840,
|
|
255
|
+
height: 2160
|
|
256
|
+
},
|
|
257
|
+
RESOLUTION_4K: {
|
|
258
|
+
width: 3840,
|
|
259
|
+
height: 2160
|
|
260
|
+
},
|
|
261
|
+
RESOLUTION_5K: {
|
|
262
|
+
width: 5120,
|
|
263
|
+
height: 2880
|
|
264
|
+
},
|
|
265
|
+
RESOLUTION_8K: {
|
|
266
|
+
width: 7680,
|
|
267
|
+
height: 4320
|
|
268
|
+
}
|
|
269
|
+
};
|
|
270
|
+
function Fo(o = null) {
|
|
271
|
+
return To({
|
|
272
|
+
color: p.PRIMARY,
|
|
273
|
+
isRounded: !0,
|
|
274
|
+
width: 20,
|
|
275
|
+
...o
|
|
276
|
+
});
|
|
277
|
+
}
|
|
278
|
+
function Uo(o = null) {
|
|
279
|
+
return xo({
|
|
280
|
+
backgroundColor: p.BACKGROUND,
|
|
281
|
+
...o
|
|
282
|
+
});
|
|
283
|
+
}
|
|
284
|
+
function wo(o = null) {
|
|
285
|
+
return k({
|
|
286
|
+
fill: p.BLUE1,
|
|
287
|
+
rounding: $.NORMAL,
|
|
288
|
+
height: 500,
|
|
289
|
+
width: 500,
|
|
290
|
+
...o
|
|
291
|
+
});
|
|
292
|
+
}
|
|
293
|
+
const G = {
|
|
294
|
+
color: p.TEXT,
|
|
295
|
+
fontFamily: v.PRIMARY,
|
|
296
|
+
fontSize: R.NORMAL
|
|
297
|
+
};
|
|
298
|
+
function Ho(o, e = null) {
|
|
299
|
+
return h(o, {
|
|
300
|
+
...G,
|
|
301
|
+
...e
|
|
302
|
+
});
|
|
303
|
+
}
|
|
304
|
+
function Io(o, e = null) {
|
|
305
|
+
return h(o, {
|
|
306
|
+
...G,
|
|
307
|
+
fontSize: R.XLARGE,
|
|
308
|
+
fontWeight: L.BOLD,
|
|
309
|
+
...e
|
|
310
|
+
});
|
|
311
|
+
}
|
|
312
|
+
function Yo(o, e = null) {
|
|
313
|
+
return h(o, {
|
|
314
|
+
...G,
|
|
315
|
+
fontSize: R.LARGE,
|
|
316
|
+
fontWeight: L.BOLD,
|
|
317
|
+
...e
|
|
318
|
+
});
|
|
319
|
+
}
|
|
320
|
+
const Xo = {
|
|
321
|
+
// Constants
|
|
322
|
+
Color: p,
|
|
323
|
+
Font: v,
|
|
324
|
+
FontSize: R,
|
|
325
|
+
Rounding: $,
|
|
326
|
+
Size: Mo,
|
|
327
|
+
// Components
|
|
328
|
+
Line: Fo,
|
|
329
|
+
MainTitleText: Io,
|
|
330
|
+
Rectangle: wo,
|
|
331
|
+
Text: Ho,
|
|
332
|
+
TitleText: Yo,
|
|
333
|
+
// Presentation
|
|
334
|
+
Presentation: Uo
|
|
335
|
+
};
|
|
336
|
+
function zo(o, e = {}) {
|
|
337
|
+
return {
|
|
338
|
+
code: o,
|
|
339
|
+
startLine: 1,
|
|
340
|
+
startCol: 1,
|
|
341
|
+
textProps: {},
|
|
342
|
+
...e
|
|
343
|
+
};
|
|
344
|
+
}
|
|
345
|
+
export {
|
|
346
|
+
Wo as CodeBlock,
|
|
347
|
+
zo as CodeFragment,
|
|
348
|
+
Xo as Spark
|
|
349
|
+
};
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export { CodeBlock } from "./objects/CodeBlock";
|
|
2
|
+
export { Spark } from "./themes/spark/Spark";
|
|
3
|
+
export { type CodeBlockContent } from "./types/CodeBlockContent";
|
|
4
|
+
export { type CodeBlockTheme } from "./types/CodeBlockTheme";
|
|
5
|
+
export { CodeFragment } from "./types/CodeFragment";
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
import { Color, Group, Rectangle, Text } from "presenter";
|
|
2
|
+
import { CodeBlockContent } from "../types/CodeBlockContent";
|
|
3
|
+
import { CodeBlockTheme } from "../types/CodeBlockTheme";
|
|
4
|
+
import { CodeFragment } from "../types/CodeFragment";
|
|
5
|
+
/** Optional additional adjustments to refine location of focus. */
|
|
6
|
+
interface FocusAdjustmentProps {
|
|
7
|
+
readonly focusOffsetX?: number;
|
|
8
|
+
readonly focusPaddingX?: number;
|
|
9
|
+
readonly focusOffsetY?: number;
|
|
10
|
+
readonly focusPaddingY?: number;
|
|
11
|
+
}
|
|
12
|
+
interface Return {
|
|
13
|
+
/**
|
|
14
|
+
* Group object containing the code block.
|
|
15
|
+
* This is what should be added to the slide for rendering.
|
|
16
|
+
*/
|
|
17
|
+
readonly block: Group;
|
|
18
|
+
/** Group object containing just code and line numbers, used to animate scrolling. */
|
|
19
|
+
readonly content: Group;
|
|
20
|
+
/** Focus rectangle, used to animate focus rectangle. */
|
|
21
|
+
readonly focus: Rectangle;
|
|
22
|
+
/** Fragment text, equal in length to the number of input fragments. */
|
|
23
|
+
readonly fragments: Text[];
|
|
24
|
+
/** Function to get new position data for content element. */
|
|
25
|
+
readonly getContentPosition: (scrollLine: number, scrollCol?: number) => {
|
|
26
|
+
x: number;
|
|
27
|
+
y: number;
|
|
28
|
+
};
|
|
29
|
+
/** Function to get new position data for focus element. */
|
|
30
|
+
readonly getFocusPosition: (focusLineStart: number, focusLineEnd: number, focusColStart: number, focusColEnd: number, props?: FocusAdjustmentProps) => {
|
|
31
|
+
x: number;
|
|
32
|
+
y: number;
|
|
33
|
+
width: number;
|
|
34
|
+
height: number;
|
|
35
|
+
};
|
|
36
|
+
/** Function to get new position data for fragment element. */
|
|
37
|
+
readonly getFragmentPosition: (line: number, col: number) => {
|
|
38
|
+
x: number;
|
|
39
|
+
y: number;
|
|
40
|
+
};
|
|
41
|
+
/** Text object within the code block, used to animate text write-on. */
|
|
42
|
+
readonly text: Text;
|
|
43
|
+
/** Number of characters in the code block, used to animate text write-on. */
|
|
44
|
+
readonly length: number;
|
|
45
|
+
}
|
|
46
|
+
interface CodeBlockProps {
|
|
47
|
+
readonly areLineNumbersVisible: boolean;
|
|
48
|
+
/**
|
|
49
|
+
* Background color of the code block.
|
|
50
|
+
* If null, uses the background color of the theme.
|
|
51
|
+
*/
|
|
52
|
+
readonly backgroundColor: Color | null;
|
|
53
|
+
readonly backgroundRounding: number;
|
|
54
|
+
/**
|
|
55
|
+
* Maximum descent height of a monospace character per unit of font size.
|
|
56
|
+
* If not provided, value assumes the theme's coding font.
|
|
57
|
+
*/
|
|
58
|
+
readonly characterDescentHeight: number;
|
|
59
|
+
/**
|
|
60
|
+
* Width of a monospace character per unit of font size.
|
|
61
|
+
* If not provided, value assumes the theme's coding font.
|
|
62
|
+
*/
|
|
63
|
+
readonly characterWidth: number;
|
|
64
|
+
/**
|
|
65
|
+
* Number of columns in code block to be visible at once.
|
|
66
|
+
* Defaults to all.
|
|
67
|
+
*/
|
|
68
|
+
readonly colCount: number | null;
|
|
69
|
+
readonly firstLineNumber: number;
|
|
70
|
+
readonly fragments: CodeFragment[];
|
|
71
|
+
/**
|
|
72
|
+
* Focus adds a highlight behind a particular section of the code.
|
|
73
|
+
*/
|
|
74
|
+
readonly isFocusVisible: boolean;
|
|
75
|
+
readonly focusColor: Color;
|
|
76
|
+
readonly focusLineStart: number;
|
|
77
|
+
readonly focusLineEnd: number;
|
|
78
|
+
readonly focusColStart: number;
|
|
79
|
+
readonly focusColEnd: number;
|
|
80
|
+
readonly focusOffsetX: number;
|
|
81
|
+
readonly focusOffsetY: number;
|
|
82
|
+
readonly focusPaddingX: number;
|
|
83
|
+
readonly focusPaddingY: number;
|
|
84
|
+
readonly focusRounding: number;
|
|
85
|
+
readonly fontFamily: string;
|
|
86
|
+
readonly isBackgroundVisible: boolean;
|
|
87
|
+
/**
|
|
88
|
+
* Number of lines in code block to be visible at once.
|
|
89
|
+
* Defaults to all.
|
|
90
|
+
*/
|
|
91
|
+
readonly lineCount: number | null;
|
|
92
|
+
/**
|
|
93
|
+
* Height of a monospace character per unit of font size.
|
|
94
|
+
* If not provided, value assumes the theme's coding font.
|
|
95
|
+
*/
|
|
96
|
+
readonly lineHeight: number;
|
|
97
|
+
readonly lineNumberColor: Color;
|
|
98
|
+
readonly padding: number;
|
|
99
|
+
/**
|
|
100
|
+
* Column index of the first character visible in the code block.
|
|
101
|
+
* 1-indexed.
|
|
102
|
+
*/
|
|
103
|
+
readonly scrollCol: number;
|
|
104
|
+
/**
|
|
105
|
+
* Line index of the first line visible in the code block.
|
|
106
|
+
* 1-indexed.
|
|
107
|
+
*/
|
|
108
|
+
readonly scrollLine: number;
|
|
109
|
+
/** Theme used to style the code block. */
|
|
110
|
+
readonly theme: CodeBlockTheme;
|
|
111
|
+
readonly groupProps: Partial<Group>;
|
|
112
|
+
readonly textProps: Partial<Text>;
|
|
113
|
+
}
|
|
114
|
+
export declare function CodeBlock(code: CodeBlockContent | string, props: Partial<CodeBlockProps>): Return;
|
|
115
|
+
export {};
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import { SparkLine } from "./SparkLine";
|
|
2
|
+
import { SparkPresentation } from "./SparkPresentation";
|
|
3
|
+
import { SparkRectangle } from "./SparkRectangle";
|
|
4
|
+
import { SparkMainTitleText, SparkText, SparkTitleText } from "./SparkText";
|
|
5
|
+
export declare const Spark: {
|
|
6
|
+
readonly Color: {
|
|
7
|
+
readonly BACKGROUND: import("presenter").Color;
|
|
8
|
+
readonly PRIMARY: import("presenter").Color;
|
|
9
|
+
readonly TEXT: import("presenter").Color;
|
|
10
|
+
readonly BLACK: import("presenter").Color;
|
|
11
|
+
readonly WHITE: import("presenter").Color;
|
|
12
|
+
readonly GRAY1: import("presenter").Color;
|
|
13
|
+
readonly GRAY2: import("presenter").Color;
|
|
14
|
+
readonly GRAY3: import("presenter").Color;
|
|
15
|
+
readonly BLUE1: import("presenter").Color;
|
|
16
|
+
readonly BLUE2: import("presenter").Color;
|
|
17
|
+
readonly GREEN1: import("presenter").Color;
|
|
18
|
+
readonly GREEN2: import("presenter").Color;
|
|
19
|
+
readonly PURPLE1: import("presenter").Color;
|
|
20
|
+
readonly PURPLE2: import("presenter").Color;
|
|
21
|
+
readonly RED1: import("presenter").Color;
|
|
22
|
+
readonly RED2: import("presenter").Color;
|
|
23
|
+
readonly YELLOW1: import("presenter").Color;
|
|
24
|
+
readonly YELLOW2: import("presenter").Color;
|
|
25
|
+
};
|
|
26
|
+
readonly Font: {
|
|
27
|
+
readonly PRIMARY: "'Open Sans', sans-serif";
|
|
28
|
+
readonly CODE: "'Noto Sans Mono', monospace";
|
|
29
|
+
};
|
|
30
|
+
readonly FontSize: {
|
|
31
|
+
SMALL: number;
|
|
32
|
+
NORMAL: number;
|
|
33
|
+
MEDIUM: number;
|
|
34
|
+
LARGE: number;
|
|
35
|
+
XLARGE: number;
|
|
36
|
+
};
|
|
37
|
+
readonly Rounding: {
|
|
38
|
+
readonly SMALL: 10;
|
|
39
|
+
readonly NORMAL: 20;
|
|
40
|
+
readonly LARGE: 30;
|
|
41
|
+
};
|
|
42
|
+
readonly Size: {
|
|
43
|
+
readonly PRIMARY: {
|
|
44
|
+
readonly width: 3840;
|
|
45
|
+
readonly height: 2160;
|
|
46
|
+
};
|
|
47
|
+
readonly RESOLUTION_4K: {
|
|
48
|
+
readonly width: 3840;
|
|
49
|
+
readonly height: 2160;
|
|
50
|
+
};
|
|
51
|
+
readonly RESOLUTION_5K: {
|
|
52
|
+
readonly width: 5120;
|
|
53
|
+
readonly height: 2880;
|
|
54
|
+
};
|
|
55
|
+
readonly RESOLUTION_8K: {
|
|
56
|
+
readonly width: 7680;
|
|
57
|
+
readonly height: 4320;
|
|
58
|
+
};
|
|
59
|
+
};
|
|
60
|
+
readonly Line: typeof SparkLine;
|
|
61
|
+
readonly MainTitleText: typeof SparkMainTitleText;
|
|
62
|
+
readonly Rectangle: typeof SparkRectangle;
|
|
63
|
+
readonly Text: typeof SparkText;
|
|
64
|
+
readonly TitleText: typeof SparkTitleText;
|
|
65
|
+
readonly Presentation: typeof SparkPresentation;
|
|
66
|
+
};
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { Color } from "presenter";
|
|
2
|
+
export declare const SparkColor: {
|
|
3
|
+
readonly BACKGROUND: Color;
|
|
4
|
+
readonly PRIMARY: Color;
|
|
5
|
+
readonly TEXT: Color;
|
|
6
|
+
readonly BLACK: Color;
|
|
7
|
+
readonly WHITE: Color;
|
|
8
|
+
readonly GRAY1: Color;
|
|
9
|
+
readonly GRAY2: Color;
|
|
10
|
+
readonly GRAY3: Color;
|
|
11
|
+
readonly BLUE1: Color;
|
|
12
|
+
readonly BLUE2: Color;
|
|
13
|
+
readonly GREEN1: Color;
|
|
14
|
+
readonly GREEN2: Color;
|
|
15
|
+
readonly PURPLE1: Color;
|
|
16
|
+
readonly PURPLE2: Color;
|
|
17
|
+
readonly RED1: Color;
|
|
18
|
+
readonly RED2: Color;
|
|
19
|
+
readonly YELLOW1: Color;
|
|
20
|
+
readonly YELLOW2: Color;
|
|
21
|
+
};
|
|
22
|
+
export declare const SparkFont: {
|
|
23
|
+
readonly PRIMARY: "'Open Sans', sans-serif";
|
|
24
|
+
readonly CODE: "'Noto Sans Mono', monospace";
|
|
25
|
+
};
|
|
26
|
+
export declare const SparkFontSize: {
|
|
27
|
+
SMALL: number;
|
|
28
|
+
NORMAL: number;
|
|
29
|
+
MEDIUM: number;
|
|
30
|
+
LARGE: number;
|
|
31
|
+
XLARGE: number;
|
|
32
|
+
};
|
|
33
|
+
export declare const SparkRounding: {
|
|
34
|
+
readonly SMALL: 10;
|
|
35
|
+
readonly NORMAL: 20;
|
|
36
|
+
readonly LARGE: 30;
|
|
37
|
+
};
|
|
38
|
+
export declare const SparkSize: {
|
|
39
|
+
readonly PRIMARY: {
|
|
40
|
+
readonly width: 3840;
|
|
41
|
+
readonly height: 2160;
|
|
42
|
+
};
|
|
43
|
+
readonly RESOLUTION_4K: {
|
|
44
|
+
readonly width: 3840;
|
|
45
|
+
readonly height: 2160;
|
|
46
|
+
};
|
|
47
|
+
readonly RESOLUTION_5K: {
|
|
48
|
+
readonly width: 5120;
|
|
49
|
+
readonly height: 2880;
|
|
50
|
+
};
|
|
51
|
+
readonly RESOLUTION_8K: {
|
|
52
|
+
readonly width: 7680;
|
|
53
|
+
readonly height: 4320;
|
|
54
|
+
};
|
|
55
|
+
};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { Text as NativeText, TextContent } from "presenter";
|
|
2
|
+
export declare function SparkText(content: TextContent, props?: Partial<NativeText> | null): NativeText;
|
|
3
|
+
export declare function SparkMainTitleText(content: TextContent, props?: Partial<NativeText> | null): NativeText;
|
|
4
|
+
export declare function SparkTitleText(content: TextContent, props?: Partial<NativeText> | null): NativeText;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/** Type of a single unit generated by the syntax_highlight utility script. */
|
|
2
|
+
export interface CodeBlockContentUnit {
|
|
3
|
+
/** The content of the code block. */
|
|
4
|
+
readonly content: string;
|
|
5
|
+
/** Token type of the content. */
|
|
6
|
+
readonly type: string;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* Array of lines of code, where each line contains content units.
|
|
10
|
+
* This matches the type of the output from the syntax_highlight utility script.
|
|
11
|
+
*/
|
|
12
|
+
export type CodeBlockContent = CodeBlockContentUnit[][];
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Text } from "presenter";
|
|
2
|
+
import { CodeBlockContent } from "./CodeBlockContent";
|
|
3
|
+
export interface CodeFragment {
|
|
4
|
+
readonly code: CodeBlockContent | string;
|
|
5
|
+
readonly startLine: number;
|
|
6
|
+
readonly startCol: number;
|
|
7
|
+
readonly textProps: Partial<Text>;
|
|
8
|
+
}
|
|
9
|
+
export declare function CodeFragment(code: CodeBlockContent | string, props?: Partial<Omit<CodeFragment, "code">>): CodeFragment;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { TextUnit } from "presenter";
|
|
2
|
+
import { CodeBlockContent } from "../types/CodeBlockContent";
|
|
3
|
+
import { CodeBlockTheme } from "../types/CodeBlockTheme";
|
|
4
|
+
export declare function getCodeBlockTextUnits(content: CodeBlockContent | string, theme: CodeBlockTheme, allowBoldText?: boolean): TextUnit[][];
|
package/package.json
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@brianyu28/dialexis",
|
|
3
|
+
"version": "0.5.0",
|
|
4
|
+
"description": "Presentation library built with Presenter.js",
|
|
5
|
+
"main": "dist/dialexis.mjs",
|
|
6
|
+
"types": "dist/src/index.d.ts",
|
|
7
|
+
"exports": {
|
|
8
|
+
".": {
|
|
9
|
+
"types": "./dist/src/index.d.ts",
|
|
10
|
+
"import": "./dist/dialexis.mjs"
|
|
11
|
+
}
|
|
12
|
+
},
|
|
13
|
+
"files": [
|
|
14
|
+
"./dist/"
|
|
15
|
+
],
|
|
16
|
+
"scripts": {
|
|
17
|
+
"build": "vite build && tsc --emitDeclarationOnly",
|
|
18
|
+
"watch": "vite build --watch",
|
|
19
|
+
"prettier": "prettier . --write --ignore-unknown",
|
|
20
|
+
"prepare": "husky && npm run build",
|
|
21
|
+
"test": "jest --passWithNoTests"
|
|
22
|
+
},
|
|
23
|
+
"repository": {
|
|
24
|
+
"type": "git",
|
|
25
|
+
"url": "git+https://github.com/brianyu28/dialexis.git"
|
|
26
|
+
},
|
|
27
|
+
"author": "Brian Yu <brian@brianyu.me>",
|
|
28
|
+
"license": "GPL-3.0-or-later",
|
|
29
|
+
"devDependencies": {
|
|
30
|
+
"@eslint/js": "^9.35.0",
|
|
31
|
+
"@types/jest": "^30.0.0",
|
|
32
|
+
"eslint": "^9.35.0",
|
|
33
|
+
"eslint-plugin-simple-import-sort": "^12.1.1",
|
|
34
|
+
"globals": "^16.3.0",
|
|
35
|
+
"husky": "^9.1.7",
|
|
36
|
+
"jest": "^29.7.0",
|
|
37
|
+
"jest-environment-jsdom": "^29.7.0",
|
|
38
|
+
"jiti": "^2.5.1",
|
|
39
|
+
"prettier": "^3.6.2",
|
|
40
|
+
"ts-jest": "^29.4.9",
|
|
41
|
+
"typescript": "^6.0.2",
|
|
42
|
+
"typescript-eslint": "^8.58.0",
|
|
43
|
+
"vite": "^6.1.5"
|
|
44
|
+
},
|
|
45
|
+
"peerDependencies": {
|
|
46
|
+
"presenter": "^0.7.3"
|
|
47
|
+
},
|
|
48
|
+
"lint-staged": {
|
|
49
|
+
"**/*": [
|
|
50
|
+
"prettier --ignore-unknown",
|
|
51
|
+
"eslint",
|
|
52
|
+
"jest --findRelatedTests --passWithNoTests"
|
|
53
|
+
]
|
|
54
|
+
}
|
|
55
|
+
}
|