invos 1.0.0 → 2.0.2

package/kit/.agents/skills/instagram-carrossel/SKILL.md

@@ -1,79 +0,0 @@
----
-name: instagram-carrossel
-description: >-
-  Instagram no INVOS: carrossel (default MVP 1–2 slides HTML + caption + handoff),
-  opcional render PNG, opcional publish Graph API. Use quando: carrossel, slides IG,
-  fábrica de carrossel, pack carrossel, render PNG dos slides, publica no Instagram
-  (Business + .env). NÃO use para só legenda texto (social-content).
----
-
-# Instagram carrossel (pacote único)
-
-Uma skill de entrada. Dependências antigas (`image-creator`, `image-fetcher`, `instagram-publisher`) vivem em **`references/`** — o agente carrega o subdoc **só quando o passo exigir**.
-
-```text
-User: carrossel / slides
-        → este SKILL (MVP ou full)
-User: gera PNG / render
-        → references/render-png.md
-User: busca imagem / screenshot pra slide
-        → references/fetch-assets.md
-User: publica no IG (API)
-        → references/publish.md + scripts/publish.js
-```
-
----
-
-## Default: modo MVP (dia a dia)
-
-Prestador em 5–15 min — **não** rode 13 steps do squad.
-
-1. Leia `marca/marca.md` + `memoria/empresa.md` (+ prova em `clientes/` se houver).  
-2. Pasta `conteudo/carrosseis/YYYY-MM-DD-kebab/`.  
-3. Entregue:
-   - `caption.txt`
-   - `slide-01.html` (+ opcional `slide-02.html`) — 1080×1350, cores da marca  
-   - `README.md` (abrir browser / print / ⚠️ postar no app)  
-4. `conteudo/_fila.md` atualizado.  
-5. Chat: paths + `⚠️ Sua vez: subir no Instagram`.
-
-**PNG:** só se user pedir **e** Chrome/Python ok → siga `references/render-png.md`.  
-Senão: HTML + handoff. **Não finja** pipeline completo.
-
-## Fábrica completa (opcional)
-
-Só se user disser: **“fábrica completa”**, **“modo squad”**, **“pipeline full”**, **“com research e ângulos”**.
-
-1. `.agents/squads/instagram-carrossel/RUN.md`  
-2. `squad.yaml` + `pipeline/`  
-3. Preferir modo turbo do RUN.
-
-## Publicar no Instagram (opcional)
-
-Só se user disser **“publica” / “pode postar”** **e** `.env` com tokens Business.
-
-1. Leia `references/publish.md`  
-2. Script: `node --env-file=.env .agents/skills/instagram-carrossel/scripts/publish.js …`  
-3. Sem env / falha → handoff humano. **Nunca** invente permalink.
-
-## Atalhos
-
-| User diz | O que rodar |
-|----------|-------------|
-| “faz um carrossel” / tema | **MVP** deste arquivo |
-| “gera PNG” / “exporta slides” | MVP (se falta HTML) + `references/render-png.md` |
-| “busca imagem pro slide” | `references/fetch-assets.md` |
-| “publica no IG” | pack pronto + `references/publish.md` ou ⚠️ |
-| “só legenda” | **Não** esta skill → `social-content` |
-
-## Relação
-
-| Skill / path | Quando |
-|--------------|--------|
-| `social-content` | Texto/legenda sem slides |
-| `design-marca` | Marca vazia |
-| Squad `instagram-carrossel` | Só no modo full |
-
-## Dono
-
-Mínimo: subir pack no app. API e PNG são extras.

package/kit/.agents/skills/instagram-carrossel/references/fetch-assets.md

