@sorrell/code-hike 1.0.7 → 1.0.8

package/Distribution/Source/CodePresentation/CodePresentation.Internal.Types.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @file      CodePresentation.Internal.Types.ts
+ * @author    Gage Sorrell <gage@sorrell.sh>
+ * @copyright (c) 2026 Gage Sorrell
+ * @license   MIT
+ */
+import type { AnnotationHandler, HighlightedCode } from "codehike/code";
+import type { FSteps, FTokenTransitionsHook, PCodePresentation } from "./CodePresentation.Types";
+import type { MarkdownSchema } from "./CodePresentation.Internal";
+import type { ReactNode } from "react";
+import type { z } from "zod";
+export type PVideo = Required<Pick<PCodePresentation, "Duration" | "FrameRate" | "Resolution" | "Hook" | "Handlers" | "style">> & {
+    Steps: FSteps;
+};
+export type FMarkdownSteps = z.infer<typeof MarkdownSchema>;
+export type FStepsInternal = FMarkdownSteps["steps"];
+export type FStepInternal = FStepsInternal[number];
+export type PVideoStep = FVideoStepInherited & {
+    Index: number;
+};
+export type FVideoStepInherited = Pick<PVideo, "Duration" | "FrameRate" | "Handlers" | "Hook" | "Resolution" | "Steps" | "style">;
+export type FToVideoStep = (Step: FStepInternal, Index: number) => ReactNode;
+export type PCode = Required<Pick<PCodePresentation, "FrameRate" | "Resolution" | "style">> & {
+    OldCode?: HighlightedCode | undefined;
+    NewCode: HighlightedCode;
+    Handlers: FHandlers;
+    Hook: FTokenTransitionsHook;
+};
+export type FHandlers = ReadonlyArray<AnnotationHandler>;
+//# sourceMappingURL=CodePresentation.Internal.Types.d.ts.map

package/Distribution/Source/CodePresentation/CodePresentation.Internal.Types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodePresentation.Internal.Types.d.ts","sourceRoot":"","sources":["../../../Source/CodePresentation/CodePresentation.Internal.Types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,KAAK,EAAE,MAAM,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AACjG,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAClE,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,UAAU,GACV,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,UAAU,GACV,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;AAEN,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAAC"}

package/Distribution/Source/CodePresentation/CodePresentation.Internal.d.ts

