@mevdragon/vidfarm-devcli 0.12.0 → 0.14.0

package/dist/src/services/hyperframes.js

@@ -13,7 +13,7 @@ import ffprobeStatic from "ffprobe-static";
 import { parseHTML } from "linkedom";
 import { config } from "../config.js";
 import { devErrorFields, devLog } from "../lib/dev-log.js";
-import { CAPTION_ANIM_CSS, CAPTION_STYLE_MARKER, KEN_BURNS_CSS, KEN_BURNS_STYLE_MARKER, TRANSITION_ADJACENCY_EPSILON, TRANSITION_CSS, TRANSITION_PRESETS, TRANSITION_STYLE_MARKER, buildHyperframeCompositionHtml, clampTransitionDuration } from "../hyperframes/composition.js";
+import { CAPTION_ANIM_CSS, CAPTION_STYLE_MARKER, KEN_BURNS_CSS, KEN_BURNS_STYLE_MARKER, LEGACY_TRANSITION_CSS_V1, TRANSITION_ADJACENCY_EPSILON, TRANSITION_CSS, TRANSITION_OUT_PRESETS, TRANSITION_PRESETS, TRANSITION_STYLE_MARKER, buildHyperframeCompositionHtml, clampTransitionDuration, transitionOutDelaySeconds } from "../hyperframes/composition.js";
 import { applyMarkupUsd } from "./billing-pricing.js";
 // The scene-annotation pass reuses the clip library's controlled vocabulary and
 // embedding-text recipe verbatim so a source scene's clip-match query is
