egaki 0.5.0 → 0.7.0

package/dist/vite/mdx-client.js

@@ -0,0 +1,265 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Client-side MDX application.
+ *
+ * All MDX processing happens in the browser: parsing, section splitting,
+ * user module resolution, and safe-mdx rendering. Because rendering runs on
+ * the client there is no RSC serialization boundary between MDX content and
+ * the components — expression props can be functions (easing={x => x}),
+ * imported values can be anything, and user components don't need a
+ * 'use client' directive.
+ *
+ * The server (app.tsx) only passes the raw MDX source string through the
+ * RSC flight payload. Entry MDX edits flow server → client via rsc:update;
+ * user .tsx/.ts/.mdx edits flow through the client module graph: this
+ * module accepts HMR updates of virtual:egaki-modules directly via
+ * import.meta.hot.accept(dep, cb) and pushes the fresh map into React
+ * through useSyncExternalStore.
+ */
+import { createContext, useContext, useEffect, useMemo } from 'react';
+import { SafeMdxRenderer } from 'safe-mdx';
+import { mdxParse, extractImports, resolveModulePath } from 'safe-mdx/parse';
+import { eagerModules as initialModules } from 'virtual:egaki-modules';
+import { splitIntoSections, calculateTotalDuration, resolveAutoDurations, parseFrontmatter, buildMdxScope } from "./mdx-parse.js";
+import { filterImportNodesToModules } from "./server-mdx.js";
+import { PlayerPage } from "./player-page.js";
+import { MDX_BUILTIN_COMPONENTS, Img, ServerSlotsContext } from "./mdx-video.js";
+import { MdxCodeBlockWrapper } from "./code-block.js";
+import { egakiStore } from "./store.js";
+import { useModules, useMediaDurations } from "./store-hooks.js";
+import { resetSectionDurations } from "./media-duration-store.js";
+// ---------------------------------------------------------------------------
+// MDX components map
+// ---------------------------------------------------------------------------
+const FONT_SANS = '-apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif';
+const FONT_MONO = '"SF Mono", ui-monospace, SFMono-Regular, "Cascadia Code", monospace';
+function buildVideoMdxComponents() {
+    return {
+        ...MDX_BUILTIN_COMPONENTS,
+        // Reserved: server component slot marker. The server renders the
+        // original children; this client component splices the slot in by
+        // matching its data-markdown-line against the slot keys.
+        Server,
+        // Standard element overrides
+        p: ({ children }) => (_jsx("div", { style: {
+                fontSize: 'clamp(1.5rem, 2.5vw, 3rem)', fontWeight: 400,
+                color: '#a1a1aa', fontFamily: FONT_SANS, textAlign: 'center',
+                letterSpacing: '-0.02em', lineHeight: 1.4, maxWidth: '80%',
+            }, children: children })),
+        strong: ({ children }) => (_jsx("span", { style: { color: '#fafafa', fontWeight: 600 }, children: children })),
+        em: ({ children }) => (_jsx("span", { style: { fontStyle: 'italic' }, children: children })),
+        a: ({ children }) => (_jsx("span", { style: { color: '#818cf8', textDecoration: 'underline' }, children: children })),
+        h1: () => null, h2: () => null, h3: () => null,
+        h4: () => null, h5: () => null, h6: () => null,
+        blockquote: () => null,
+        pre: MdxCodeBlockWrapper,
+        inlineCode: ({ children }) => (_jsx("span", { style: {
+                fontFamily: FONT_MONO, fontSize: '0.875em', color: '#e4e4e7',
+                background: 'rgba(255, 255, 255, 0.06)', borderRadius: '0.25em',
+                padding: '0.1em 0.4em',
+            }, children: children })),
+        ul: ({ children }) => (_jsx("div", { style: {
+                fontSize: 'clamp(1.25rem, 2vw, 2rem)', color: '#a1a1aa',
+                fontFamily: FONT_SANS, textAlign: 'left', display: 'flex',
+                flexDirection: 'column', gap: '0.4em',
+            }, children: children })),
+        ol: ({ children }) => (_jsx("div", { style: {
+                fontSize: 'clamp(1.25rem, 2vw, 2rem)', color: '#a1a1aa',
+                fontFamily: FONT_SANS, textAlign: 'left', display: 'flex',
+                flexDirection: 'column', gap: '0.4em',
+            }, children: children })),
+        li: ({ children }) => (_jsxs("div", { style: { display: 'flex', gap: '0.5em' }, children: [_jsx("span", { style: { color: '#52525b' }, children: "\u2022" }), _jsx("span", { children: children })] })),
+        img: ({ src, alt }) => (_jsx(Img, { src: src, alt: alt || '', style: {
+                maxWidth: '80%', maxHeight: '70%', objectFit: 'contain', borderRadius: '0.5em',
+            } })),
+        hr: () => (_jsx("div", { style: { width: '40%', height: 1, background: 'rgba(255, 255, 255, 0.1)' } })),
+        table: ({ children }) => (_jsx("div", { style: { fontSize: 'clamp(0.875rem, 1.2vw, 1.125rem)', fontFamily: FONT_SANS, color: '#a1a1aa' }, children: children })),
+        thead: ({ children }) => _jsx("div", { children: children }),
+        tbody: ({ children }) => _jsx("div", { children: children }),
+        tr: ({ children }) => (_jsx("div", { style: { display: 'flex', gap: '1em', borderBottom: '1px solid rgba(255,255,255,0.06)', padding: '0.5em 0' }, children: children })),
+        td: ({ children }) => _jsx("div", { style: { flex: 1 }, children: children }),
+        th: ({ children }) => (_jsx("div", { style: { flex: 1, fontWeight: 600, color: '#e4e4e7' }, children: children })),
+    };
+}
+// Built once — the map is static.
+const mdxComponents = buildVideoMdxComponents();
+// Enable function expressions in MDX attribute props. safe-mdx evaluates
+// them with a safe AST interpreter (no eval), so `easing={x => x}` works.
+const evaluateOptions = { functions: true };
+// ---------------------------------------------------------------------------
+// User modules — initial value from static import, HMR updates via store
+// ---------------------------------------------------------------------------
+egakiStore.setState({ modules: initialModules });
+if (import.meta.hot) {
+    import.meta.hot.accept('virtual:egaki-modules', (next) => {
+        if (next?.eagerModules) {
+            egakiStore.setState({ modules: next.eagerModules });
+        }
+    });
+}
+// ---------------------------------------------------------------------------
+// Composition building (parse → sections → JSX)
+// ---------------------------------------------------------------------------
+// Slots travel via React context (provided by MdxClientApp around
+// PlayerPage) rather than a safe-mdx renderNode hook: safe-mdx only calls
+// renderNode in its top-level mdast traversal, while JSX elements nested
+// inside other JSX elements go through jsxTransformer which resolves the
+// components map directly. A real `Server` component in the map works at
+// any nesting depth; it matches its slot via the data-markdown-line prop
+// that safe-mdx injects (line numbers are identical on server and client
+// because blankServerContents preserves line positions).
+function Server(props) {
+    const slots = useContext(ServerSlotsContext);
+    const key = String(props['data-markdown-line']);
+    if (key in slots)
+        return slots[key];
+    // No slot: <Server> inside an imported .mdx file (not scanned, v1
+    // limitation) or a stale flight payload.
+    console.warn(`[egaki] <Server> at line ${key} has no server-rendered slot; rendering nothing`);
+    return null;
+}
+let lastGoodComposition = null;
+function makeErrorComposition(error) {
+    // If we have a cached good result, reuse its frontmatter and show the
+    // error as a single-section overlay so the player stays alive.
+    const frontmatter = lastGoodComposition?.frontmatter ?? { fps: 30, bpm: 120, width: 1920, height: 1080, scale: 1 };
+    return {
+        sections: [{
+                heading: 'Parse Error',
+                durationInFrames: frontmatter.fps * 5,
+                jsx: (_jsxs("div", { style: {
+                        display: 'flex', flexDirection: 'column', alignItems: 'center',
+                        justifyContent: 'center', width: '100%', height: '100%',
+                        padding: '2rem', fontFamily: 'ui-monospace, SFMono-Regular, "Cascadia Code", monospace',
+                    }, children: [_jsx("div", { style: { color: '#ef4444', fontSize: 'clamp(1rem, 2vw, 1.5rem)', fontWeight: 600, marginBottom: '1rem' }, children: "MDX Parse Error" }), _jsx("div", { style: {
+                                color: '#fca5a5', fontSize: 'clamp(0.75rem, 1.5vw, 1rem)',
+                                background: 'rgba(239, 68, 68, 0.1)', borderRadius: '0.5rem',
+                                padding: '1rem 1.5rem', maxWidth: '80%', whiteSpace: 'pre-wrap',
+                                lineHeight: 1.6, border: '1px solid rgba(239, 68, 68, 0.2)',
+                            }, children: error.message }), _jsx("div", { style: { color: '#71717a', fontSize: 'clamp(0.625rem, 1vw, 0.875rem)', marginTop: '1rem' }, children: "Fix the syntax error and save. The video will recover automatically." })] })),
+            }],
+        preamble: lastGoodComposition?.preamble,
+        frontmatter,
+        parseError: error.message,
+    };
+}
+function buildComposition(mdxSource, modules) {
+    let ast;
+    try {
+        ast = mdxParse(mdxSource);
+    }
+    catch (e) {
+        console.warn('[egaki] MDX parse error:', e.message);
+        return makeErrorComposition(e);
+    }
+    // Compute FPS and BEAT from frontmatter early so they're available as
+    // scope variables for all SafeMdxRenderer calls (including imported MDX).
+    const { fps, bpm } = parseFrontmatter(ast);
+    const mdxScope = buildMdxScope(fps, bpm);
+    // Render imported .mdx/.md files into React components so safe-mdx can
+    // resolve `import Intro from './intro.mdx'` and render `<Intro />` via
+    // React composition. Each imported MDX gets its own SafeMdxRenderer pass
+    // with the same components map.
+    const moduleKeys = Object.keys(modules);
+    const mergedModules = { ...modules };
+    const imports = extractImports(ast);
+    for (const imp of imports) {
+        if (!/\.mdx?$/.test(imp.source))
+            continue;
+        const key = resolveModulePath(imp.source, './', moduleKeys);
+        if (!key || !mergedModules[key])
+            continue;
+        const rawContent = mergedModules[key].default;
+        if (typeof rawContent !== 'string')
+            continue;
+        let importedAst;
+        try {
+            importedAst = mdxParse(rawContent);
+        }
+        catch (e) {
+            // Imported MDX has a syntax error. Skip it instead of crashing the
+            // whole composition; the main file's content still renders.
+            console.warn(`[egaki] parse error in imported MDX (${imp.source}):`, e.message);
+            continue;
+        }
+        const renderedJsx = (_jsx(SafeMdxRenderer, { markdown: rawContent, mdast: importedAst, components: mdxComponents, modules: mergedModules, baseUrl: "./", scope: mdxScope, evaluateOptions: evaluateOptions, onError: (e) => console.warn('[egaki] imported MDX:', e.message) }));
+        // Replace the raw string module with a component that returns the
+        // pre-rendered JSX. safe-mdx reads mod.default for default imports.
+        mergedModules[key] = { default: () => renderedJsx };
+    }
+    const result = splitIntoSections(ast);
+    // Extract import nodes (mdxjsEsm) from the full mdast. Section splitting
+    // drops them, but SafeMdxRenderer needs them to resolve imported components
+    // from the modules map. Prepend to every section's nodes.
+    //
+    // Imports not resolvable in the client modules map are stripped: those
+    // are server-only files (used exclusively inside <Server> blocks, which
+    // the server already rendered into slots) excluded from the client map
+    // by the vite plugin's inference.
+    const importNodes = filterImportNodesToModules(ast.children.filter((node) => node.type === 'mdxjsEsm'), Object.keys(mergedModules));
+    const renderNodes = (nodes) => (_jsx(SafeMdxRenderer, { markdown: mdxSource, mdast: { type: 'root', children: [...importNodes, ...nodes] }, components: mdxComponents, modules: mergedModules, baseUrl: "./", scope: mdxScope, addMarkdownLineNumbers: true, evaluateOptions: evaluateOptions, onError: (e) => console.warn('[egaki] MDX:', e.message) }));
+    const sections = result.sections.map((section) => ({
+        heading: section.heading,
+        durationInFrames: section.durationInFrames,
+        jsx: renderNodes(section.nodes),
+    }));
+    // Preamble: content before the first heading, rendered at composition
+    // level (outside Series) so it spans the full video duration.
+    const preamble = result.preamble.length > 0
+        ? renderNodes(result.preamble)
+        : undefined;
+    const composition = { sections, preamble, frontmatter: result.frontmatter };
+    // Cache successful result for parse error recovery
+    lastGoodComposition = composition;
+    return composition;
+}
+// ---------------------------------------------------------------------------
+// App component
+// ---------------------------------------------------------------------------
+const EMPTY_SLOTS = {};
+export function MdxClientApp({ mdx, serverSlots = EMPTY_SLOTS, entryPath, availableEntries = [], currentRoute = '', }) {
+    const modules = useModules();
+    // Subscribe to media duration reports. When Audio/Video components report
+    // their durations (via mediabunny metadata fetch), this re-renders and
+    // sections without explicit duration= get auto-sized to their media content.
+    // The map is keyed by section index (as string) → max media duration in
+    // seconds, derived from the src-keyed persistent cache.
+    const sectionDurations = useMediaDurations();
+    // Split into two memos to avoid an infinite loop:
+    // 1. buildComposition creates JSX (depends on mdx + modules only).
+    //    If this re-ran on sectionDurations changes, it would create new JSX
+    //    identity → React unmounts Audio/Video → clearSectionDuration fires →
+    //    snapshot changes → sectionDurations changes → infinite loop.
+    // 2. resolveAutoDurations fills in null durations from the section store.
+    //    This memo is cheap and can re-run on every sectionDurations change
+    //    without touching JSX identity.
+    const composed = useMemo(() => buildComposition(mdx, modules), [mdx, modules]);
+    // Reset section duration reports when the composition changes (HMR,
+    // MDX edit, module update). Media components will re-report on mount.
+    // Does NOT clear the raw src cache so cached durations resolve instantly.
+    useEffect(() => {
+        resetSectionDurations();
+    }, [composed]);
+    const { sections, totalDuration, preamble, hasUnresolvedDurations } = useMemo(() => {
+        const { fps, bpm } = composed.frontmatter;
+        // MDX files without headings (e.g. imported partials rendered standalone)
+        // have 0 sections. Synthesize one from the preamble with null duration
+        // BEFORE resolving auto-durations, so media auto-sizing still works.
+        let sourceSections = composed.sections;
+        let finalPreamble = composed.preamble;
+        if (sourceSections.length === 0 && finalPreamble) {
+            sourceSections = [{ heading: null, durationInFrames: null, jsx: finalPreamble }];
+            finalPreamble = undefined;
+        }
+        const resolved = resolveAutoDurations(sourceSections, fps, bpm, sectionDurations);
+        const hasUnresolved = sourceSections.some((s, i) => s.durationInFrames === null && sectionDurations[String(i)] === undefined);
+        return {
+            sections: resolved,
+            totalDuration: Math.max(1, calculateTotalDuration(resolved)),
+            preamble: finalPreamble,
+            hasUnresolvedDurations: hasUnresolved,
+        };
+    }, [composed, sectionDurations]);
+    return (_jsx(ServerSlotsContext.Provider, { value: serverSlots, children: _jsx(PlayerPage, { sections: sections, totalDuration: totalDuration, preamble: preamble, entryPath: entryPath, hasUnresolvedDurations: hasUnresolvedDurations, frontmatter: composed.frontmatter, availableEntries: availableEntries, currentRoute: currentRoute }) }));
+}

