animark-react 0.1.0

package/dist/Animark.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import ReactMarkdown from "react-markdown";
+import type { RemarkAnimarkOptions } from "animark-core";
+import type { Components } from "react-markdown";
+export interface AnimarkProps {
+    children: string;
+    useMotion?: boolean;
+    pluginOptions?: RemarkAnimarkOptions;
+    remarkPlugins?: NonNullable<Parameters<typeof ReactMarkdown>[0]["remarkPlugins"]>;
+    rehypePlugins?: NonNullable<Parameters<typeof ReactMarkdown>[0]["rehypePlugins"]>;
+    components?: Components;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const Animark: React.FC<AnimarkProps>;
+export default Animark;
+//# sourceMappingURL=Animark.d.ts.map

package/dist/Animark.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Animark.d.ts","sourceRoot":"","sources":["../src/Animark.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,aAAa,MAAM,gBAAgB,CAAC;AAK3C,OAAO,KAAK,EAAE,oBAAoB,EAAmB,MAAM,cAAc,CAAC;AAC1E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAGjD,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,oBAAoB,CAAC;IACrC,aAAa,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC;IAClF,aAAa,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC;IAClF,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAOD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAqF1C,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/Animark.js

@@ -0,0 +1,66 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import ReactMarkdown from "react-markdown";
+import remarkDirective from "remark-directive";
+import remarkMath from "remark-math";
+import rehypeKatex from "rehype-katex";
+import { remarkAnimark } from "animark-core";
+import { AnimarkNodeRenderer } from "./AnimarkNodeRenderer";
+// Plugin arrays defined OUTSIDE the component so their references are stable.
+// react-markdown re-runs the entire pipeline whenever plugin array refs change.
+const BASE_REMARK_PLUGINS = [remarkDirective, remarkAnimark, remarkMath];
+const BASE_REHYPE_PLUGINS = [rehypeKatex];
+export const Animark = ({ children, useMotion = false, pluginOptions, remarkPlugins = [], rehypePlugins = [], components = {}, className, style, }) => {
+    // Only rebuild when pluginOptions identity changes
+    const remarkPluginList = useMemo(() => {
+        if (pluginOptions) {
+            return [
+                remarkDirective,
+                [remarkAnimark, pluginOptions],
+                remarkMath,
+                ...remarkPlugins,
+            ];
+        }
+        return [...BASE_REMARK_PLUGINS, ...remarkPlugins];
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [pluginOptions]);
+    const rehypePluginList = useMemo(() => [...BASE_REHYPE_PLUGINS, ...rehypePlugins], 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []);
+    const finalComponents = useMemo(() => ({
+        ...components,
+        // Intercept every <div> and check for the data-animark marker.
+        // When found, hand off to the animation layer instead of rendering
+        // a plain div. All other divs pass through unchanged.
+        div(props) {
+            const { children: divChildren, "data-animark": isAnimark, ...rest } = props;
+            if (!isAnimark) {
+                return _jsx("div", { ...rest, children: divChildren });
+            }
+            const toNum = (v) => v !== undefined && v !== "" && v !== null ? Number(v) : undefined;
+            const animation = {
+                type: rest["data-animark-type"] ?? "fade",
+                trigger: rest["data-animark-trigger"] ?? "auto",
+                ...(toNum(rest["data-animark-delay"]) !== undefined && {
+                    delay: toNum(rest["data-animark-delay"]),
+                }),
+                ...(toNum(rest["data-animark-duration"]) !== undefined && {
+                    duration: toNum(rest["data-animark-duration"]),
+                }),
+                ...(toNum(rest["data-animark-stagger"]) !== undefined && {
+                    stagger: toNum(rest["data-animark-stagger"]),
+                }),
+                ...(rest["data-animark-direction"] && {
+                    direction: rest["data-animark-direction"],
+                }),
+            };
+            return (_jsx(AnimarkNodeRenderer, { animation: animation, useMotion: useMotion, children: divChildren }));
+        },
+    }), 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [useMotion]);
+    return (_jsx("div", { className: className, style: style, children: _jsx(ReactMarkdown, { remarkPlugins: remarkPluginList, rehypePlugins: rehypePluginList, components: finalComponents, children: children }) }));
+};
+export default Animark;
+//# sourceMappingURL=Animark.js.map

package/dist/Animark.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Animark.js","sourceRoot":"","sources":["../src/Animark.tsx"],"names":[],"mappings":"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"}

package/dist/AnimarkContext.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+export interface AnimarkContextValue {
+    /** Increments on every replay — used as React key to remount CSS animations */
+    playCount: number;
+    /** Whether the timeline is currently playing */
+    playing: boolean;
+    /** Virtual current time in ms (used for timeline scrubbing) */
+    currentTime: number;
+    /** Total duration derived from all registered blocks */
+    totalDuration: number;
+    /** Trigger a full replay from the start */
+    replay: () => void;
+    /** Register a block's delay+duration so we can compute totalDuration */
+    registerBlock: (id: string, delay: number, duration: number) => void;
+    /** Unregister on unmount */
+    unregisterBlock: (id: string) => void;
+}
+export declare const AnimarkContext: React.Context<AnimarkContextValue>;
+export declare function useAnimarkContext(): AnimarkContextValue;
+interface AnimarkProviderProps {
+    children: React.ReactNode;
+}
+export declare function AnimarkProvider({ children }: AnimarkProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=AnimarkContext.d.ts.map

package/dist/AnimarkContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimarkContext.d.ts","sourceRoot":"","sources":["../src/AnimarkContext.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAExF,MAAM,WAAW,mBAAmB;IAClC,+EAA+E;IAC/E,SAAS,EAAE,MAAM,CAAC;IAClB,gDAAgD;IAChD,OAAO,EAAE,OAAO,CAAC;IACjB,+DAA+D;IAC/D,WAAW,EAAE,MAAM,CAAC;IACpB,wDAAwD;IACxD,aAAa,EAAE,MAAM,CAAC;IACtB,2CAA2C;IAC3C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,wEAAwE;IACxE,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACrE,4BAA4B;IAC5B,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAYD,eAAO,MAAM,cAAc,oCAAqD,CAAC;AAEjF,wBAAgB,iBAAiB,wBAEhC;AAED,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,oBAAoB,2CAwEjE"}

package/dist/AnimarkContext.js

@@ -0,0 +1,75 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useState, useCallback, useRef } from "react";
+const defaultContext = {
+    playCount: 0,
+    playing: false,
+    currentTime: 0,
+    totalDuration: 0,
+    replay: () => { },
+    registerBlock: () => { },
+    unregisterBlock: () => { },
+};
+export const AnimarkContext = createContext(defaultContext);
+export function useAnimarkContext() {
+    return useContext(AnimarkContext);
+}
+export function AnimarkProvider({ children }) {
+    const [playCount, setPlayCount] = useState(0);
+    const [playing, setPlaying] = useState(false);
+    const [currentTime, setCurrentTime] = useState(0);
+    const [totalDuration, setTotalDuration] = useState(0);
+    // Registry of { delay, duration } per block id
+    const blocksRef = useRef(new Map());
+    const rafRef = useRef(null);
+    const startTimeRef = useRef(0);
+    const computeTotal = useCallback(() => {
+        let max = 0;
+        blocksRef.current.forEach(({ delay, duration }) => {
+            max = Math.max(max, delay + duration);
+        });
+        setTotalDuration(max || 1500);
+    }, []);
+    const registerBlock = useCallback((id, delay, duration) => {
+        blocksRef.current.set(id, { delay, duration });
+        computeTotal();
+    }, [computeTotal]);
+    const unregisterBlock = useCallback((id) => {
+        blocksRef.current.delete(id);
+        computeTotal();
+    }, [computeTotal]);
+    const stopRaf = useCallback(() => {
+        if (rafRef.current != null) {
+            cancelAnimationFrame(rafRef.current);
+            rafRef.current = null;
+        }
+    }, []);
+    const replay = useCallback(() => {
+        stopRaf();
+        setCurrentTime(0);
+        setPlaying(true);
+        setPlayCount((c) => c + 1);
+        startTimeRef.current = performance.now();
+        const total = (() => {
+            let max = 0;
+            blocksRef.current.forEach(({ delay, duration }) => {
+                max = Math.max(max, delay + duration);
+            });
+            return max || 1500;
+        })();
+        const tick = (now) => {
+            const elapsed = now - startTimeRef.current;
+            const clamped = Math.min(elapsed, total);
+            setCurrentTime(clamped);
+            if (clamped < total) {
+                rafRef.current = requestAnimationFrame(tick);
+            }
+            else {
+                setPlaying(false);
+            }
+        };
+        rafRef.current = requestAnimationFrame(tick);
+    }, [stopRaf]);
+    return (_jsx(AnimarkContext.Provider, { value: { playCount, playing, currentTime, totalDuration, replay, registerBlock, unregisterBlock }, children: children }));
+}
+//# sourceMappingURL=AnimarkContext.js.map

package/dist/AnimarkContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimarkContext.js","sourceRoot":"","sources":["../src/AnimarkContext.tsx"],"names":[],"mappings":"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"}

package/dist/AnimarkNodeRenderer.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import type { AnimationConfig } from "animark-core";
+interface AnimarkNodeRendererProps {
+    /** Animation config extracted from the AST node */
+    animation: AnimationConfig;
+    children: React.ReactNode;
+    /** Use Framer Motion when available. Falls back to CSS otherwise. */
+    useMotion?: boolean;
+    className?: string;
+}
+/**
+ * `AnimarkNodeRenderer` is the bridge between the parsed `animarkWrapper`
+ * AST node and the actual animation implementation.
+ *
+ * It decides whether to use CSS or Framer Motion based on the `useMotion` prop
+ * and falls back gracefully in SSR environments.
+ */
+export declare const AnimarkNodeRenderer: React.FC<AnimarkNodeRendererProps>;
+export {};
+//# sourceMappingURL=AnimarkNodeRenderer.d.ts.map

package/dist/AnimarkNodeRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimarkNodeRenderer.d.ts","sourceRoot":"","sources":["../src/AnimarkNodeRenderer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AACvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAGpD,UAAU,wBAAwB;IAChC,mDAAmD;IACnD,SAAS,EAAE,eAAe,CAAC;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,qEAAqE;IACrE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AASD;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA4BlE,CAAC"}

package/dist/AnimarkNodeRenderer.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Suspense, lazy } from "react";
+import { CSSAnimatedWrapper } from "./CSSAnimatedWrapper";
+// Lazily import the Motion wrapper so it's tree-shakeable and SSR-safe
+const LazyMotionWrapper = lazy(() => import("./MotionAnimatedWrapper").then((m) => ({
+    default: m.MotionAnimatedWrapper,
+})));
+/**
+ * `AnimarkNodeRenderer` is the bridge between the parsed `animarkWrapper`
+ * AST node and the actual animation implementation.
+ *
+ * It decides whether to use CSS or Framer Motion based on the `useMotion` prop
+ * and falls back gracefully in SSR environments.
+ */
+export const AnimarkNodeRenderer = ({ animation, children, useMotion = false, className, }) => {
+    if (!useMotion) {
+        return (_jsx(CSSAnimatedWrapper, { animation: animation, className: className, children: children }));
+    }
+    // Framer Motion path — wrapped in Suspense so SSR falls back to CSS version
+    return (_jsx(Suspense, { fallback: _jsx(CSSAnimatedWrapper, { animation: animation, className: className, children: children }), children: _jsx(LazyMotionWrapper, { animation: animation, className: className, children: children }) }));
+};
+//# sourceMappingURL=AnimarkNodeRenderer.js.map

package/dist/AnimarkNodeRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimarkNodeRenderer.js","sourceRoot":"","sources":["../src/AnimarkNodeRenderer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,QAAQ,EAAE,IAAI,EAAW,MAAM,OAAO,CAAC;AAEvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAW1D,uEAAuE;AACvE,MAAM,iBAAiB,GAAG,IAAI,CAAC,GAAG,EAAE,CAClC,MAAM,CAAC,yBAAyB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAC7C,OAAO,EAAE,CAAC,CAAC,qBAAqB;CACjC,CAAC,CAAC,CACJ,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAuC,CAAC,EACtE,SAAS,EACT,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,SAAS,GACV,EAAE,EAAE;IACH,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,OAAO,CACL,KAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,YAC3D,QAAQ,GACU,CACtB,CAAC;IACJ,CAAC;IAED,4EAA4E;IAC5E,OAAO,CACL,KAAC,QAAQ,IACP,QAAQ,EACN,KAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,YAC3D,QAAQ,GACU,YAGvB,KAAC,iBAAiB,IAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,YAC1D,QAAQ,GACS,GACX,CACZ,CAAC;AACJ,CAAC,CAAC"}

package/dist/Animarkcontrols.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+export interface AnimarkControlsProps {
+    /** Show the timeline scrubber bar. Default: true */
+    showTimeline?: boolean;
+    /** Custom className for the controls container */
+    className?: string;
+    /** Custom styles for the controls container */
+    style?: React.CSSProperties;
+}
+/**
+ * AnimarkControls — play/replay button + optional timeline scrubber.
+ * Must be rendered inside an <AnimarkPlayer> (which provides the context).
+ */
+export declare function AnimarkControls({ showTimeline, className, style, }: AnimarkControlsProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AnimarkControls.d.ts.map

package/dist/Animarkcontrols.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimarkControls.d.ts","sourceRoot":"","sources":["../src/AnimarkControls.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,oBAAoB;IACnC,oDAAoD;IACpD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAC9B,YAAmB,EACnB,SAAc,EACd,KAAU,GACX,EAAE,oBAAoB,2CAkFtB"}

package/dist/Animarkcontrols.js

@@ -0,0 +1,48 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useAnimarkContext } from "./AnimarkContext";
+/**
+ * AnimarkControls — play/replay button + optional timeline scrubber.
+ * Must be rendered inside an <AnimarkPlayer> (which provides the context).
+ */
+export function AnimarkControls({ showTimeline = true, className = "", style = {}, }) {
+    const { playing, currentTime, totalDuration, replay } = useAnimarkContext();
+    const progress = totalDuration > 0 ? (currentTime / totalDuration) * 100 : 0;
+    return (_jsxs("div", { className: `animark-controls ${className}`.trim(), style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 12,
+            padding: "10px 0",
+            userSelect: "none",
+            ...style,
+        }, children: [_jsx("button", { onClick: replay, disabled: playing, "aria-label": playing ? "Playing…" : "Replay animations", style: {
+                    display: "inline-flex",
+                    alignItems: "center",
+                    gap: 6,
+                    padding: "6px 14px",
+                    border: "1px solid currentColor",
+                    borderRadius: 6,
+                    background: "transparent",
+                    cursor: playing ? "not-allowed" : "pointer",
+                    opacity: playing ? 0.5 : 1,
+                    fontSize: 13,
+                    fontFamily: "inherit",
+                    transition: "opacity 0.2s",
+                    whiteSpace: "nowrap",
+                }, children: _jsx("span", { "aria-hidden": true, children: playing ? "▶ Playing…" : "↺ Replay" }) }), showTimeline && (_jsx("div", { role: "progressbar", "aria-valuenow": Math.round(progress), "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": "Animation timeline", style: {
+                    flex: 1,
+                    height: 4,
+                    borderRadius: 2,
+                    background: "rgba(128,128,128,0.2)",
+                    overflow: "hidden",
+                    minWidth: 80,
+                }, children: _jsx("div", { style: {
+                        height: "100%",
+                        width: `${progress}%`,
+                        background: "currentColor",
+                        borderRadius: 2,
+                        transition: playing ? "none" : "width 0.3s ease",
+                        opacity: 0.7,
+                    } }) })), showTimeline && (_jsxs("span", { "aria-hidden": true, style: { fontSize: 12, opacity: 0.5, minWidth: 48, textAlign: "right", fontVariantNumeric: "tabular-nums" }, children: [(currentTime / 1000).toFixed(1), "s"] }))] }));
+}
+//# sourceMappingURL=AnimarkControls.js.map