@@ -2309,6 +2309,18 @@ function compositionHasCoverageGap(intervals, total, minGap = 0.2) {
 // neighbor back). Stored drafts stay butt-cut; only publish/render output
 // carries the overlap. The preview runtime applies the same window live.
 function materializeTransitionOverlaps(document) {
+    const upsertStyleVar = (el, name, value) => {
+        const styleValue = el.getAttribute("style") || "";
+        const decl = `${name}:${value}`;
+        const pattern = new RegExp(`(^|;)\\s*${name.replace(/[.*+?^${}()|[\]\\-]/g, "\\$&")}\\s*:[^;]*`, "i");
+        const nextStyle = pattern.test(styleValue)
+            ? styleValue.replace(pattern, (_match, lead) => `${lead}${decl}`)
+            : styleValue.length === 0 || styleValue.endsWith(";")
+                ? `${styleValue}${decl}`
+                : `${styleValue};${decl}`;
+        if (nextStyle !== styleValue)
+            el.setAttribute("style", nextStyle);
+    };
     const clips = [];
     for (const el of Array.from(document.querySelectorAll("[data-start]"))) {
         if (el.hasAttribute("data-composition-id"))
@@ -2331,6 +2343,23 @@ function materializeTransitionOverlaps(document) {
         return;
     for (const clip of clips) {
         const transitionEl = clip.el;
+        const tagName = transitionEl.tagName?.toLowerCase?.() ?? "";
+        // Exit transitions: validate/clamp here; the tail-positioning delay var is
+        // re-derived in the final loop below once holds are known (the animation
+        // must end at the clip's rendered end, nominal + hold).
+        const outPreset = transitionEl.getAttribute("data-transition-out");
+        if (outPreset) {
+            if (!TRANSITION_OUT_PRESETS.includes(outPreset) || tagName === "audio") {
+                transitionEl.removeAttribute("data-transition-out");
+                transitionEl.removeAttribute("data-transition-out-duration");
+            }
+            else {
+                const outDuration = Math.min(clampTransitionDuration(transitionEl.getAttribute("data-transition-out-duration")), clip.nominal);
+                const outDurationValue = Number(outDuration.toFixed(3));
+                transitionEl.setAttribute("data-transition-out-duration", String(outDurationValue));
+                upsertStyleVar(transitionEl, "--vf-tr-out-dur", `${outDurationValue}s`);
+            }
+        }
         const preset = transitionEl.getAttribute("data-transition");
         if (!preset)
             continue;
@@ -2341,7 +2370,6 @@ function materializeTransitionOverlaps(document) {
             transitionEl.removeAttribute("data-transition-duration");
             continue;
         }
-        const tagName = transitionEl.tagName?.toLowerCase?.() ?? "";
         if (tagName === "audio") {
             transitionEl.removeAttribute("data-transition");
             transitionEl.removeAttribute("data-transition-duration");
@@ -2353,15 +2381,7 @@ function materializeTransitionOverlaps(document) {
         transitionEl.setAttribute("data-transition-duration", String(durationValue));
         // Keep the inline var (which drives animation-duration) in lockstep, same
         // as the --vf-kb-dur re-derivation above.
-        const styleValue = transitionEl.getAttribute("style") || "";
-        const durDecl = `--vf-tr-dur:${durationValue}s`;
-        const nextStyle = /(^|;)\s*--vf-tr-dur\s*:[^;]*/i.test(styleValue)
-            ? styleValue.replace(/(^|;)\s*--vf-tr-dur\s*:[^;]*/i, (_match, lead) => `${lead}${durDecl}`)
-            : styleValue.length === 0 || styleValue.endsWith(";")
-                ? `${styleValue}${durDecl}`
-                : `${styleValue};${durDecl}`;
-        if (nextStyle !== styleValue)
-            transitionEl.setAttribute("style", nextStyle);
+        upsertStyleVar(transitionEl, "--vf-tr-dur", `${durationValue}s`);
         // Grant the hold to the clip this one cuts away from: same track, nominal
         // end at (within epsilon of) this clip's start.
         for (const candidate of clips) {
@@ -2390,6 +2410,13 @@ function materializeTransitionOverlaps(document) {
         else {
             clip.el.removeAttribute("data-transition-hold");
         }
+        // Position the exit animation at the clip's rendered tail. Timeline edits
+        // touch data-duration only, so this re-derivation (like --vf-kb-dur) is
+        // what keeps stored delays honest after retimes.
+        if (clip.el.getAttribute("data-transition-out")) {
+            const outDuration = clampTransitionDuration(clip.el.getAttribute("data-transition-out-duration"));
+            upsertStyleVar(clip.el, "--vf-tr-out-delay", `${transitionOutDelaySeconds(nextDuration, outDuration)}s`);
+        }
     }
 }
 export function normalizePublishHtml(html) {
@@ -2519,10 +2546,28 @@ export function normalizePublishHtml(html) {
         (document.head ?? document.documentElement)?.appendChild(styleEl);
     }
     materializeTransitionOverlaps(document);
-    if (document.querySelector("[data-transition]") && !html.includes(TRANSITION_STYLE_MARKER)) {
-        const styleEl = document.createElement("style");
-        styleEl.textContent = TRANSITION_CSS;
-        (document.head ?? document.documentElement)?.appendChild(styleEl);
+    if (document.querySelector("[data-transition], [data-transition-out]") && !html.includes(TRANSITION_STYLE_MARKER)) {
+        // Compositions stored before V2 carry the V1 block inline: upgrade it in
+        // place (exact string swap) instead of stacking a second stylesheet. If the
+        // legacy block drifted, append after it — later source order wins the
+        // equal-specificity animation-name battle, so V2 still takes effect.
+        let upgradedLegacy = false;
+        if (html.includes("__VF_TRANSITIONS_V1__")) {
+            for (const styleEl of Array.from(document.querySelectorAll("style"))) {
+                const text = styleEl.textContent || "";
+                if (!text.includes("__VF_TRANSITIONS_V1__"))
+                    continue;
+                styleEl.textContent = text.includes(LEGACY_TRANSITION_CSS_V1)
+                    ? text.split(LEGACY_TRANSITION_CSS_V1).join(TRANSITION_CSS)
+                    : `${text}\n${TRANSITION_CSS}`;
+                upgradedLegacy = true;
+            }
+        }
+        if (!upgradedLegacy) {
+            const styleEl = document.createElement("style");
+            styleEl.textContent = TRANSITION_CSS;
+            (document.head ?? document.documentElement)?.appendChild(styleEl);
+        }
     }
     // Editor sessions occasionally leave inline style attributes with double
     // quotes inside CSS values (font-family: "TikTok Sans"). When serialized into

package/dist/src/services/providers.js

@@ -1555,6 +1555,7 @@ export class ProviderService {
                 prompt: input.prompt,
                 language: input.language,
                 diarize: input.diarize,
+                wordTimestamps: input.wordTimestamps,
                 apiKey: lease.secret
             })));
             await this.serverlessProviderKeys.recordProviderKeyUsage({

package/dist/src/services/serverless-records.js

@@ -44,6 +44,7 @@ const METHOD_COLLECTIONS = {
     createTemplateRelease: "template_release",
     createTemplateSource: "template_source",
     createUserAttachment: "user_attachment",
+    updateUserAttachmentNotes: "user_attachment",
     createUserFileFolder: "user_file_folder",
     createUserTemporaryFile: "user_temporary_file",
     deleteEmailChannel: "email_channel",
@@ -151,6 +152,14 @@ class ServerlessRecordsServiceImpl {
         });
     }
     async getLatestApiKeyForCustomer(customerId) {
+        const keys = await this.listActiveApiKeysForCustomer(customerId, 1);
+        return keys[0] ?? null;
+    }
+    // Newest-first active API key records. Callers that hand a key to a client
+    // (boot configs, Settings) should pick one the CURRENT server can validate —
+    // after an API_KEY_SALT rotation the shared table holds keys hashed under
+    // different salts (deployed stage vs local dev boxes).
+    async listActiveApiKeysForCustomer(customerId, limit = 25) {
         const response = await dynamodb.send(new QueryCommand({
             TableName: requireMainTableName(),
             IndexName: "gsi1",
@@ -164,9 +173,9 @@ class ServerlessRecordsServiceImpl {
                 ":status": "active"
             },
             ScanIndexForward: false,
-            Limit: 1
+            Limit: limit
         }));
-        return response.Items?.[0] ?? null;
+        return response.Items ?? [];
     }
     async hasCustomerCreditGrant(customerId, grantType) {
         return Boolean(await this.getById("credit_grant", `${customerId}:${grantType}`));
@@ -390,6 +399,7 @@ class ServerlessRecordsServiceImpl {
             templateId: null,
             trendTagline: input.trendTagline ?? null,
             visibility: input.visibility ?? "public",
+            origin: input.origin ?? "inspiration",
             notes: input.notes ?? null,
             errorMessage: null,
             createdAt: timestamp,
@@ -446,6 +456,7 @@ class ServerlessRecordsServiceImpl {
             viralDna: input.viralDna ?? null,
             defaultForkId: input.defaultForkId ?? null,
             visibility: input.visibility ?? "public",
+            origin: input.origin ?? "inspiration",
             notes: input.notes ?? null,
             createdAt: timestamp,
             updatedAt: timestamp
@@ -787,9 +798,15 @@ class ServerlessRecordsServiceImpl {
             storageKey: input.storageKey,
             folderPath: normalizeFolder(input.folderPath),
             publicUrl: input.publicUrl ?? null,
+            notes: input.notes ?? null,
+            notesEmbedding: input.notesEmbedding ?? null,
+            notesEmbeddingModel: input.notesEmbeddingModel ?? null,
             createdAt: input.createdAt ?? timestamp
         });
     }
+    async updateUserAttachmentNotes(customerId, attachmentId, patch) {
+        return this.mergeByIdForCustomer("user_attachment", customerId, attachmentId, patch);
+    }
     async listUserAttachments(customerId) {
         return this.listByCustomer("user_attachment", customerId);
     }

package/dist/src/services/storage.js

@@ -162,6 +162,18 @@ export class StorageService {
     async getReadUrl(key) {
         return this.createReadUrl(key);
     }
+    // Absolute on-disk path for a key — local driver only (null on S3), for
+    // callers that hand the file to a local process (ffmpeg) without copying.
+    getLocalPath(key) {
+        if (this.s3 && config.AWS_S3_BUCKET)
+            return null;
+        try {
+            return this.resolveLocalPath(key);
+        }
+        catch {
+            return null;
+        }
+    }
     async createWriteUrl(key, input) {
         if (!this.s3 || !config.AWS_S3_BUCKET) {
             throw new Error("Presigned uploads require S3 storage.");

package/dist/src/template-editor-shell.js

@@ -307,6 +307,7 @@ export const TEMPLATE_EDITOR_SHELL_STYLES = `
 
   .vf-editor-chat-mobile-fab,
   .vf-editor-chat-minimize,
+  .vf-editor-chat-expand,
   .vf-editor-chat-back-button--header {
     display: none;
   }
@@ -2634,18 +2635,25 @@ export const TEMPLATE_EDITOR_SHELL_STYLES = `
       pointer-events: none;
     }
 
+    /* Chat opens as a floating popup card anchored above the FAB; the expand
+       toggle promotes it to a full-screen sheet (data-mobile-expanded). */
     .vf-editor-chat-thread {
       position: fixed;
-      inset: 0;
+      top: auto;
+      left: auto;
+      right: 12px;
+      bottom: calc(12px + env(safe-area-inset-bottom));
       z-index: 1;
       display: none;
-      width: 100%;
-      height: 100svh;
-      border-radius: 0;
+      width: min(430px, calc(100vw - 24px));
+      height: min(72svh, 640px);
+      border: 1px solid rgba(219, 193, 122, 0.46);
+      border-radius: 24px;
+      overflow: hidden;
       background:
         radial-gradient(circle at top right, rgba(219, 193, 122, 0.12), transparent 30%),
         linear-gradient(180deg, rgba(255, 252, 247, 0.99), rgba(252, 247, 238, 0.98));
-      box-shadow: none;
+      box-shadow: 0 30px 72px rgba(37, 45, 61, 0.34);
       pointer-events: auto;
     }
 
@@ -2653,6 +2661,22 @@ export const TEMPLATE_EDITOR_SHELL_STYLES = `
       display: flex;
     }
 
+    /* Outranks the desktop brainstorm thread rule (display:grid), which has
+       higher specificity than the plain .vf-editor-chat-thread hide above. */
+    .vf-editor-chat-shell:not([data-mobile-open="true"]) .vf-editor-chat-thread {
+      display: none;
+    }
+
+    .vf-editor-chat-shell[data-mobile-expanded="true"] .vf-editor-chat-thread {
+      inset: 0;
+      width: 100%;
+      height: 100svh;
+      border: 0;
+      border-radius: 0;
+      box-shadow: none;
+    }
+
+    .vf-editor-chat-expand,
     .vf-editor-chat-minimize {
       all: unset;
       display: inline-flex;
@@ -2681,10 +2705,21 @@ export const TEMPLATE_EDITOR_SHELL_STYLES = `
     }
 
     .vf-editor-chat-new-thread,
+    .vf-editor-chat-expand,
     .vf-editor-chat-minimize {
       flex: 0 0 auto;
     }
 
+    .vf-editor-chat-expand svg {
+      width: 16px;
+      height: 16px;
+      fill: none;
+      stroke: currentColor;
+      stroke-width: 1.9;
+      stroke-linecap: round;
+      stroke-linejoin: round;
+    }
+
     .vf-editor-chat-header,
     .vf-editor-chat-tracer-bar,
     .vf-editor-chat-footer {
@@ -2701,31 +2736,59 @@ export const TEMPLATE_EDITOR_SHELL_STYLES = `
       max-width: 72vw;
     }
 
+    /* iOS auto-zooms the viewport when focusing sub-16px inputs; the chat
+       composer is the page's primary interaction on phones. */
+    .vf-editor-chat-input,
+    .vf-editor-upload-folder-dialog input {
+      font-size: 16px;
+    }
+
+    .vf-editor-chat-shell[data-layout="brainstorm"] .editor-chat-panel,
     .vf-editor-chat-shell[data-layout="brainstorm"] {
-      pointer-events: auto;
+      background: transparent;
     }
 
-    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-mobile-fab {
-      display: none;
+    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-brainstorm-layout {
+      grid-template-columns: minmax(0, 1fr);
     }
 
-    /* Minimize makes no sense when the chat IS the page (/chat); Discover
-       re-enables it (with the FAB dock pattern) via its own scoped styles. */
-    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-minimize {
+    /* On narrow screens the persistent history sidebar collapses; the
+       overlay history toggle in the header takes over instead. */
+    .vf-editor-chat-brainstorm-layout.has-sidebar > .vf-editor-chat-history-pane {
       display: none;
     }
 
-    /* iOS auto-zooms the viewport when focusing sub-16px inputs; the chat
-       composer is the page's primary interaction on phones. */
-    .vf-editor-chat-input,
-    .vf-editor-upload-folder-dialog input {
-      font-size: 16px;
+    /* Brainstorm surfaces (Discover/Library/Clips) use the same FAB + popup
+       dock as everything else; the thread just lays out as a grid. */
+    .vf-editor-chat-shell[data-layout="brainstorm"][data-mobile-open="true"] .vf-editor-chat-thread {
+      display: grid;
+      grid-template-rows: auto minmax(0, 1fr) auto;
     }
 
-    /* On phones the /chat page has no topbar and the sidebar (with its
-       Discover link) is collapsed — surface the header back button there.
-       Discover hides it again via its own scoped styles. */
-    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-back-button--header {
+    .vf-editor-chat-history-close,
+    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-history-toggle {
+      display: inline-flex;
+    }
+
+    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-viewport {
+      padding-left: 12px;
+      padding-right: 12px;
+    }
+
+    /* /chat is the one surface where the chat IS the page: no FAB, no
+       minimize/expand, thread pinned full-screen, with a back-to-Discover
+       escape hatch in the header (the page has no topbar on phones). */
+    .is-chat-page .vf-editor-chat-shell[data-layout="brainstorm"] {
+      pointer-events: auto;
+    }
+
+    .is-chat-page .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-mobile-fab,
+    .is-chat-page .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-minimize,
+    .is-chat-page .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-expand {
+      display: none;
+    }
+
+    .is-chat-page .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-back-button--header {
       display: inline-flex;
       align-items: center;
       justify-content: center;
@@ -2739,27 +2802,12 @@ export const TEMPLATE_EDITOR_SHELL_STYLES = `
       color: #617087;
     }
 
-    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-back-button--header svg {
+    .is-chat-page .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-back-button--header svg {
       width: 18px;
       height: 18px;
     }
 
-    .vf-editor-chat-shell[data-layout="brainstorm"] .editor-chat-panel,
-    .vf-editor-chat-shell[data-layout="brainstorm"] {
-      background: transparent;
-    }
-
-    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-brainstorm-layout {
-      grid-template-columns: minmax(0, 1fr);
-    }
-
-    /* On narrow screens the persistent history sidebar collapses; the
-       overlay history toggle in the header takes over instead. */
-    .vf-editor-chat-brainstorm-layout.has-sidebar > .vf-editor-chat-history-pane {
-      display: none;
-    }
-
-    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-thread {
+    .is-chat-page .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-thread {
       position: relative;
       inset: auto;
       display: grid;
@@ -2767,18 +2815,9 @@ export const TEMPLATE_EDITOR_SHELL_STYLES = `
       width: 100%;
       height: 100%;
       min-height: 0;
+      border: 0;
       border-radius: 0;
-    }
-
-
-    .vf-editor-chat-history-close,
-    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-history-toggle {
-      display: inline-flex;
-    }
-
-    .vf-editor-chat-shell[data-layout="brainstorm"] .vf-editor-chat-viewport {
-      padding-left: 12px;
-      padding-right: 12px;
+      box-shadow: none;
     }
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mevdragon/vidfarm-devcli",
-  "version": "0.12.0",
+  "version": "0.14.0",
   "description": "Local bridge for the Vidfarm Trackpad Editor. `vidfarm serve <template_id>` boots the FULL editor on localhost (disk-backed records/storage, free in-process render); edit composition.html on disk (Claude Code, Codex, etc.) and the browser live-morphs it.",
   "type": "module",
   "bin": {