@mihirsarya/manim-scroll-react 0.1.1

package/dist/ManimScroll.d.ts

@@ -0,0 +1,58 @@
+import React from "react";
+import type { ScrollRangeValue } from "@mihirsarya/manim-scroll-runtime";
+/**
+ * Animation props that are passed to the Manim scene.
+ * These are used for auto-resolution when manifestUrl is not provided.
+ */
+export interface ManimAnimationProps {
+    /** Scene name (default: "TextScene") */
+    scene?: string;
+    /** Font size for text animations */
+    fontSize?: number;
+    /** Color for the animation (hex string) */
+    color?: string;
+    /** Font family for text animations */
+    font?: string;
+    /** Additional custom props for the scene */
+    [key: string]: unknown;
+}
+export type ManimScrollProps = ManimAnimationProps & {
+    /** Explicit manifest URL (overrides auto-resolution) */
+    manifestUrl?: string;
+    /** Playback mode */
+    mode?: "auto" | "frames" | "video";
+    /** Scroll range configuration (preset, tuple, or legacy object) */
+    scrollRange?: ScrollRangeValue;
+    /** Called when animation is loaded and ready */
+    onReady?: () => void;
+    /** Called on scroll progress updates */
+    onProgress?: (progress: number) => void;
+    /** Canvas dimensions */
+    canvas?: {
+        width?: number;
+        height?: number;
+    };
+    className?: string;
+    style?: React.CSSProperties;
+    children?: React.ReactNode;
+};
+/**
+ * Scroll-driven Manim animation component.
+ *
+ * Automatically resolves pre-rendered animation assets based on props,
+ * or use an explicit `manifestUrl` for manual control.
+ *
+ * @example
+ * ```tsx
+ * // Auto-resolution (with Next.js plugin)
+ * <ManimScroll scene="TextScene" fontSize={72} color="#ffffff">
+ *   Welcome to my site
+ * </ManimScroll>
+ *
+ * // Manual mode
+ * <ManimScroll manifestUrl="/assets/scene/manifest.json">
+ *   Scroll-driven text
+ * </ManimScroll>
+ * ```
+ */
+export declare function ManimScroll({ className, style, children, canvas, manifestUrl, mode, scrollRange, onReady, onProgress, scene, fontSize, color, font, ...customProps }: ManimScrollProps): JSX.Element;

package/dist/ManimScroll.js

@@ -0,0 +1,74 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useMemo, useEffect } from "react";
+import { useManimScroll } from "./hooks";
+import { extractChildrenText } from "./hash";
+/**
+ * Scroll-driven Manim animation component.
+ *
+ * Automatically resolves pre-rendered animation assets based on props,
+ * or use an explicit `manifestUrl` for manual control.
+ *
+ * @example
+ * ```tsx
+ * // Auto-resolution (with Next.js plugin)
+ * <ManimScroll scene="TextScene" fontSize={72} color="#ffffff">
+ *   Welcome to my site
+ * </ManimScroll>
+ *
+ * // Manual mode
+ * <ManimScroll manifestUrl="/assets/scene/manifest.json">
+ *   Scroll-driven text
+ * </ManimScroll>
+ * ```
+ */
+export function ManimScroll({ className, style, children, canvas, manifestUrl, mode, scrollRange, onReady, onProgress, 
+// Animation props
+scene = "TextScene", fontSize, color, font, ...customProps }) {
+    const containerRef = useRef(null);
+    // Extract text from children
+    const childrenText = useMemo(() => extractChildrenText(children), [children]);
+    // Build animation props for hashing
+    const animationProps = useMemo(() => {
+        const props = { ...customProps };
+        if (childrenText)
+            props.text = childrenText;
+        if (fontSize !== undefined)
+            props.fontSize = fontSize;
+        if (color !== undefined)
+            props.color = color;
+        if (font !== undefined)
+            props.font = font;
+        return props;
+    }, [childrenText, fontSize, color, font, customProps]);
+    // Use the hook for all animation logic
+    const { isReady, error, progress } = useManimScroll({
+        ref: containerRef,
+        manifestUrl,
+        scene,
+        animationProps,
+        mode,
+        scrollRange,
+        canvasDimensions: canvas,
+    });
+    // Forward callbacks
+    useEffect(() => {
+        if (isReady) {
+            onReady === null || onReady === void 0 ? void 0 : onReady();
+        }
+    }, [isReady, onReady]);
+    useEffect(() => {
+        onProgress === null || onProgress === void 0 ? void 0 : onProgress(progress);
+    }, [progress, onProgress]);
+    return (_jsxs("div", { className: className, style: { position: "relative", ...style }, ref: containerRef, children: [_jsx("span", { style: { position: "absolute", opacity: 0 }, children: children }), error && process.env.NODE_ENV === "development" && (_jsx("div", { style: {
+                    position: "absolute",
+                    inset: 0,
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    background: "rgba(0, 0, 0, 0.8)",
+                    color: "#ff6b6b",
+                    padding: "1rem",
+                    fontSize: "0.875rem",
+                    textAlign: "center",
+                }, children: error.message }))] }));
+}