package/dist/Animarkcontrols.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimarkControls.js","sourceRoot":"","sources":["../src/AnimarkControls.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAWrD;;;GAGG;AACH,MAAM,UAAU,eAAe,CAAC,EAC9B,YAAY,GAAG,IAAI,EACnB,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,GACW;IACrB,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAE5E,MAAM,QAAQ,GAAG,aAAa,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,GAAG,aAAa,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IAE7E,OAAO,CACL,eACE,SAAS,EAAE,oBAAoB,SAAS,EAAE,CAAC,IAAI,EAAE,EACjD,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,EAAE;YACP,OAAO,EAAE,QAAQ;YACjB,UAAU,EAAE,MAAM;YAClB,GAAG,KAAK;SACT,aAGD,iBACE,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,OAAO,gBACL,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,mBAAmB,EACtD,KAAK,EAAE;oBACL,OAAO,EAAE,aAAa;oBACtB,UAAU,EAAE,QAAQ;oBACpB,GAAG,EAAE,CAAC;oBACN,OAAO,EAAE,UAAU;oBACnB,MAAM,EAAE,wBAAwB;oBAChC,YAAY,EAAE,CAAC;oBACf,UAAU,EAAE,aAAa;oBACzB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS;oBAC3C,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;oBAC1B,QAAQ,EAAE,EAAE;oBACZ,UAAU,EAAE,SAAS;oBACrB,UAAU,EAAE,cAAc;oBAC1B,UAAU,EAAE,QAAQ;iBACrB,YAED,8CAAmB,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,UAAU,GAAQ,GACvD,EAGR,YAAY,IAAI,CACf,cACE,IAAI,EAAC,aAAa,mBACH,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,mBACpB,CAAC,mBACD,GAAG,gBACP,oBAAoB,EAC/B,KAAK,EAAE;oBACL,IAAI,EAAE,CAAC;oBACP,MAAM,EAAE,CAAC;oBACT,YAAY,EAAE,CAAC;oBACf,UAAU,EAAE,uBAAuB;oBACnC,QAAQ,EAAE,QAAQ;oBAClB,QAAQ,EAAE,EAAE;iBACb,YAED,cACE,KAAK,EAAE;wBACL,MAAM,EAAE,MAAM;wBACd,KAAK,EAAE,GAAG,QAAQ,GAAG;wBACrB,UAAU,EAAE,cAAc;wBAC1B,YAAY,EAAE,CAAC;wBACf,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,iBAAiB;wBAChD,OAAO,EAAE,GAAG;qBACb,GACD,GACE,CACP,EAGA,YAAY,IAAI,CACf,qCAEE,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,aAE1G,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAC3B,CACR,IACG,CACP,CAAC;AACJ,CAAC"}

