vibetachyon 1.6.0 → 1.7.0

package/dist/mcp-server.js

@@ -174,7 +174,7 @@ async function startMcpServer() {
     await validateTokenAtStartup();
     const server = new mcp_js_1.McpServer({
         name: "VibeTachyon MCP — Animmaster Engine",
-        version: "1.6.0"
+        version: "1.7.0"
     });
     /**
      * VIBETACHYON FRONTEND PERSONA — Senior Frontend Designer (Animmaster Engine)
@@ -184,12 +184,12 @@ async function startMcpServer() {
      * as a unified system — not as isolated snippets. You do NOT generate generic code.
      *
      * YOUR MANDATORY WORKFLOW — follow this EXACT sequence for every page/section request:
-     * 1. vibe_project_dna       — read the project first, always
-     * 2. vibe_design_brief      — if no brief exists, ASK the user before touching any code
+     * 0. vibe_launchpad         — ABSOLUTE FIRST STEP, no exceptions. Scans stack, colors, brief, components.
+     * 1. vibe_get_architecture  — load designer rules for the specific context
+     * 2. vibe_design_brief      — if no brief exists (launchpad will tell you), create it now
      * 3. vibe_read_design_brief — read active brief before each new section
-     * 4. vibe_search_snippets   — search Animmaster components by use_case and visual_tone
-     * 5. vibe_get_component     — get the complete bundle (JS+HTML+SCSS) for chosen components
-     * 6. Generate code          — only after steps 1-5 are complete
+     * 4. vibe_get_component     — load each component bundle suggested by launchpad
+     * 5. Generate code          — only after steps 0-4 are complete. Never before.
      *
      * ANIMMASTER SYSTEM RULES:
      * - Components must be initialized in init_order sequence (0→6): preloader first, then cursor/header, then effects
@@ -220,6 +220,171 @@ async function startMcpServer() {
      * - Social proof (logos/testimonials) before pricing — builds trust first
      * - Every section must have ONE clear action or message. Not two.
      */
+    // ── Tool: Launchpad (MANDATORY FIRST STEP) ───────────────────────────────
+    server.tool("vibe_launchpad", "⚡ MANDATORY FIRST STEP — Call this before ANY frontend work (page, section, component, site). DO NOT write a single line of code without calling this first. It automatically scans the project stack, detects design tokens, reads the existing design brief, and suggests Animmaster components — returning a complete MISSION BRIEFING that makes all subsequent work precise and professional.", {
+        goal: zod_1.z.string().describe("What the user wants to build. Be specific: 'landing page for SaaS', 'hero section with animations', 'dashboard with sidebar', etc."),
+        projectDir: zod_1.z.string().optional().describe("Absolute path to the project root. If omitted, uses current working directory.")
+    }, async ({ goal, projectDir }) => {
+        await checkSanity();
+        const cwd = projectDir || process.cwd();
+        const root = await findProjectRoot(cwd);
+        const lines = [];
+        const sep = '═'.repeat(54);
+        lines.push(`╔${sep}╗`);
+        lines.push(`║  ⚡ VIBETACHYON MISSION BRIEFING${' '.repeat(21)}║`);
+        lines.push(`║  Goal: ${goal.slice(0, 46).padEnd(46)} ║`);
+        lines.push(`╠${sep}╣`);
+        // 1. Detect stack from package.json
+        let stackLines = [];
+        const pkgPath = path_1.default.join(root, 'package.json');
+        if (await fs_extra_1.default.pathExists(pkgPath)) {
+            try {
+                const pkg = await fs_extra_1.default.readJson(pkgPath);
+                const deps = { ...pkg.dependencies, ...pkg.devDependencies };
+                const framework = deps['next'] ? `Next.js ${deps['next'].replace(/[\^~]/, '')}` :
+                    deps['vite'] ? `Vite ${deps['vite'].replace(/[\^~]/, '')}` :
+                        deps['nuxt'] ? `Nuxt ${deps['nuxt'].replace(/[\^~]/, '')}` :
+                            deps['@remix-run/react'] ? 'Remix' :
+                                'Unknown';
+                const styling = deps['tailwindcss'] ? 'Tailwind CSS' :
+                    deps['styled-components'] ? 'Styled Components' :
+                        deps['@emotion/react'] ? 'Emotion' : 'CSS/SCSS';
+                const typescript = deps['typescript'] || deps['@types/react'] ? 'TypeScript' : 'JavaScript';
+                const ui = deps['@shadcn/ui'] || (await fs_extra_1.default.pathExists(path_1.default.join(root, 'components.json'))) ? ' + Shadcn UI' : '';
+                stackLines.push(`  Stack   : ${framework} · ${styling} · ${typescript}${ui}`);
+                stackLines.push(`  Package : ${pkg.name || 'unnamed'} v${pkg.version || '0.0.0'}`);
+            }
+            catch {
+                stackLines.push('  Stack   : Could not parse package.json');
+            }
+        }
+        else {
+            stackLines.push('  Stack   : No package.json found');
+        }
+        // 2. Detect CSS variables / brand colors
+        let colorLines = [];
+        const cssFiles = ['src/app/globals.css', 'src/styles/globals.css', 'styles/globals.css', 'src/index.css', 'index.css', 'src/main.css'];
+        let cssFound = false;
+        for (const f of cssFiles) {
+            const cssPath = path_1.default.join(root, f);
+            if (await fs_extra_1.default.pathExists(cssPath)) {
+                const css = await fs_extra_1.default.readFile(cssPath, 'utf-8');
+                const vars = css.match(/--[\w-]+:\s*[^;]+/g) || [];
+                const colorVars = vars.filter(v => v.match(/color|primary|secondary|accent|background|foreground/i)).slice(0, 4);
+                if (colorVars.length > 0) {
+                    colorLines.push(`  Colors  : ${colorVars.map(v => v.split(':')[0].trim()).join(', ')}`);
+                }
+                else {
+                    colorLines.push(`  Colors  : ${f} found — no color vars detected`);
+                }
+                cssFound = true;
+                break;
+            }
+        }
+        if (!cssFound) {
+            // Try tailwind config
+            const twFiles = ['tailwind.config.ts', 'tailwind.config.js', 'tailwind.config.mjs'];
+            for (const f of twFiles) {
+                if (await fs_extra_1.default.pathExists(path_1.default.join(root, f))) {
+                    colorLines.push(`  Colors  : Tailwind config found (${f}) — use vibe_get_colors for full palette`);
+                    break;
+                }
+            }
+            if (colorLines.length === 0)
+                colorLines.push('  Colors  : No CSS variables detected — define brand colors in brief');
+        }
+        // 3. Check for existing design brief
+        let briefLines = [];
+        let briefExists = false;
+        const briefPath = path_1.default.join(root, '.vibetachyon', 'design-brief.json');
+        if (await fs_extra_1.default.pathExists(briefPath)) {
+            try {
+                const brief = await fs_extra_1.default.readJson(briefPath);
+                briefExists = true;
+                briefLines.push(`  Brief   : ✅ EXISTS — "${brief.projectName || 'unnamed'}" (${brief.visualTone || 'no tone set'})`);
+                if (brief.sections?.length)
+                    briefLines.push(`  Sections: ${brief.sections.map((s) => s.name || s).join(', ')}`);
+                if (brief.avoid?.length)
+                    briefLines.push(`  Avoid   : ${brief.avoid.join(', ')}`);
+            }
+            catch {
+                briefLines.push('  Brief   : Found but corrupted — run vibe_design_brief to recreate');
+            }
+        }
+        else {
+            briefLines.push('  Brief   : ❌ MISSING — vibe_design_brief must be created before code');
+        }
+        // 4. Suggest Animmaster components for the goal
+        let componentLines = [];
+        try {
+            const goalLower = goal.toLowerCase();
+            const keywords = [];
+            if (/hero|landing|header/.test(goalLower))
+                keywords.push('hero', 'header', 'splittype', 'parallax');
+            if (/animation|effect|motion/.test(goalLower))
+                keywords.push('cursor', 'ripple', 'gsap', 'mouse');
+            if (/gallery|portfolio|showcase/.test(goalLower))
+                keywords.push('masonry', 'gallery', 'zoom', 'slider');
+            if (/form|contact|input|checkout/.test(goalLower))
+                keywords.push('form', 'input', 'datepicker', 'select');
+            if (/menu|nav|navigation/.test(goalLower))
+                keywords.push('menu', 'header', 'scrollto');
+            if (/scroll|reveal|appear/.test(goalLower))
+                keywords.push('watcher', 'scrollto', 'parallax');
+            if (/load|intro|preload/.test(goalLower))
+                keywords.push('preloader');
+            if (/count|stat|number|metric/.test(goalLower))
+                keywords.push('digcounter', 'chart');
+            if (/tab|toggle|accordion/.test(goalLower))
+                keywords.push('tabs', 'spollers', 'showmore');
+            if (/popup|modal|dialog/.test(goalLower))
+                keywords.push('popup', 'tippy');
+            if (keywords.length === 0)
+                keywords.push('header', 'watcher', 'splittype');
+            const uniqueKeywords = [...new Set(keywords)].slice(0, 6);
+            const { data: components } = await supabase
+                .from('animmaster_components')
+                .select('name, category, description')
+                .in('name', uniqueKeywords);
+            if (components && components.length > 0) {
+                componentLines.push(`  Ready   : ${components.map((c) => c.name).join(', ')}`);
+                componentLines.push(`  Cmd     : use vibe_get_component to load each bundle`);
+            }
+            else {
+                componentLines.push(`  Ready   : Use vibe_search_snippets to find matching components`);
+            }
+        }
+        catch {
+            componentLines.push('  Ready   : Run vibe_search_snippets to find components');
+        }
+        // 5. Build next steps based on state
+        const nextSteps = [];
+        if (!briefExists)
+            nextSteps.push('1. vibe_design_brief — define project identity & style');
+        nextSteps.push(`${nextSteps.length + 1}. vibe_get_component — load each suggested component`);
+        nextSteps.push(`${nextSteps.length + 1}. Generate code — only after brief is confirmed`);
+        if (briefExists)
+            nextSteps.push(`${nextSteps.length + 1}. vibe_mission_start — track this build with tasks`);
+        // Compose output
+        lines.push('║  PROJECT STACK' + ' '.repeat(40) + '║');
+        stackLines.forEach(l => lines.push(`║${l.padEnd(55)}║`));
+        lines.push(`╠${sep}╣`);
+        lines.push('║  DESIGN TOKENS' + ' '.repeat(40) + '║');
+        colorLines.forEach(l => lines.push(`║${l.padEnd(55)}║`));
+        lines.push(`╠${sep}╣`);
+        lines.push('║  DESIGN BRIEF' + ' '.repeat(41) + '║');
+        briefLines.forEach(l => lines.push(`║${l.padEnd(55)}║`));
+        lines.push(`╠${sep}╣`);
+        lines.push('║  ANIMMASTER COMPONENTS' + ' '.repeat(32) + '║');
+        componentLines.forEach(l => lines.push(`║${l.padEnd(55)}║`));
+        lines.push(`╠${sep}╣`);
+        lines.push('║  NEXT STEPS' + ' '.repeat(43) + '║');
+        nextSteps.forEach(s => lines.push(`║  ${s.padEnd(53)}║`));
+        lines.push(`╚${sep}╝`);
+        lines.push('');
+        lines.push('⚠️  DO NOT write code until brief exists and components are loaded.');
+        return { content: [{ type: "text", text: lines.join('\n') }] };
+    });
     // Tool: Searching Snippets (Animmaster Engine)
     server.tool("vibe_search_snippets", "Search for Animmaster UI components. Returns standalone JS + HTML + SCSS bundles ready to use. Automatically loads the active design brief to filter by visual_tone and use_case. Always call vibe_project_dna and vibe_design_brief before this tool.", {
         query: zod_1.z.string().describe("Search query for the UI component (e.g. 'hero section', 'text animation', 'parallax scroll')"),
@@ -457,7 +622,7 @@ async function startMcpServer() {
         }
     });
     // Tool: Frontend Persona — Senior Designer Rules
-    server.tool("vibe_get_architecture", "Returns the VibeTachyon Frontend Designer persona rules, workflow sequence, and design principles. Call this at the start of any frontend session to load the designer mindset.", {
+    server.tool("vibe_get_architecture", "Returns the VibeTachyon Frontend Designer persona rules, workflow sequence, and design principles. Call AFTER vibe_launchpad to load the designer mindset for the specific context (landing-page, saas-dashboard, etc.).", {
         context: zod_1.z.string().optional().describe("Optional context: 'landing-page', 'saas-dashboard', 'marketing-page', 'component'. Defaults to 'landing-page'.")
     }, async ({ context = 'landing-page' }) => {
         await checkSanity();

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "vibetachyon",
-    "version": "1.6.0",
+    "version": "1.7.0",
     "description": "VibeCodes MCP CLI Installer and Server",
     "main": "dist/index.js",
     "bin": {