package/dist/hash.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Compute a deterministic hash for animation props.
+ * This hash is used to look up pre-rendered assets at runtime.
+ *
+ * Note: This must produce the same hash as the build-time hasher.
+ * Uses the djb2 algorithm for cross-environment compatibility.
+ */
+export declare function computePropsHash(scene: string, props: Record<string, unknown>): string;
+/**
+ * Extract text content from React children.
+ * Handles strings and arrays of strings.
+ */
+export declare function extractChildrenText(children: React.ReactNode): string | null;

package/dist/hash.js

@@ -0,0 +1,63 @@
+/**
+ * Recursively sort object keys for deterministic JSON stringification.
+ */
+function sortObjectKeys(obj) {
+    if (obj === null || typeof obj !== "object") {
+        return obj;
+    }
+    if (Array.isArray(obj)) {
+        return obj.map(sortObjectKeys);
+    }
+    const sorted = {};
+    const keys = Object.keys(obj).sort();
+    for (const key of keys) {
+        sorted[key] = sortObjectKeys(obj[key]);
+    }
+    return sorted;
+}
+/**
+ * Compute a deterministic hash for animation props.
+ * This hash is used to look up pre-rendered assets at runtime.
+ *
+ * Note: This must produce the same hash as the build-time hasher.
+ * Uses the djb2 algorithm for cross-environment compatibility.
+ */
+export function computePropsHash(scene, props) {
+    // Create a deterministic string representation
+    // Sort keys to ensure consistent ordering
+    const sortedProps = sortObjectKeys(props);
+    const data = JSON.stringify({ scene, props: sortedProps });
+    // Use djb2 hash algorithm - matches the build-time implementation
+    let hash = 5381;
+    for (let i = 0; i < data.length; i++) {
+        hash = ((hash << 5) + hash + data.charCodeAt(i)) | 0;
+    }
+    // Convert to positive hex string, padded to 8 chars
+    const hexHash = (hash >>> 0).toString(16).padStart(8, "0");
+    return hexHash;
+}
+/**
+ * Extract text content from React children.
+ * Handles strings and arrays of strings.
+ */
+export function extractChildrenText(children) {
+    if (typeof children === "string") {
+        return children.trim();
+    }
+    if (typeof children === "number") {
+        return String(children);
+    }
+    if (Array.isArray(children)) {
+        const texts = children
+            .map((child) => {
+            if (typeof child === "string")
+                return child.trim();
+            if (typeof child === "number")
+                return String(child);
+            return "";
+        })
+            .filter(Boolean);
+        return texts.length > 0 ? texts.join(" ") : null;
+    }
+    return null;
+}

package/dist/hash.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/hash.test.js