package/dist/Animarkplayer.d.ts

@@ -0,0 +1,29 @@
+import { type AnimarkProps } from "./Animark";
+import { type AnimarkControlsProps } from "./AnimarkControls";
+export interface AnimarkPlayerProps extends AnimarkProps {
+    /**
+     * Show the built-in play/replay controls.
+     * Pass false to hide them and control playback manually via useAnimarkContext().
+     * Default: true
+     */
+    showControls?: boolean;
+    /** Props forwarded to the built-in <AnimarkControls /> */
+    controlsProps?: AnimarkControlsProps;
+}
+/**
+ * AnimarkPlayer — <Animark> with built-in replay controls and timeline.
+ *
+ * Wraps content in an AnimarkProvider so all animated blocks share
+ * the same play state.
+ *
+ * Usage:
+ *   <AnimarkPlayer showControls>{markdown}</AnimarkPlayer>
+ *
+ * To position controls manually:
+ *   <AnimarkPlayer showControls={false}>
+ *     {markdown}
+ *     <AnimarkControls />   ← place anywhere inside
+ *   </AnimarkPlayer>
+ */
+export declare function AnimarkPlayer({ showControls, controlsProps, children, ...animarkProps }: AnimarkPlayerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AnimarkPlayer.d.ts.map

package/dist/Animarkplayer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimarkPlayer.d.ts","sourceRoot":"","sources":["../src/AnimarkPlayer.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AACvD,OAAO,EAAmB,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAE/E,MAAM,WAAW,kBAAmB,SAAQ,YAAY;IACtD;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,0DAA0D;IAC1D,aAAa,CAAC,EAAE,oBAAoB,CAAC;CACtC;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,aAAa,CAAC,EAC5B,YAAmB,EACnB,aAAkB,EAClB,QAAQ,EACR,GAAG,YAAY,EAChB,EAAE,kBAAkB,2CAOpB"}

package/dist/Animarkplayer.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AnimarkProvider } from "./AnimarkContext";
+import { Animark } from "./Animark";
+import { AnimarkControls } from "./AnimarkControls";
+/**
+ * AnimarkPlayer — <Animark> with built-in replay controls and timeline.
+ *
+ * Wraps content in an AnimarkProvider so all animated blocks share
+ * the same play state.
+ *
+ * Usage:
+ *   <AnimarkPlayer showControls>{markdown}</AnimarkPlayer>
+ *
+ * To position controls manually:
+ *   <AnimarkPlayer showControls={false}>
+ *     {markdown}
+ *     <AnimarkControls />   ← place anywhere inside
+ *   </AnimarkPlayer>
+ */
+export function AnimarkPlayer({ showControls = true, controlsProps = {}, children, ...animarkProps }) {
+    return (_jsxs(AnimarkProvider, { children: [showControls && _jsx(AnimarkControls, { ...controlsProps }), _jsx(Animark, { ...animarkProps, children: children })] }));
+}
+//# sourceMappingURL=AnimarkPlayer.js.map