package/dist/vite/mdx-parse.d.ts

@@ -0,0 +1,102 @@
+/**
+ * Server-safe MDX parsing utilities for the video framework.
+ *
+ * This module contains ONLY parsing logic (frontmatter, section splitting,
+ * duration calculation). It does NOT import remotion or any client-only
+ * modules, so it can safely run in the RSC server environment.
+ *
+ * The rendering counterpart is mdx-video.tsx which re-exports these
+ * functions alongside the Remotion components.
+ */
+type RootContent = any;
+type Root = {
+    type: 'root';
+    children: RootContent[];
+};
+export interface VideoFrontmatter {
+    fps: number;
+    bpm: number;
+    width: number;
+    height: number;
+    /** Pixel density / scale multiplier for rendering. Default 1.
+     *  Setting scale=2 renders at 2x resolution (e.g. 3840×2160 for a 1920×1080 comp). */
+    scale: number;
+}
+/** Scope variables injected into MDX expressions via safe-mdx's `scope` prop.
+ *  Both server (app.tsx) and client (mdx-client.tsx) must pass the same shape. */
+export interface MdxScope {
+    FPS: number;
+    BEAT: number;
+    Math: typeof Math;
+    Number: typeof Number;
+    parseInt: typeof parseInt;
+    parseFloat: typeof parseFloat;
+    Infinity: typeof Infinity;
+    NaN: typeof NaN;
+    Boolean: typeof Boolean;
+    String: typeof String;
+    Array: typeof Array;
+    Object: typeof Object;
+    JSON: typeof JSON;
+}
+/** Build the MDX scope from frontmatter values.
+ *  Includes JS globals so MDX expressions can use Math.round(), parseInt(), etc. */
+export declare function buildMdxScope(fps: number, bpm: number): MdxScope;
+/** Parse YAML frontmatter from mdast. Extracts fps, bpm, width, height, scale. */
+export declare function parseFrontmatter(mdast: Root): VideoFrontmatter;
+/** Compute the closest aspect ratio string from pixel dimensions.
+ *  When `allowedRatios` is provided (e.g. from a model's supported list),
+ *  picks the best match from that list. Otherwise uses STANDARD_RATIOS.
+ *  Reduces to the exact ratio first (e.g. 1920×1080 → 16:9). If the exact
+ *  ratio doesn't match, picks the closest by comparing decimal values.
+ *  Returns '16:9' for invalid inputs. */
+export declare function aspectRatioFromDimensions(width: number, height: number, allowedRatios?: string[]): string;
+export interface MdxSection {
+    heading: string | null;
+    nodes: RootContent[];
+    /** Duration in frames. `null` means "auto-infer from media content". */
+    durationInFrames: number | null;
+}
+export interface SplitResult {
+    sections: MdxSection[];
+    frontmatter: VideoFrontmatter;
+    /** ESM import nodes from the document, needed by SafeMdxRenderer to resolve modules */
+    imports: RootContent[];
+    /** Content nodes before the first heading. Rendered at composition level,
+     *  outside the Series, spanning the full video duration. Use for soundtracks,
+     *  ambient background videos, or any component that should persist across
+     *  all sections. */
+    preamble: RootContent[];
+}
+export declare function splitIntoSections(mdast: Root): SplitResult;
+/** Calculate total composition duration.
+ *  All sections must have resolved (non-null) durations. */
+export declare function calculateTotalDuration(sections: {
+    durationInFrames: number;
+}[]): number;
+/** MdxSection with a guaranteed non-null durationInFrames. */
+export type ResolvedMdxSection = MdxSection & {
+    durationInFrames: number;
+};
+/**
+ * Resolve null (auto) durations using per-section media durations.
+ *
+ * `sectionDurations` is keyed by section index (as string) → max media
+ * duration in seconds. Audio/Video components populate this at runtime
+ * via the media duration store after fetching metadata with mediabunny.
+ *
+ * For each section with `durationInFrames === null`:
+ *   1. Look up the section's index in `sectionDurations`.
+ *   2. If found, set duration = Math.round(seconds * fps).
+ *   3. Otherwise fall back to DEFAULT_SECTION_BEATS * framesPerBeat.
+ *
+ * Sections with explicit durations are returned unchanged.
+ * Generic so extra fields (like `jsx`) are preserved in the return type.
+ */
+export declare function resolveAutoDurations<T extends {
+    durationInFrames: number | null;
+}>(sections: T[], fps: number, bpm: number, sectionDurations?: Record<string, number>): (T & {
+    durationInFrames: number;
+})[];
+export {};
+//# sourceMappingURL=mdx-parse.d.ts.map

