@superdesign/cli 0.1.0

package/dist/index.cjs

@@ -0,0 +1,1254 @@
+"use strict";
+const __rslib_import_meta_url__ = /*#__PURE__*/ function() {
+    return 'undefined' == typeof document ? new (require('url'.replace('', ''))).URL('file:' + __filename).href : document.currentScript && document.currentScript.src || new URL('main.js', document.baseURI).href;
+}();
+var __webpack_modules__ = {
+    open: function(module) {
+        module.exports = import("open").then(function(module) {
+            return module;
+        });
+    }
+};
+var __webpack_module_cache__ = {};
+function __webpack_require__(moduleId) {
+    var cachedModule = __webpack_module_cache__[moduleId];
+    if (void 0 !== cachedModule) return cachedModule.exports;
+    var module = __webpack_module_cache__[moduleId] = {
+        exports: {}
+    };
+    __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+    return module.exports;
+}
+(()=>{
+    __webpack_require__.n = (module)=>{
+        var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
+        __webpack_require__.d(getter, {
+            a: getter
+        });
+        return getter;
+    };
+})();
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+(()=>{
+    __webpack_require__.r(__webpack_exports__);
+    __webpack_require__.d(__webpack_exports__, {
+        run: ()=>run,
+        createDraft: ()=>createDraft,
+        getApiUrl: ()=>getApiUrl,
+        iterateDraft: ()=>iterateDraft,
+        clearConfig: ()=>clearConfig,
+        isJobDone: ()=>isJobDone,
+        createProject: ()=>createProject,
+        executeFlowPages: ()=>executeFlowPages,
+        loadConfig: ()=>loadConfig,
+        createPublicApiClient: ()=>createPublicApiClient,
+        planFlowPages: ()=>planFlowPages,
+        claimSession: ()=>claimSession,
+        isAuthenticated: ()=>manager_isAuthenticated,
+        addDraft: ()=>addDraft,
+        saveConfig: ()=>saveConfig,
+        createSession: ()=>createSession,
+        isJobFailed: ()=>isJobFailed,
+        getConfigPath: ()=>getConfigPath,
+        pollSession: ()=>pollSession,
+        updateConfig: ()=>updateConfig,
+        createProgram: ()=>createProgram,
+        getApiClient: ()=>getApiClient,
+        getJobStatus: ()=>getJobStatus,
+        getConfigDir: ()=>getConfigDir,
+        isJobCompleted: ()=>isJobCompleted,
+        ApiClientError: ()=>ApiClientError,
+        getApiKey: ()=>getApiKey,
+        createApiClient: ()=>createApiClient
+    });
+    const external_dotenv_namespaceObject = require("dotenv");
+    const external_url_namespaceObject = require("url");
+    const external_path_namespaceObject = require("path");
+    const external_commander_namespaceObject = require("commander");
+    const external_fs_namespaceObject = require("fs");
+    const external_os_namespaceObject = require("os");
+    const CONFIG_DIR_NAME = '.superdesign';
+    const CONFIG_FILE_NAME = 'config.json';
+    const EXIT_CODES = {
+        SUCCESS: 0,
+        GENERAL_ERROR: 1,
+        AUTH_REQUIRED: 2,
+        AUTH_FAILED: 3,
+        API_ERROR: 4,
+        VALIDATION_ERROR: 5,
+        TIMEOUT: 6
+    };
+    const SKILLS_DIR = '.claude/skills/superdesign';
+    const SKILL_FILE_NAME = 'SKILL.md';
+    function getConfigDir() {
+        return external_path_namespaceObject.join(external_os_namespaceObject.homedir(), CONFIG_DIR_NAME);
+    }
+    function getConfigPath() {
+        return external_path_namespaceObject.join(getConfigDir(), CONFIG_FILE_NAME);
+    }
+    function ensureConfigDir() {
+        const configDir = getConfigDir();
+        if (!external_fs_namespaceObject.existsSync(configDir)) external_fs_namespaceObject.mkdirSync(configDir, {
+            recursive: true,
+            mode: 448
+        });
+    }
+    function loadConfig() {
+        const configPath = getConfigPath();
+        if (!external_fs_namespaceObject.existsSync(configPath)) return {};
+        try {
+            const content = external_fs_namespaceObject.readFileSync(configPath, 'utf-8');
+            return JSON.parse(content);
+        } catch  {
+            return {};
+        }
+    }
+    function saveConfig(config) {
+        ensureConfigDir();
+        const configPath = getConfigPath();
+        external_fs_namespaceObject.writeFileSync(configPath, JSON.stringify(config, null, 2), {
+            encoding: 'utf-8',
+            mode: 384
+        });
+    }
+    function updateConfig(updates) {
+        const current = loadConfig();
+        const updated = {
+            ...current,
+            ...updates
+        };
+        saveConfig(updated);
+        return updated;
+    }
+    function clearConfig() {
+        const configPath = getConfigPath();
+        if (external_fs_namespaceObject.existsSync(configPath)) external_fs_namespaceObject.unlinkSync(configPath);
+    }
+    function manager_isAuthenticated() {
+        const config = loadConfig();
+        return !!config.apiKey;
+    }
+    function getApiKey() {
+        const config = loadConfig();
+        if (!config.apiKey) throw new Error('Not authenticated. Run `superdesign login` first.');
+        return config.apiKey;
+    }
+    function getApiUrl() {
+        const config = loadConfig();
+        return config.apiUrl || process.env.SUPERDESIGN_API_URL || 'https://api.superdesign.dev/v1';
+    }
+    const external_axios_namespaceObject = require("axios");
+    var external_axios_default = /*#__PURE__*/ __webpack_require__.n(external_axios_namespaceObject);
+    class ApiClientError extends Error {
+        constructor(message, code, status, details){
+            super(message), this.code = code, this.status = status, this.details = details;
+            this.name = 'ApiClientError';
+        }
+    }
+    function createApiClient(requireAuth = true) {
+        const baseURL = getApiUrl();
+        const client = external_axios_default().create({
+            baseURL,
+            timeout: 30000,
+            headers: {
+                'Content-Type': 'application/json'
+            }
+        });
+        if (requireAuth) client.interceptors.request.use((config)=>{
+            if (!manager_isAuthenticated()) throw new ApiClientError('Not authenticated. Run `superdesign login` first.', 'auth_required', 401);
+            const apiKey = getApiKey();
+            config.headers.Authorization = `Bearer ${apiKey}`;
+            return config;
+        });
+        client.interceptors.response.use((response)=>response, (error)=>{
+            if (error.response) {
+                const { status, data } = error.response;
+                const apiError = data?.error;
+                throw new ApiClientError(apiError?.message || error.message, apiError?.code || 'api_error', status, apiError?.details);
+            }
+            if ('ECONNREFUSED' === error.code) throw new ApiClientError('Could not connect to SuperDesign API', 'connection_error');
+            if ('ETIMEDOUT' === error.code) throw new ApiClientError('Request timed out', 'timeout');
+            throw new ApiClientError(error.message || 'Unknown error', 'unknown_error');
+        });
+        return client;
+    }
+    function createPublicApiClient() {
+        return createApiClient(false);
+    }
+    function getApiClient() {
+        return createApiClient(true);
+    }
+    async function createSession(data) {
+        const client = createPublicApiClient();
+        const response = await client.post('/cli-auth/sessions', data);
+        return response.data;
+    }
+    async function pollSession(pollToken) {
+        const client = createPublicApiClient();
+        const response = await client.get('/cli-auth/sessions/poll', {
+            params: {
+                token: pollToken
+            }
+        });
+        return response.data;
+    }
+    async function claimSession(pollToken) {
+        const client = createPublicApiClient();
+        const response = await client.post('/cli-auth/sessions/claim', {
+            pollToken
+        });
+        return response.data;
+    }
+    async function openBrowser(url) {
+        const open = await Promise.resolve().then(__webpack_require__.bind(__webpack_require__, "open"));
+        await open.default(url);
+    }
+    async function poll(fn, isDone, options = {}) {
+        const intervalMs = options.intervalMs ?? 2000;
+        const timeoutMs = options.timeoutMs ?? 300000;
+        const startTime = Date.now();
+        let attempt = 0;
+        while(Date.now() - startTime < timeoutMs){
+            attempt++;
+            if (options.onPoll) options.onPoll(attempt);
+            try {
+                const result = await fn();
+                if (isDone(result)) return {
+                    success: true,
+                    data: result
+                };
+            } catch (err) {
+                const message = err instanceof Error ? err.message : 'Unknown error';
+                return {
+                    success: false,
+                    error: message
+                };
+            }
+            await sleep(intervalMs);
+        }
+        return {
+            success: false,
+            timedOut: true,
+            error: 'Polling timed out'
+        };
+    }
+    function sleep(ms) {
+        return new Promise((resolve)=>setTimeout(resolve, ms));
+    }
+    const external_ora_namespaceObject = require("ora");
+    var external_ora_default = /*#__PURE__*/ __webpack_require__.n(external_ora_namespaceObject);
+    let jsonMode = false;
+    function setJsonMode(enabled) {
+        jsonMode = enabled;
+    }
+    function isJsonMode() {
+        return jsonMode;
+    }
+    function output(data) {
+        if (jsonMode) console.log(JSON.stringify(data, null, 2));
+        else if ('string' == typeof data) console.log(data);
+        else console.log(JSON.stringify(data, null, 2));
+    }
+    function success(message) {
+        if (!jsonMode) console.log(`✓ ${message}`);
+    }
+    function output_error(message) {
+        if (jsonMode) console.error(JSON.stringify({
+            error: message
+        }));
+        else console.error(`✗ ${message}`);
+    }
+    function info(message) {
+        if (!jsonMode) console.log(message);
+    }
+    let currentSpinner = null;
+    function startSpinner(text) {
+        if (isJsonMode()) return null;
+        currentSpinner = external_ora_default()(text).start();
+        return currentSpinner;
+    }
+    function updateSpinner(text) {
+        if (currentSpinner) currentSpinner.text = text;
+    }
+    function succeedSpinner(text) {
+        if (currentSpinner) {
+            currentSpinner.succeed(text);
+            currentSpinner = null;
+        }
+    }
+    function failSpinner(text) {
+        if (currentSpinner) {
+            currentSpinner.fail(text);
+            currentSpinner = null;
+        }
+    }
+    async function runAuthFlow(options = {}) {
+        const { openBrowser: shouldOpenBrowser = true, showSuccessMessage = true } = options;
+        try {
+            startSpinner('Creating auth session...');
+            const session = await createSession({
+                cliVersion: "0.1.0",
+                os: `${external_os_namespaceObject.platform()} ${external_os_namespaceObject.release()}`,
+                hostname: external_os_namespaceObject.hostname()
+            });
+            updateSpinner('Waiting for browser authorization...');
+            if (shouldOpenBrowser) try {
+                await openBrowser(session.authUrl);
+                info(`\nOpened browser to: ${session.authUrl}`);
+            } catch  {
+                info(`\nPlease open this URL in your browser:\n${session.authUrl}`);
+            }
+            else info(`\nPlease open this URL in your browser:\n${session.authUrl}`);
+            info(`\nSession code: ${session.sessionCode}`);
+            info('Waiting for authorization...\n');
+            const pollResult = await poll(()=>pollSession(session.pollToken), (response)=>'pending' !== response.status, {
+                intervalMs: 2000,
+                timeoutMs: 600000,
+                onPoll: (attempt)=>{
+                    if (attempt % 10 === 0) updateSpinner(`Waiting for authorization... (${Math.floor(2000 * attempt / 1000)}s)`);
+                }
+            });
+            if (pollResult.timedOut) {
+                failSpinner('Authorization timed out');
+                return {
+                    success: false,
+                    error: 'Session expired. Please try again.'
+                };
+            }
+            if (!pollResult.success || !pollResult.data) {
+                failSpinner('Authorization failed');
+                return {
+                    success: false,
+                    error: pollResult.error || 'Failed to get authorization status'
+                };
+            }
+            const authResponse = pollResult.data;
+            if ('expired' === authResponse.status) {
+                failSpinner('Session expired');
+                return {
+                    success: false,
+                    error: 'Session expired. Please try again.'
+                };
+            }
+            if ('approved' !== authResponse.status || !authResponse.apiKey) {
+                failSpinner('Authorization denied');
+                return {
+                    success: false,
+                    error: 'Authorization was denied or failed.'
+                };
+            }
+            await claimSession(session.pollToken);
+            updateConfig({
+                apiKey: authResponse.apiKey,
+                teamId: authResponse.teamId,
+                teamName: authResponse.teamName
+            });
+            succeedSpinner('Authenticated successfully!');
+            if (showSuccessMessage) success(`Logged in to team: ${authResponse.teamName}`);
+            return {
+                success: true,
+                teamId: authResponse.teamId,
+                teamName: authResponse.teamName,
+                apiKey: authResponse.apiKey
+            };
+        } catch (err) {
+            failSpinner('Login failed');
+            const message = err instanceof Error ? err.message : 'Unknown error';
+            output_error(message);
+            return {
+                success: false,
+                error: message
+            };
+        }
+    }
+    const LOGO = `
+ ███████╗██╗   ██╗██████╗ ███████╗██████╗ ██████╗ ███████╗███████╗██╗ ██████╗ ███╗   ██╗
+ ██╔════╝██║   ██║██╔══██╗██╔════╝██╔══██╗██╔══██╗██╔════╝██╔════╝██║██╔════╝ ████╗  ██║
+ ███████╗██║   ██║██████╔╝█████╗  ██████╔╝██║  ██║█████╗  ███████╗██║██║  ███╗██╔██╗ ██║
+ ╚════██║██║   ██║██╔═══╝ ██╔══╝  ██╔══██╗██║  ██║██╔══╝  ╚════██║██║██║   ██║██║╚██╗██║
+ ███████║╚██████╔╝██║     ███████╗██║  ██║██████╔╝███████╗███████║██║╚██████╔╝██║ ╚████║
+ ╚══════╝ ╚═════╝ ╚═╝     ╚══════╝╚═╝  ╚═╝╚═════╝ ╚══════╝╚══════╝╚═╝ ╚═════╝ ╚═╝  ╚═══╝
+`.trim();
+    const TAGLINE = 'AI designer for coding agents';
+    const SCRAMBLE_CHARS = '░▒▓█▄▀│┤┐└┴┬├─┼╞╟╚╔╩╦╠═╬╧╨╤╥╙╘╒╓╫╪┘┌';
+    function ascii_animation_sleep(ms) {
+        return new Promise((resolve)=>setTimeout(resolve, ms));
+    }
+    function getRandomChar() {
+        return SCRAMBLE_CHARS[Math.floor(Math.random() * SCRAMBLE_CHARS.length)];
+    }
+    function shouldSkipAnimation() {
+        if (process.env.CI) return true;
+        if (!process.stdout.isTTY) return true;
+        if (process.env.NO_COLOR) return true;
+        return false;
+    }
+    function clearFrame(lineCount) {
+        for(let i = 0; i < lineCount; i++){
+            process.stdout.write('\x1B[1A');
+            process.stdout.write('\x1B[2K');
+        }
+    }
+    async function animateLogo() {
+        if (shouldSkipAnimation()) {
+            console.log(LOGO);
+            console.log(TAGLINE);
+            console.log();
+            return;
+        }
+        const lines = LOGO.split('\n');
+        const frames = 20;
+        const frameDelay = 60;
+        const scrambledLines = lines.map((line)=>line.split('').map((char)=>' ' === char ? ' ' : getRandomChar()).join(''));
+        console.log(scrambledLines.join('\n'));
+        for(let frame = 1; frame <= frames; frame++){
+            await ascii_animation_sleep(frameDelay);
+            clearFrame(lines.length);
+            const revealRatio = frame / frames;
+            const easedRatio = 1 - Math.pow(1 - revealRatio, 3);
+            const renderedLines = lines.map((line)=>line.split('').map((char, i)=>{
+                    if (' ' === char) return ' ';
+                    const positionFactor = i / line.length;
+                    const threshold = 1.2 * easedRatio - 0.3 * positionFactor;
+                    if (Math.random() < threshold) return char;
+                    return getRandomChar();
+                }).join(''));
+            console.log(renderedLines.join('\n'));
+        }
+        clearFrame(lines.length);
+        console.log(LOGO);
+        await ascii_animation_sleep(100);
+        console.log(TAGLINE);
+        console.log();
+    }
+    function createLoginCommand() {
+        const command = new external_commander_namespaceObject.Command('login').description('Authenticate with SuperDesign platform').option('--json', 'Output in JSON format').option('--no-browser', 'Do not open browser automatically').action(async (options)=>{
+            if (options.json) setJsonMode(true);
+            if (!isJsonMode()) await animateLogo();
+            const currentConfig = loadConfig();
+            if (currentConfig.apiKey) {
+                info(`Already authenticated as team: ${currentConfig.teamName || 'Unknown'}`);
+                info('Run `superdesign login` again to re-authenticate.');
+            }
+            const result = await runAuthFlow({
+                openBrowser: false !== options.noBrowser,
+                showSuccessMessage: !isJsonMode()
+            });
+            if (!result.success) {
+                output_error(result.error || 'Authentication failed');
+                process.exit(EXIT_CODES.AUTH_FAILED);
+            }
+            if (isJsonMode()) output({
+                success: true,
+                teamId: result.teamId,
+                teamName: result.teamName
+            });
+            else {
+                info('\nYou can now use SuperDesign CLI commands.');
+                info('Run `superdesign init` to install Claude Code skills.');
+            }
+        });
+        return command;
+    }
+    function createLogoutCommand() {
+        const command = new external_commander_namespaceObject.Command('logout').description('Log out and clear stored credentials').option('--json', 'Output in JSON format').action(async (options)=>{
+            if (options.json) setJsonMode(true);
+            try {
+                if (!manager_isAuthenticated()) {
+                    if (isJsonMode()) output({
+                        success: true,
+                        message: 'Not logged in'
+                    });
+                    else info('Not logged in.');
+                    return;
+                }
+                const config = loadConfig();
+                const teamName = config.teamName;
+                clearConfig();
+                if (isJsonMode()) output({
+                    success: true,
+                    message: 'Logged out successfully',
+                    teamName
+                });
+                else {
+                    success('Logged out successfully!');
+                    if (teamName) info(`Disconnected from team: ${teamName}`);
+                    info('\nRun `superdesign login` or `superdesign init` to authenticate again.');
+                }
+            } catch (err) {
+                const message = err instanceof Error ? err.message : 'Unknown error';
+                output_error(`Failed to logout: ${message}`);
+            }
+        });
+        return command;
+    }
+    function getSkillTemplate() {
+        return `---
+name: superdesign
+description: Superdesign is a design agent, where it specialised in frontend UI/UX design; Use this skill before you implement any UI that require some design thinking
+---
+
+# SuperDesign Integration
+This skill provides integration with the SuperDesign platform for AI-powered design generation.
+
+## Available Commands
+
+### Create Project
+
+Create a new new project, can pass optional HTML as initial starting point for design iteration:
+
+\`\`\`bash
+# Basic project
+superdesign create-project --title "My Project" --json
+
+# Project with initial HTML
+superdesign create-project --title "My Project" --html "<html>...</html>" --json
+
+# Project with HTML from file
+superdesign create-project --title "My Project" --html-file ./index.html --json
+\`\`\`
+
+**Output (JSON):**
+\`\`\`json
+{
+  "projectId": "uuid",
+  "title": "My Project",
+  "projectUrl": "https://app.superdesign.ai/...",
+  "shareToken": "token"
+}
+\`\`\`
+
+### Create Design Draft
+
+Generate a design draft using AI designer:
+
+\`\`\`bash
+superdesign create-design-draft \\
+  --project-id <project-id> \\
+  --title "Hero Section" \\
+  --prompt "Create a modern hero section with gradient background" \\
+  --device desktop \\
+  --json
+\`\`\`
+
+**Options:**
+- \`--project-id\` (required): Project to add draft to
+- \`--title\` (required): Draft title
+- \`--prompt\` (required): AI generation prompt
+- \`--device\`: Device mode (mobile, tablet, desktop)
+
+**Output (JSON):**
+\`\`\`json
+{
+  "draftId": "uuid",
+  "nodeId": "uuid",
+  "title": "Hero Section",
+  "projectUrl": "https://app.superdesign.ai/...",
+  "nodeUrl": "https://app.superdesign.ai/...?node=...",
+  "previewUrl": "https://preview.superdesign.ai/...",
+  "creditsConsumed": 1
+}
+\`\`\`
+
+### Iterate Design Draft
+
+Create variations or improvements of an existing draft:
+
+\`\`\`bash
+# Replace mode - updates the existing draft
+superdesign iterate-design-draft \\
+  --draft-id <draft-id> \\
+  --prompt "Make the colors more vibrant" \\
+  --mode replace \\
+  --json
+
+# Branch mode - creates new variations
+superdesign iterate-design-draft \\
+  --draft-id <draft-id> \\
+  --prompt "Try different color schemes" \\
+  --mode branch \\
+  --count 3 \\
+  --json
+\`\`\`
+
+**Options:**
+- \`--draft-id\` (required): Draft to iterate on
+- \`--prompt\` (required): Iteration instructions
+- \`--mode\` (required): "replace" or "branch"
+- \`--count\`: Number of variations (1-4, branch mode only)
+
+**Output (JSON):**
+\`\`\`json
+{
+  "drafts": [
+    {
+      "draftId": "uuid",
+      "nodeId": "uuid",
+      "title": "Variation 1",
+      "nodeUrl": "https://...",
+      "previewUrl": "https://..."
+    }
+  ],
+  "projectUrl": "https://...",
+  "creditsConsumed": 3
+}
+\`\`\`
+
+### Plan Flow Pages
+
+Get AI suggestions for related pages in a user flow:
+
+\`\`\`bash
+superdesign plan-flow-pages \\
+  --draft-id <draft-id> \\
+  --source-node-id <node-id> \\
+  --context "E-commerce checkout flow" \\
+  --json
+\`\`\`
+
+**Options:**
+- \`--draft-id\` (required): Source draft
+- \`--source-node-id\` (required): Starting node in flow
+- \`--context\`: Additional context for planning
+
+**Output (JSON):**
+\`\`\`json
+{
+  "pages": [
+    {
+      "title": "Cart Review",
+      "prompt": "Create a cart review page showing..."
+    },
+    {
+      "title": "Payment",
+      "prompt": "Create a payment form with..."
+    }
+  ],
+  "creditsConsumed": 1
+}
+\`\`\`
+
+### Execute Flow Pages
+
+Generate the planned flow pages:
+
+\`\`\`bash
+superdesign execute-flow-pages \\
+  --draft-id <draft-id> \\
+  --source-node-id <node-id> \\
+  --pages '[{"title":"Cart","prompt":"Create cart page"},{"title":"Payment","prompt":"Create payment form"}]' \\
+  --json
+\`\`\`
+
+**Options:**
+- \`--draft-id\` (required): Source draft
+- \`--source-node-id\` (required): Starting node
+- \`--pages\` (required): JSON array of pages to generate
+- \`--context\`: Additional context
+
+**Output (JSON):**
+\`\`\`json
+{
+  "drafts": [
+    {
+      "index": 0,
+      "draftId": "uuid",
+      "nodeId": "uuid",
+      "title": "Cart",
+      "nodeUrl": "https://...",
+      "previewUrl": "https://..."
+    }
+  ],
+  "projectUrl": "https://...",
+  "creditsConsumed": 2
+}
+\`\`\`
+
+## Workflow Examples
+
+### Create a new design from scratch
+
+\`\`\`bash
+# 1. Create project
+PROJECT=$(superdesign create-project --title "Landing Page" --json)
+PROJECT_ID=$(echo $PROJECT | jq -r '.projectId')
+
+# 2. Generate initial design
+DRAFT=$(superdesign create-design-draft \\
+  --project-id $PROJECT_ID \\
+  --title "Hero" \\
+  --prompt "Modern SaaS landing page hero with gradient, CTA button" \\
+  --json)
+
+echo "Preview: $(echo $DRAFT | jq -r '.previewUrl')"
+\`\`\`
+
+### Iterate on existing design
+
+\`\`\`bash
+# Create variations
+superdesign iterate-design-draft \\
+  --draft-id <draft-id> \\
+  --prompt "Try a dark theme version" \\
+  --mode branch \\
+  --count 2 \\
+  --json
+\`\`\`
+
+### Build a complete user flow
+
+\`\`\`bash
+# 1. Plan the flow
+PLAN=$(superdesign plan-flow-pages \\
+  --draft-id <draft-id> \\
+  --source-node-id <node-id> \\
+  --context "User onboarding flow" \\
+  --json)
+
+# 2. Execute the plan
+PAGES=$(echo $PLAN | jq -c '.pages')
+superdesign execute-flow-pages \\
+  --draft-id <draft-id> \\
+  --source-node-id <node-id> \\
+  --pages "$PAGES" \\
+  --json
+\`\`\`
+
+
+## Tips
+
+- Always use \`--json\` flag when parsing output programmatically
+- Store project and draft IDs for subsequent operations
+- Use \`plan-flow-pages\` before \`execute-flow-pages\` for best results
+- The \`previewUrl\` can be used to view designs without authentication
+`;
+    }
+    function createInitCommand() {
+        const command = new external_commander_namespaceObject.Command('init').description('Install SuperDesign skill files for Claude Code (auto-login if needed)').option('--json', 'Output in JSON format').option('--force', 'Overwrite existing skill files').action(async (options)=>{
+            if (options.json) setJsonMode(true);
+            if (!isJsonMode()) await animateLogo();
+            try {
+                if (!manager_isAuthenticated()) {
+                    info('Not authenticated. Starting login flow...\n');
+                    const authResult = await runAuthFlow({
+                        showSuccessMessage: true
+                    });
+                    if (!authResult.success) {
+                        output_error(authResult.error || 'Authentication failed');
+                        process.exit(EXIT_CODES.AUTH_FAILED);
+                    }
+                    info('');
+                }
+                const cwd = process.cwd();
+                const skillsPath = external_path_namespaceObject.join(cwd, SKILLS_DIR);
+                const skillFilePath = external_path_namespaceObject.join(skillsPath, SKILL_FILE_NAME);
+                if (external_fs_namespaceObject.existsSync(skillFilePath) && !options.force) {
+                    if (isJsonMode()) output({
+                        success: false,
+                        error: 'Skill file already exists. Use --force to overwrite.',
+                        path: skillFilePath
+                    });
+                    else {
+                        info(`Skill file already exists at: ${skillFilePath}`);
+                        info('Use --force to overwrite.');
+                    }
+                    process.exit(EXIT_CODES.VALIDATION_ERROR);
+                }
+                external_fs_namespaceObject.mkdirSync(skillsPath, {
+                    recursive: true
+                });
+                const skillContent = getSkillTemplate();
+                external_fs_namespaceObject.writeFileSync(skillFilePath, skillContent, 'utf-8');
+                if (isJsonMode()) output({
+                    success: true,
+                    path: skillFilePath,
+                    message: 'Skill files installed successfully'
+                });
+                else {
+                    success('Skill files installed successfully!');
+                    info(`\nSkill file created at: ${skillFilePath}`);
+                    info('\nClaude Code will now have access to SuperDesign commands.');
+                    info('Available commands:');
+                    info('  - superdesign create-project');
+                    info('  - superdesign create-design-draft');
+                    info('  - superdesign iterate-design-draft');
+                    info('  - superdesign plan-flow-pages');
+                    info('  - superdesign execute-flow-pages');
+                }
+            } catch (err) {
+                const message = err instanceof Error ? err.message : 'Unknown error';
+                output_error(`Failed to initialize: ${message}`);
+                process.exit(EXIT_CODES.GENERAL_ERROR);
+            }
+        });
+        return command;
+    }
+    async function createProject(data) {
+        const client = getApiClient();
+        const response = await client.post('/external/projects', data);
+        return response.data;
+    }
+    async function addDraft(projectId, data) {
+        const client = getApiClient();
+        const response = await client.post(`/external/projects/${projectId}/drafts/add`, data);
+        return response.data;
+    }
+    function createCreateProjectCommand() {
+        const command = new external_commander_namespaceObject.Command('create-project').description('Create a new SuperDesign project').requiredOption('--title <title>', 'Project title').option('--html <html>', 'Initial HTML content for first draft').option('--html-file <path>', 'Path to HTML file for first draft').option('--device <mode>', 'Device mode for draft (mobile, tablet, desktop)', 'desktop').option('--json', 'Output in JSON format').action(async (options)=>{
+            if (options.json) setJsonMode(true);
+            try {
+                if (!manager_isAuthenticated()) {
+                    output_error('Not authenticated. Run `superdesign login` first.');
+                    process.exit(EXIT_CODES.AUTH_REQUIRED);
+                }
+                if (options.device && ![
+                    'mobile',
+                    'tablet',
+                    'desktop'
+                ].includes(options.device)) {
+                    output_error('Invalid device mode. Must be: mobile, tablet, or desktop');
+                    process.exit(EXIT_CODES.VALIDATION_ERROR);
+                }
+                let htmlContent;
+                if (options.htmlFile) {
+                    if (!external_fs_namespaceObject.existsSync(options.htmlFile)) {
+                        output_error(`HTML file not found: ${options.htmlFile}`);
+                        process.exit(EXIT_CODES.VALIDATION_ERROR);
+                    }
+                    htmlContent = external_fs_namespaceObject.readFileSync(options.htmlFile, 'utf-8');
+                } else if (options.html) htmlContent = options.html;
+                startSpinner('Creating project...');
+                const project = await createProject({
+                    title: options.title
+                });
+                let draftResult = null;
+                if (htmlContent) draftResult = await addDraft(project.projectId, {
+                    title: 'Initial Draft',
+                    html: htmlContent,
+                    deviceMode: options.device
+                });
+                succeedSpinner('Project created successfully!');
+                const result = {
+                    projectId: project.projectId,
+                    title: project.title,
+                    projectUrl: project.projectUrl,
+                    shareToken: project.shareToken,
+                    ...draftResult && {
+                        draft: {
+                            draftId: draftResult.draftId,
+                            nodeId: draftResult.nodeId,
+                            nodeUrl: draftResult.nodeUrl,
+                            previewUrl: draftResult.previewUrl
+                        }
+                    }
+                };
+                if (isJsonMode()) output(result);
+                else {
+                    success(`Project "${project.title}" created!`);
+                    info(`\nProject ID: ${project.projectId}`);
+                    info(`Project URL: ${project.projectUrl}`);
+                    if (draftResult) {
+                        info(`\nDraft ID: ${draftResult.draftId}`);
+                        info(`Draft URL: ${draftResult.nodeUrl}`);
+                        info(`Preview URL: ${draftResult.previewUrl}`);
+                    }
+                }
+            } catch (err) {
+                failSpinner('Failed to create project');
+                if (err instanceof ApiClientError) {
+                    output_error(`API Error: ${err.message}`);
+                    process.exit(EXIT_CODES.API_ERROR);
+                }
+                const message = err instanceof Error ? err.message : 'Unknown error';
+                output_error(message);
+                process.exit(EXIT_CODES.GENERAL_ERROR);
+            }
+        });
+        return command;
+    }
+    async function createDraft(projectId, data) {
+        const client = getApiClient();
+        const response = await client.post(`/external/projects/${projectId}/drafts/create`, data);
+        return response.data;
+    }
+    async function iterateDraft(draftId, data) {
+        const client = getApiClient();
+        const response = await client.post(`/external/drafts/${draftId}/iterate`, data);
+        return response.data;
+    }
+    async function planFlowPages(draftId, data) {
+        const client = getApiClient();
+        const response = await client.post(`/external/drafts/${draftId}/flow/plan`, data);
+        return response.data;
+    }
+    async function executeFlowPages(draftId, data) {
+        const client = getApiClient();
+        const response = await client.post(`/external/drafts/${draftId}/flow/execute`, data);
+        return response.data;
+    }
+    async function getJobStatus(jobId) {
+        const client = getApiClient();
+        const response = await client.get(`/external/jobs/${jobId}`);
+        return response.data;
+    }
+    function isJobDone(response) {
+        return 'completed' === response.status || 'failed' === response.status;
+    }
+    function isJobCompleted(response) {
+        return 'completed' === response.status;
+    }
+    function isJobFailed(response) {
+        return 'failed' === response.status;
+    }
+    async function runJob(config) {
+        const { startLabel, pollingLabel, successLabel, timeoutLabel, failureLabel, timeoutMs = 300000, startJob, transformResult, displayResult } = config;
+        try {
+            startSpinner(startLabel);
+            const job = await startJob();
+            updateSpinner(pollingLabel);
+            const pollResult = await poll(()=>getJobStatus(job.jobId), isJobDone, {
+                intervalMs: 2000,
+                timeoutMs,
+                onPoll: (attempt)=>{
+                    if (attempt % 5 === 0) updateSpinner(`${pollingLabel} (${Math.floor(2000 * attempt / 1000)}s)`);
+                }
+            });
+            if (pollResult.timedOut) {
+                failSpinner(timeoutLabel);
+                output_error('Job timed out. The operation may still be processing in the background.');
+                if (isJsonMode()) output({
+                    error: 'timeout',
+                    jobId: job.jobId
+                });
+                process.exit(EXIT_CODES.TIMEOUT);
+            }
+            if (!pollResult.success || !pollResult.data) {
+                failSpinner(failureLabel);
+                output_error(pollResult.error || 'Failed to get job status');
+                process.exit(EXIT_CODES.API_ERROR);
+            }
+            const jobResult = pollResult.data;
+            if (isJobFailed(jobResult)) {
+                failSpinner(failureLabel);
+                output_error(`${jobResult.error.code}: ${jobResult.error.message}`);
+                process.exit(EXIT_CODES.API_ERROR);
+            }
+            if (!isJobCompleted(jobResult)) {
+                failSpinner('Unexpected job status');
+                output_error('Job ended in unexpected state');
+                process.exit(EXIT_CODES.API_ERROR);
+            }
+            succeedSpinner(successLabel);
+            if (isJsonMode()) output(transformResult(jobResult));
+            else displayResult(jobResult);
+            process.exit(EXIT_CODES.SUCCESS);
+        } catch (err) {
+            failSpinner(failureLabel);
+            if (err instanceof ApiClientError) {
+                output_error(`API Error: ${err.message}`);
+                process.exit(EXIT_CODES.API_ERROR);
+            }
+            const message = err instanceof Error ? err.message : 'Unknown error';
+            output_error(message);
+            process.exit(EXIT_CODES.GENERAL_ERROR);
+        }
+    }
+    function job_runner_requireAuth(isAuthenticated) {
+        if (!isAuthenticated()) {
+            output_error('Not authenticated. Run `superdesign login` first.');
+            process.exit(EXIT_CODES.AUTH_REQUIRED);
+        }
+    }
+    function createCreateDesignDraftCommand() {
+        const command = new external_commander_namespaceObject.Command('create-design-draft').description('Create a design draft using AI generation').requiredOption('--project-id <id>', 'Project ID').requiredOption('--title <title>', 'Draft title').requiredOption('--prompt <prompt>', 'Design prompt for AI generation').option('--device <mode>', 'Device mode (mobile, tablet, desktop)', 'desktop').option('--json', 'Output in JSON format').action(async (options)=>{
+            if (options.json) setJsonMode(true);
+            job_runner_requireAuth(manager_isAuthenticated);
+            if (options.device && ![
+                'mobile',
+                'tablet',
+                'desktop'
+            ].includes(options.device)) {
+                output_error('Invalid device mode. Must be: mobile, tablet, or desktop');
+                process.exit(EXIT_CODES.VALIDATION_ERROR);
+            }
+            await runJob({
+                startLabel: 'Creating design draft...',
+                pollingLabel: 'Generating design with AI...',
+                successLabel: 'Design draft created!',
+                timeoutLabel: 'Generation timed out',
+                failureLabel: 'Failed to create draft',
+                startJob: ()=>createDraft(options.projectId, {
+                        title: options.title,
+                        prompt: options.prompt,
+                        deviceMode: options.device
+                    }),
+                transformResult: (job)=>({
+                        draftId: job.result.draftId,
+                        nodeId: job.result.nodeId,
+                        title: job.result.title,
+                        projectUrl: job.result.projectUrl,
+                        nodeUrl: job.result.nodeUrl,
+                        previewUrl: job.result.previewUrl,
+                        creditsConsumed: job.creditsConsumed
+                    }),
+                displayResult: (job)=>{
+                    success(`Draft "${job.result.title}" created!`);
+                    info(`\nDraft ID: ${job.result.draftId}`);
+                    info(`Node URL: ${job.result.nodeUrl}`);
+                    info(`Preview URL: ${job.result.previewUrl}`);
+                    info(`Credits consumed: ${job.creditsConsumed}`);
+                }
+            });
+        });
+        return command;
+    }
+    function createIterateDesignDraftCommand() {
+        const command = new external_commander_namespaceObject.Command('iterate-design-draft').description('Iterate on an existing draft using AI').requiredOption('--draft-id <id>', 'Draft ID to iterate on').requiredOption('--prompt <prompt>', 'Iteration prompt').requiredOption('--mode <mode>', 'Iteration mode (replace or branch)').option('--count <count>', 'Number of variations to generate (1-4)', '1').option('--json', 'Output in JSON format').action(async (options)=>{
+            if (options.json) setJsonMode(true);
+            job_runner_requireAuth(manager_isAuthenticated);
+            if (![
+                'replace',
+                'branch'
+            ].includes(options.mode)) {
+                output_error('Invalid mode. Must be: replace or branch');
+                process.exit(EXIT_CODES.VALIDATION_ERROR);
+            }
+            const count = parseInt(options.count || '1', 10);
+            if (isNaN(count) || count < 1 || count > 4) {
+                output_error('Invalid count. Must be between 1 and 4');
+                process.exit(EXIT_CODES.VALIDATION_ERROR);
+            }
+            await runJob({
+                startLabel: 'Starting iteration...',
+                pollingLabel: 'Iterating design with AI...',
+                successLabel: 'Iteration complete!',
+                timeoutLabel: 'Iteration timed out',
+                failureLabel: 'Failed to iterate draft',
+                startJob: ()=>iterateDraft(options.draftId, {
+                        prompt: options.prompt,
+                        mode: options.mode,
+                        count: count
+                    }),
+                transformResult: (job)=>({
+                        drafts: job.result.drafts,
+                        projectUrl: job.result.projectUrl,
+                        creditsConsumed: job.creditsConsumed
+                    }),
+                displayResult: (job)=>{
+                    success(`Created ${job.result.drafts.length} draft variation(s)!`);
+                    info(`\nProject URL: ${job.result.projectUrl}`);
+                    info(`Credits consumed: ${job.creditsConsumed}`);
+                    info('\nDrafts:');
+                    job.result.drafts.forEach((draft, i)=>{
+                        info(`  ${i + 1}. ${draft.title}`);
+                        info(`     Draft ID: ${draft.draftId}`);
+                        info(`     Preview: ${draft.previewUrl}`);
+                    });
+                }
+            });
+        });
+        return command;
+    }
+    function createPlanFlowPagesCommand() {
+        const command = new external_commander_namespaceObject.Command('plan-flow-pages').description('Plan flow pages using AI').requiredOption('--draft-id <id>', 'Source draft ID').requiredOption('--source-node-id <id>', 'Source node ID in the flow').option('--context <context>', 'Additional context for flow planning').option('--json', 'Output in JSON format').action(async (options)=>{
+            if (options.json) setJsonMode(true);
+            job_runner_requireAuth(manager_isAuthenticated);
+            await runJob({
+                startLabel: 'Planning flow pages...',
+                pollingLabel: 'AI is analyzing and planning pages...',
+                successLabel: 'Flow pages planned!',
+                timeoutLabel: 'Planning timed out',
+                failureLabel: 'Failed to plan flow pages',
+                startJob: ()=>planFlowPages(options.draftId, {
+                        sourceNodeId: options.sourceNodeId,
+                        flowContext: options.context
+                    }),
+                transformResult: (job)=>({
+                        pages: job.result.pages,
+                        creditsConsumed: job.creditsConsumed
+                    }),
+                displayResult: (job)=>{
+                    success(`Planned ${job.result.pages.length} flow page(s)!`);
+                    info(`Credits consumed: ${job.creditsConsumed}`);
+                    info('\nSuggested pages:');
+                    job.result.pages.forEach((page, i)=>{
+                        info(`\n  ${i + 1}. ${page.title}`);
+                        const promptPreview = page.prompt.length > 100 ? `${page.prompt.substring(0, 100)}...` : page.prompt;
+                        info(`     Prompt: ${promptPreview}`);
+                    });
+                    info('\nUse `superdesign execute-flow-pages` to generate these pages.');
+                }
+            });
+        });
+        return command;
+    }
+    function parsePages(pagesJson) {
+        const parsed = JSON.parse(pagesJson);
+        if (!Array.isArray(parsed)) throw new Error('Pages must be an array');
+        for (const page of parsed){
+            if (!page.title || 'string' != typeof page.title) throw new Error('Each page must have a title string');
+            if (!page.prompt || 'string' != typeof page.prompt) throw new Error('Each page must have a prompt string');
+        }
+        return parsed;
+    }
+    function createExecuteFlowPagesCommand() {
+        const command = new external_commander_namespaceObject.Command('execute-flow-pages').description('Generate flow pages using AI').requiredOption('--draft-id <id>', 'Source draft ID').requiredOption('--source-node-id <id>', 'Source node ID in the flow').requiredOption('--pages <json>', 'JSON array of pages to generate [{title, prompt}]').option('--context <context>', 'Additional context for flow generation').option('--json', 'Output in JSON format').action(async (options)=>{
+            if (options.json) setJsonMode(true);
+            job_runner_requireAuth(manager_isAuthenticated);
+            let pages;
+            try {
+                pages = parsePages(options.pages);
+            } catch (parseErr) {
+                const msg = parseErr instanceof Error ? parseErr.message : 'Invalid JSON';
+                output_error(`Invalid pages JSON: ${msg}`);
+                output_error('Expected format: [{"title": "Page 1", "prompt": "Create a..."}]');
+                process.exit(EXIT_CODES.VALIDATION_ERROR);
+            }
+            if (0 === pages.length) {
+                output_error('At least one page is required');
+                process.exit(EXIT_CODES.VALIDATION_ERROR);
+            }
+            if (pages.length > 10) {
+                output_error('Maximum 10 pages allowed');
+                process.exit(EXIT_CODES.VALIDATION_ERROR);
+            }
+            const timeoutMs = Math.max(300000, 2 * pages.length * 60000);
+            await runJob({
+                startLabel: `Generating ${pages.length} flow page(s)...`,
+                pollingLabel: `AI is generating ${pages.length} page(s)...`,
+                successLabel: 'Flow pages generated!',
+                timeoutLabel: 'Generation timed out',
+                failureLabel: 'Failed to execute flow pages',
+                timeoutMs,
+                startJob: ()=>executeFlowPages(options.draftId, {
+                        sourceNodeId: options.sourceNodeId,
+                        flowContext: options.context,
+                        pages
+                    }),
+                transformResult: (job)=>({
+                        drafts: job.result.drafts,
+                        projectUrl: job.result.projectUrl,
+                        creditsConsumed: job.creditsConsumed
+                    }),
+                displayResult: (job)=>{
+                    success(`Generated ${job.result.drafts.length} flow page(s)!`);
+                    info(`\nProject URL: ${job.result.projectUrl}`);
+                    info(`Credits consumed: ${job.creditsConsumed}`);
+                    info('\nGenerated pages:');
+                    job.result.drafts.forEach((draft)=>{
+                        info(`\n  ${draft.index + 1}. ${draft.title}`);
+                        info(`     Draft ID: ${draft.draftId}`);
+                        info(`     Node URL: ${draft.nodeUrl}`);
+                        info(`     Preview: ${draft.previewUrl}`);
+                    });
+                }
+            });
+        });
+        return command;
+    }
+    const src_filename = (0, external_url_namespaceObject.fileURLToPath)(__rslib_import_meta_url__);
+    const src_dirname = (0, external_path_namespaceObject.dirname)(src_filename);
+    (0, external_dotenv_namespaceObject.config)({
+        path: (0, external_path_namespaceObject.resolve)(src_dirname, '../.env')
+    });
+    (0, external_dotenv_namespaceObject.config)();
+    function createProgram() {
+        const program = new external_commander_namespaceObject.Command();
+        program.name('superdesign').description('SuperDesign CLI - AI product designer for coding agents').version("0.1.0");
+        program.addCommand(createLoginCommand());
+        program.addCommand(createLogoutCommand());
+        program.addCommand(createInitCommand());
+        program.addCommand(createCreateProjectCommand());
+        program.addCommand(createCreateDesignDraftCommand());
+        program.addCommand(createIterateDesignDraftCommand());
+        program.addCommand(createPlanFlowPagesCommand());
+        program.addCommand(createExecuteFlowPagesCommand());
+        return program;
+    }
+    async function run() {
+        const program = createProgram();
+        await program.parseAsync(process.argv);
+    }
+})();
+exports.ApiClientError = __webpack_exports__.ApiClientError;
+exports.addDraft = __webpack_exports__.addDraft;
+exports.claimSession = __webpack_exports__.claimSession;
+exports.clearConfig = __webpack_exports__.clearConfig;
+exports.createApiClient = __webpack_exports__.createApiClient;
+exports.createDraft = __webpack_exports__.createDraft;
+exports.createProgram = __webpack_exports__.createProgram;
+exports.createProject = __webpack_exports__.createProject;
+exports.createPublicApiClient = __webpack_exports__.createPublicApiClient;
+exports.createSession = __webpack_exports__.createSession;
+exports.executeFlowPages = __webpack_exports__.executeFlowPages;
+exports.getApiClient = __webpack_exports__.getApiClient;
+exports.getApiKey = __webpack_exports__.getApiKey;
+exports.getApiUrl = __webpack_exports__.getApiUrl;
+exports.getConfigDir = __webpack_exports__.getConfigDir;
+exports.getConfigPath = __webpack_exports__.getConfigPath;
+exports.getJobStatus = __webpack_exports__.getJobStatus;
+exports.isAuthenticated = __webpack_exports__.isAuthenticated;
+exports.isJobCompleted = __webpack_exports__.isJobCompleted;
+exports.isJobDone = __webpack_exports__.isJobDone;
+exports.isJobFailed = __webpack_exports__.isJobFailed;
+exports.iterateDraft = __webpack_exports__.iterateDraft;
+exports.loadConfig = __webpack_exports__.loadConfig;
+exports.planFlowPages = __webpack_exports__.planFlowPages;
+exports.pollSession = __webpack_exports__.pollSession;
+exports.run = __webpack_exports__.run;
+exports.saveConfig = __webpack_exports__.saveConfig;
+exports.updateConfig = __webpack_exports__.updateConfig;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "ApiClientError",
+    "addDraft",
+    "claimSession",
+    "clearConfig",
+    "createApiClient",
+    "createDraft",
+    "createProgram",
+    "createProject",
+    "createPublicApiClient",
+    "createSession",
+    "executeFlowPages",
+    "getApiClient",
+    "getApiKey",
+    "getApiUrl",
+    "getConfigDir",
+    "getConfigPath",
+    "getJobStatus",
+    "isAuthenticated",
+    "isJobCompleted",
+    "isJobDone",
+    "isJobFailed",
+    "iterateDraft",
+    "loadConfig",
+    "planFlowPages",
+    "pollSession",
+    "run",
+    "saveConfig",
+    "updateConfig"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});