@@ -0,0 +1,165 @@
+/**
+ * @file      CodePresentation.Internal.tsx
+ * @author    Gage Sorrell <gage@sorrell.sh>
+ * @copyright (c) 2026 Gage Sorrell
+ * @license   MIT
+ */
+import { type CSSProperties, type ReactNode } from "react";
+import type { PVideo } from "./CodePresentation.Internal.Types";
+import { z } from "zod";
+export declare const StepSchema: z.ZodObject<{
+    title: z.ZodOptional<z.ZodString>;
+    children: z.ZodType<import("react").ReactNode, z.ZodTypeDef, import("react").ReactNode>;
+    code: z.ZodObject<{
+        meta: z.ZodString;
+        value: z.ZodString;
+        lang: z.ZodString;
+        code: z.ZodString;
+        tokens: z.ZodType<(string | import("codehike/code").Token)[], z.ZodTypeDef, (string | import("codehike/code").Token)[]>;
+        annotations: z.ZodType<import("codehike/code").CodeAnnotation[], z.ZodTypeDef, import("codehike/code").CodeAnnotation[]>;
+        themeName: z.ZodString;
+        style: z.ZodType<import("react").CSSProperties, z.ZodTypeDef, import("react").CSSProperties>;
+    }, "strip", z.ZodTypeAny, {
+        code: string;
+        meta: string;
+        style: import("react").CSSProperties;
+        value: string;
+        lang: string;
+        tokens: (string | import("codehike/code").Token)[];
+        annotations: import("codehike/code").CodeAnnotation[];
+        themeName: string;
+    }, {
+        code: string;
+        meta: string;
+        style: import("react").CSSProperties;
+        value: string;
+        lang: string;
+        tokens: (string | import("codehike/code").Token)[];
+        annotations: import("codehike/code").CodeAnnotation[];
+        themeName: string;
+    }>;
+}, "strip", z.ZodTypeAny, {
+    code: {
+        code: string;
+        meta: string;
+        style: import("react").CSSProperties;
+        value: string;
+        lang: string;
+        tokens: (string | import("codehike/code").Token)[];
+        annotations: import("codehike/code").CodeAnnotation[];
+        themeName: string;
+    };
+    title?: string | undefined;
+    children?: ReactNode;
+}, {
+    code: {
+        code: string;
+        meta: string;
+        style: import("react").CSSProperties;
+        value: string;
+        lang: string;
+        tokens: (string | import("codehike/code").Token)[];
+        annotations: import("codehike/code").CodeAnnotation[];
+        themeName: string;
+    };
+    title?: string | undefined;
+    children?: ReactNode;
+}>;
+export declare const MarkdownSchema: z.ZodObject<{
+    title: z.ZodOptional<z.ZodString>;
+    children: z.ZodType<import("react").ReactNode, z.ZodTypeDef, import("react").ReactNode>;
+    steps: z.ZodArray<z.ZodObject<{
+        title: z.ZodOptional<z.ZodString>;
+        children: z.ZodType<import("react").ReactNode, z.ZodTypeDef, import("react").ReactNode>;
+        code: z.ZodObject<{
+            meta: z.ZodString;
+            value: z.ZodString;
+            lang: z.ZodString;
+            code: z.ZodString;
+            tokens: z.ZodType<(string | import("codehike/code").Token)[], z.ZodTypeDef, (string | import("codehike/code").Token)[]>;
+            annotations: z.ZodType<import("codehike/code").CodeAnnotation[], z.ZodTypeDef, import("codehike/code").CodeAnnotation[]>;
+            themeName: z.ZodString;
+            style: z.ZodType<import("react").CSSProperties, z.ZodTypeDef, import("react").CSSProperties>;
+        }, "strip", z.ZodTypeAny, {
+            code: string;
+            meta: string;
+            style: import("react").CSSProperties;
+            value: string;
+            lang: string;
+            tokens: (string | import("codehike/code").Token)[];
+            annotations: import("codehike/code").CodeAnnotation[];
+            themeName: string;
+        }, {
+            code: string;
+            meta: string;
+            style: import("react").CSSProperties;
+            value: string;
+            lang: string;
+            tokens: (string | import("codehike/code").Token)[];
+            annotations: import("codehike/code").CodeAnnotation[];
+            themeName: string;
+        }>;
+    }, "strip", z.ZodTypeAny, {
+        code: {
+            code: string;
+            meta: string;
+            style: import("react").CSSProperties;
+            value: string;
+            lang: string;
+            tokens: (string | import("codehike/code").Token)[];
+            annotations: import("codehike/code").CodeAnnotation[];
+            themeName: string;
+        };
+        title?: string | undefined;
+        children?: ReactNode;
+    }, {
+        code: {
+            code: string;
+            meta: string;
+            style: import("react").CSSProperties;
+            value: string;
+            lang: string;
+            tokens: (string | import("codehike/code").Token)[];
+            annotations: import("codehike/code").CodeAnnotation[];
+            themeName: string;
+        };
+        title?: string | undefined;
+        children?: ReactNode;
+    }>, "many">;
+}, "strip", z.ZodTypeAny, {
+    steps: {
+        code: {
+            code: string;
+            meta: string;
+            style: import("react").CSSProperties;
+            value: string;
+            lang: string;
+            tokens: (string | import("codehike/code").Token)[];
+            annotations: import("codehike/code").CodeAnnotation[];
+            themeName: string;
+        };
+        title?: string | undefined;
+        children?: ReactNode;
+    }[];
+    title?: string | undefined;
+    children?: ReactNode;
+}, {
+    steps: {
+        code: {
+            code: string;
+            meta: string;
+            style: import("react").CSSProperties;
+            value: string;
+            lang: string;
+            tokens: (string | import("codehike/code").Token)[];
+            annotations: import("codehike/code").CodeAnnotation[];
+            themeName: string;
+        };
+        title?: string | undefined;
+        children?: ReactNode;
+    }[];
+    title?: string | undefined;
+    children?: ReactNode;
+}>;
+export declare function Video(Props: PVideo): ReactNode;
+//# sourceMappingURL=CodePresentation.Internal.d.ts.map

