@sorrell/code-hike 1.0.17 → 1.0.19
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/Distribution/CodePresentation/CodePresentation.Internal.Types.d.ts +4 -5
- package/Distribution/CodePresentation/CodePresentation.Internal.Types.d.ts.map +1 -1
- package/Distribution/CodePresentation/CodePresentation.Internal.d.ts +19 -0
- package/Distribution/CodePresentation/CodePresentation.Internal.d.ts.map +1 -1
- package/Distribution/CodePresentation/CodePresentation.Internal.js +48 -4
- package/Distribution/CodePresentation/CodePresentation.Internal.js.map +1 -1
- package/Distribution/CodePresentation/CodePresentation.Types.d.ts +4 -3
- package/Distribution/CodePresentation/CodePresentation.Types.d.ts.map +1 -1
- package/Distribution/CodePresentation/CodePresentation.d.ts.map +1 -1
- package/Distribution/CodePresentation/CodePresentation.js +27 -12
- package/Distribution/CodePresentation/CodePresentation.js.map +1 -1
- package/package.json +1 -1
|
@@ -4,12 +4,12 @@
|
|
|
4
4
|
* @copyright (c) 2026 Gage Sorrell
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
7
|
-
import type {
|
|
8
|
-
import type {
|
|
7
|
+
import type { FHandlers, FSteps, FTokenTransitionsHook, PCodePresentation } from "./CodePresentation.Types.js";
|
|
8
|
+
import type { HighlightedCode } from "codehike/code";
|
|
9
9
|
import type { MarkdownSchema } from "./CodePresentation.Internal.js";
|
|
10
10
|
import type { ReactNode } from "react";
|
|
11
11
|
import type { z } from "zod";
|
|
12
|
-
export type PVideo = Required<Pick<PCodePresentation, "
|
|
12
|
+
export type PVideo = Required<Pick<PCodePresentation, "FrameRate" | "Resolution" | "Hook" | "Handlers" | "style">> & {
|
|
13
13
|
Steps: FSteps;
|
|
14
14
|
};
|
|
15
15
|
export type FMarkdownSteps = z.infer<typeof MarkdownSchema>;
|
|
@@ -18,7 +18,7 @@ export type FStepInternal = FStepsInternal[number];
|
|
|
18
18
|
export type PVideoStep = FVideoStepInherited & {
|
|
19
19
|
Index: number;
|
|
20
20
|
};
|
|
21
|
-
export type FVideoStepInherited = Pick<PVideo, "
|
|
21
|
+
export type FVideoStepInherited = Pick<PVideo, "FrameRate" | "Handlers" | "Hook" | "Resolution" | "Steps" | "style">;
|
|
22
22
|
export type FToVideoStep = (Step: FStepInternal, Index: number) => ReactNode;
|
|
23
23
|
export type PCode = Required<Pick<PCodePresentation, "FrameRate" | "Resolution" | "style">> & {
|
|
24
24
|
OldCode?: HighlightedCode | undefined;
|
|
@@ -26,5 +26,4 @@ export type PCode = Required<Pick<PCodePresentation, "FrameRate" | "Resolution"
|
|
|
26
26
|
Handlers: FHandlers;
|
|
27
27
|
Hook: FTokenTransitionsHook;
|
|
28
28
|
};
|
|
29
|
-
export type FHandlers = ReadonlyArray<AnnotationHandler>;
|
|
30
29
|
//# sourceMappingURL=CodePresentation.Internal.Types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodePresentation.Internal.Types.d.ts","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.Internal.Types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"CodePresentation.Internal.Types.d.ts","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.Internal.Types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EACR,SAAS,EACT,MAAM,EACN,qBAAqB,EACrB,iBAAiB,EACpB,MAAM,6BAA6B,CAAC;AACrC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAE7B,MAAM,MAAM,MAAM,GACd,QAAQ,CAAC,IAAI,CACT,iBAAiB,EACf,WAAW,GACX,YAAY,GACZ,MAAM,GACN,UAAU,GACV,OAAO,CACZ,CAAC,GACF;IACI,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEN,MAAM,MAAM,cAAc,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,cAAc,CAAC,CAAC;AAE5D,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,OAAO,CAAC,CAAC;AACrD,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC;AAEnD,MAAM,MAAM,UAAU,GAClB,mBAAmB,GACnB;IACI,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEN,MAAM,MAAM,mBAAmB,GAC3B,IAAI,CACA,MAAM,EACJ,WAAW,GACX,UAAU,GACV,MAAM,GACN,YAAY,GACZ,OAAO,GACP,OAAO,CACZ,CAAC;AAEN,MAAM,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;AAE7E,MAAM,MAAM,KAAK,GACb,QAAQ,CAAC,IAAI,CACT,iBAAiB,EACf,WAAW,GACX,YAAY,GACZ,OAAO,CACZ,CAAC,GACF;IACI,OAAO,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;IACtC,OAAO,EAAE,eAAe,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,EAAE,qBAAqB,CAAC;CAC/B,CAAC"}
|
|
@@ -5,11 +5,14 @@
|
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
7
7
|
import { type CSSProperties, type ReactNode } from "react";
|
|
8
|
+
import type { FStep } from "./CodePresentation.Types.js";
|
|
8
9
|
import type { PVideo } from "./CodePresentation.Internal.Types.js";
|
|
9
10
|
import { z } from "zod";
|
|
10
11
|
export declare const StepSchema: z.ZodObject<{
|
|
11
12
|
title: z.ZodOptional<z.ZodString>;
|
|
12
13
|
children: z.ZodType<import("react").ReactNode, z.ZodTypeDef, import("react").ReactNode>;
|
|
14
|
+
Delay: z.ZodOptional<z.ZodNumber>;
|
|
15
|
+
Duration: z.ZodOptional<z.ZodNumber>;
|
|
13
16
|
code: z.ZodObject<{
|
|
14
17
|
meta: z.ZodString;
|
|
15
18
|
value: z.ZodString;
|
|
@@ -51,6 +54,8 @@ export declare const StepSchema: z.ZodObject<{
|
|
|
51
54
|
};
|
|
52
55
|
title?: string | undefined;
|
|
53
56
|
children?: ReactNode;
|
|
57
|
+
Delay?: number | undefined;
|
|
58
|
+
Duration?: number | undefined;
|
|
54
59
|
}, {
|
|
55
60
|
code: {
|
|
56
61
|
code: string;
|
|
@@ -64,6 +69,8 @@ export declare const StepSchema: z.ZodObject<{
|
|
|
64
69
|
};
|
|
65
70
|
title?: string | undefined;
|
|
66
71
|
children?: ReactNode;
|
|
72
|
+
Delay?: number | undefined;
|
|
73
|
+
Duration?: number | undefined;
|
|
67
74
|
}>;
|
|
68
75
|
export declare const MarkdownSchema: z.ZodObject<{
|
|
69
76
|
title: z.ZodOptional<z.ZodString>;
|
|
@@ -71,6 +78,8 @@ export declare const MarkdownSchema: z.ZodObject<{
|
|
|
71
78
|
steps: z.ZodArray<z.ZodObject<{
|
|
72
79
|
title: z.ZodOptional<z.ZodString>;
|
|
73
80
|
children: z.ZodType<import("react").ReactNode, z.ZodTypeDef, import("react").ReactNode>;
|
|
81
|
+
Delay: z.ZodOptional<z.ZodNumber>;
|
|
82
|
+
Duration: z.ZodOptional<z.ZodNumber>;
|
|
74
83
|
code: z.ZodObject<{
|
|
75
84
|
meta: z.ZodString;
|
|
76
85
|
value: z.ZodString;
|
|
@@ -112,6 +121,8 @@ export declare const MarkdownSchema: z.ZodObject<{
|
|
|
112
121
|
};
|
|
113
122
|
title?: string | undefined;
|
|
114
123
|
children?: ReactNode;
|
|
124
|
+
Delay?: number | undefined;
|
|
125
|
+
Duration?: number | undefined;
|
|
115
126
|
}, {
|
|
116
127
|
code: {
|
|
117
128
|
code: string;
|
|
@@ -125,6 +136,8 @@ export declare const MarkdownSchema: z.ZodObject<{
|
|
|
125
136
|
};
|
|
126
137
|
title?: string | undefined;
|
|
127
138
|
children?: ReactNode;
|
|
139
|
+
Delay?: number | undefined;
|
|
140
|
+
Duration?: number | undefined;
|
|
128
141
|
}>, "many">;
|
|
129
142
|
}, "strip", z.ZodTypeAny, {
|
|
130
143
|
steps: {
|
|
@@ -140,6 +153,8 @@ export declare const MarkdownSchema: z.ZodObject<{
|
|
|
140
153
|
};
|
|
141
154
|
title?: string | undefined;
|
|
142
155
|
children?: ReactNode;
|
|
156
|
+
Delay?: number | undefined;
|
|
157
|
+
Duration?: number | undefined;
|
|
143
158
|
}[];
|
|
144
159
|
title?: string | undefined;
|
|
145
160
|
children?: ReactNode;
|
|
@@ -157,9 +172,13 @@ export declare const MarkdownSchema: z.ZodObject<{
|
|
|
157
172
|
};
|
|
158
173
|
title?: string | undefined;
|
|
159
174
|
children?: ReactNode;
|
|
175
|
+
Delay?: number | undefined;
|
|
176
|
+
Duration?: number | undefined;
|
|
160
177
|
}[];
|
|
161
178
|
title?: string | undefined;
|
|
162
179
|
children?: ReactNode;
|
|
163
180
|
}>;
|
|
164
181
|
export declare function Video(Props: PVideo): ReactNode;
|
|
182
|
+
export declare function MakeStepSequence(FrameRate: number, Steps: ReadonlyArray<FStep>): (Step: FStep, Index: number) => ReactNode;
|
|
183
|
+
export declare function GetTotalDurationInFrames(FrameRate: number, Steps: ReadonlyArray<FStep>): number;
|
|
165
184
|
//# sourceMappingURL=CodePresentation.Internal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodePresentation.Internal.d.ts","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.Internal.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CodePresentation.Internal.d.ts","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.Internal.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,KAAK,EAAe,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACtE,OAAO,KAAK,EAKR,MAAM,EAET,MAAM,sCAAsC,CAAC;AAE9C,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAIxB,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAIrB,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA+C,CAAC;AAwF3E,wBAAgB,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAY9C;AAiBD,wBAAgB,gBAAgB,CAC5B,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,GAC5B,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAe3C;AAED,wBAAgB,wBAAwB,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,GAAG,MAAM,CAsB/F"}
|
|
@@ -11,7 +11,11 @@ import {} from "react";
|
|
|
11
11
|
import { Pre } from "codehike/code";
|
|
12
12
|
import { z } from "zod";
|
|
13
13
|
/* eslint-disable @typescript-eslint/typedef, @typescript-eslint/no-unused-vars, jsdoc/require-jsdoc */
|
|
14
|
-
export const StepSchema = Block.extend({
|
|
14
|
+
export const StepSchema = Block.extend({
|
|
15
|
+
Delay: z.coerce.number().optional(),
|
|
16
|
+
Duration: z.coerce.number().optional(),
|
|
17
|
+
code: HighlightedCodeBlock
|
|
18
|
+
});
|
|
15
19
|
export const MarkdownSchema = Block.extend({ steps: z.array(StepSchema) });
|
|
16
20
|
/* eslint-enable @typescript-eslint/typedef, @typescript-eslint/no-unused-vars */
|
|
17
21
|
function Code({ FrameRate, Handlers, Hook, OldCode, NewCode, Resolution, style }) {
|
|
@@ -29,10 +33,22 @@ function Code({ FrameRate, Handlers, Hook, OldCode, NewCode, Resolution, style }
|
|
|
29
33
|
return (_jsx(Pre, { code: Code, handlers: [...Handlers], ref: Ref, style: Style }));
|
|
30
34
|
}
|
|
31
35
|
function VideoStep(Props) {
|
|
32
|
-
const {
|
|
36
|
+
const { FrameRate, Handlers, Hook, Index, Resolution, Steps, style } = Props;
|
|
33
37
|
const Step = Steps[Index];
|
|
34
|
-
|
|
35
|
-
return (
|
|
38
|
+
return (_jsx(Sequence, { durationInFrames: Step.Duration ?? FrameRate, from: GetStartFrame(FrameRate, Steps, Index), layout: "none", name: Step.title, children: _jsx(Code, { NewCode: Step.code, OldCode: Steps[Index - 1]?.code, FrameRate, Handlers, Hook, Resolution, style }) }));
|
|
39
|
+
// return (
|
|
40
|
+
// <Sequence
|
|
41
|
+
// durationInFrames={ DurationInFrames }
|
|
42
|
+
// from={ DurationInFrames * Index }
|
|
43
|
+
// layout="none"
|
|
44
|
+
// name={ Step.title }>
|
|
45
|
+
// <Code
|
|
46
|
+
// NewCode={ Step.code }
|
|
47
|
+
// OldCode={ Steps[Index - 1]?.code }
|
|
48
|
+
// { ...{ FrameRate, Handlers, Hook, Resolution, style } }
|
|
49
|
+
// />
|
|
50
|
+
// </Sequence>
|
|
51
|
+
// );
|
|
36
52
|
}
|
|
37
53
|
function MakeToVideoStep(InheritedProps) {
|
|
38
54
|
return function ToVideoStep(Step, Index) {
|
|
@@ -46,4 +62,32 @@ export function Video(Props) {
|
|
|
46
62
|
fontSize: 24
|
|
47
63
|
}, children: Props.Steps.map(MakeToVideoStep(Props)) }));
|
|
48
64
|
}
|
|
65
|
+
function GetStartFrame(FrameRate, Steps, Index) {
|
|
66
|
+
let StartFrame = 0;
|
|
67
|
+
for (let ThisIndex = 0; ThisIndex < Index; ThisIndex++) {
|
|
68
|
+
const PreviousStep = Steps[ThisIndex];
|
|
69
|
+
StartFrame += PreviousStep.Duration ?? (FrameRate);
|
|
70
|
+
StartFrame += PreviousStep.Delay ?? (FrameRate * 0.5);
|
|
71
|
+
}
|
|
72
|
+
return StartFrame;
|
|
73
|
+
}
|
|
74
|
+
export function MakeStepSequence(FrameRate, Steps) {
|
|
75
|
+
return function ToStepSequence(Step, StepIndex) {
|
|
76
|
+
return (_jsx(Sequence, { durationInFrames: Step.Duration ?? FrameRate, from: GetStartFrame(FrameRate, Steps, StepIndex), layout: "none", name: Step.title, children: Step.children }, StepIndex));
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
export function GetTotalDurationInFrames(FrameRate, Steps) {
|
|
80
|
+
if (Steps.length === 0) {
|
|
81
|
+
return 1;
|
|
82
|
+
}
|
|
83
|
+
let TotalDurationInFrames = 0;
|
|
84
|
+
for (let Index = 0; Index < Steps.length; Index++) {
|
|
85
|
+
const Step = Steps[Index];
|
|
86
|
+
TotalDurationInFrames += (Step.Duration || 1000) * 0.001 * FrameRate;
|
|
87
|
+
if (Index !== Steps.length - 1) {
|
|
88
|
+
TotalDurationInFrames += (Step.Delay || 200) * 0.001 * FrameRate;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
return TotalDurationInFrames;
|
|
92
|
+
}
|
|
49
93
|
//# sourceMappingURL=CodePresentation.Internal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodePresentation.Internal.js","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.Internal.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AAEH,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAClD,OAAO,EAAE,KAAK,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAC9D,OAAO,EAAsC,MAAM,OAAO,CAAC;AAU3D,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,uGAAuG;AAEvG,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"CodePresentation.Internal.js","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.Internal.tsx"],"names":[],"mappings":"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"}
|
|
@@ -4,9 +4,9 @@
|
|
|
4
4
|
* @copyright (c) 2026 Gage Sorrell
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
7
|
-
import type { BlockAnnotation, HighlightedCode } from "codehike/code";
|
|
7
|
+
import type { AnnotationHandler, BlockAnnotation, HighlightedCode } from "codehike/code";
|
|
8
8
|
import type { CSSProperties, PropsWithChildren } from "react";
|
|
9
|
-
import type {
|
|
9
|
+
import type { FStepInternal } from "./CodePresentation.Internal.Types.js";
|
|
10
10
|
/** The object such that a sequence of these objects define an animation. */
|
|
11
11
|
export type FStep = FStepInternal;
|
|
12
12
|
/** An array whose elements are of type {@link FStep}. */
|
|
@@ -29,7 +29,6 @@ export type FResolution =
|
|
|
29
29
|
*/
|
|
30
30
|
export type PCodePresentation = {
|
|
31
31
|
Content: unknown;
|
|
32
|
-
Duration: number;
|
|
33
32
|
FrameRate?: FFrameRate;
|
|
34
33
|
Handlers?: FHandlers;
|
|
35
34
|
Hook?: FTokenTransitionsHook;
|
|
@@ -52,4 +51,6 @@ export type FTokenTransitionsHook = (OldCode: HighlightedCode | undefined, NewCo
|
|
|
52
51
|
export type PBlock = PropsWithChildren & {
|
|
53
52
|
annotation: BlockAnnotation;
|
|
54
53
|
};
|
|
54
|
+
/** The (optional) {@link AnnotationHandler | AnnotationHandlers} for your animation. */
|
|
55
|
+
export type FHandlers = ReadonlyArray<AnnotationHandler>;
|
|
55
56
|
//# sourceMappingURL=CodePresentation.Types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodePresentation.Types.d.ts","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.Types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"CodePresentation.Types.d.ts","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.Types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACzF,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAI9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAE1E,4EAA4E;AAC5E,MAAM,MAAM,KAAK,GAAG,aAAa,CAAC;AAElC,yDAAyD;AACzD,MAAM,MAAM,MAAM,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC;AAE1C,+CAA+C;AAC/C,MAAM,MAAM,UAAU,GAChB,EAAE,GACF,EAAE,CAAC;AAET,+CAA+C;AAC/C,MAAM,MAAM,WAAW;AACnB,8BAA8B;AAC5B,UAAU;AAEZ,yCAAyC;GACvC,WAAW;AAEb,8BAA8B;GAC5B,WAAW,CAAC;AAElB;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,GACzB;IACI,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,qBAAqB,CAAC;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,WAAW,CAAC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAC;CACzB,CAAC;AAEN;;;;;;GAMG;AACH,MAAM,MAAM,qBAAqB,GAAG,CAChC,OAAO,EAAE,eAAe,GAAG,SAAS,EACpC,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,MAAM,KACf;IACD,IAAI,EAAE,eAAe,CAAC;IACtB,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;CACxC,CAAC;AAEF,kFAAkF;AAClF,MAAM,MAAM,MAAM,GACd,iBAAiB,GACjB;IACI,UAAU,EAAE,eAAe,CAAC;CAC/B,CAAC;AAEN,wFAAwF;AACxF,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodePresentation.d.ts","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;
|
|
1
|
+
{"version":3,"file":"CodePresentation.d.ts","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EAAe,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAMlF,OAAO,EAAE,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAM7D;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CA8FpE"}
|
|
@@ -1,8 +1,14 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
/**
|
|
3
|
+
* @file CodePresentation.tsx
|
|
4
|
+
* @author Gage Sorrell <gage@sorrell.sh>
|
|
5
|
+
* @copyright (c) 2026 Gage Sorrell
|
|
6
|
+
* @license MIT
|
|
7
|
+
*/
|
|
5
8
|
import { Composition } from "remotion";
|
|
9
|
+
import { GetTotalDurationInFrames, MarkdownSchema, Video } from "./CodePresentation.Internal.js";
|
|
10
|
+
import { useCallback, useMemo } from "react";
|
|
11
|
+
import { TokenTransitions, UseTokenTransitions } from "./TokenTransitions.js";
|
|
6
12
|
import { parseRoot } from "codehike/blocks";
|
|
7
13
|
/**
|
|
8
14
|
* An animation, made up of {@link FStep | steps}, to explain code.
|
|
@@ -16,7 +22,7 @@ import { parseRoot } from "codehike/blocks";
|
|
|
16
22
|
* important props, suitable for code animations.
|
|
17
23
|
*/
|
|
18
24
|
export function CodePresentation(Props) {
|
|
19
|
-
const { Content,
|
|
25
|
+
const { Content, FrameRate = 90, Handlers: InHandlers, Hook = UseTokenTransitions, Name, Resolution = "1920x1280", style = {} } = Props;
|
|
20
26
|
const Handlers = (() => {
|
|
21
27
|
if (InHandlers === undefined) {
|
|
22
28
|
return [TokenTransitions];
|
|
@@ -31,13 +37,14 @@ export function CodePresentation(Props) {
|
|
|
31
37
|
const { steps: Steps } = useMemo(
|
|
32
38
|
// @ts-expect-error parseRoot disagrees with the `zod` schema.
|
|
33
39
|
() => parseRoot(Content, MarkdownSchema), [Content]);
|
|
34
|
-
const Resolutions = {
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
40
|
+
const Resolutions = useMemo(() => {
|
|
41
|
+
return {
|
|
42
|
+
"1296x864": [1296, 864],
|
|
43
|
+
"1920x1280": [1920, 1080],
|
|
44
|
+
"2400x1600": [2400, 1600]
|
|
45
|
+
};
|
|
46
|
+
}, []);
|
|
39
47
|
const VideoProps = {
|
|
40
|
-
Duration,
|
|
41
48
|
FrameRate,
|
|
42
49
|
Handlers,
|
|
43
50
|
Hook,
|
|
@@ -45,7 +52,15 @@ export function CodePresentation(Props) {
|
|
|
45
52
|
Steps,
|
|
46
53
|
style
|
|
47
54
|
};
|
|
48
|
-
|
|
49
|
-
|
|
55
|
+
/* eslint-disable-next-line @typescript-eslint/typedef */
|
|
56
|
+
const Metadata = useCallback(({ props: { Steps } }) => {
|
|
57
|
+
return {
|
|
58
|
+
durationInFrames: GetTotalDurationInFrames(FrameRate, Steps),
|
|
59
|
+
fps: FrameRate,
|
|
60
|
+
height: Resolutions[Resolution][1],
|
|
61
|
+
width: Resolutions[Resolution][0]
|
|
62
|
+
};
|
|
63
|
+
}, [FrameRate, Resolution, Resolutions]);
|
|
64
|
+
return (_jsx(Composition, { calculateMetadata: Metadata, component: Video, defaultProps: VideoProps, durationInFrames: 1, fps: FrameRate, height: Resolutions[Resolution][1], id: Name, width: Resolutions[Resolution][0] }));
|
|
50
65
|
}
|
|
51
66
|
//# sourceMappingURL=CodePresentation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodePresentation.js","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"CodePresentation.js","sourceRoot":"","sources":["../../Source/CodePresentation/CodePresentation.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AAEH,OAAO,EAAkC,WAAW,EAAE,MAAM,UAAU,CAAC;AAGvE,OAAO,EACH,wBAAwB,EACxB,cAAc,EACd,KAAK,EACR,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAkB,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAG9E,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C;;;;;;;;;;GAUG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAwB;IAErD,MAAM,EACF,OAAO,EACP,SAAS,GAAG,EAAE,EACd,QAAQ,EAAE,UAAU,EACpB,IAAI,GAAG,mBAAmB,EAC1B,IAAI,EACJ,UAAU,GAAG,WAAW,EACxB,KAAK,GAAG,EAAG,EACd,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAqC,CAAC,GAAqC,EAAE;QAEvF,IAAI,UAAU,KAAK,SAAS,EAC5B,CAAC;YACG,OAAO,CAAE,gBAAgB,CAAW,CAAC;QACzC,CAAC;aACI,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,CAAC,EAC/C,CAAC;YACG,OAAO,CAAE,GAAG,UAAU,EAAE,gBAAgB,CAAW,CAAC;QACxD,CAAC;aAED,CAAC;YACG,OAAO,UAAU,CAAC;QACtB,CAAC;IACL,CAAC,CAAC,EAAE,CAAC;IAEL,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,OAAO;IAC5B,8DAA8D;IAC9D,GAAmB,EAAE,CAAC,SAAS,CAAC,OAAO,EAAE,cAAc,CAAC,EACxD,CAAE,OAAO,CAAE,CACd,CAAC;IAGF,MAAM,WAAW,GAAiB,OAAO,CAAC,GAAiB,EAAE;QAEzD,OAAO;YACH,UAAU,EAAE,CAAE,IAAI,EAAE,GAAG,CAAW;YAClC,WAAW,EAAE,CAAE,IAAI,EAAE,IAAI,CAAW;YACpC,WAAW,EAAE,CAAE,IAAI,EAAE,IAAI,CAAW;SAC9B,CAAC;IACf,CAAC,EAAE,EAAG,CAAC,CAAC;IAER,MAAM,UAAU,GACZ;QACI,SAAS;QACT,QAAQ;QACR,IAAI;QACJ,UAAU;QACV,KAAK;QACL,KAAK;KACR,CAAC;IAmBN,yDAAyD;IACzD,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,EAAqB,EAAuB,EAAE;QAE1F,OAAO;YACH,gBAAgB,EAAE,wBAAwB,CAAC,SAAS,EAAE,KAAK,CAAC;YAC5D,GAAG,EAAE,SAAS;YACd,MAAM,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;YAClC,KAAK,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;SACpC,CAAC;IACN,CAAC,EAAE,CAAE,SAAS,EAAE,UAAU,EAAE,WAAW,CAAE,CAAC,CAAC;IAE3C,OAAO,CACH,KAAC,WAAW,IACR,iBAAiB,EAAG,QAAQ,EAC5B,SAAS,EAAG,KAAK,EACjB,YAAY,EAAG,UAAU,EACzB,gBAAgB,EAAG,CAAC,EACpB,GAAG,EAAG,SAAS,EACf,MAAM,EAAG,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EACnC,EAAE,EAAG,IAAI,EACT,KAAK,EAAG,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,GACpC,CACL,CAAC;AACN,CAAC"}
|