@mevdragon/vidfarm-devcli 0.2.10 → 0.2.11

package/SKILL.developer.md

@@ -919,6 +919,15 @@ npx @mevdragon/vidfarm-devcli session
 
 The current standard version is `2026-05-30`. The CLI response includes `caption_standard_version`, `fonts`, `text_background_colors`, `presets`, `package_dependencies`, the source standard file, and the starter template style file.
 
+Text background rendering rule:
+
+- any selected text background color must render as an inline highlight chip that hugs the text only
+- apply visible per-line padding around the glyph bounds; the background should feel intentional, not cramped
+- use slightly curved corners like TikTok's native text highlight shape
+- do not render full-width bars, paragraph washes, large caption panels, or loose boxes behind text
+- for multi-line captions, each line should get its own tight chip or a chip shape that follows the actual text block closely
+- support chip strength levels where practical: `subtle` for light editor-style chips, `standard` for normal TikTok color chips, and `strong` for high-contrast emphatic captions
+
 Canonical font IDs:
 
 - `tiktok_sans_semibold`: default native TikTok caption font, backed by `@fontsource/tiktok-sans` or the bundled `TikTokSans-SemiBold.ttf` starter asset
@@ -969,8 +978,8 @@ Canonical text background color IDs:
 Canonical style presets:
 
 - `tiktok_native_white`: TikTok Sans SemiBold, white fill, no color chip, native black shadow
-- `tiktok_native_chip`: TikTok Sans SemiBold, white fill, red default color chip, native black shadow
-- `tiktok_editor_gray`: TikTok Sans SemiBold, dark fill, light gray default chip, no shadow
+- `tiktok_native_chip`: TikTok Sans SemiBold, white fill, red default inline highlight chip, `standard` chip strength, native black shadow
+- `tiktok_editor_gray`: TikTok Sans SemiBold, dark fill, light gray default inline highlight chip, `subtle` chip strength, no shadow
 
 Templates that expose caption styling should use these IDs in `configSchema`, operation payloads, manifests, and docs instead of inventing local names or hardcoding unrelated font stacks. If a template intentionally uses a format-specific typography system, document the exception in the template-local `SKILL.md`.
 

package/dist/src/cli.js

@@ -7,7 +7,7 @@ import path from "node:path";
 import { parseArgs } from "node:util";
 import { promisify } from "node:util";
 import dotenv from "dotenv";
-import { CAPTION_STANDARD_VERSION, STARTER_TEMPLATE_FONT_OPTIONS, STARTER_TEMPLATE_TEXT_BACKGROUND_COLOR_OPTIONS, TIKTOK_CAPTION_STYLE_PRESETS } from "./lib/template-style-options.js";
+import { CAPTION_STANDARD_VERSION, STARTER_TEMPLATE_FONT_OPTIONS, STARTER_TEMPLATE_TEXT_BACKGROUND_COLOR_OPTIONS, TIKTOK_CAPTION_STYLE_PRESETS, TIKTOK_TEXT_BACKGROUND_RENDERING } from "./lib/template-style-options.js";
 import { analyzeTemplateDna, hasTemplatePreviewMedia, stageTemplateDnaInputs, syncTemplateDnaModule } from "./lib/template-dna.js";
 import { assertTemplateFolderNameHasPrefix, defaultSkillPathForTemplateModule, deriveTemplateRootDirFromModulePath } from "./lib/template-paths.js";
 const execFileAsync = promisify(execFile);
@@ -857,6 +857,7 @@ async function runSessionCommand(argv) {
             caption_standard_version: CAPTION_STANDARD_VERSION,
             fonts: STARTER_TEMPLATE_FONT_OPTIONS,
             text_background_colors: STARTER_TEMPLATE_TEXT_BACKGROUND_COLOR_OPTIONS,
+            text_background_rendering: TIKTOK_TEXT_BACKGROUND_RENDERING,
             presets: TIKTOK_CAPTION_STYLE_PRESETS,
             package_dependencies: [
                 "@fontsource/tiktok-sans",

package/dist/src/lib/template-style-options.js

@@ -99,6 +99,38 @@ export const TIKTOK_TEXT_BACKGROUND_COLOR_OPTIONS = [
     { id: "dark_gray", label: "Dark Gray", hex: "#333333" }
 ];
 export const STARTER_TEMPLATE_TEXT_BACKGROUND_COLOR_OPTIONS = TIKTOK_TEXT_BACKGROUND_COLOR_OPTIONS;
+export const TIKTOK_TEXT_BACKGROUND_RENDERING = {
+    mode: "inline_highlight_chip",
+    rule: "Text background colors must render as inline highlight chips that hug the text only.",
+    padding: "Use visible per-line padding around glyph bounds; do not render full-width bars, paragraph washes, or loose caption boxes.",
+    shape: "Use slightly curved corners, similar to native TikTok text highlight chips.",
+    strengths: {
+        none: {
+            paddingX: 0,
+            paddingY: 0,
+            radius: 0,
+            opacity: 0
+        },
+        subtle: {
+            paddingX: 14,
+            paddingY: 8,
+            radius: 9,
+            opacity: 0.72
+        },
+        standard: {
+            paddingX: 20,
+            paddingY: 12,
+            radius: 12,
+            opacity: 0.86
+        },
+        strong: {
+            paddingX: 26,
+            paddingY: 14,
+            radius: 14,
+            opacity: 0.94
+        }
+    }
+};
 export const TIKTOK_CAPTION_STYLE_PRESETS = [
     {
         id: "tiktok_native_white",
@@ -114,6 +146,8 @@ export const TIKTOK_CAPTION_STYLE_PRESETS = [
         fontId: "tiktok_sans_semibold",
         fill: "#ffffff",
         defaultBackgroundColorId: "red",
+        backgroundRendering: "inline_highlight_chip",
+        chipStrength: "standard",
         shadow: "native_black_shadow"
     },
     {
@@ -122,6 +156,8 @@ export const TIKTOK_CAPTION_STYLE_PRESETS = [
         fontId: "tiktok_sans_semibold",
         fill: "#111111",
         defaultBackgroundColorId: "light_gray",
+        backgroundRendering: "inline_highlight_chip",
+        chipStrength: "subtle",
         shadow: "none"
     }
 ];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mevdragon/vidfarm-devcli",
-  "version": "0.2.10",
+  "version": "0.2.11",
   "description": "Developer CLI for running the Vidfarm local template platform.",
   "type": "module",
   "bin": {