package/Distribution/Source/CodePresentation/CodePresentation.Internal.d.ts.map

@@ -0,0 +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;AAE3D,OAAO,KAAK,EAKR,MAAM,EACM,MAAM,mCAAmC,CAAC;AAE1D,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAIxB,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA+C,CAAC;AACvE,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA+C,CAAC;AA4E3E,wBAAgB,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAY9C"}

package/Distribution/Source/CodePresentation/CodePresentation.Types.d.ts

@@ -0,0 +1,55 @@
+/**
+ * @file      CodePresentation.Types.ts
+ * @author    Gage Sorrell <gage@sorrell.sh>
+ * @copyright (c) 2026 Gage Sorrell
+ * @license   MIT
+ */
+import type { BlockAnnotation, HighlightedCode } from "codehike/code";
+import type { CSSProperties, PropsWithChildren } from "react";
+import type { FHandlers, FStepInternal } from "./CodePresentation.Internal.Types";
+/** The object such that a sequence of these objects define an animation. */
+export type FStep = FStepInternal;
+/** An array whose elements are of type {@link FStep}. */
+export type FSteps = ReadonlyArray<FStep>;
+/** The possible frame rates for animations. */
+export type FFrameRate = 30 | 90;
+/** The possible resolutions for animations. */
+export type FResolution = 
+/** The *small* resolution. */
+"1296x864"
+/** The *medium* (default) resolution. */
+ | "1920x1280"
+/** The *large* resolution. */
+ | "2400x1600";
+/**
+ * The props type of the {@link CodePresentation} component.
+ *
+ * @property {FSteps} Steps - The steps that define a {@link CodePresentation}.
+ * @property {FMarkdownSteps} Content - The default import of the Markdown file that defines the animation.
+ */
+export type PCodePresentation = {
+    Content: unknown;
+    Duration: number;
+    FrameRate?: FFrameRate;
+    Handlers?: FHandlers;
+    Hook?: FTokenTransitionsHook;
+    Name: string;
+    Resolution?: FResolution;
+    style?: CSSProperties;
+};
+/**
+ * The hook that processes token transitions.
+ *
+ * @param OldCode - The content of the previous step.
+ * @param NewCode - The content of the current step.
+ * @param Duration - The duration of the given step.
+ */
+export type FTokenTransitionsHook = (OldCode: HighlightedCode | undefined, NewCode: HighlightedCode, Duration: number) => {
+    Code: HighlightedCode;
+    Ref: React.RefObject<HTMLPreElement>;
+};
+/** The props type for defining {@link AnnotationHandler | AnnotationHandlers}. */
+export type PBlock = PropsWithChildren & {
+    annotation: BlockAnnotation;
+};
+//# sourceMappingURL=CodePresentation.Types.d.ts.map

package/Distribution/Source/CodePresentation/CodePresentation.Types.d.ts.map

@@ -0,0 +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;AACtE,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAKlF,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,QAAQ,EAAE,MAAM,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"}

package/Distribution/Source/CodePresentation/CodePresentation.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @file      CodePresentation.tsx
+ * @author    Gage Sorrell <gage@sorrell.sh>
+ * @copyright (c) 2026 Gage Sorrell
+ * @license   MIT
+ */
+import type { PCodePresentation } from "./CodePresentation.Types";
+import { type ReactNode } from "react";
+/**
+ * An animation, made up of {@link FStep | steps}, to explain code.
+ *
+ * @param Props - The sequence of {@link FStep | steps} that defines an animation.
+ *
+ * @throws {Error} If {@link PCodePresentation!Durations} is an {@link Array} and there is not
+ * precisely one duration assigned to every step, then this will throw.
+ *
+ * @returns {ReactPortal | null} A {@link Composition} with default values for
+ * important props, suitable for code animations.
+ */
+export declare function CodePresentation(Props: PCodePresentation): ReactNode;
+//# sourceMappingURL=CodePresentation.d.ts.map