package/dist/vite/mdx-parse.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mdx-parse.d.ts","sourceRoot":"","sources":["../../src/vite/mdx-parse.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAKH,KAAK,WAAW,GAAG,GAAG,CAAA;AACtB,KAAK,IAAI,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,WAAW,EAAE,CAAA;CAAE,CAAA;AAiBrD,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd;0FACsF;IACtF,KAAK,EAAE,MAAM,CAAA;CACd;AAED;kFACkF;AAClF,MAAM,WAAW,QAAQ;IACvB,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IAEZ,IAAI,EAAE,OAAO,IAAI,CAAA;IACjB,MAAM,EAAE,OAAO,MAAM,CAAA;IACrB,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,UAAU,EAAE,OAAO,UAAU,CAAA;IAC7B,QAAQ,EAAE,OAAO,QAAQ,CAAA;IACzB,GAAG,EAAE,OAAO,GAAG,CAAA;IACf,OAAO,EAAE,OAAO,OAAO,CAAA;IACvB,MAAM,EAAE,OAAO,MAAM,CAAA;IACrB,KAAK,EAAE,OAAO,KAAK,CAAA;IACnB,MAAM,EAAE,OAAO,MAAM,CAAA;IACrB,IAAI,EAAE,OAAO,IAAI,CAAA;CAClB;AAED;oFACoF;AACpF,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,QAAQ,CAgBhE;AAED,kFAAkF;AAClF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,IAAI,GAAG,gBAAgB,CA4B9D;AAqBD;;;;;yCAKyC;AACzC,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,aAAa,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,CA4BzG;AAiDD,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,KAAK,EAAE,WAAW,EAAE,CAAA;IACpB,wEAAwE;IACxE,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAA;CAChC;AAED,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,UAAU,EAAE,CAAA;IACtB,WAAW,EAAE,gBAAgB,CAAA;IAC7B,uFAAuF;IACvF,OAAO,EAAE,WAAW,EAAE,CAAA;IACtB;;;wBAGoB;IACpB,QAAQ,EAAE,WAAW,EAAE,CAAA;CACxB;AAWD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,IAAI,GAAG,WAAW,CA6C1D;AAED;4DAC4D;AAC5D,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE;IAAE,gBAAgB,EAAE,MAAM,CAAA;CAAE,EAAE,GAAG,MAAM,CAMvF;AAMD,8DAA8D;AAC9D,MAAM,MAAM,kBAAkB,GAAG,UAAU,GAAG;IAAE,gBAAgB,EAAE,MAAM,CAAA;CAAE,CAAA;AAE1E;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,SAAS;IAAE,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,EAChF,QAAQ,EAAE,CAAC,EAAE,EACb,GAAG,EAAE,MAAM,EACX,GAAG,EAAE,MAAM,EACX,gBAAgB,GAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAM,GAC5C,CAAC,CAAC,GAAG;IAAE,gBAAgB,EAAE,MAAM,CAAA;CAAE,CAAC,EAAE,CAgBtC"}

