@sellable/mcp 0.1.261 → 0.1.263

package/dist/tools/content-posts.js

@@ -1,6 +1,8 @@
 import * as fs from "node:fs";
 import * as os from "node:os";
 import * as path from "node:path";
+import { execFileSync } from "node:child_process";
+import { pathToFileURL } from "node:url";
 const CONTENT_ROOT_ENV = "SELLABLE_CONTENT_DIR";
 const DEFAULT_PREVIEW_CHARS = 220;
 const RELATIVE_DIRS = {
@@ -8,6 +10,7 @@ const RELATIVE_DIRS = {
     hookResearch: "linkedin/research/hooks",
     drafts: "linkedin/drafts",
     published: "linkedin/published",
+    previews: "linkedin/previews",
     commentLibrary: "linkedin/comments/library",
 };
 export const contentPostToolDefinitions = [
@@ -104,6 +107,43 @@ export const contentPostToolDefinitions = [
             additionalProperties: false,
         },
     },
+    {
+        name: "render_linkedin_post_preview",
+        description: "Render any LinkedIn post text through the Sellable LinkedIn preview CSS contract for mobile and desktop. Writes HTML artifacts and, when local Chrome is available, browser screenshots under ~/.sellable/content/linkedin/previews.",
+        inputSchema: {
+            type: "object",
+            properties: {
+                postText: {
+                    type: "string",
+                    description: "Full post text to render. Provide either postText or draftId.",
+                },
+                draftId: {
+                    type: "string",
+                    description: "Optional saved draft ID. When postText is omitted, the tool renders this draft's Draft Body.",
+                },
+                renderId: {
+                    type: "string",
+                    description: "Optional stable render ID. Must be a safe filename without slashes.",
+                },
+                sourceLabel: { type: "string" },
+                createdAt: { type: "string" },
+                renderScreenshots: {
+                    type: "boolean",
+                    description: "Defaults to true. When true, tries to use local Chrome headless to write PNG screenshots.",
+                },
+                requireScreenshots: {
+                    type: "boolean",
+                    description: "Defaults to false. When true, fail if local Chrome cannot produce PNG screenshots.",
+                },
+                reviewClampLines: {
+                    type: "number",
+                    description: "Visible review lines before see-more. Defaults to 3.",
+                },
+            },
+            required: [],
+            additionalProperties: false,
+        },
+    },
     {
         name: "update_post_draft",
         description: "Update an existing LinkedIn post draft in place while preserving omitted fields. Useful for adding iteration receipts, status changes, or final copy edits without rewriting the whole artifact.",
@@ -389,6 +429,109 @@ export function savePostDraftTool(input) {
         preview: sanitizedPreview(input.body),
     };
 }
+export function renderLinkedInPostPreviewTool(input) {
+    const now = normalizeDate(input.createdAt);
+    const draftId = input.draftId
+        ? normalizeArtifactId(input.draftId, "draftId")
+        : undefined;
+    const draftBody = draftId
+        ? extractMarkdownSection(getArtifact(RELATIVE_DIRS.drafts, draftId, "draftId").markdown, "Draft Body")
+        : undefined;
+    const postText = input.postText ?? draftBody;
+    requireString(postText, "postText");
+    const reviewClampLines = typeof input.reviewClampLines === "number" &&
+        Number.isFinite(input.reviewClampLines)
+        ? Math.max(1, Math.min(Math.floor(input.reviewClampLines), 8))
+        : 3;
+    const id = input.renderId ??
+        `preview_${dateStamp(now)}_${slugify(input.sourceLabel || draftId || postText)}`;
+    const safeId = normalizeArtifactId(id, "renderId");
+    const baseDir = `${RELATIVE_DIRS.previews}/${safeId}`;
+    const title = input.sourceLabel || draftId || safeId;
+    const renderScreenshots = input.renderScreenshots !== false;
+    const mobile = buildPreviewSurface({
+        label: "mobile",
+        text: postText,
+        baseDir,
+        textWidthPx: 308,
+        viewportWidthPx: 390,
+        viewportHeightPx: 760,
+        reviewClampLines,
+    });
+    const desktop = buildPreviewSurface({
+        label: "desktop",
+        text: postText,
+        baseDir,
+        textWidthPx: 582,
+        viewportWidthPx: 744,
+        viewportHeightPx: 760,
+        reviewClampLines,
+    });
+    const combinedHtmlRelativePath = `${baseDir}/preview.html`;
+    const combinedHtml = buildCombinedPreviewHtml({
+        title,
+        postText,
+        mobile,
+        desktop,
+    });
+    writeContentFile(combinedHtmlRelativePath, combinedHtml);
+    const screenshotResult = renderScreenshots
+        ? renderPreviewScreenshots([mobile, desktop], input.requireScreenshots)
+        : { status: "skipped", reason: "renderScreenshots=false" };
+    const metadata = {
+        id: safeId,
+        type: "linkedin_preview",
+        status: screenshotResult.status === "rendered" ? "rendered" : "html_rendered",
+        title,
+        draftId,
+        createdAt: now,
+        updatedAt: now,
+    };
+    const renderedPreview = {
+        basis: screenshotResult.status === "rendered"
+            ? "local_chrome_headless_screenshot"
+            : "linkedin_css_contract_html",
+        cssContractVersion: "linkedin-preview-rendering/v1",
+        generatedAt: now,
+        sourceLabel: title,
+        mobile: surfaceRecord(mobile),
+        desktop: surfaceRecord(desktop),
+        diagnostics: previewDiagnostics(postText),
+        screenshotStatus: screenshotResult,
+    };
+    const recordRelativePath = `${baseDir}/render.md`;
+    const metadataJsonRelativePath = `${baseDir}/metadata.json`;
+    writeContentFile(metadataJsonRelativePath, `${JSON.stringify(renderedPreview, null, 2)}\n`);
+    writeArtifact(recordRelativePath, buildMarkdown(metadata, [
+        ["Rendered Preview Record", jsonBlock(renderedPreview)],
+        [
+            "Artifacts",
+            [
+                `- combinedHtml: ${combinedHtmlRelativePath}`,
+                `- mobileHtml: ${mobile.htmlPath}`,
+                mobile.screenshotPath
+                    ? `- mobileScreenshot: ${mobile.screenshotPath}`
+                    : "- mobileScreenshot: none",
+                `- desktopHtml: ${desktop.htmlPath}`,
+                desktop.screenshotPath
+                    ? `- desktopScreenshot: ${desktop.screenshotPath}`
+                    : "- desktopScreenshot: none",
+            ].join("\n"),
+        ],
+    ]));
+    return {
+        id: safeId,
+        path: recordRelativePath,
+        artifactDir: baseDir,
+        absoluteArtifactDir: safePath(resolveContentRoot(), baseDir),
+        combinedHtmlPath: combinedHtmlRelativePath,
+        absoluteCombinedHtmlPath: safePath(resolveContentRoot(), combinedHtmlRelativePath),
+        mobile: surfaceReturnRecord(mobile),
+        desktop: surfaceReturnRecord(desktop),
+        screenshotStatus: screenshotResult,
+        renderedPreview,
+    };
+}
 export function updatePostDraftTool(input) {
     const safeDraftId = normalizeArtifactId(input.draftId, "draftId");
     const relativePath = `${RELATIVE_DIRS.drafts}/${safeDraftId}.md`;
@@ -617,6 +760,362 @@ export function listPublishedPostsTool(input) {
     }
     return summarizeArtifacts(artifacts, input?.limit);
 }
+function buildPreviewSurface(input) {
+    const estimatedLines = estimateRenderedLines(input.text, input.textWidthPx);
+    const htmlPath = `${input.baseDir}/${input.label}.html`;
+    const surface = {
+        label: input.label,
+        textWidthPx: input.textWidthPx,
+        viewportWidthPx: input.viewportWidthPx,
+        viewportHeightPx: input.viewportHeightPx,
+        fontSizePx: 14,
+        lineHeightPx: 21,
+        reviewClampLines: input.reviewClampLines,
+        estimatedLines,
+        estimatedVisibleTextBlock: estimatedLines
+            .slice(0, input.reviewClampLines)
+            .join("\n"),
+        estimatedLineCountBeforeClamp: estimatedLines.length,
+        estimatedBlankLinesBeforeClamp: estimatedLines
+            .slice(0, input.reviewClampLines)
+            .filter((line) => line.trim().length === 0).length,
+        htmlPath,
+        absoluteHtmlPath: safePath(resolveContentRoot(), htmlPath),
+    };
+    writeContentFile(htmlPath, buildSinglePreviewHtml({
+        title: `${input.label} LinkedIn preview`,
+        postText: input.text,
+        surface,
+    }));
+    return surface;
+}
+function buildSinglePreviewHtml(input) {
+    return htmlDocument({
+        title: input.title,
+        bodyClass: input.surface.label,
+        body: linkedInCardHtml(input.postText, input.surface),
+    });
+}
+function buildCombinedPreviewHtml(input) {
+    return htmlDocument({
+        title: `LinkedIn preview: ${input.title}`,
+        bodyClass: "combined",
+        body: [
+            `<main class="combined-grid">`,
+            `<section><h1>Mobile preview</h1>${linkedInCardHtml(input.postText, input.mobile)}</section>`,
+            `<section><h1>Desktop preview</h1>${linkedInCardHtml(input.postText, input.desktop)}</section>`,
+            `</main>`,
+        ].join("\n"),
+    });
+}
+function htmlDocument(input) {
+    return [
+        "<!doctype html>",
+        '<html lang="en">',
+        "<head>",
+        '<meta charset="utf-8">',
+        '<meta name="viewport" content="width=device-width, initial-scale=1">',
+        `<title>${escapeHtml(input.title)}</title>`,
+        "<style>",
+        linkedinPreviewCss(),
+        "</style>",
+        "</head>",
+        `<body class="${escapeHtml(input.bodyClass)}">`,
+        input.body,
+        "</body>",
+        "</html>",
+        "",
+    ].join("\n");
+}
+function linkedInCardHtml(postText, surface) {
+    const escapedText = escapeHtml(postText);
+    const cardWidth = surface.textWidthPx + 32;
+    return [
+        `<article class="linkedin-card" data-surface="${surface.label}" style="width:${cardWidth}px">`,
+        '<header class="post-header" aria-hidden="true">',
+        '<div class="avatar"></div>',
+        '<div class="byline"><div class="name">Preview Author</div><div class="meta">LinkedIn preview contract</div></div>',
+        "</header>",
+        `<div class="post-text" style="width:${surface.textWidthPx}px;-webkit-line-clamp:${surface.reviewClampLines}">${escapedText}</div>`,
+        surface.estimatedLineCountBeforeClamp > surface.reviewClampLines
+            ? '<div class="see-more">...see more</div>'
+            : "",
+        '<div class="post-actions" aria-hidden="true"><span>Like</span><span>Comment</span><span>Repost</span></div>',
+        "</article>",
+    ].join("\n");
+}
+function linkedinPreviewCss() {
+    return `
+:root {
+  color-scheme: light;
+  --linkedin-text: rgba(0, 0, 0, 0.9);
+  --linkedin-muted: rgba(0, 0, 0, 0.6);
+  --linkedin-border: #e0dfdc;
+  --linkedin-bg: #f3f2ef;
+}
+* { box-sizing: border-box; }
+body {
+  margin: 0;
+  min-height: 100vh;
+  background: var(--linkedin-bg);
+  font-family: -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue",
+    "Fira Sans", Ubuntu, "Oxygen Sans", Cantarell, "Droid Sans",
+    "Lucida Grande", Helvetica, Arial, sans-serif;
+}
+body.mobile, body.desktop {
+  display: flex;
+  align-items: flex-start;
+  justify-content: center;
+  padding: 20px;
+}
+.combined-grid {
+  display: grid;
+  grid-template-columns: max-content max-content;
+  gap: 28px;
+  align-items: start;
+  padding: 20px;
+}
+h1 {
+  margin: 0 0 10px;
+  font-size: 14px;
+  line-height: 20px;
+  font-weight: 600;
+  color: var(--linkedin-muted);
+}
+.linkedin-card {
+  background: #fff;
+  border: 1px solid var(--linkedin-border);
+  border-radius: 8px;
+  padding: 12px 16px 10px;
+  color: var(--linkedin-text);
+}
+.post-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 8px;
+}
+.avatar {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #d7dce0, #eef0f2);
+}
+.byline { min-width: 0; }
+.name {
+  height: 16px;
+  font-size: 14px;
+  line-height: 16px;
+  font-weight: 600;
+}
+.meta {
+  font-size: 12px;
+  line-height: 14px;
+  color: var(--linkedin-muted);
+}
+.post-text {
+  font-size: 14px;
+  line-height: 21px;
+  font-weight: 400;
+  letter-spacing: normal;
+  white-space: pre-wrap;
+  overflow-wrap: break-word;
+  color: var(--linkedin-text);
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+}
+.see-more {
+  margin-top: 2px;
+  font-size: 14px;
+  line-height: 21px;
+  color: var(--linkedin-muted);
+}
+.post-actions {
+  display: flex;
+  gap: 18px;
+  border-top: 1px solid var(--linkedin-border);
+  margin-top: 10px;
+  padding-top: 8px;
+  color: var(--linkedin-muted);
+  font-size: 13px;
+  line-height: 18px;
+}
+`;
+}
+function renderPreviewScreenshots(surfaces, requireScreenshots) {
+    const chromePath = findChromeExecutable();
+    if (!chromePath) {
+        if (requireScreenshots) {
+            throw new Error("Chrome executable not found. Set CHROME_PATH or install Google Chrome to render LinkedIn preview screenshots.");
+        }
+        return { status: "skipped", reason: "chrome_not_found" };
+    }
+    try {
+        for (const surface of surfaces) {
+            const screenshotPath = surface.htmlPath.replace(/\.html$/, ".png");
+            const absoluteScreenshotPath = safePath(resolveContentRoot(), screenshotPath);
+            execFileSync(chromePath, [
+                "--headless=new",
+                "--disable-gpu",
+                "--no-sandbox",
+                "--disable-dev-shm-usage",
+                "--hide-scrollbars",
+                `--screenshot=${absoluteScreenshotPath}`,
+                `--window-size=${surface.viewportWidthPx},${surface.viewportHeightPx}`,
+                pathToFileURL(surface.absoluteHtmlPath).href,
+            ], { stdio: "ignore", timeout: 20000 });
+            surface.screenshotPath = screenshotPath;
+            surface.absoluteScreenshotPath = absoluteScreenshotPath;
+        }
+        return { status: "rendered", chromePath };
+    }
+    catch (error) {
+        const reason = error instanceof Error ? error.message : String(error);
+        if (requireScreenshots) {
+            throw new Error(`Chrome screenshot render failed: ${reason}`);
+        }
+        return { status: "failed", reason, chromePath };
+    }
+}
+function findChromeExecutable() {
+    const candidates = [
+        process.env.CHROME_PATH,
+        process.env.GOOGLE_CHROME_BIN,
+        "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
+        "/Applications/Google Chrome Canary.app/Contents/MacOS/Google Chrome Canary",
+        "/Applications/Chromium.app/Contents/MacOS/Chromium",
+        "/usr/bin/google-chrome",
+        "/usr/bin/google-chrome-stable",
+        "/usr/bin/chromium",
+        "/usr/bin/chromium-browser",
+        "/snap/bin/chromium",
+    ].filter(Boolean);
+    return candidates.find((candidate) => fs.existsSync(candidate)) ?? null;
+}
+function surfaceRecord(surface) {
+    return {
+        textWidthPx: surface.textWidthPx,
+        viewportWidthPx: surface.viewportWidthPx,
+        fontSizePx: surface.fontSizePx,
+        lineHeightPx: surface.lineHeightPx,
+        reviewClampLines: surface.reviewClampLines,
+        estimatedVisibleTextBlock: surface.estimatedVisibleTextBlock,
+        estimatedRenderedLines: surface.estimatedLines.slice(0, surface.reviewClampLines),
+        estimatedLineCountBeforeClamp: surface.estimatedLineCountBeforeClamp,
+        estimatedBlankLinesBeforeClamp: surface.estimatedBlankLinesBeforeClamp,
+        htmlPath: surface.htmlPath,
+        screenshotPath: surface.screenshotPath,
+    };
+}
+function surfaceReturnRecord(surface) {
+    return {
+        ...surfaceRecord(surface),
+        absoluteHtmlPath: surface.absoluteHtmlPath,
+        absoluteScreenshotPath: surface.absoluteScreenshotPath,
+    };
+}
+function previewDiagnostics(text) {
+    const physicalLines = text.split("\n");
+    const nonblankLines = physicalLines.filter((line) => line.trim().length > 0);
+    return {
+        charCount: text.replace(/\s/g, "").length,
+        charCountIncludingNewlines: text.length,
+        firstLineChars: physicalLines[0]?.length ?? 0,
+        firstTwoPhysicalLinesChars: physicalLines.slice(0, 2).join("\n").length,
+        physicalLineCount: physicalLines.length,
+        contentLineCount: nonblankLines.length,
+        longestNonblankLineChars: nonblankLines.reduce((max, line) => Math.max(max, line.length), 0),
+        blankLineCount: physicalLines.length - nonblankLines.length,
+    };
+}
+function estimateRenderedLines(text, textWidthPx) {
+    const physicalLines = text.split("\n");
+    const rendered = [];
+    for (const physicalLine of physicalLines) {
+        if (physicalLine.length === 0) {
+            rendered.push("");
+            continue;
+        }
+        rendered.push(...wrapPhysicalLine(physicalLine, textWidthPx));
+    }
+    return rendered;
+}
+function wrapPhysicalLine(line, textWidthPx) {
+    const tokens = line.match(/\S+\s*/g) ?? [line];
+    const wrapped = [];
+    let current = "";
+    for (const token of tokens) {
+        const candidate = `${current}${token}`;
+        if (!current || measureTextPx(candidate) <= textWidthPx) {
+            current = candidate;
+            continue;
+        }
+        wrapped.push(current.trimEnd());
+        if (measureTextPx(token) <= textWidthPx) {
+            current = token;
+        }
+        else {
+            const broken = breakLongToken(token.trimEnd(), textWidthPx);
+            wrapped.push(...broken.slice(0, -1));
+            current = broken.at(-1) ?? "";
+            if (token.endsWith(" "))
+                current += " ";
+        }
+    }
+    if (current.length > 0)
+        wrapped.push(current.trimEnd());
+    return wrapped.length > 0 ? wrapped : [""];
+}
+function breakLongToken(token, textWidthPx) {
+    const parts = [];
+    let current = "";
+    for (const char of [...token]) {
+        const candidate = `${current}${char}`;
+        if (!current || measureTextPx(candidate) <= textWidthPx) {
+            current = candidate;
+        }
+        else {
+            parts.push(current);
+            current = char;
+        }
+    }
+    if (current)
+        parts.push(current);
+    return parts;
+}
+function measureTextPx(value) {
+    let width = 0;
+    for (const char of [...value]) {
+        width += estimateCharWidthPx(char);
+    }
+    return width;
+}
+function estimateCharWidthPx(char) {
+    if (char === " ")
+        return 3.6;
+    if (/[ilI|.,:;!'`]/.test(char))
+        return 3.8;
+    if (/[fjrt()[\]{}]/.test(char))
+        return 5.2;
+    if (/[mwMW@#%&]/.test(char))
+        return 10.2;
+    if (/[A-Z]/.test(char))
+        return 8.2;
+    if (/[0-9]/.test(char))
+        return 7.3;
+    if (/[^\x00-\x7F]/.test(char))
+        return 8.4;
+    return 7.0;
+}
+function escapeHtml(value) {
+    return value
+        .replace(/&/g, "&amp;")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;")
+        .replace(/'/g, "&#39;");
+}
 function getArtifact(relativeDir, id, label) {
     const safeId = normalizeArtifactId(id, label);
     const relativePath = `${relativeDir}/${safeId}.md`;
@@ -810,6 +1309,11 @@ function writeArtifact(relativePath, markdown) {
     const filePath = safeWritablePath(root, relativePath);
     fs.writeFileSync(filePath, markdown);
 }
+function writeContentFile(relativePath, contents) {
+    const root = resolveContentRoot();
+    const filePath = safeWritablePath(root, relativePath);
+    fs.writeFileSync(filePath, contents);
+}
 function safePath(root, relativePath) {
     validateRelativePath(relativePath);
     const fullPath = path.resolve(root, ...relativePath.split("/"));

package/dist/tools/registry.d.ts

@@ -1260,6 +1260,12 @@ export declare const allTools: ({
             body?: undefined;
             validationReceipt?: undefined;
             status?: undefined;
+            postText?: undefined;
+            renderId?: undefined;
+            sourceLabel?: undefined;
+            renderScreenshots?: undefined;
+            requireScreenshots?: undefined;
+            reviewClampLines?: undefined;
             updatedAt?: undefined;
             publishUrl?: undefined;
             activityId?: undefined;
@@ -1295,6 +1301,7 @@ export declare const allTools: ({
         properties: {
             draftId: {
                 type: string;
+                description?: undefined;
             };
             ideaId: {
                 type: string;
@@ -1339,6 +1346,12 @@ export declare const allTools: ({
             selectedPatterns?: undefined;
             previewBudget?: undefined;
             notes?: undefined;
+            postText?: undefined;
+            renderId?: undefined;
+            sourceLabel?: undefined;
+            renderScreenshots?: undefined;
+            requireScreenshots?: undefined;
+            reviewClampLines?: undefined;
             updatedAt?: undefined;
             publishUrl?: undefined;
             activityId?: undefined;
@@ -1361,6 +1374,7 @@ export declare const allTools: ({
         properties: {
             draftId: {
                 type: string;
+                description?: undefined;
             };
             hookResearchId: {
                 type: string;
@@ -1403,6 +1417,12 @@ export declare const allTools: ({
             previewBudget?: undefined;
             notes?: undefined;
             createdAt?: undefined;
+            postText?: undefined;
+            renderId?: undefined;
+            sourceLabel?: undefined;
+            renderScreenshots?: undefined;
+            requireScreenshots?: undefined;
+            reviewClampLines?: undefined;
             publishUrl?: undefined;
             activityId?: undefined;
             publishedAt?: undefined;
@@ -1424,6 +1444,7 @@ export declare const allTools: ({
         properties: {
             draftId: {
                 type: string;
+                description?: undefined;
             };
             publishUrl: {
                 type: string;
@@ -1464,6 +1485,12 @@ export declare const allTools: ({
             body?: undefined;
             validationReceipt?: undefined;
             status?: undefined;
+            postText?: undefined;
+            renderId?: undefined;
+            sourceLabel?: undefined;
+            renderScreenshots?: undefined;
+            requireScreenshots?: undefined;
+            reviewClampLines?: undefined;
             updatedAt?: undefined;
             publishedPostId?: undefined;
             year?: undefined;
@@ -1516,6 +1543,12 @@ export declare const allTools: ({
             body?: undefined;
             validationReceipt?: undefined;
             status?: undefined;
+            postText?: undefined;
+            renderId?: undefined;
+            sourceLabel?: undefined;
+            renderScreenshots?: undefined;
+            requireScreenshots?: undefined;
+            reviewClampLines?: undefined;
             updatedAt?: undefined;
             publishUrl?: undefined;
             activityId?: undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sellable/mcp",
-  "version": "0.1.261",
+  "version": "0.1.263",
   "type": "module",
   "description": "Sellable MCP server for Claude Code and Codex campaign workflows",
   "main": "dist/index.js",