package/Distribution/Source/CodePresentation/CodePresentation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodePresentation.d.ts","sourceRoot":"","sources":["../../../Source/CodePresentation/CodePresentation.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,KAAK,EAAe,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE/E,OAAO,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAC;AAMhD;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CAkEpE"}

package/Distribution/Source/CodePresentation/TokenTransitions.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @file      TokenTransitions.tsx
+ * @author    Gage Sorrell <gage@sorrell.sh>
+ * @copyright (c) 2026 Gage Sorrell
+ * @license   MIT
+ */
+import { type AnnotationHandler, type HighlightedCode } from "codehike/code";
+import type { FTokenTransitionsHook } from "./CodePresentation.Types";
+export declare function UseTokenTransitions(OldCode: HighlightedCode | undefined, NewCode: HighlightedCode, FrameRate: number): ReturnType<FTokenTransitionsHook>;
+export declare const TokenTransitions: AnnotationHandler;
+//# sourceMappingURL=TokenTransitions.d.ts.map

package/Distribution/Source/CodePresentation/TokenTransitions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TokenTransitions.d.ts","sourceRoot":"","sources":["../../../Source/CodePresentation/TokenTransitions.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,EACH,KAAK,iBAAiB,EACtB,KAAK,eAAe,EAGvB,MAAM,eAAe,CAAC;AAiBvB,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEtE,wBAAgB,mBAAmB,CAC/B,OAAO,EAAE,eAAe,GAAG,SAAS,EACpC,OAAO,EAAE,eAAe,EACxB,SAAS,EAAE,MAAM,GAClB,UAAU,CAAC,qBAAqB,CAAC,CAyCnC;AAED,eAAO,MAAM,gBAAgB,EAAE,iBAe1B,CAAC"}

package/Distribution/Source/CodePresentation/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @file      index.ts
+ * @author    Gage Sorrell <gage@sorrell.sh>
+ * @copyright (c) 2026 Gage Sorrell
+ * @license   MIT
+ */
+export * from "./CodePresentation";
+export * from "./CodePresentation.Types";
+export * from "./TokenTransitions";
+//# sourceMappingURL=index.d.ts.map

package/Distribution/Source/CodePresentation/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../Source/CodePresentation/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC"}

package/Distribution/Source/ReactiveEventIntro/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @file      index.tsx
+ * @author    Gage Sorrell <gage@sorrell.sh>
+ * @copyright (c) 2026 Gage Sorrell
+ * @license   MIT
+ */
+export declare function ReactiveEventIntro(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/Distribution/Source/ReactiveEventIntro/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../Source/ReactiveEventIntro/index.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAsCH,wBAAgB,kBAAkB,4CASjC"}

package/Distribution/Source/index.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @file      index.js
+ * @author    Gage Sorrell <gage@sorrell.sh>
+ * @copyright (c) 2026 Gage Sorrell
+ * @license   MIT
+ */
+import type { FC } from "react";
+/**
+ * This should be called in the Remotion entrypoint, so that Remotion Studio
+ * will open the given {@link CodePresentation} component.
+ *
+ * @param PresentationComponent - The component to open in Remotion Studio.
+ */
+export declare function RunStudio(PresentationComponent: FC): void;
+export * from "./CodePresentation";
+//# sourceMappingURL=index.d.ts.map

package/Distribution/Source/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../Source/index.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC;;;;;GAKG;AACH,wBAAgB,SAAS,CAAC,qBAAqB,EAAE,EAAE,GAAG,IAAI,CAGzD;AAED,cAAc,oBAAoB,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sorrell/code-hike",
   "private": false,
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "A helper library for making animations with Code Hike.",
   "scripts": {
     "build": "tsc -p ./tsconfig.json"