@@ -1,77 +0,0 @@
-# Fetch assets (subdoc de instagram-carrossel)
-
-**Não é skill separada.** Carregar só se precisar stock/screenshot/arquivo do user nos slides.
-
-## When to use
-
-Assets visuais: busca web, screenshot (Playwright **ou** Chrome se existir), arquivos do user.  
-**Opcional** no carrossel — a maioria das runs só precisa de HTML tipográfico + `marca/`.
-
-## When to use (detail)
-
-Three modes: web image search, live website screenshots, user-provided files. Save under squad `output/` or `conteudo/carrosseis/$SLUG/assets/`.
-
-## Instructions
-
-### Capabilities
-
-1. **Web Image Search** -- Use the native web_search tool to find images by keyword. Evaluate results and download the best match.
-
-2. **Live Screenshot** -- Use Playwright MCP to navigate to a URL, set viewport dimensions, and capture a screenshot.
-
-3. **Asset Organization** -- Save all acquired assets with descriptive filenames in the squad's reference/ or output/ folder.
-
-### Screenshot Modes
-
-- **viewport** -- Capture only the visible viewport area (default)
-- **full_page** -- Capture the entire scrollable page
-- **selector** -- Capture a specific CSS selector element
-
-### Screenshot Workflow
-
-When taking a screenshot:
-1. Navigate to the URL with `browser_navigate`
-2. Set viewport: `browser_resize` with width/height for target format
-   - Instagram post: 1080x1080
-   - Instagram carousel: 1080x1440
-   - Story/Reel: 1080x1920
-   - Generic: 1280x720
-3. Wait for page load (`browser_wait_for` if needed)
-4. Capture: `browser_take_screenshot`
-5. Save to reference folder with descriptive filename
-
-### Asset Metadata
-
-After acquiring each asset, document in your output:
-- `path`: local file path
-- `width/height`: image dimensions
-- `source_type`: "web_search" | "screenshot" | "user_provided"
-- `original_url`: source URL (if applicable)
-
-### Cache Policy
-
-Before fetching an asset:
-- Check if the reference folder already has a matching file
-- Use deterministic filenames based on source (e.g., URL slug + viewport)
-- Reuse existing assets to avoid redundant fetches
-
-### Safety
-
-- Timeout: max 30s per screenshot, skip and warn if exceeded
-- Maximum screenshot dimensions: 1920x1920px
-- Block `file://` protocol URLs
-- Block localhost and private IP ranges (127.0.0.1, 10.x, 192.168.x)
-
-### Best Practices
-
-- Prefer screenshots over web search for product/tool pages (images are often outdated)
-- Save with descriptive names: `gemini-benchmark-chart.png` not `image1.png`
-- Normalize URLs before caching (strip tracking params)
-- Document all acquired assets with metadata for downstream tools
-
-## Available operations
-
-- **Web Image Search** -- Find and download images by keyword from the web
-- **Live Screenshot** -- Capture viewport, full-page, or element screenshots of any URL
-- **Asset Organization** -- Save and catalog assets with descriptive filenames and metadata
-- **Cache Check** -- Detect and reuse previously fetched assets to avoid redundant downloads

package/kit/.agents/skills/instagram-carrossel/references/publish.md

@@ -1,48 +0,0 @@
-# Publish Instagram (subdoc de instagram-carrossel)
-
-**Não é skill separada.** Carregar só se user disser “publica/pode postar” e houver `.env`.
-
-## Default no INVOS (sem erro se faltar API)
-
-**Não é obrigatório.** O skill `instagram-carrossel` termina com pack em `conteudo/carrosseis/` +  
-
-```text
-⚠️ Sua vez: subir PNGs no Instagram + colar caption.txt
-```
-
-Só use publish automático se:
-
-1. User disse **“publica” / “pode postar”**  
-2. `.env` tem as variáveis (nunca commitar)  
-3. Conta Instagram **Business** + Página Facebook  
-
-## Env (local only)
-
-```bash
-# .env (gitignore)
-INSTAGRAM_ACCESS_TOKEN=
-INSTAGRAM_USER_ID=
-IMGBB_API_KEY=
-```
-
-## Script
-
-```bash
-node --env-file=.env .agents/skills/instagram-carrossel/scripts/publish.js \
-  --images "path/slide-01.png,path/slide-02.png" \
-  --caption "legenda..."
-# dry-run:
-#   ... --dry-run
-```
-
-Imagens: JPEG/PNG conforme o script; preferir 2–10 slides. Caption max 2200 chars.
-
-## Setup token (resumo)
-
-Ver Meta Graph API Explorer: permissões `instagram_content_publish`, `instagram_basic`, `pages_read_engagement`.  
-User ID: Page → `instagram_business_account.id`.  
-Token longa duração (~60 dias).
-
-## Se faltar chave / script falhar
-
-Reportar erro real → manter handoff humano. **Nunca** inventar permalink de post.