package/dist/Animarkplayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimarkPlayer.js","sourceRoot":"","sources":["../src/AnimarkPlayer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,OAAO,EAAqB,MAAM,WAAW,CAAC;AACvD,OAAO,EAAE,eAAe,EAA6B,MAAM,mBAAmB,CAAC;AAa/E;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,YAAY,GAAG,IAAI,EACnB,aAAa,GAAG,EAAE,EAClB,QAAQ,EACR,GAAG,YAAY,EACI;IACnB,OAAO,CACL,MAAC,eAAe,eACb,YAAY,IAAI,KAAC,eAAe,OAAK,aAAa,GAAI,EACvD,KAAC,OAAO,OAAK,YAAY,YAAG,QAAQ,GAAW,IAC/B,CACnB,CAAC;AACJ,CAAC"}

package/dist/CSSAnimatedWrapper.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import type { AnimationConfig } from "animark-core";
+interface CSSAnimatedWrapperProps {
+    animation: AnimationConfig;
+    children: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * Pure CSS animated wrapper.
+ * Re-triggers animation on replay by remounting via key={playCount}.
+ */
+export declare const CSSAnimatedWrapper: React.FC<CSSAnimatedWrapperProps>;
+export {};
+//# sourceMappingURL=CSSAnimatedWrapper.d.ts.map

package/dist/CSSAnimatedWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CSSAnimatedWrapper.d.ts","sourceRoot":"","sources":["../src/CSSAnimatedWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAGpD,UAAU,uBAAuB;IAC/B,SAAS,EAAE,eAAe,CAAC;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAaD;;;GAGG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAmChE,CAAC"}

package/dist/CSSAnimatedWrapper.js

@@ -0,0 +1,39 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useId } from "react";
+import { useAnimarkContext } from "./AnimarkContext";
+function getAnimationClass(animation) {
+    const dir = animation.direction ?? "up";
+    switch (animation.type) {
+        case "fade": return "animark-fade";
+        case "scale": return "animark-scale";
+        case "slide": return `animark-slide-${dir}`;
+        case "move": return `animark-move-${dir}`;
+        default: return "animark-fade";
+    }
+}
+/**
+ * Pure CSS animated wrapper.
+ * Re-triggers animation on replay by remounting via key={playCount}.
+ */
+export const CSSAnimatedWrapper = ({ animation, children, className = "", style = {}, }) => {
+    const id = useId();
+    const { playCount, registerBlock, unregisterBlock } = useAnimarkContext();
+    const duration = animation.duration ?? 500;
+    const delay = animation.delay ?? 0;
+    // Register this block so the timeline knows about it
+    useEffect(() => {
+        registerBlock(id, delay, duration);
+        return () => unregisterBlock(id);
+    }, [id, delay, duration, registerBlock, unregisterBlock]);
+    const animClass = getAnimationClass(animation);
+    return (
+    // key={playCount} forces React to remount this element on every replay,
+    // which restarts the CSS animation from the beginning.
+    _jsx("div", { className: `animark-wrapper ${animClass} ${className}`.trim(), style: {
+            animationDuration: `${duration}ms`,
+            animationDelay: `${delay}ms`,
+            ...style,
+        }, children: children }, playCount));
+};
+//# sourceMappingURL=CSSAnimatedWrapper.js.map