package/dist/vite/mdx-parse.js

@@ -0,0 +1,251 @@
+/**
+ * Server-safe MDX parsing utilities for the video framework.
+ *
+ * This module contains ONLY parsing logic (frontmatter, section splitting,
+ * duration calculation). It does NOT import remotion or any client-only
+ * modules, so it can safely run in the RSC server environment.
+ *
+ * The rendering counterpart is mdx-video.tsx which re-exports these
+ * functions alongside the Remotion components.
+ */
+import YAML from 'yaml';
+// ---------------------------------------------------------------------------
+// Constants
+// ---------------------------------------------------------------------------
+const DEFAULT_FPS = 30;
+const DEFAULT_BPM = 120;
+const DEFAULT_SECTION_BEATS = 10;
+// ---------------------------------------------------------------------------
+// Frontmatter parsing
+// ---------------------------------------------------------------------------
+const DEFAULT_WIDTH = 1920;
+const DEFAULT_HEIGHT = 1080;
+/** Build the MDX scope from frontmatter values.
+ *  Includes JS globals so MDX expressions can use Math.round(), parseInt(), etc. */
+export function buildMdxScope(fps, bpm) {
+    return {
+        FPS: fps,
+        BEAT: fps / (bpm / 60),
+        Math,
+        Number,
+        parseInt,
+        parseFloat,
+        Infinity,
+        NaN,
+        Boolean,
+        String,
+        Array,
+        Object,
+        JSON,
+    };
+}
+/** Parse YAML frontmatter from mdast. Extracts fps, bpm, width, height, scale. */
+export function parseFrontmatter(mdast) {
+    const result = {
+        fps: DEFAULT_FPS,
+        bpm: DEFAULT_BPM,
+        width: DEFAULT_WIDTH,
+        height: DEFAULT_HEIGHT,
+        scale: 1,
+    };
+    for (const node of mdast.children) {
+        if (node.type !== 'yaml')
+            continue;
+        const text = node.value;
+        if (!text)
+            continue;
+        const parsed = YAML.parse(text);
+        if (parsed && typeof parsed === 'object') {
+            if (typeof parsed.fps === 'number' && parsed.fps > 0)
+                result.fps = parsed.fps;
+            if (typeof parsed.bpm === 'number' && parsed.bpm > 0)
+                result.bpm = parsed.bpm;
+            if (typeof parsed.width === 'number') {
+                const w = Math.round(parsed.width);
+                if (w > 0)
+                    result.width = w;
+            }
+            if (typeof parsed.height === 'number') {
+                const h = Math.round(parsed.height);
+                if (h > 0)
+                    result.height = h;
+            }
+            if (typeof parsed.scale === 'number' && parsed.scale > 0)
+                result.scale = parsed.scale;
+        }
+    }
+    return result;
+}
+// ---------------------------------------------------------------------------
+// Aspect ratio from composition dimensions
+// ---------------------------------------------------------------------------
+const STANDARD_RATIOS = [
+    [1, 1], [3, 4], [4, 3], [9, 16], [16, 9],
+    [2, 3], [3, 2], [4, 5], [5, 4], [9, 21], [21, 9],
+];
+function gcd(a, b) {
+    while (b) {
+        [a, b] = [b, a % b];
+    }
+    return a;
+}
+function parseRatio(s) {
+    const [a, b] = s.split(':').map(Number);
+    if (a && b && a > 0 && b > 0)
+        return [a, b];
+}
+/** Compute the closest aspect ratio string from pixel dimensions.
+ *  When `allowedRatios` is provided (e.g. from a model's supported list),
+ *  picks the best match from that list. Otherwise uses STANDARD_RATIOS.
+ *  Reduces to the exact ratio first (e.g. 1920×1080 → 16:9). If the exact
+ *  ratio doesn't match, picks the closest by comparing decimal values.
+ *  Returns '16:9' for invalid inputs. */
+export function aspectRatioFromDimensions(width, height, allowedRatios) {
+    if (!Number.isFinite(width) || !Number.isFinite(height) || width <= 0 || height <= 0) {
+        return '16:9';
+    }
+    const candidates = allowedRatios?.length
+        ? allowedRatios.map(parseRatio).filter((r) => r !== undefined)
+        : STANDARD_RATIOS;
+    if (candidates.length === 0)
+        return '16:9';
+    const d = gcd(width, height);
+    const rw = width / d;
+    const rh = height / d;
+    // Check exact match first
+    if (candidates.some(([w, h]) => w === rw && h === rh)) {
+        return `${rw}:${rh}`;
+    }
+    // Find closest by decimal value
+    const target = width / height;
+    let best = candidates[0];
+    let bestDiff = Infinity;
+    for (const ratio of candidates) {
+        const diff = Math.abs(ratio[0] / ratio[1] - target);
+        if (diff < bestDiff) {
+            bestDiff = diff;
+            best = ratio;
+        }
+    }
+    return `${best[0]}:${best[1]}`;
+}
+// ---------------------------------------------------------------------------
+// Duration parsing from heading text
+// ---------------------------------------------------------------------------
+const HEADING_PROP_RE = /\s+(duration)=(\d+(?:\.\d+)?)(s|fps|frames?|f|beats?)?/gi;
+function parseHeadingProps(rawText, fps, bpm) {
+    let label = rawText;
+    let durationInFrames = null;
+    const framesPerBeat = fps / (bpm / 60);
+    // Strip all key=value props from the heading text
+    label = label.replace(HEADING_PROP_RE, (_match, key, value, unit) => {
+        const v = Number(value);
+        const u = (unit || '').toLowerCase();
+        let frames;
+        if (u === 's') {
+            frames = Math.round(v * fps);
+        }
+        else if (u === 'beat' || u === 'beats') {
+            frames = Math.round(v * framesPerBeat);
+        }
+        else {
+            // bare number, fps, f, frame, frames — all mean raw frames
+            frames = Math.round(v);
+        }
+        if (key.toLowerCase() === 'duration') {
+            durationInFrames = frames;
+        }
+        return '';
+    }).trim();
+    return { label: label || 'Untitled', durationInFrames };
+}
+function extractHeadingText(node) {
+    if (node.type !== 'heading')
+        return '';
+    const parts = [];
+    for (const child of node.children || []) {
+        if (child.type === 'text')
+            parts.push(child.value);
+    }
+    return parts.join('') || 'Untitled';
+}
+export function splitIntoSections(mdast) {
+    const frontmatter = parseFrontmatter(mdast);
+    const { fps, bpm } = frontmatter;
+    const framesPerBeat = fps / (bpm / 60);
+    const defaultDuration = Math.round(DEFAULT_SECTION_BEATS * framesPerBeat);
+    const sections = [];
+    const imports = [];
+    const preamble = [];
+    let current = null;
+    let beforeFirstHeading = true;
+    for (const node of mdast.children) {
+        if (node.type === 'yaml' || node.type === 'toml') {
+            continue;
+        }
+        if (node.type === 'mdxjsEsm') {
+            imports.push(node);
+            continue;
+        }
+        if (node.type === 'heading') {
+            beforeFirstHeading = false;
+            const rawText = extractHeadingText(node);
+            const parsed = parseHeadingProps(rawText, fps, bpm);
+            current = {
+                heading: parsed.label,
+                nodes: [],
+                durationInFrames: parsed.durationInFrames ?? null,
+            };
+            sections.push(current);
+            continue;
+        }
+        // Content before the first heading goes into the preamble, which is
+        // rendered at composition level (outside Series) so it spans the
+        // full video duration.
+        if (beforeFirstHeading) {
+            preamble.push(node);
+        }
+        else if (current) {
+            current.nodes.push(node);
+        }
+    }
+    return { sections, frontmatter, imports, preamble };
+}
+/** Calculate total composition duration.
+ *  All sections must have resolved (non-null) durations. */
+export function calculateTotalDuration(sections) {
+    let total = 0;
+    for (const s of sections) {
+        total += s.durationInFrames;
+    }
+    return total;
+}
+/**
+ * Resolve null (auto) durations using per-section media durations.
+ *
+ * `sectionDurations` is keyed by section index (as string) → max media
+ * duration in seconds. Audio/Video components populate this at runtime
+ * via the media duration store after fetching metadata with mediabunny.
+ *
+ * For each section with `durationInFrames === null`:
+ *   1. Look up the section's index in `sectionDurations`.
+ *   2. If found, set duration = Math.round(seconds * fps).
+ *   3. Otherwise fall back to DEFAULT_SECTION_BEATS * framesPerBeat.
+ *
+ * Sections with explicit durations are returned unchanged.
+ * Generic so extra fields (like `jsx`) are preserved in the return type.
+ */
+export function resolveAutoDurations(sections, fps, bpm, sectionDurations = {}) {
+    const framesPerBeat = fps / (bpm / 60);
+    const defaultDuration = Math.round(DEFAULT_SECTION_BEATS * framesPerBeat);
+    return sections.map((section, i) => {
+        if (section.durationInFrames !== null) {
+            return section;
+        }
+        const seconds = sectionDurations[String(i)];
+        const durationInFrames = seconds !== undefined && seconds > 0
+            ? Math.round(seconds * fps)
+            : defaultDuration;
+        return { ...section, durationInFrames };
+    });
+}