package/kit/.agents/skills/instagram-carrossel/references/render-png.md

@@ -1,147 +0,0 @@
-# Render PNG (subdoc de instagram-carrossel)
-
-**Não é skill separada.** Carregar só quando o user pedir PNG/export ou o passo de render do squad full.
-
-Renderiza HTML/CSS em PNG (Chrome headless padrão INVOS; Playwright opcional).
-
-## Quando usar
-
-Gerar slides de carrossel, gráficos sociais, qualquer HTML self-contained → PNG.
-
-## Ordem de render (obrigatória)
-
-1. **Chrome/Chromium headless** (padrão INVOS — sem MCP)  
-2. Playwright MCP se o harness tiver  
-3. Se nada existir: deixe HTML + instrução “abrir no browser / print” e **não** finja PNG
-
-### Core Workflow
-
-1. **Generate HTML** — arquivo self-contained (CSS inline, Google Fonts via `@import` ok).
-
-2. **Save HTML** — ex.:  
-   `.agents/squads/instagram-carrossel/output/slides/slide-01.html`  
-   e espelho em `conteudo/carrosseis/$SLUG/slides/`.
-
-3. **Start HTTP server** na pasta dos HTML:
-   ```bash
-   python3 -m http.server 8765 --directory "OUTPUT_DIR" &
-   for i in $(seq 1 30); do curl -s http://localhost:8765 >/dev/null 2>&1 && break || sleep 0.1; done
-   ```
-
-4. **Render com Chrome headless** (macOS path padrão):
-   ```bash
-   CHROME="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
-   # Linux: google-chrome || chromium
-   W=1080 H=1350   # INVOS default 4:5; squad legado pode pedir 1440
-   "$CHROME" --headless=new --no-sandbox --disable-gpu --hide-scrollbars \
-     --window-size=${W},${H} \
-     --screenshot="OUTPUT_DIR/rendered/slide-01.png" \
-     --virtual-time-budget=4000 \
-     "http://localhost:8765/slide-01.html"
-   ```
-
-5. **Verify** — inspecionar PNG; re-render se quebrar.
-
-6. **Stop server**:
-   ```bash
-   pkill -f "http.server 8765" 2>/dev/null || true
-   ```
-
-### Viewport Presets (width x height)
-
-Use these standard dimensions:
-- Instagram Post: 1080 x 1080
-- Instagram Carousel: 1080 x 1440
-- Instagram Story/Reel: 1080 x 1920
-- Facebook Post: 1200 x 630
-- Twitter/X Post: 1200 x 675
-- LinkedIn Post: 1200 x 627
-- YouTube Thumbnail: 1280 x 720
-- Custom: as specified by the squad
-
-### HTML Template Guidelines
-
-The HTML you generate MUST:
-- Be self-contained (inline CSS, no external dependencies)
-- Use web-safe fonts OR Google Fonts via `@import`
-- Embed images as absolute paths or base64 data URIs
-- Set exact body dimensions matching the viewport
-- Use `margin: 0; padding: 0; overflow: hidden` on body
-- Account for device pixel ratio if high-res needed
-
-Example minimal structure:
-```html
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="UTF-8">
-  <style>
-    * { margin: 0; padding: 0; box-sizing: border-box; }
-    body { width: 1080px; height: 1440px; overflow: hidden; }
-    /* ... your design ... */
-  </style>
-</head>
-<body>
-  <!-- Your content -->
-</body>
-</html>
-```
-
-### Batch Rendering (Carousels/Multi-slide)
-
-For multi-image outputs like carousels:
-1. Generate one HTML file per slide
-2. Start the HTTP server **once** before the batch (step 3 of Core Workflow)
-3. Render each slide sequentially (step 4 repeated per slide)
-4. Stop the HTTP server **once** after all slides are done (step 6 of Core Workflow)
-5. Name output files with zero-padded numbers: slide-01.png, slide-02.png, slide-03.png
-6. Keep all slides at the same viewport dimensions
-
-### Best Practices
-
-- Always verify the first rendered image before batch rendering
-- Use CSS Grid/Flexbox for layout -- most reliable across renderers
-- Avoid animations/transitions (static screenshot only)
-- For rounded corners on images, use CSS `border-radius` + `overflow`
-- For emoji rendering, rely on system fonts (Windows: Segoe UI Emoji)
-- Test text overflow -- ensure no content is clipped unexpectedly
-- Keep HTML files alongside output PNGs for easy re-rendering
-
-### Typography & Readability Rules
-
-Text must be legible in the target platform's smallest viewing context (mobile feed for social platforms). Text inside linked or embedded image files (JPG, PNG, base64 assets) is decorative and exempt. All HTML text nodes and inline SVG text are subject to these rules.
-
-These are HARD minimums -- never go below them for readable text.
-
-#### Minimum Font Sizes by Platform
-
-| Text Role        | Instagram Post/Carousel | Instagram Story/Reel | LinkedIn/Facebook | YouTube Thumb |
-|------------------|------------------------|----------------------|-------------------|---------------|
-| Hero / Display   | 58px                   | 56px                 | 40px              | 60px          |
-| Heading          | 43px                   | 42px                 | 32px              | 36px          |
-| Body / Bullets   | 34px                   | 32px                 | 24px              | 36px          |
-| Caption / Footer | 24px                   | 20px                 | 20px              | 32px          |
-
-**Universal rule**: No text element meant to be read may use a font size smaller than 20px, on any platform.
-
-#### Font Weight
-
-- Body text and above: use font-weight 500+ (medium/semibold/bold)
-- Caption text: font-weight 500+ strongly recommended; 400 only with explicit high-contrast background (4.5:1 ratio minimum)
-- Avoid thin/light weights (100-300) for any readable text
-
-#### Verification Checklist
-
-Before calling `browser_take_screenshot`, scan your HTML and confirm:
-- All text elements use explicit px sizes (not em/rem that could resolve smaller)
-- No heading is below the Heading minimum for the target platform
-- No body/bullet text is below the Body minimum
-- No footer or metadata text is below the Caption minimum
-- No readable text uses font-weight below 500 (caption at 400 only with 4.5:1 contrast background)
-
-## Available operations
-
-- **Render HTML to PNG** -- Convert self-contained HTML/CSS into a pixel-perfect screenshot
-- **Batch Render** -- Render multiple slides/pages sequentially for carousels and multi-image content
-- **Viewport Resize** -- Set precise viewport dimensions for any target platform
-- **Quality Verification** -- Visually inspect rendered output and re-render if needed