@@ -0,0 +1,176 @@
+import { describe, it, expect } from "vitest";
+import { computePropsHash, extractChildrenText } from "./hash";
+describe("computePropsHash", () => {
+    it("should produce consistent hashes for same input", () => {
+        const hash1 = computePropsHash("TextScene", { text: "Hello", fontSize: 72 });
+        const hash2 = computePropsHash("TextScene", { text: "Hello", fontSize: 72 });
+        expect(hash1).toBe(hash2);
+    });
+    it("should produce different hashes for different scenes", () => {
+        const hash1 = computePropsHash("TextScene", { text: "Hello" });
+        const hash2 = computePropsHash("CustomScene", { text: "Hello" });
+        expect(hash1).not.toBe(hash2);
+    });
+    it("should produce different hashes for different props", () => {
+        const hash1 = computePropsHash("TextScene", { text: "Hello" });
+        const hash2 = computePropsHash("TextScene", { text: "World" });
+        expect(hash1).not.toBe(hash2);
+    });
+    it("should normalize key order (produce same hash regardless of key order)", () => {
+        const hash1 = computePropsHash("TextScene", { a: 1, b: 2, c: 3 });
+        const hash2 = computePropsHash("TextScene", { c: 3, a: 1, b: 2 });
+        expect(hash1).toBe(hash2);
+    });
+    it("should handle empty props", () => {
+        const hash = computePropsHash("TextScene", {});
+        expect(hash).toHaveLength(8);
+        expect(hash).toMatch(/^[0-9a-f]{8}$/);
+    });
+    it("should handle nested objects", () => {
+        const hash1 = computePropsHash("Scene", { config: { theme: "dark", size: 10 } });
+        const hash2 = computePropsHash("Scene", { config: { size: 10, theme: "dark" } });
+        expect(hash1).toBe(hash2);
+    });
+    it("should handle arrays in props", () => {
+        const hash1 = computePropsHash("Scene", { items: [1, 2, 3] });
+        const hash2 = computePropsHash("Scene", { items: [1, 2, 3] });
+        expect(hash1).toBe(hash2);
+        // Different array order should produce different hash
+        const hash3 = computePropsHash("Scene", { items: [3, 2, 1] });
+        expect(hash1).not.toBe(hash3);
+    });
+    it("should handle null values", () => {
+        const hash = computePropsHash("Scene", { value: null });
+        expect(hash).toHaveLength(8);
+    });
+    it("should handle boolean values", () => {
+        const hash1 = computePropsHash("Scene", { enabled: true });
+        const hash2 = computePropsHash("Scene", { enabled: false });
+        expect(hash1).not.toBe(hash2);
+    });
+    it("should handle string values", () => {
+        const hash1 = computePropsHash("Scene", { color: "#ffffff" });
+        const hash2 = computePropsHash("Scene", { color: "#000000" });
+        expect(hash1).not.toBe(hash2);
+    });
+    it("should handle number values", () => {
+        const hash1 = computePropsHash("Scene", { size: 72 });
+        const hash2 = computePropsHash("Scene", { size: 48 });
+        expect(hash1).not.toBe(hash2);
+    });
+    it("should produce valid hex string", () => {
+        const hash = computePropsHash("TextScene", { text: "Test", fontSize: 72 });
+        expect(hash).toMatch(/^[0-9a-f]{8}$/);
+    });
+    it("should handle unicode characters", () => {
+        const hash1 = computePropsHash("Scene", { text: "Hello 👋 World" });
+        const hash2 = computePropsHash("Scene", { text: "Hello 👋 World" });
+        expect(hash1).toBe(hash2);
+    });
+    it("should handle special characters", () => {
+        const hash = computePropsHash("Scene", { text: "Hello\n\t\"World\"" });
+        expect(hash).toHaveLength(8);
+    });
+});
+describe("extractChildrenText", () => {
+    it("should extract string children", () => {
+        expect(extractChildrenText("Hello World")).toBe("Hello World");
+    });
+    it("should trim string children", () => {
+        expect(extractChildrenText("  Hello World  ")).toBe("Hello World");
+    });
+    it("should convert number children to string", () => {
+        expect(extractChildrenText(42)).toBe("42");
+        expect(extractChildrenText(3.14)).toBe("3.14");
+        expect(extractChildrenText(0)).toBe("0");
+    });
+    it("should extract text from array of strings", () => {
+        expect(extractChildrenText(["Hello", " ", "World"])).toBe("Hello World");
+    });
+    it("should handle array with numbers", () => {
+        expect(extractChildrenText(["Value: ", 42])).toBe("Value: 42");
+    });
+    it("should filter out empty strings from arrays", () => {
+        expect(extractChildrenText(["Hello", "", "World"])).toBe("Hello World");
+    });
+    it("should return null for non-extractable children", () => {
+        expect(extractChildrenText(null)).toBeNull();
+        expect(extractChildrenText(undefined)).toBeNull();
+    });
+    it("should return null for empty array", () => {
+        expect(extractChildrenText([])).toBeNull();
+    });
+    it("should return null for array of empty strings", () => {
+        expect(extractChildrenText(["", "  ", ""])).toBeNull();
+    });
+    it("should handle mixed array with non-string elements", () => {
+        // Objects in array should be treated as empty
+        expect(extractChildrenText(["Hello", {}, "World"])).toBe("Hello World");
+    });
+    it("should handle objects (not extractable)", () => {
+        expect(extractChildrenText({})).toBeNull();
+    });
+    it("should handle boolean children", () => {
+        expect(extractChildrenText(true)).toBeNull();
+        expect(extractChildrenText(false)).toBeNull();
+    });
+});
+describe("sortObjectKeys (via computePropsHash)", () => {
+    // Test the sortObjectKeys function indirectly through computePropsHash
+    it("should handle deeply nested objects", () => {
+        const props1 = {
+            level1: {
+                level2: {
+                    level3: {
+                        b: 2,
+                        a: 1,
+                    },
+                },
+            },
+        };
+        const props2 = {
+            level1: {
+                level2: {
+                    level3: {
+                        a: 1,
+                        b: 2,
+                    },
+                },
+            },
+        };
+        const hash1 = computePropsHash("Scene", props1);
+        const hash2 = computePropsHash("Scene", props2);
+        expect(hash1).toBe(hash2);
+    });
+    it("should handle arrays of objects", () => {
+        const props1 = {
+            items: [
+                { z: 3, y: 2, x: 1 },
+                { c: 3, b: 2, a: 1 },
+            ],
+        };
+        const props2 = {
+            items: [
+                { x: 1, y: 2, z: 3 },
+                { a: 1, b: 2, c: 3 },
+            ],
+        };
+        const hash1 = computePropsHash("Scene", props1);
+        const hash2 = computePropsHash("Scene", props2);
+        expect(hash1).toBe(hash2);
+    });
+    it("should preserve array order", () => {
+        const hash1 = computePropsHash("Scene", { items: ["a", "b", "c"] });
+        const hash2 = computePropsHash("Scene", { items: ["c", "b", "a"] });
+        expect(hash1).not.toBe(hash2);
+    });
+    it("should handle null values in nested objects", () => {
+        const hash = computePropsHash("Scene", {
+            config: {
+                value: null,
+                other: "test",
+            },
+        });
+        expect(hash).toHaveLength(8);
+    });
+});