package/dist/CSSAnimatedWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CSSAnimatedWrapper.js","sourceRoot":"","sources":["../src/CSSAnimatedWrapper.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AASrD,SAAS,iBAAiB,CAAC,SAA0B;IACnD,MAAM,GAAG,GAAG,SAAS,CAAC,SAAS,IAAI,IAAI,CAAC;IACxC,QAAQ,SAAS,CAAC,IAAI,EAAE,CAAC;QACvB,KAAK,MAAM,CAAC,CAAE,OAAO,cAAc,CAAC;QACpC,KAAK,OAAO,CAAC,CAAC,OAAO,eAAe,CAAC;QACrC,KAAK,OAAO,CAAC,CAAC,OAAO,iBAAiB,GAAG,EAAE,CAAC;QAC5C,KAAK,MAAM,CAAC,CAAE,OAAO,gBAAgB,GAAG,EAAE,CAAC;QAC3C,OAAO,CAAC,CAAM,OAAO,cAAc,CAAC;IACtC,CAAC;AACH,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EACpE,SAAS,EACT,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,GACX,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IACnB,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAE1E,MAAM,QAAQ,GAAG,SAAS,CAAC,QAAQ,IAAI,GAAG,CAAC;IAC3C,MAAM,KAAK,GAAG,SAAS,CAAC,KAAK,IAAI,CAAC,CAAC;IAEnC,qDAAqD;IACrD,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,CAAC,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;QACnC,OAAO,GAAG,EAAE,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,eAAe,CAAC,CAAC,CAAC;IAE1D,MAAM,SAAS,GAAG,iBAAiB,CAAC,SAAS,CAAC,CAAC;IAE/C,OAAO;IACL,wEAAwE;IACxE,uDAAuD;IACvD,cAEE,SAAS,EAAE,mBAAmB,SAAS,IAAI,SAAS,EAAE,CAAC,IAAI,EAAE,EAC7D,KAAK,EAAE;YACL,iBAAiB,EAAE,GAAG,QAAQ,IAAI;YAClC,cAAc,EAAE,GAAG,KAAK,IAAI;YAC5B,GAAG,KAAK;SACT,YAEA,QAAQ,IARJ,SAAS,CASV,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/MotionAnimatedWrapper-HT6ZXMNF.mjs

