@smoove/studio 0.1.1

package/dist/components/render/render-dialog.js

@@ -0,0 +1,95 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { useComposition } from "../../hooks/use-composition.js";
+import { useStudio } from "../../hooks/use-studio.js";
+import { cn } from "../../lib/cn.js";
+import { estMB, FORMATS, prettyMB, QUALITY, RES_PRESETS } from "../../lib/constants.js";
+import { fmtTime } from "../../lib/format.js";
+import { useSignalValue } from "../../signals/signal-bridge.js";
+import { Button } from "../button/button.js";
+import { Icon } from "../icon/icon.js";
+import { StDialog } from "../primitives/dialog.js";
+import { StNumberField } from "../primitives/number-field.js";
+import { StSelect } from "../primitives/select.js";
+const Field = ({ label, children }) => (_jsxs("div", { className: "mb-4", children: [_jsx("span", { className: "block text-[11.5px] font-semibold text-ink-2 mb-1.5", children: label }), children] }));
+/** Server-render dialog (mocked): format/quality/resolution/fps/range → enqueue. */
+export function RenderDialog({ open, onOpenChange, onSubmitted, }) {
+    const store = useStudio();
+    const { composition: comp, entry } = useComposition();
+    const region = useSignalValue(store.region);
+    const compFps = comp?.fps ?? 30;
+    const total = comp ? comp.durationInFrames.get() : 0;
+    const baseW = comp?.width() ?? 1280;
+    const baseH = comp?.height() ?? 720;
+    const durSec = total / compFps;
+    const [format, setFormat] = useState("mp4");
+    const [quality, setQuality] = useState("standard");
+    const [preset, setPreset] = useState("720p");
+    const [w, setW] = useState(baseW);
+    const [h, setH] = useState(baseH);
+    const [rfps, setRfps] = useState(compFps);
+    const [range, setRange] = useState("full");
+    const hasRegion = region.in != null || region.out != null;
+    useEffect(() => {
+        if (open) {
+            setRfps(compFps);
+            setRange("full");
+            setW(baseW);
+            setH(baseH);
+        }
+    }, [open, compFps, baseW, baseH]);
+    const applyPreset = (p) => {
+        setPreset(p);
+        const f = RES_PRESETS.find((x) => x.value === p);
+        if (f?.w && f?.h) {
+            setW(f.w);
+            setH(f.h);
+        }
+    };
+    const editDim = (which, val) => {
+        const v = Math.max(16, Math.min(7680, Math.round(val || 0)));
+        if (which === "w")
+            setW(v);
+        else
+            setH(v);
+        setPreset("custom");
+    };
+    const den = Math.max(1, total - 1);
+    const inFrame = region.in ?? 0;
+    const outFrame = region.out ?? den;
+    const rangeDurSec = range === "region" && hasRegion ? (outFrame - inFrame) / compFps : durSec;
+    const frames = Math.max(1, Math.round(rangeDurSec * rfps));
+    const qf = QUALITY.find((q) => q.value === quality)?.f ?? 0.16;
+    const mul = FORMATS.find((x) => x.value === format)?.mul ?? 1;
+    const mb = estMB(w, h, frames, qf, mul);
+    const title = entry?.title ?? entry?.id ?? "Composition";
+    const submit = () => {
+        store.startRender({
+            id: store.selectedId.get(),
+            kind: "video",
+            comp: title,
+            // The live props drive the preview; send them so the render matches it.
+            props: comp?.props.get(),
+            format,
+            quality,
+            w,
+            h,
+            fps: rfps,
+            frames,
+            ...(range === "region" && hasRegion ? { from: inFrame, to: outFrame } : {}),
+            rangeLabel: range === "region" && hasRegion
+                ? `${fmtTime(inFrame / compFps)}–${fmtTime(outFrame / compFps)}`
+                : `Full · ${fmtTime(durSec)}`,
+            sizeEst: mb,
+        });
+        onOpenChange(false);
+        onSubmitted?.();
+    };
+    const D = StDialog;
+    return (_jsx(D, { open: open, onOpenChange: onOpenChange, children: _jsxs(D.Popup, { width: 500, children: [_jsx(D.Header, { icon: "server", title: "Render on server" }), _jsxs(D.Body, { children: [_jsxs("div", { className: "flex items-center gap-3 p-3 bg-bg-2 border border-line rounded-ui mb-4.5", children: [_jsx("span", { className: "size-8 flex-none grid place-items-center rounded-ui bg-bg-1 border border-line text-accent-2", children: _jsx(Icon, { name: "film", size: 15 }) }), _jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-[13.5px] font-bold text-ink-1 truncate", children: title }), _jsxs("div", { className: "text-[11px] text-ink-3 font-mono mt-0.5 truncate", children: [entry?.group ?? "Compositions", " \u00B7 ", durSec.toFixed(1), "s source"] })] })] }), _jsx(Field, { label: "Format", children: _jsx(StSelect, { value: format, onValueChange: setFormat, options: FORMATS }) }), _jsx(Field, { label: "Quality", children: _jsx(StSelect, { value: quality, onValueChange: setQuality, options: QUALITY }) }), _jsxs(Field, { label: "Resolution", children: [_jsx(StSelect, { value: preset, onValueChange: applyPreset, options: RES_PRESETS }), _jsxs("div", { className: "flex items-center gap-2 mt-2.5", children: [_jsx(StNumberField, { value: w, onValueChange: (v) => editDim("w", v), suffix: "W", min: 16, max: 7680 }), _jsx("span", { className: "text-ink-3", children: _jsx(Icon, { name: "close", size: 12 }) }), _jsx(StNumberField, { value: h, onValueChange: (v) => editDim("h", v), suffix: "H", min: 16, max: 7680 })] })] }), _jsxs("div", { className: "flex gap-3.5", children: [_jsx(Field, { label: "Frame rate", children: _jsx(StNumberField, { value: rfps, onValueChange: (v) => setRfps(Math.max(1, Math.min(120, v))), suffix: "fps", min: 1, max: 120 }) }), _jsx(Field, { label: "Range", children: _jsxs("div", { className: "flex bg-bg-2 border border-line rounded-control p-[3px] gap-[3px]", children: [_jsx("button", { type: "button", onClick: () => setRange("full"), className: cn("flex-1 text-[12px] font-semibold py-[7px] rounded-[5px]", range === "full"
+                                                    ? "bg-bg-0 text-ink-1 shadow-[0_1px_4px_rgba(0,0,0,.3)]"
+                                                    : "text-ink-3 hover:text-ink-1"), children: "Full" }), _jsx("button", { type: "button", onClick: () => hasRegion && setRange("region"), disabled: !hasRegion, title: hasRegion ? "" : "Set In/Out first", className: cn("flex-1 text-[12px] font-semibold py-[7px] rounded-[5px] disabled:opacity-40 disabled:cursor-not-allowed", range === "region"
+                                                    ? "bg-bg-0 text-ink-1 shadow-[0_1px_4px_rgba(0,0,0,.3)]"
+                                                    : "text-ink-3 hover:text-ink-1"), children: "Loop region" })] }) })] })] }), _jsxs(D.Footer, { children: [_jsxs("div", { className: "flex items-center gap-1.5 font-mono text-[11.5px] text-ink-2 whitespace-nowrap", children: [_jsx(Icon, { name: "film", size: 13, className: "text-ink-3" }), _jsxs("span", { children: [frames.toLocaleString(), " frames \u00B7 ~", prettyMB(mb)] })] }), _jsxs("div", { className: "flex items-center gap-2 ml-auto shrink-0", children: [_jsx(D.Close, { render: _jsx(Button, { tone: "ghost", children: "Cancel" }) }), _jsx(Button, { tone: "primary", icon: "server", onClick: submit, children: "Render" })] })] })] }) }));
+}
+//# sourceMappingURL=render-dialog.js.map