package/dist/vite/mdx-provided-components.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Global MDXProvidedComponents type for MDX LSP support.
+ *
+ * The MDX analyzer (mdx-analyzer / vscode-mdx) uses the special global type
+ * `MDXProvidedComponents` to know which components are available in MDX files
+ * without explicit imports. This file declares that type from the same
+ * MDX_BUILTIN_COMPONENTS map that the runtime uses, keeping them in sync.
+ *
+ * Projects opt in by having an `egaki-env.d.ts` with:
+ *   /// <reference types="egaki/mdx-components" />
+ *
+ * The egaki vite plugin auto-generates this file on first run.
+ */
+import { MDX_BUILTIN_COMPONENTS } from './mdx-video.tsx';
+declare global {
+    type MDXProvidedComponents = typeof MDX_BUILTIN_COMPONENTS;
+}
+//# sourceMappingURL=mdx-provided-components.d.ts.map

package/dist/vite/mdx-provided-components.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mdx-provided-components.d.ts","sourceRoot":"","sources":["../../src/vite/mdx-provided-components.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAA;AAExD,OAAO,CAAC,MAAM,CAAC;IACb,KAAK,qBAAqB,GAAG,OAAO,sBAAsB,CAAA;CAC3D"}

package/dist/vite/mdx-provided-components.js

@@ -0,0 +1,14 @@
+/**
+ * Global MDXProvidedComponents type for MDX LSP support.
+ *
+ * The MDX analyzer (mdx-analyzer / vscode-mdx) uses the special global type
+ * `MDXProvidedComponents` to know which components are available in MDX files
+ * without explicit imports. This file declares that type from the same
+ * MDX_BUILTIN_COMPONENTS map that the runtime uses, keeping them in sync.
+ *
+ * Projects opt in by having an `egaki-env.d.ts` with:
+ *   /// <reference types="egaki/mdx-components" />
+ *
+ * The egaki vite plugin auto-generates this file on first run.
+ */
+import { MDX_BUILTIN_COMPONENTS } from "./mdx-video.js";