@@ -0,0 +1,74 @@
+"use client";
+
+// src/MotionAnimatedWrapper.tsx
+import { motion } from "framer-motion";
+import { jsx } from "react/jsx-runtime";
+function buildVariants(animation) {
+  const dir = animation.direction ?? "up";
+  const duration = (animation.duration ?? 500) / 1e3;
+  switch (animation.type) {
+    case "fade":
+      return {
+        hidden: { opacity: 0 },
+        visible: { opacity: 1, transition: { duration } }
+      };
+    case "slide": {
+      const sign = dir === "right" || dir === "down" ? -1 : 1;
+      if (dir === "left" || dir === "right") {
+        return {
+          hidden: { opacity: 0, x: sign * 24 },
+          visible: { opacity: 1, x: 0, transition: { duration } }
+        };
+      }
+      return {
+        hidden: { opacity: 0, y: sign * 24 },
+        visible: { opacity: 1, y: 0, transition: { duration } }
+      };
+    }
+    case "scale":
+      return {
+        hidden: { opacity: 0, scale: 0.88 },
+        visible: { opacity: 1, scale: 1, transition: { duration } }
+      };
+    case "move": {
+      const sign = dir === "right" || dir === "down" ? -1 : 1;
+      if (dir === "left" || dir === "right") {
+        return {
+          hidden: { x: sign * 12 },
+          visible: { x: 0, transition: { duration } }
+        };
+      }
+      return {
+        hidden: { y: sign * 12 },
+        visible: { y: 0, transition: { duration } }
+      };
+    }
+    default:
+      return {
+        hidden: { opacity: 0 },
+        visible: { opacity: 1, transition: { duration } }
+      };
+  }
+}
+var MotionAnimatedWrapper = ({
+  animation,
+  children,
+  className = ""
+}) => {
+  const variants = buildVariants(animation);
+  const delaySeconds = (animation.delay ?? 0) / 1e3;
+  return /* @__PURE__ */ jsx(
+    motion.div,
+    {
+      className: `animark-wrapper ${className}`.trim(),
+      variants,
+      initial: "hidden",
+      animate: "visible",
+      transition: { delay: delaySeconds },
+      children
+    }
+  );
+};
+export {
+  MotionAnimatedWrapper
+};