package/dist/components/render/render-dialog.js.map

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

package/dist/components/render/render-queue.d.ts

@@ -0,0 +1,5 @@
+/** Render queue view: job list with live progress + download/cancel/remove. */
+export declare function RenderQueue({ className }: {
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=render-queue.d.ts.map

package/dist/components/render/render-queue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"render-queue.d.ts","sourceRoot":"","sources":["../../../src/components/render/render-queue.tsx"],"names":[],"mappings":"AAuBA,+EAA+E;AAC/E,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,2CA6IhE"}

package/dist/components/render/render-queue.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useStudio } from "../../hooks/use-studio.js";
+import { cn } from "../../lib/cn.js";
+import { prettyMB } from "../../lib/constants.js";
+import { useSignalValue } from "../../signals/signal-bridge.js";
+import { Button } from "../button/button.js";
+import { IconButton } from "../button/icon-button.js";
+import { Icon } from "../icon/icon.js";
+import { StTooltip } from "../primitives/tooltip.js";
+const STATUS = {
+    queued: { label: "Queued", icon: "clock", cls: "text-ink-2 bg-bg-2 border-line" },
+    rendering: {
+        label: "Rendering",
+        icon: "loader",
+        cls: "text-accent-2 bg-accent-soft border-accent/35",
+    },
+    done: { label: "Ready", icon: "check", cls: "text-good bg-good/12 border-good/30" },
+    canceled: { label: "Canceled", icon: "close", cls: "text-ink-3 bg-bg-2 border-line" },
+    error: { label: "Failed", icon: "close", cls: "text-danger bg-danger/12 border-danger/30" },
+};
+/** Render queue view: job list with live progress + download/cancel/remove. */
+export function RenderQueue({ className }) {
+    const store = useStudio();
+    const jobs = useSignalValue(store.jobs);
+    const active = jobs.filter((j) => j.status === "queued" || j.status === "rendering").length;
+    const done = jobs.filter((j) => j.status === "done").length;
+    return (_jsxs("div", { className: cn("flex-1 min-h-0 flex flex-col", className), style: {
+            background: "radial-gradient(120% 90% at 50% 0%, #16151c 0%, var(--color-bg-0) 70%)",
+        }, children: [_jsxs("div", { className: "flex items-center gap-4 px-5.5 py-3.5 border-b border-line", children: [_jsxs("div", { className: "flex items-center gap-4.5 text-[12px] text-ink-3", children: [_jsxs("span", { children: [_jsx("b", { className: "font-mono text-[14px] text-ink-1 mr-1", children: active }), "active"] }), _jsxs("span", { children: [_jsx("b", { className: "font-mono text-[14px] text-ink-1 mr-1", children: done }), "ready"] }), _jsxs("span", { children: [_jsx("b", { className: "font-mono text-[14px] text-ink-1 mr-1", children: jobs.length }), "total"] })] }), _jsx("div", { className: "flex-1" }), done > 0 && (_jsx(Button, { size: "sm", tone: "ghost", icon: "trash", onClick: store.clearDone, children: "Clear ready" }))] }), _jsx("div", { className: "flex-1 min-h-0 overflow-y-auto scroll px-5.5 py-4 flex flex-col gap-2.5", children: jobs.length === 0 ? (_jsxs("div", { className: "flex flex-col items-center justify-center text-center h-full text-ink-3 gap-3", children: [_jsx("div", { className: "size-[52px] rounded-2xl bg-bg-2 grid place-items-center border border-line text-ink-3", children: _jsx(Icon, { name: "server", size: 22 }) }), _jsx("h4", { className: "m-0 mt-1 text-[15px] font-bold text-ink-1", children: "No render jobs yet" }), _jsx("p", { className: "m-0 text-[13px] leading-relaxed max-w-[260px]", children: "Renders and frame exports you queue will appear here with live progress." })] })) : (jobs.map((j) => {
+                    const sm = STATUS[j.status];
+                    const isStill = j.kind === "still";
+                    return (_jsxs("div", { className: cn("flex items-center gap-3.5 bg-bg-1 border rounded-ui p-3.5", j.status === "done" ? "border-good/20" : "border-line"), children: [_jsx("div", { className: "size-[46px] flex-none rounded-[9px] grid place-items-center border border-line-2", style: {
+                                    background: isStill
+                                        ? "linear-gradient(140deg,#4d2f1a,#16161b)"
+                                        : "linear-gradient(140deg,#3a1f1a,#16161b)",
+                                    color: "var(--color-accent-2)",
+                                }, children: _jsx(Icon, { name: isStill ? "camera" : "film", size: 18 }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2.5", children: [_jsx("span", { className: "text-[13.5px] font-bold text-ink-1 truncate", children: j.comp }), _jsxs("span", { className: cn("inline-flex items-center gap-1 text-[10.5px] font-semibold px-2 py-0.5 rounded-full border", sm.cls), children: [_jsx(Icon, { name: sm.icon, size: 11, className: j.status === "rendering" ? "spin" : "" }), sm.label] })] }), _jsxs("div", { className: "flex items-center gap-2 text-[11px] font-mono text-ink-3 mt-1.5 flex-wrap", children: [_jsx("span", { children: j.format.toUpperCase() }), _jsx("span", { className: "text-line-2", children: "\u00B7" }), _jsxs("span", { children: [j.w, "\u00D7", j.h] }), _jsx("span", { className: "text-line-2", children: "\u00B7" }), _jsxs("span", { children: [j.fps, "fps"] }), _jsx("span", { className: "text-line-2", children: "\u00B7" }), _jsxs("span", { children: [j.frames.toLocaleString(), "f"] }), _jsx("span", { className: "text-line-2", children: "\u00B7" }), _jsx("span", { children: j.rangeLabel }), _jsx("span", { className: "text-line-2", children: "\u00B7" }), _jsxs("span", { children: ["~", prettyMB(j.sizeEst)] })] }), !isStill && (j.status === "queued" || j.status === "rendering") && (_jsxs("div", { className: "flex items-center gap-2.5 mt-2", children: [_jsx("div", { className: "flex-1 h-1 rounded-full bg-bg-3 overflow-hidden", children: _jsx("div", { className: "h-full bg-accent rounded-full transition-[width]", style: { width: `${Math.round(j.progress * 100)}%` } }) }), _jsxs("span", { className: "font-mono text-[10.5px] text-ink-2 w-9 text-right", children: [Math.round(j.progress * 100), "%"] })] }))] }), _jsxs("div", { className: "flex items-center gap-0.5", children: [j.status === "done" && (_jsx(StTooltip, { content: "Download", children: _jsx(IconButton, { size: "sm", icon: "download", onClick: () => store.downloadJob(j) }) })), (j.status === "queued" || j.status === "rendering") && (_jsx(StTooltip, { content: "Cancel", children: _jsx(IconButton, { size: "sm", icon: "close", onClick: () => store.cancelJob(j.jobId) }) })), _jsx(StTooltip, { content: "Remove", children: _jsx(IconButton, { size: "sm", tone: "danger", icon: "trash", iconSize: 15, onClick: () => store.removeJob(j.jobId) }) })] })] }, j.jobId));
+                })) })] }));
+}
+//# sourceMappingURL=render-queue.js.map

package/dist/components/render/render-queue.js.map

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

package/dist/components/right-panel/panel-handle.d.ts

@@ -0,0 +1,3 @@
+/** The collapsed right-panel rail. */
+export declare function PanelHandle(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=panel-handle.d.ts.map

package/dist/components/right-panel/panel-handle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-handle.d.ts","sourceRoot":"","sources":["../../../src/components/right-panel/panel-handle.tsx"],"names":[],"mappings":"AAGA,sCAAsC;AACtC,wBAAgB,WAAW,4CAqB1B"}

package/dist/components/right-panel/panel-handle.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useStudio } from "../../hooks/use-studio.js";
+import { Icon } from "../icon/icon.js";
+/** The collapsed right-panel rail. */
+export function PanelHandle() {
+    const store = useStudio();
+    return (_jsxs("div", { className: "w-[26px] flex-none bg-bg-1 border-l border-line flex flex-col items-center pt-3 gap-3.5", children: [_jsx("button", { type: "button", onClick: () => store.setPanelOpen(true), className: "size-[26px] grid place-items-center text-ink-3 rounded-[6px] hover:text-ink-1 hover:bg-bg-2", title: "Open panel", children: _jsx(Icon, { name: "panelRight", size: 16 }) }), _jsx("button", { type: "button", onClick: () => store.setPanelOpen(true), className: "[writing-mode:vertical-rl] text-[10.5px] font-bold tracking-[.12em] uppercase text-ink-3 hover:text-ink-2 mt-1", children: "Inspector" })] }));
+}
+//# sourceMappingURL=panel-handle.js.map

package/dist/components/right-panel/panel-handle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-handle.js","sourceRoot":"","sources":["../../../src/components/right-panel/panel-handle.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEvC,sCAAsC;AACtC,MAAM,UAAU,WAAW;IACzB,MAAM,KAAK,GAAG,SAAS,EAAE,CAAC;IAC1B,OAAO,CACL,eAAK,SAAS,EAAC,yFAAyF,aACtG,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,EACvC,SAAS,EAAC,6FAA6F,EACvG,KAAK,EAAC,YAAY,YAElB,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,EAAC,IAAI,EAAE,EAAE,GAAI,GAC7B,EACT,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,EACvC,SAAS,EAAC,gHAAgH,0BAGnH,IACL,CACP,CAAC;AACJ,CAAC"}

package/dist/components/right-panel/panel-tabs.d.ts

@@ -0,0 +1,3 @@
+/** Props (schema form) / Info tabs for the active composition. */
+export declare function PanelTabs(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=panel-tabs.d.ts.map

package/dist/components/right-panel/panel-tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-tabs.d.ts","sourceRoot":"","sources":["../../../src/components/right-panel/panel-tabs.tsx"],"names":[],"mappings":"AAQA,kEAAkE;AAClE,wBAAgB,SAAS,4CAwDxB"}

package/dist/components/right-panel/panel-tabs.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useComposition } from "../../hooks/use-composition.js";
+import { useStudio } from "../../hooks/use-studio.js";
+import { useSignalValue } from "../../signals/signal-bridge.js";
+import { IconButton } from "../button/icon-button.js";
+import { StTabs, Tab, TabList, TabPanel } from "../primitives/tabs.js";
+import { StTooltip } from "../primitives/tooltip.js";
+import { SchemaForm } from "../schema-form/schema-form.js";
+/** Props (schema form) / Info tabs for the active composition. */
+export function PanelTabs() {
+    const store = useStudio();
+    const tab = useSignalValue(store.panelTab);
+    const { composition: comp, entry } = useComposition();
+    return (_jsxs(StTabs, { value: tab, onValueChange: (v) => store.setPanelTab(v), children: [_jsxs(TabList, { children: [_jsx(Tab, { value: "props", icon: "sliders", children: "Props" }), _jsx(Tab, { value: "info", icon: "info", children: "Info" }), _jsx("div", { className: "flex-1" }), _jsx("div", { className: "flex items-center pr-1", children: _jsx(StTooltip, { content: "Collapse", children: _jsx(IconButton, { size: "sm", icon: "close", onClick: () => store.setPanelOpen(false) }) }) })] }), _jsx(TabPanel, { value: "props", className: "p-4", children: _jsx(SchemaForm, {}) }), _jsxs(TabPanel, { value: "info", className: "p-4", children: [entry?.description && (_jsx("p", { className: "text-[13px] leading-relaxed text-ink-2 mt-0 mb-4.5", children: entry.description })), (entry?.tags ?? []).length > 0 && (_jsx("div", { className: "flex gap-1.5 flex-wrap mb-4.5", children: entry?.tags?.map((t) => (_jsxs("span", { className: "text-[11px] text-ink-2 bg-bg-2 border border-line rounded-full px-2.5 py-0.5", children: ["#", t] }, t))) })), comp ? (_jsx(InfoRows, { group: entry?.group ?? "Compositions", durationS: comp.durationInFrames.get() / comp.fps, fps: comp.fps, frames: comp.durationInFrames.get(), size: `${comp.width()}×${comp.height()}` })) : (_jsx("div", { className: "text-[12.5px] text-ink-3", children: "Loading\u2026" }))] })] }));
+}
+function InfoRows({ group, durationS, fps, frames, size, }) {
+    const rows = [
+        ["Subject", group],
+        ["Duration", `${durationS.toFixed(1)}s`],
+        ["Frame rate", `${fps} fps`],
+        ["Frames", String(frames)],
+        ["Composition", size],
+    ];
+    return (_jsx(_Fragment, { children: rows.map(([k, v]) => (_jsxs("div", { className: "flex justify-between py-2.5 border-b border-line last:border-0 text-[13px]", children: [_jsx("span", { className: "text-ink-3", children: k }), _jsx("span", { className: "text-ink-1 font-mono text-[12px]", children: v })] }, k))) }));
+}
+//# sourceMappingURL=panel-tabs.js.map

package/dist/components/right-panel/panel-tabs.js.map

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

package/dist/components/right-panel/panel.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from "react";
+/** Right inspector. Collapses to a handle; defaults to the Props/Info tabs. */
+export declare function Panel({ children, width, className, }: {
+    children?: ReactNode;
+    width?: string;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=panel.d.ts.map

package/dist/components/right-panel/panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../../src/components/right-panel/panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC,+EAA+E;AAC/E,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,KAAK,EACL,SAAS,GACV,EAAE;IACD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAaA"}

package/dist/components/right-panel/panel.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useStudio } from "../../hooks/use-studio.js";
+import { cn } from "../../lib/cn.js";
+import { useSignalValue } from "../../signals/signal-bridge.js";
+import { PanelHandle } from "./panel-handle.js";
+import { PanelTabs } from "./panel-tabs.js";
+/** Right inspector. Collapses to a handle; defaults to the Props/Info tabs. */
+export function Panel({ children, width, className, }) {
+    const store = useStudio();
+    const open = useSignalValue(store.panelOpen);
+    if (!open)
+        return _jsx(PanelHandle, {});
+    const w = width ?? "var(--spacing-panel)";
+    return (_jsx("div", { className: cn("flex flex-col min-h-0 bg-bg-1 border-l border-line", className), style: { width: w, flex: `0 0 ${w}` }, children: children ?? _jsx(PanelTabs, {}) }));
+}
+//# sourceMappingURL=panel.js.map

package/dist/components/right-panel/panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.js","sourceRoot":"","sources":["../../../src/components/right-panel/panel.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,+EAA+E;AAC/E,MAAM,UAAU,KAAK,CAAC,EACpB,QAAQ,EACR,KAAK,EACL,SAAS,GAKV;IACC,MAAM,KAAK,GAAG,SAAS,EAAE,CAAC;IAC1B,MAAM,IAAI,GAAG,cAAc,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7C,IAAI,CAAC,IAAI;QAAE,OAAO,KAAC,WAAW,KAAG,CAAC;IAClC,MAAM,CAAC,GAAG,KAAK,IAAI,sBAAsB,CAAC;IAC1C,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CAAC,oDAAoD,EAAE,SAAS,CAAC,EAC9E,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,CAAC,EAAE,EAAE,YAEpC,QAAQ,IAAI,KAAC,SAAS,KAAG,GACtB,CACP,CAAC;AACJ,CAAC"}

package/dist/components/schema-form/field.d.ts

@@ -0,0 +1,9 @@
+import type { SmooveField } from "../../schema/types.js";
+type FieldProps = {
+    field: SmooveField;
+    value: unknown;
+    onChange: (value: unknown) => void;
+};
+export declare function Field({ field, value, onChange }: FieldProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=field.d.ts.map

package/dist/components/schema-form/field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../../src/components/schema-form/field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAMzD,KAAK,UAAU,GAAG;IAAE,KAAK,EAAE,WAAW,CAAC;IAAC,KAAK,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;CAAE,CAAC;AAM7F,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,UAAU,2CAsP3D"}

package/dist/components/schema-form/field.js

@@ -0,0 +1,102 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../../lib/cn.js";
+import { Icon } from "../icon/icon.js";
+import { StSelect } from "../primitives/select.js";
+import { StSlider } from "../primitives/slider.js";
+import { StSwitch } from "../primitives/switch.js";
+const labelCls = "text-[12.5px] text-ink-2 font-medium";
+const inputCls = "w-full bg-bg-2 border border-line rounded-control text-[13px] text-ink-1 placeholder:text-ink-3 px-3 py-2 outline-none focus:border-accent focus:shadow-[0_0_0_3px_var(--color-accent-soft)]";
+export function Field({ field, value, onChange }) {
+    switch (field.type) {
+        case "divider":
+            return (_jsxs("div", { className: "flex items-center gap-2.5 mt-5 mb-3 first:mt-0", children: [field.label && (_jsx("span", { className: "text-[10.5px] font-bold tracking-[.08em] uppercase text-ink-3", children: field.label })), _jsx("span", { className: "flex-1 h-px bg-line" })] }));
+        case "boolean":
+            return (_jsxs("div", { className: "mb-4 flex items-center justify-between gap-3", children: [_jsx("span", { className: labelCls, children: field.label }), _jsx(StSwitch, { checked: Boolean(value), onCheckedChange: onChange })] }));
+        case "text":
+            return (_jsx(Labeled, { label: field.label, description: field.description, children: _jsx("input", { value: String(value ?? ""), placeholder: field.placeholder, onChange: (e) => onChange(e.target.value), className: inputCls }) }));
+        case "multiline":
+            return (_jsx(Labeled, { label: field.label, description: field.description, children: _jsx("textarea", { value: String(value ?? ""), placeholder: field.placeholder, rows: field.rows ?? 3, onChange: (e) => onChange(e.target.value), className: cn(inputCls, "resize-y leading-relaxed") }) }));
+        case "number": {
+            const num = typeof value === "number" ? value : (field.default ?? field.min ?? 0);
+            const slider = field.min != null && field.max != null;
+            return (_jsxs("div", { className: "mb-4", children: [_jsxs("div", { className: "flex items-center justify-between mb-2", children: [_jsx("span", { className: labelCls, children: field.label }), _jsxs("span", { className: "font-mono text-[11.5px] text-ink-1 bg-bg-2 border border-line px-2 py-0.5 rounded-[5px]", children: [num, field.unit ?? ""] })] }), slider ? (_jsx(StSlider, { value: num, min: field.min, max: field.max, step: field.step ?? 1, onValueChange: onChange })) : (_jsx("input", { type: "number", value: num, step: field.step ?? 1, onChange: (e) => onChange(Number(e.target.value)), className: inputCls }))] }));
+        }
+        case "color": {
+            const swatches = field.swatches ?? ["#ffffff", "#ff5640", "#2bd9c4", "#ff8a3d", "#ff5d8f"];
+            const current = String(value ?? field.default ?? "#ffffff");
+            return (_jsx(Labeled, { label: field.label, description: field.description, children: _jsxs("div", { className: "flex gap-2 flex-wrap items-center", children: [swatches.map((c) => (_jsx("button", { type: "button", onClick: () => onChange(c), className: cn("size-[26px] rounded-[7px] shadow-[0_0_0_1px_rgba(255,255,255,.1)_inset]", current === c && "ring-2 ring-accent-2 ring-offset-2 ring-offset-bg-1"), style: { background: c } }, c))), _jsx("input", { value: current, onChange: (e) => onChange(e.target.value), className: "w-[88px] bg-bg-2 border border-line rounded-control text-[12px] font-mono text-ink-1 px-2 py-1.5 outline-none focus:border-line-2" })] }) }));
+        }
+        case "select":
+            return (_jsx(Labeled, { label: field.label, description: field.description, children: _jsx(StSelect, { value: String(value ?? field.default ?? field.options[0]?.value ?? ""), onValueChange: onChange, options: field.options }) }));
+        case "multiselect": {
+            const selected = Array.isArray(value) ? value : [];
+            const toggle = (v) => onChange(selected.includes(v) ? selected.filter((x) => x !== v) : [...selected, v]);
+            return (_jsx(Labeled, { label: field.label, description: field.description, children: _jsx("div", { className: "flex gap-1.5 flex-wrap", children: field.options.map((o) => {
+                        const on = selected.includes(o.value);
+                        return (_jsx("button", { type: "button", onClick: () => toggle(o.value), className: cn("text-[12px] font-medium rounded-full px-2.5 py-1 border transition-colors", on
+                                ? "bg-accent-soft border-accent-line text-white"
+                                : "bg-bg-2 border-line text-ink-2 hover:text-ink-1"), children: o.label }, o.value));
+                    }) }) }));
+        }
+        case "object": {
+            const obj = isObj(value) ? value : {};
+            return (_jsxs("div", { className: "mb-4 rounded-ui border border-line bg-bg-2/40 p-3", children: [field.label && (_jsx("div", { className: "text-[11px] font-bold tracking-[.06em] uppercase text-ink-3 mb-2.5", children: field.label })), Object.entries(field.fields).map(([k, f]) => (_jsx(Field, { field: f, value: obj[k], onChange: (v) => onChange({ ...obj, [k]: v }) }, k)))] }));
+        }
+        case "array": {
+            const items = Array.isArray(value) ? value : [];
+            const setItem = (i, v) => onChange(items.map((it, idx) => (idx === i ? v : it)));
+            const removeItem = (i) => onChange(items.filter((_, idx) => idx !== i));
+            const move = (i, dir) => {
+                const j = i + dir;
+                if (j < 0 || j >= items.length)
+                    return;
+                const next = items.slice();
+                const a = next[i];
+                const b = next[j];
+                next[i] = b;
+                next[j] = a;
+                onChange(next);
+            };
+            const add = () => onChange([...items, defaultItem(field.of)]);
+            const atMax = field.max != null && items.length >= field.max;
+            const atMin = field.min != null && items.length <= field.min;
+            return (_jsxs("div", { className: "mb-4", children: [_jsxs("div", { className: "flex items-center justify-between mb-2", children: [_jsx("span", { className: labelCls, children: field.label }), _jsx("span", { className: "text-[10.5px] font-mono text-ink-3", children: items.length })] }), _jsx("div", { className: "flex flex-col gap-2", children: items.map((it, i) => (_jsxs("div", { className: "rounded-control border border-line bg-bg-2/40 p-2.5", children: [_jsxs("div", { className: "flex items-center gap-1 mb-1.5", children: [_jsxs("span", { className: "text-[10.5px] font-mono text-ink-3 flex-1", children: [field.itemLabel ?? "Item", " ", i + 1] }), _jsx("button", { type: "button", onClick: () => move(i, -1), disabled: i === 0, className: "size-6 grid place-items-center rounded text-ink-3 hover:text-ink-1 hover:bg-bg-3 disabled:opacity-30 rotate-180", title: "Move up", children: _jsx(Icon, { name: "chevron", size: 13 }) }), _jsx("button", { type: "button", onClick: () => move(i, 1), disabled: i === items.length - 1, className: "size-6 grid place-items-center rounded text-ink-3 hover:text-ink-1 hover:bg-bg-3 disabled:opacity-30", title: "Move down", children: _jsx(Icon, { name: "chevron", size: 13 }) }), _jsx("button", { type: "button", onClick: () => removeItem(i), disabled: atMin, className: "size-6 grid place-items-center rounded text-ink-3 hover:text-danger hover:bg-danger/12 disabled:opacity-30", title: "Remove", children: _jsx(Icon, { name: "trash", size: 14 }) })] }), _jsx(Field, { field: field.of, value: it, onChange: (v) => setItem(i, v) })] }, i))) }), _jsxs("button", { type: "button", onClick: add, disabled: atMax, className: "mt-2 flex items-center justify-center gap-1.5 w-full text-[12px] font-medium text-ink-2 bg-bg-2 border border-line border-dashed rounded-control py-2 hover:text-ink-1 hover:border-line-2 disabled:opacity-40", children: [_jsx(Icon, { name: "plus", size: 14 }), " Add ", field.itemLabel ?? "item"] })] }));
+        }
+    }
+}
+function Labeled({ label, description, children, }) {
+    return (_jsxs("div", { className: "mb-4", children: [label && _jsx("div", { className: cn(labelCls, "mb-2"), children: label }), children, description && (_jsx("div", { className: "text-[11px] text-ink-3 mt-1.5 leading-relaxed", children: description }))] }));
+}
+function isObj(v) {
+    return typeof v === "object" && v !== null && !Array.isArray(v);
+}
+function defaultItem(field) {
+    switch (field.type) {
+        case "object": {
+            const o = {};
+            for (const [k, f] of Object.entries(field.fields)) {
+                if (f.type !== "divider")
+                    o[k] = defaultItem(f);
+            }
+            return o;
+        }
+        case "text":
+        case "multiline":
+            return field.default ?? "";
+        case "color":
+            return field.default ?? "#ffffff";
+        case "boolean":
+            return field.default ?? false;
+        case "number":
+            return field.default ?? field.min ?? 0;
+        case "select":
+            return field.default ?? field.options[0]?.value ?? "";
+        case "multiselect":
+            return field.default ?? [];
+        case "array":
+            return field.default ?? [];
+        default:
+            return undefined;
+    }
+}
+//# sourceMappingURL=field.js.map

package/dist/components/schema-form/field.js.map

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

package/dist/components/schema-form/schema-form.d.ts

@@ -0,0 +1,3 @@
+/** Schema-driven props form for the active composition. */
+export declare function SchemaForm(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=schema-form.d.ts.map

package/dist/components/schema-form/schema-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-form.d.ts","sourceRoot":"","sources":["../../../src/components/schema-form/schema-form.tsx"],"names":[],"mappings":"AAKA,2DAA2D;AAC3D,wBAAgB,UAAU,4CA6CzB"}

package/dist/components/schema-form/schema-form.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useComposition } from "../../hooks/use-composition.js";
+import { usePropsForm } from "../../hooks/use-props-form.js";
+import { Icon } from "../icon/icon.js";
+import { Field } from "./field.js";
+/** Schema-driven props form for the active composition. */
+export function SchemaForm() {
+    const { selectedId, entry } = useComposition();
+    const form = usePropsForm(selectedId);
+    const fields = form.schema ? Object.entries(form.schema.fields) : [];
+    const hasFields = fields.some(([, f]) => f.type !== "divider");
+    if (!hasFields) {
+        return (_jsxs("div", { className: "flex flex-col items-center justify-center text-center h-full text-ink-3 gap-3 py-10", children: [_jsx("div", { className: "size-11 rounded-xl bg-bg-2 grid place-items-center border border-line", children: _jsx(Icon, { name: "sliders", size: 20 }) }), _jsx("h4", { className: "m-0 text-[14px] text-ink-2 font-semibold", children: "No props" }), _jsxs("p", { className: "m-0 text-[12.5px] leading-relaxed max-w-[200px]", children: ["\u201C", entry?.title ?? selectedId, "\u201D exposes no overridable settings."] })] }));
+    }
+    const values = form.values;
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center justify-between mb-4", children: [_jsxs("div", { className: "text-[10.5px] font-bold tracking-[.08em] uppercase text-ink-3", children: [entry?.title ?? selectedId, " \u00B7 props"] }), _jsx("button", { type: "button", onClick: form.reset, className: "text-[11px] text-ink-2 bg-bg-2 border border-line rounded-full px-2.5 py-0.5 font-medium hover:text-ink-1 hover:border-line-2", children: "Reset" })] }), fields.map(([key, field]) => (_jsx(Field, { field: field, value: values[key], onChange: (v) => form.setValue(key, v) }, key)))] }));
+}
+//# sourceMappingURL=schema-form.js.map

package/dist/components/schema-form/schema-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-form.js","sourceRoot":"","sources":["../../../src/components/schema-form/schema-form.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,2DAA2D;AAC3D,MAAM,UAAU,UAAU;IACxB,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,cAAc,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,YAAY,CAAC,UAAU,CAAC,CAAC;IACtC,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACrE,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC;IAE/D,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,OAAO,CACL,eAAK,SAAS,EAAC,qFAAqF,aAClG,cAAK,SAAS,EAAC,uEAAuE,YACpF,KAAC,IAAI,IAAC,IAAI,EAAC,SAAS,EAAC,IAAI,EAAE,EAAE,GAAI,GAC7B,EACN,aAAI,SAAS,EAAC,0CAA0C,yBAAc,EACtE,aAAG,SAAS,EAAC,iDAAiD,uBAC1D,KAAK,EAAE,KAAK,IAAI,UAAU,+CAC1B,IACA,CACP,CAAC;IACJ,CAAC;IAED,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;IAC3B,OAAO,CACL,8BACE,eAAK,SAAS,EAAC,wCAAwC,aACrD,eAAK,SAAS,EAAC,+DAA+D,aAC3E,KAAK,EAAE,KAAK,IAAI,UAAU,qBACvB,EACN,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,KAAK,EACnB,SAAS,EAAC,+HAA+H,sBAGlI,IACL,EACL,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAC5B,KAAC,KAAK,IAEJ,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC,EAClB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,CAAC,IAHjC,GAAG,CAIR,CACH,CAAC,IACD,CACJ,CAAC;AACJ,CAAC"}

package/dist/components/stage/stage.d.ts

@@ -0,0 +1,12 @@
+export type StageProps = {
+    className?: string;
+    /** Show the corner resolution/frame/scale readout (off by default). */
+    showStatus?: boolean;
+};
+/**
+ * The composition viewport. Mounts a `<smoove-player>`, registers it with the store,
+ * and sizes it to the scaled comp box (fit-to-viewport, or an explicit zoom in
+ * an overflow-scroll container). The player letterboxes inside that box.
+ */
+export declare function Stage({ className, showStatus }: StageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=stage.d.ts.map

package/dist/components/stage/stage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stage.d.ts","sourceRoot":"","sources":["../../../src/components/stage/stage.tsx"],"names":[],"mappings":"AAcA,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uEAAuE;IACvE,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,KAAK,CAAC,EAAE,SAAS,EAAE,UAAkB,EAAE,EAAE,UAAU,2CAkGlE"}

package/dist/components/stage/stage.js

@@ -0,0 +1,103 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { useComposition } from "../../hooks/use-composition.js";
+import { applyLayerVisibility } from "../../hooks/use-layers.js";
+import { useShortcuts } from "../../hooks/use-shortcuts.js";
+import { useStudio } from "../../hooks/use-studio.js";
+import { cn } from "../../lib/cn.js";
+import { fpsHealth } from "../../lib/format.js";
+import { usePlayerSignal, useSignalValue } from "../../signals/signal-bridge.js";
+const PAD = 40;
+const ZERO_SIGNAL = { get: () => 0, subscribe: () => () => { } };
+/**
+ * The composition viewport. Mounts a `<smoove-player>`, registers it with the store,
+ * and sizes it to the scaled comp box (fit-to-viewport, or an explicit zoom in
+ * an overflow-scroll container). The player letterboxes inside that box.
+ */
+export function Stage({ className, showStatus = false }) {
+    const store = useStudio();
+    const { composition: comp } = useComposition();
+    const zoom = useSignalValue(store.zoom);
+    const layerOffMap = useSignalValue(store.layerOff);
+    const selectedId = useSignalValue(store.selectedId);
+    useShortcuts();
+    const wrapRef = useRef(null);
+    const playerRef = useRef(null);
+    const [box, setBox] = useState({ w: 0, h: 0 });
+    // measure available space
+    useEffect(() => {
+        const el = wrapRef.current;
+        if (!el)
+            return;
+        const ro = new ResizeObserver((entries) => {
+            const r = entries[0]?.contentRect;
+            if (r)
+                setBox({ w: r.width, h: r.height });
+        });
+        ro.observe(el);
+        return () => ro.disconnect();
+    }, []);
+    // register the player + base attributes (we own keyboard + click-to-play)
+    useEffect(() => {
+        const el = playerRef.current;
+        if (!el)
+            return;
+        el.setAttribute("no-keyboard", "");
+        el.setAttribute("no-click-to-play", "");
+        el.setAttribute("loop", "");
+        // No autoplay: a composition loads stopped (paused on frame 0) by default.
+        store.setPlayer(el);
+        return () => {
+            if (store.player.get() === el)
+                store.setPlayer(null);
+        };
+    }, [store]);
+    // mount / swap the composition
+    useEffect(() => {
+        const el = playerRef.current;
+        if (!el)
+            return;
+        el.composition = comp ?? null;
+        // After a dev hot-reload, restore the playhead + play state on the rebuilt
+        // comp (the player setter mounts synchronously, so seekTo works here).
+        if (comp) {
+            const restore = store.takeRestore();
+            if (restore) {
+                el.seekTo(restore.frame);
+                if (restore.playing)
+                    el.play();
+                else
+                    el.pause();
+            }
+        }
+    }, [comp, store]);
+    // apply per-layer enable/disable
+    useEffect(() => {
+        if (comp)
+            applyLayerVisibility(comp, layerOffMap[selectedId] ?? new Set());
+    }, [comp, layerOffMap, selectedId]);
+    const w = comp ? comp.width() : 1280;
+    const h = comp ? comp.height() : 720;
+    const fit = zoom === "fit";
+    const fitScale = box.w
+        ? Math.max(0.05, Math.min((box.w - PAD * 2) / w, (box.h - PAD * 2) / h))
+        : 0.5;
+    useEffect(() => {
+        store.setFitScale(fitScale);
+    }, [fitScale, store]);
+    const scale = fit ? fitScale : zoom;
+    const overflow = !fit && (w * scale > box.w - 8 || h * scale > box.h - 8);
+    return (_jsxs("div", { ref: wrapRef, className: cn("relative flex-1 min-h-0 overflow-hidden", className), style: {
+            background: "radial-gradient(120% 90% at 50% 0%, #16151c 0%, var(--color-stage) 70%)",
+        }, children: [_jsx("div", { className: cn("absolute inset-0 flex p-10", overflow ? "overflow-auto scroll" : "items-center justify-center"), children: _jsx("div", { className: "m-auto flex-none relative rounded-[4px] overflow-hidden bg-black shadow-[0_24px_80px_-20px_rgba(0,0,0,.8),0_0_0_1px_rgba(255,255,255,.06)]", style: { width: w * scale, height: h * scale }, children: _jsx("smoove-player", { ref: playerRef, style: { position: "absolute", inset: 0 } }) }) }), showStatus && comp && _jsx(StageStatus, { scale: scale, w: w, h: h })] }));
+}
+function StageStatus({ scale, w, h }) {
+    const store = useStudio();
+    const player = useSignalValue(store.player);
+    const frame = usePlayerSignal(player?.state.frame ?? ZERO_SIGNAL);
+    const total = usePlayerSignal(player?.state.duration ?? ZERO_SIGNAL);
+    const fps = player?.fps ?? 0;
+    const health = fpsHealth(fps, fps || 1);
+    return (_jsxs("div", { className: "absolute bottom-3 left-4 z-[5] flex items-center gap-2.5 text-[11px] font-mono text-ink-3 bg-[rgba(16,16,20,.6)] backdrop-blur-md border border-line rounded-control px-2.5 py-1.5 pointer-events-none", children: [_jsx("span", { className: cn("size-[7px] rounded-full", health === "good" ? "bg-good" : health === "ok" ? "bg-warn" : "bg-ink-3/50") }), _jsxs("span", { className: "text-ink-2 font-semibold", children: [w, "\u00D7", h] }), _jsx("span", { className: "text-line-2", children: "\u00B7" }), _jsxs("span", { children: [frame, "/", total, "f"] }), _jsx("span", { className: "text-line-2", children: "\u00B7" }), _jsxs("span", { children: [Math.round(scale * 100), "%"] })] }));
+}
+//# sourceMappingURL=stage.js.map