package/dist/hooks.d.ts

@@ -0,0 +1,82 @@
+import type { ScrollRangeValue } from "@mihirsarya/manim-scroll-runtime";
+interface CacheManifest {
+    version: number;
+    animations: Record<string, string>;
+}
+/**
+ * Load the cache manifest from the public directory.
+ */
+declare function loadCacheManifest(): Promise<CacheManifest | null>;
+/**
+ * Resolve the manifest URL for the given animation props.
+ */
+declare function resolveManifestUrl(scene: string, props: Record<string, unknown>): Promise<string | null>;
+/**
+ * Options for the useManimScroll hook.
+ */
+export interface UseManimScrollOptions {
+    /** Ref to the container element */
+    ref: React.RefObject<HTMLElement | null>;
+    /** Explicit manifest URL (skips auto-resolution) */
+    manifestUrl?: string;
+    /** Scene name for auto-resolution (default: "TextScene") */
+    scene?: string;
+    /** Animation props for auto-resolution (hashed to find cached assets) */
+    animationProps?: Record<string, unknown>;
+    /** Playback mode */
+    mode?: "auto" | "frames" | "video";
+    /** Scroll range configuration */
+    scrollRange?: ScrollRangeValue;
+    /** Canvas dimensions */
+    canvasDimensions?: {
+        width?: number;
+        height?: number;
+    };
+}
+/**
+ * Result returned by the useManimScroll hook.
+ */
+export interface UseManimScrollResult {
+    /** Current scroll progress (0 to 1) */
+    progress: number;
+    /** Whether the animation is loaded and ready */
+    isReady: boolean;
+    /** Error if loading/resolution failed */
+    error: Error | null;
+    /** Ref to attach to an optional canvas element */
+    canvasRef: React.RefObject<HTMLCanvasElement | null>;
+    /** Imperatively seek to a specific progress (0 to 1) */
+    seek: (progress: number) => void;
+    /** Pause scroll-driven updates */
+    pause: () => void;
+    /** Resume scroll-driven updates */
+    resume: () => void;
+    /** Whether scroll updates are paused */
+    isPaused: boolean;
+}
+/**
+ * Hook for advanced scroll-driven Manim animation control.
+ *
+ * Provides fine-grained control over the animation lifecycle, progress tracking,
+ * and imperative methods for seeking and pausing.
+ *
+ * @example
+ * ```tsx
+ * function CustomAnimation() {
+ *   const containerRef = useRef<HTMLDivElement>(null);
+ *   const { progress, isReady, error } = useManimScroll({
+ *     ref: containerRef,
+ *     manifestUrl: "/assets/scene/manifest.json",
+ *   });
+ *
+ *   return (
+ *     <div ref={containerRef}>
+ *       {!isReady && <Spinner />}
+ *       <ProgressBar value={progress} />
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useManimScroll(options: UseManimScrollOptions): UseManimScrollResult;
+export { loadCacheManifest, resolveManifestUrl };

package/dist/hooks.js

@@ -0,0 +1,182 @@
+import { useEffect, useRef, useState, useMemo, useCallback } from "react";
+import { registerScrollAnimation } from "@mihirsarya/manim-scroll-runtime";
+import { computePropsHash } from "./hash";
+// Global cache manifest (loaded once)
+let cacheManifestPromise = null;
+/**
+ * Load the cache manifest from the public directory.
+ */
+async function loadCacheManifest() {
+    if (cacheManifestPromise) {
+        return cacheManifestPromise;
+    }
+    cacheManifestPromise = fetch("/manim-assets/cache-manifest.json")
+        .then((response) => {
+        if (!response.ok) {
+            return null;
+        }
+        return response.json();
+    })
+        .catch(() => null);
+    return cacheManifestPromise;
+}
+/**
+ * Resolve the manifest URL for the given animation props.
+ */
+async function resolveManifestUrl(scene, props) {
+    var _a;
+    const manifest = await loadCacheManifest();
+    if (!manifest) {
+        return null;
+    }
+    const hash = computePropsHash(scene, props);
+    return (_a = manifest.animations[hash]) !== null && _a !== void 0 ? _a : null;
+}
+/**
+ * Hook for advanced scroll-driven Manim animation control.
+ *
+ * Provides fine-grained control over the animation lifecycle, progress tracking,
+ * and imperative methods for seeking and pausing.
+ *
+ * @example
+ * ```tsx
+ * function CustomAnimation() {
+ *   const containerRef = useRef<HTMLDivElement>(null);
+ *   const { progress, isReady, error } = useManimScroll({
+ *     ref: containerRef,
+ *     manifestUrl: "/assets/scene/manifest.json",
+ *   });
+ *
+ *   return (
+ *     <div ref={containerRef}>
+ *       {!isReady && <Spinner />}
+ *       <ProgressBar value={progress} />
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export function useManimScroll(options) {
+    const { ref, manifestUrl: explicitManifestUrl, scene = "TextScene", animationProps = {}, mode, scrollRange, canvasDimensions, } = options;
+    const [progress, setProgress] = useState(0);
+    const [isReady, setIsReady] = useState(false);
+    const [error, setError] = useState(null);
+    const [isPaused, setIsPaused] = useState(false);
+    const [resolvedManifestUrl, setResolvedManifestUrl] = useState(explicitManifestUrl !== null && explicitManifestUrl !== void 0 ? explicitManifestUrl : null);
+    const canvasRef = useRef(null);
+    const cleanupRef = useRef(null);
+    const pausedRef = useRef(isPaused);
+    // Keep pausedRef in sync
+    useEffect(() => {
+        pausedRef.current = isPaused;
+    }, [isPaused]);
+    // Memoize animation props for stable dependency
+    const memoizedAnimationProps = useMemo(() => animationProps, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [JSON.stringify(animationProps)]);
+    // Resolve manifest URL if not explicitly provided
+    useEffect(() => {
+        if (explicitManifestUrl) {
+            setResolvedManifestUrl(explicitManifestUrl);
+            setError(null);
+            return;
+        }
+        resolveManifestUrl(scene, memoizedAnimationProps).then((url) => {
+            if (url) {
+                setResolvedManifestUrl(url);
+                setError(null);
+            }
+            else {
+                setError(new Error(`No pre-rendered animation found for scene "${scene}". ` +
+                    `Make sure to run the build with @mihirsarya/manim-scroll-next.`));
+            }
+        });
+    }, [explicitManifestUrl, scene, memoizedAnimationProps]);
+    // Handle progress updates (respects pause state)
+    const handleProgress = useCallback((p) => {
+        if (!pausedRef.current) {
+            setProgress(p);
+        }
+    }, []);
+    // Handle ready callback
+    const handleReady = useCallback(() => {
+        setIsReady(true);
+    }, []);
+    // Register scroll animation
+    useEffect(() => {
+        var _a;
+        const container = ref.current;
+        if (!container || !resolvedManifestUrl)
+            return;
+        let isMounted = true;
+        // Create or use existing canvas
+        const canvasEl = (_a = canvasRef.current) !== null && _a !== void 0 ? _a : document.createElement("canvas");
+        if (canvasDimensions === null || canvasDimensions === void 0 ? void 0 : canvasDimensions.width)
+            canvasEl.width = canvasDimensions.width;
+        if (canvasDimensions === null || canvasDimensions === void 0 ? void 0 : canvasDimensions.height)
+            canvasEl.height = canvasDimensions.height;
+        // Only append if we created the canvas
+        if (!canvasRef.current) {
+            container.appendChild(canvasEl);
+        }
+        registerScrollAnimation({
+            manifestUrl: resolvedManifestUrl,
+            mode,
+            scrollRange,
+            onReady: handleReady,
+            onProgress: handleProgress,
+            container,
+            canvas: canvasEl,
+        }).then((dispose) => {
+            if (!isMounted) {
+                dispose();
+                return;
+            }
+            cleanupRef.current = dispose;
+        });
+        return () => {
+            var _a;
+            isMounted = false;
+            (_a = cleanupRef.current) === null || _a === void 0 ? void 0 : _a.call(cleanupRef);
+            // Only remove if we created the canvas
+            if (!canvasRef.current) {
+                canvasEl.remove();
+            }
+            setIsReady(false);
+        };
+    }, [
+        ref,
+        resolvedManifestUrl,
+        mode,
+        scrollRange,
+        canvasDimensions === null || canvasDimensions === void 0 ? void 0 : canvasDimensions.width,
+        canvasDimensions === null || canvasDimensions === void 0 ? void 0 : canvasDimensions.height,
+        handleProgress,
+        handleReady,
+    ]);
+    // Imperative methods
+    const seek = useCallback((targetProgress) => {
+        const clamped = Math.min(1, Math.max(0, targetProgress));
+        setProgress(clamped);
+        // Note: actual seeking in the player would require extending ScrollPlayer
+        // For now, this updates the progress state for UI synchronization
+    }, []);
+    const pause = useCallback(() => {
+        setIsPaused(true);
+    }, []);
+    const resume = useCallback(() => {
+        setIsPaused(false);
+    }, []);
+    return {
+        progress,
+        isReady,
+        error,
+        canvasRef,
+        seek,
+        pause,
+        resume,
+        isPaused,
+    };
+}
+// Re-export helper functions for use by the component
+export { loadCacheManifest, resolveManifestUrl };

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export { ManimScroll } from "./ManimScroll";
+export type { ManimScrollProps, ManimAnimationProps } from "./ManimScroll";
+export { useManimScroll } from "./hooks";
+export type { UseManimScrollOptions, UseManimScrollResult } from "./hooks";
+export { computePropsHash, extractChildrenText } from "./hash";

package/dist/index.js

@@ -0,0 +1,3 @@
+export { ManimScroll } from "./ManimScroll";
+export { useManimScroll } from "./hooks";
+export { computePropsHash, extractChildrenText } from "./hash";

package/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@mihirsarya/manim-scroll-react",
+  "version": "0.1.1",
+  "description": "React wrapper for scroll-driven Manim animations.",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "dependencies": {
+    "@mihirsarya/manim-scroll-runtime": "0.1.1"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.61",
+    "@types/react-dom": "^18.2.19",
+    "typescript": "^5.4.5"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.json"
+  }
+}