package/dist/MotionAnimatedWrapper.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import type { AnimationConfig } from "animark-core";
+interface MotionWrapperProps {
+    animation: AnimationConfig;
+    children: React.ReactNode;
+    className?: string;
+}
+export declare const MotionAnimatedWrapper: React.FC<MotionWrapperProps>;
+export {};
+//# sourceMappingURL=MotionAnimatedWrapper.d.ts.map

package/dist/MotionAnimatedWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MotionAnimatedWrapper.d.ts","sourceRoot":"","sources":["../src/MotionAnimatedWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAGpD,UAAU,kBAAkB;IAC1B,SAAS,EAAE,eAAe,CAAC;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAmDD,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAsC9D,CAAC"}

package/dist/MotionAnimatedWrapper.js

@@ -0,0 +1,73 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useId } from "react";
+import { motion, useAnimation } from "framer-motion";
+import { useAnimarkContext } from "./AnimarkContext";
+function buildVariants(animation) {
+    const dir = animation.direction ?? "up";
+    const duration = (animation.duration ?? 500) / 1000;
+    switch (animation.type) {
+        case "fade":
+            return {
+                hidden: { opacity: 0 },
+                visible: { opacity: 1, transition: { duration } },
+            };
+        case "slide": {
+            const sign = dir === "right" || dir === "down" ? -1 : 1;
+            if (dir === "left" || dir === "right") {
+                return {
+                    hidden: { opacity: 0, x: sign * 24 },
+                    visible: { opacity: 1, x: 0, transition: { duration } },
+                };
+            }
+            return {
+                hidden: { opacity: 0, y: sign * 24 },
+                visible: { opacity: 1, y: 0, transition: { duration } },
+            };
+        }
+        case "scale":
+            return {
+                hidden: { opacity: 0, scale: 0.88 },
+                visible: { opacity: 1, scale: 1, transition: { duration } },
+            };
+        case "move": {
+            const sign = dir === "right" || dir === "down" ? -1 : 1;
+            if (dir === "left" || dir === "right") {
+                return {
+                    hidden: { x: sign * 12 },
+                    visible: { x: 0, transition: { duration } },
+                };
+            }
+            return {
+                hidden: { y: sign * 12 },
+                visible: { y: 0, transition: { duration } },
+            };
+        }
+        default:
+            return {
+                hidden: { opacity: 0 },
+                visible: { opacity: 1, transition: { duration } },
+            };
+    }
+}
+export const MotionAnimatedWrapper = ({ animation, children, className = "", }) => {
+    const id = useId();
+    const { playCount, registerBlock, unregisterBlock } = useAnimarkContext();
+    const controls = useAnimation();
+    const duration = animation.duration ?? 500;
+    const delay = animation.delay ?? 0;
+    const delaySeconds = delay / 1000;
+    // Register with the timeline
+    useEffect(() => {
+        registerBlock(id, delay, duration);
+        return () => unregisterBlock(id);
+    }, [id, delay, duration, registerBlock, unregisterBlock]);
+    // Re-run animation whenever playCount increments (replay triggered)
+    useEffect(() => {
+        controls.set("hidden");
+        controls.start("visible");
+    }, [playCount, controls]);
+    const variants = buildVariants(animation);
+    return (_jsx(motion.div, { className: `animark-wrapper ${className}`.trim(), variants: variants, initial: "hidden", animate: controls, transition: { delay: delaySeconds }, children: children }));
+};
+//# sourceMappingURL=MotionAnimatedWrapper.js.map