package/kit/.agents/skills/instagram-carrossel/scripts/publish.js

@@ -1,165 +0,0 @@
-#!/usr/bin/env node
-// Instagram Carousel Publisher
-// Usage: node --env-file=.env publish.js --images "slide1.jpg,slide2.jpg" --caption "..." [--dry-run]
-
-import { readFileSync } from 'node:fs';
-import { resolve } from 'node:path';
-import { fileURLToPath } from 'node:url';
-
-// ── Argument parsing ──────────────────────────────────────────
-
-export function parseArgs(argv) {
-  const args = { images: [], caption: '', dryRun: false };
-  for (let i = 2; i < argv.length; i++) {
-    if (argv[i] === '--images') {
-      if (i + 1 < argv.length) args.images = argv[++i].split(',').map(s => s.trim());
-    }
-    else if (argv[i] === '--caption') {
-      if (i + 1 < argv.length) args.caption = argv[++i];
-    }
-    else if (argv[i] === '--dry-run') args.dryRun = true;
-  }
-  return args;
-}
-
-// ── Image upload (imgBB) ──────────────────────────────────────
-
-export async function uploadToImgBB(imagePath, apiKey) {
-  const absolutePath = resolve(imagePath);
-  const fileBuffer = readFileSync(absolutePath);
-  const base64Image = fileBuffer.toString('base64');
-  const form = new FormData();
-  form.append('key', apiKey);
-  form.append('image', base64Image);
-  const res = await fetch('https://api.imgbb.com/1/upload', {
-    method: 'POST',
-    body: form,
-  });
-  if (!res.ok) throw new Error(`imgBB upload failed [${res.status}]: ${await res.text()}`);
-  const json = await res.json();
-  if (!json.success) throw new Error(`imgBB upload failed: ${JSON.stringify(json)}`);
-  return json.data.url;
-}
-
-// ── Instagram Graph API ───────────────────────────────────────
-
-const IG_BASE = 'https://graph.facebook.com/v21.0';
-
-export async function createChildContainer(userId, imageUrl, accessToken) {
-  const params = new URLSearchParams({
-    image_url: imageUrl,
-    is_carousel_item: 'true',
-    access_token: accessToken,
-  });
-  const res = await fetch(`${IG_BASE}/${userId}/media?${params}`, { method: 'POST' });
-  if (!res.ok) throw new Error(`createChildContainer failed [${res.status}]: ${await res.text()}`);
-  return (await res.json()).id;
-}
-
-export async function getContainerStatus(containerId, accessToken) {
-  const params = new URLSearchParams({ fields: 'status_code', access_token: accessToken });
-  const res = await fetch(`${IG_BASE}/${containerId}?${params}`);
-  if (!res.ok) throw new Error(`getContainerStatus failed [${res.status}]: ${await res.text()}`);
-  return (await res.json()).status_code;
-}
-
-export async function pollUntilFinished(containerId, accessToken, timeoutMs = 60_000, intervalMs = 3_000) {
-  const deadline = Date.now() + timeoutMs;
-  while (Date.now() < deadline) {
-    const status = await getContainerStatus(containerId, accessToken);
-    if (status === 'FINISHED') return;
-    if (status === 'ERROR') throw new Error(`Container ${containerId} entered ERROR state`);
-    await new Promise(r => setTimeout(r, intervalMs));
-  }
-  throw new Error(`Container ${containerId} timed out after ${timeoutMs}ms`);
-}
-
-export async function createCarouselContainer(userId, childIds, caption, accessToken) {
-  const params = new URLSearchParams({
-    media_type: 'CAROUSEL',
-    children: childIds.join(','),
-    caption,
-    access_token: accessToken,
-  });
-  const res = await fetch(`${IG_BASE}/${userId}/media?${params}`, { method: 'POST' });
-  if (!res.ok) throw new Error(`createCarouselContainer failed [${res.status}]: ${await res.text()}`);
-  return (await res.json()).id;
-}
-
-export async function publishMedia(userId, containerId, accessToken) {
-  const params = new URLSearchParams({ creation_id: containerId, access_token: accessToken });
-  const res = await fetch(`${IG_BASE}/${userId}/media_publish?${params}`, { method: 'POST' });
-  if (!res.ok) throw new Error(`publishMedia failed [${res.status}]: ${await res.text()}`);
-  return (await res.json()).id;
-}
-
-export async function getPermalink(mediaId, accessToken) {
-  const params = new URLSearchParams({ fields: 'permalink', access_token: accessToken });
-  const res = await fetch(`${IG_BASE}/${mediaId}?${params}`);
-  if (!res.ok) return null; // non-fatal — just skip the URL display
-  const json = await res.json();
-  return json.permalink ?? null;
-}
-
-// ── Main ──────────────────────────────────────────────────────
-
-async function main() {
-  const { images, caption, dryRun } = parseArgs(process.argv);
-
-  if (!images.length) throw new Error('--images is required (e.g. --images "slide1.jpg,slide2.jpg")');
-  if (!caption) throw new Error('--caption is required');
-  if (images.length < 2 || images.length > 10) {
-    throw new Error(`Instagram carousels require 2–10 images (got ${images.length})`);
-  }
-  if (caption.length > 2200) {
-    throw new Error(`Caption exceeds Instagram's 2200-character limit (got ${caption.length})`);
-  }
-
-  const { INSTAGRAM_ACCESS_TOKEN, INSTAGRAM_USER_ID, IMGBB_API_KEY } = process.env;
-  if (!INSTAGRAM_ACCESS_TOKEN) throw new Error('INSTAGRAM_ACCESS_TOKEN is not set in environment');
-  if (!INSTAGRAM_USER_ID) throw new Error('INSTAGRAM_USER_ID is not set in environment');
-  if (!IMGBB_API_KEY) throw new Error('IMGBB_API_KEY is not set in environment. Get one at https://api.imgbb.com/');
-
-  console.log(`📸 Uploading ${images.length} image(s) to imgBB...`);
-  const imageUrls = await Promise.all(images.map(p => uploadToImgBB(p, IMGBB_API_KEY)));
-  imageUrls.forEach((url, i) => console.log(`   [${i + 1}] ${url}`));
-
-  console.log('\n📦 Creating Instagram media containers...');
-  const childIds = await Promise.all(
-    imageUrls.map(url => createChildContainer(INSTAGRAM_USER_ID, url, INSTAGRAM_ACCESS_TOKEN))
-  );
-  console.log(`   Container IDs: ${childIds.join(', ')}`);
-
-  console.log('\n⏳ Waiting for containers to finish processing...');
-  await Promise.all(childIds.map(id => pollUntilFinished(id, INSTAGRAM_ACCESS_TOKEN)));
-  console.log('   All containers ready.');
-
-  console.log('\n🎠 Creating carousel container...');
-  const carouselId = await createCarouselContainer(
-    INSTAGRAM_USER_ID, childIds, caption, INSTAGRAM_ACCESS_TOKEN
-  );
-  await pollUntilFinished(carouselId, INSTAGRAM_ACCESS_TOKEN);
-  console.log(`   Carousel container ID: ${carouselId}`);
-
-  if (dryRun) {
-    console.log('\n✅ DRY RUN complete — skipping final publish call.');
-    console.log(`   Carousel container ready: ${carouselId}`);
-    return;
-  }
-
-  console.log('\n🚀 Publishing to Instagram...');
-  const postId = await publishMedia(INSTAGRAM_USER_ID, carouselId, INSTAGRAM_ACCESS_TOKEN);
-  const permalink = await getPermalink(postId, INSTAGRAM_ACCESS_TOKEN);
-  console.log(`\n✅ Published successfully!`);
-  console.log(`   Post ID: ${postId}`);
-  if (permalink) console.log(`   URL: ${permalink}`);
-}
-
-// Run only when executed directly (not when imported for tests)
-const isMain = process.argv[1] === fileURLToPath(import.meta.url);
-if (isMain) {
-  main().catch(err => {
-    console.error(`\n❌ ${err.message}`);
-    process.exit(1);
-  });
-}