@embeddables/cli 0.2.0 → 0.3.0

package/dist/cli.js

@@ -8,6 +8,7 @@ import { runInit } from './commands/init.js';
 import { runLogin } from './commands/login.js';
 import { runLogout } from './commands/logout.js';
 import { runPull } from './commands/pull.js';
+import { runSave } from './commands/save.js';
 // Make all console.warn output yellow
 const originalWarn = console.warn.bind(console);
 console.warn = (...args) => {
@@ -22,11 +23,10 @@ program.name('embeddables').description('Embeddables CLI').version('0.1.0');
 program
     .command('init')
     .description('Initialize a new Embeddables project')
-    .option('--name <name>', 'Project name')
     .option('--project-id <id>', 'Embeddables project ID')
     .option('-y, --yes', 'Skip prompts and use defaults')
     .action(async (opts) => {
-    await runInit({ name: opts.name, projectId: opts.projectId, yes: opts.yes });
+    await runInit({ projectId: opts.projectId, yes: opts.yes });
 });
 program
     .command('build')
@@ -42,15 +42,15 @@ program
     .option('--id <id>', 'Embeddable ID (will prompt if not provided)')
     .option('--pages <glob>', 'Pages glob')
     .option('--out <path>', 'Output json path')
-    .option('--remote', 'Use remote engine (https://engine.embeddables.com)')
-    .option('--engine <url>', 'Engine origin', 'http://localhost:8787')
+    .option('--local', 'Use local engine (http://localhost:8787)')
+    .option('--engine <url>', 'Engine origin', 'https://engine.embeddables.com')
     .option('--port <n>', 'Dev proxy port', '3000')
     .option('--overrideRoute <path>', 'Route to override in proxy (exact match, no wildcards yet)', '/init')
     .option('--pageKeyFrom <mode>', 'filename|export', 'filename')
     .action(async (opts) => {
-    // --remote flag overrides --engine to use production engine
-    if (opts.remote) {
-        opts.engine = 'https://engine.embeddables.com';
+    // --local flag overrides --engine to use local engine
+    if (opts.local) {
+        opts.engine = 'http://localhost:8787';
     }
     await runDev(opts);
 });
@@ -76,6 +76,23 @@ program
     .action(async (opts) => {
     await runPull(opts);
 });
+program
+    .command('save')
+    .description('Build and save an embeddable to the cloud')
+    .option('--id <id>', 'Embeddable ID (will prompt if not provided)')
+    .option('--label <label>', 'Human-readable label for this version')
+    .option('--branch <branch_id>', 'Branch ID to save to')
+    .option('--skip-build', 'Skip the build step and use existing compiled JSON')
+    .option('--from-version <number>', 'Base version number (auto-detected from local files if not provided)')
+    .action(async (opts) => {
+    await runSave({
+        id: opts.id,
+        label: opts.label,
+        branch: opts.branch,
+        skipBuild: opts.skipBuild,
+        fromVersion: opts.fromVersion,
+    });
+});
 program
     .command('branch')
     .description('Switch to a different branch of an embeddable')

package/dist/commands/dev.d.ts

@@ -2,7 +2,7 @@ export declare function runDev(opts: {
     id?: string;
     pages?: string;
     out?: string;
-    remote?: boolean;
+    local?: boolean;
     engine: string;
     port: string;
     overrideRoute: string;

package/dist/commands/dev.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dev.d.ts","sourceRoot":"","sources":["../../src/commands/dev.ts"],"names":[],"mappings":"AAoFA,wBAAsB,MAAM,CAAC,IAAI,EAAE;IACjC,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,UAAU,GAAG,QAAQ,CAAA;CACnC,iBAgGA"}
+{"version":3,"file":"dev.d.ts","sourceRoot":"","sources":["../../src/commands/dev.ts"],"names":[],"mappings":"AAmHA,wBAAsB,MAAM,CAAC,IAAI,EAAE;IACjC,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,UAAU,GAAG,QAAQ,CAAA;CACnC,iBA4GA"}

package/dist/commands/dev.js

@@ -1,4 +1,5 @@
 import fs from 'node:fs';
+import net from 'node:net';
 import path from 'node:path';
 import chokidar from 'chokidar';
 import pc from 'picocolors';
@@ -6,6 +7,32 @@ import prompts from 'prompts';
 import { compileAllPages } from '../compiler/index.js';
 import { startProxyServer } from '../proxy/server.js';
 import { formatError } from '../compiler/errors.js';
+/**
+ * Check whether a port is available by attempting to listen on it.
+ */
+function isPortAvailable(port) {
+    return new Promise((resolve) => {
+        const server = net.createServer();
+        server.once('error', () => resolve(false));
+        server.once('listening', () => {
+            server.close(() => resolve(true));
+        });
+        server.listen(port);
+    });
+}
+/**
+ * Starting from `startPort`, find the first available port.
+ * Tries up to `maxAttempts` consecutive ports.
+ */
+async function getAvailablePort(startPort, maxAttempts = 20) {
+    for (let i = 0; i < maxAttempts; i++) {
+        const port = startPort + i;
+        if (await isPortAvailable(port)) {
+            return port;
+        }
+    }
+    throw new Error(`Could not find an available port (tried ${startPort}–${startPort + maxAttempts - 1})`);
+}
 async function discoverEmbeddables() {
     const embeddablesDir = 'embeddables';
     if (!fs.existsSync(embeddablesDir)) {
@@ -96,8 +123,20 @@ export async function runDev(opts) {
         console.error(formatError(e));
         process.exit(1);
     }
-    // Start proxy
-    const port = Number(opts.port);
+    // Start proxy — find an available port if the requested one is taken
+    const requestedPort = Number(opts.port);
+    let port;
+    try {
+        port = await getAvailablePort(requestedPort);
+    }
+    catch (e) {
+        console.error(pc.red(e.message));
+        process.exit(1);
+    }
+    if (port !== requestedPort) {
+        console.warn(`Port ${requestedPort} is in use, using ${port} instead.`);
+        console.log('');
+    }
     const proxy = await startProxyServer({
         port,
         engineOrigin: opts.engine,
@@ -139,11 +178,11 @@ export async function runDev(opts) {
     const separator = '━'.repeat(terminalWidth);
     console.log(`${pc.bold(pc.cyan(separator))}`);
     console.log('');
-    if (opts.remote) {
-        console.log(`${pc.bold(pc.yellow('Mode:'))} ${pc.yellow('Remote')} (using ${opts.engine})`);
+    if (opts.local) {
+        console.log(`${pc.bold(pc.blue('Mode:'))} ${pc.blue('Local')} (using ${opts.engine})`);
     }
     else {
-        console.log(`${pc.bold(pc.blue('Mode:'))} ${pc.blue('Local')} (using ${opts.engine})`);
+        console.log(`${pc.bold(pc.yellow('Mode:'))} ${pc.yellow('Remote')} (using ${opts.engine})`);
     }
     console.log('');
     console.log(`${pc.bold(pc.green('Preview URL:'))} ${pc.underline(pc.cyan(`http://localhost:${port}?id=${embeddableId}&version=latest`))}`);

package/dist/commands/init.d.ts

@@ -1,5 +1,4 @@
 export declare function runInit(opts: {
-    name?: string;
     projectId?: string;
     yes?: boolean;
 }): Promise<void>;

package/dist/commands/init.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"init.d.ts","sourceRoot":"","sources":["../../src/commands/init.ts"],"names":[],"mappings":"AAiBA,wBAAsB,OAAO,CAAC,IAAI,EAAE;IAAE,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,OAAO,CAAA;CAAE,iBAsMvF"}
+{"version":3,"file":"init.d.ts","sourceRoot":"","sources":["../../src/commands/init.ts"],"names":[],"mappings":"AAuGA,wBAAsB,OAAO,CAAC,IAAI,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,OAAO,CAAA;CAAE,iBA0KxE"}

package/dist/commands/init.js

@@ -1,37 +1,112 @@
 import fs from 'node:fs';
 import path from 'node:path';
+import { fileURLToPath } from 'node:url';
 import pc from 'picocolors';
 import prompts from 'prompts';
 import { writeProjectConfig, readProjectConfig } from '../config/index.js';
 import { isLoggedIn } from '../auth/index.js';
 import { promptForProject } from '../prompts/index.js';
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+/** Recursively copy a directory, creating target dirs as needed. */
+function copyDirSync(src, dest) {
+    fs.mkdirSync(dest, { recursive: true });
+    for (const entry of fs.readdirSync(src, { withFileTypes: true })) {
+        const srcPath = path.join(src, entry.name);
+        const destPath = path.join(dest, entry.name);
+        if (entry.isDirectory()) {
+            copyDirSync(srcPath, destPath);
+        }
+        else {
+            fs.copyFileSync(srcPath, destPath);
+        }
+    }
+}
+/**
+ * Generate type declaration stubs in embeddables/.types/ so the editor
+ * can resolve imports in generated TSX files without npm install.
+ */
+function writeTypeStubs(embeddablesDir) {
+    const typesDir = path.join(embeddablesDir, '.types');
+    fs.mkdirSync(typesDir, { recursive: true });
+    // React JSX runtime types (needed for "jsx": "react-jsx" in tsconfig)
+    fs.writeFileSync(path.join(typesDir, 'react-jsx-runtime.d.ts'), `export namespace JSX {
+  type Element = any
+  interface IntrinsicElements {
+    [elemName: string]: any
+  }
+}
+export function jsx(type: any, props: any, key?: string): JSX.Element
+export function jsxs(type: any, props: any, key?: string): JSX.Element
+export const Fragment: unique symbol
+`, 'utf8');
+    // Component primitives
+    const componentNames = [
+        'BookMeeting',
+        'Chart',
+        'Container',
+        'CustomButton',
+        'CustomHTML',
+        'FileUpload',
+        'InputBox',
+        'Lottie',
+        'MediaEmbed',
+        'MediaImage',
+        'OptionSelector',
+        'PaypalCheckout',
+        'PlainText',
+        'ProgressBar',
+        'RichText',
+        'RichTextMarkdown',
+        'Rive',
+        'StripeCheckout',
+        'StripeCheckout2',
+    ];
+    const componentExports = componentNames
+        .map((name) => `export function ${name}(props: Record<string, any>): any`)
+        .join('\n');
+    fs.writeFileSync(path.join(typesDir, 'components.d.ts'), componentExports + '\n', 'utf8');
+    // Embeddables types (OptionSelectorButton, etc.)
+    fs.writeFileSync(path.join(typesDir, 'types.d.ts'), `export interface OptionSelectorButton {
+  id?: string
+  key: string
+  text?: string
+  description?: string
+  icon?: string
+  emojiIcon?: string
+  imageUrl?: string
+  imageAltText?: string
+  conditions?: Record<string, any>[]
+  triggerEvent?: 'no-action' | 'next-page' | 'open-url'
+  openUrlInNewTab?: boolean
+  url?: string
+  single_select?: boolean
+  hide?: boolean
+  is_repeatable_button?: boolean
+  [key: string]: any
+}
+`, 'utf8');
+}
 export async function runInit(opts) {
     const cwd = process.cwd();
-    const packageJsonPath = path.join(cwd, 'package.json');
     const gitignorePath = path.join(cwd, '.gitignore');
     const embeddablesDir = path.join(cwd, 'embeddables');
     console.log('');
     console.log(pc.bold(pc.cyan('  Embeddables Project Setup')));
     console.log('');
-    // Check if already initialized
-    let existingPackageJson = null;
-    if (fs.existsSync(packageJsonPath)) {
-        try {
-            existingPackageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
-        }
-        catch {
-            // Invalid JSON, we'll overwrite
-        }
-    }
     const existingConfig = readProjectConfig();
-    // Step 1: Get Embeddables project (this determines the default name)
+    // Step 1: Get Embeddables project
     let projectId = opts.projectId;
     let selectedProjectTitle;
+    let selectedOrgId;
+    let selectedOrgTitle;
     if (!projectId && !opts.yes) {
         if (existingConfig?.project_id) {
             console.log(pc.gray(`  Using existing project ID: ${existingConfig.project_id}`));
             projectId = existingConfig.project_id;
             selectedProjectTitle = existingConfig.project_name || undefined;
+            selectedOrgId = existingConfig.org_id || undefined;
+            selectedOrgTitle = existingConfig.org_title || undefined;
         }
         else if (isLoggedIn()) {
             // Fetch and show project list
@@ -43,6 +118,8 @@ export async function runInit(opts) {
             if (selectedProject) {
                 projectId = selectedProject.id;
                 selectedProjectTitle = selectedProject.title || undefined;
+                selectedOrgId = selectedProject.org_id || undefined;
+                selectedOrgTitle = selectedProject.org_title || undefined;
             }
         }
         else {
@@ -62,77 +139,18 @@ export async function runInit(opts) {
             projectId = response.projectId || undefined;
         }
     }
-    // Step 2: Get project name (default to selected project title, or existing, or directory name)
-    let projectName = opts.name;
-    if (!projectName) {
-        if (existingPackageJson?.name) {
-            projectName = existingPackageJson.name;
-            console.log(pc.gray(`  Using existing project name: ${projectName}`));
-        }
-        else if (opts.yes) {
-            // Use selected project title or directory name as default
-            projectName = selectedProjectTitle || path.basename(cwd);
-        }
-        else {
-            // Default to selected project title, then directory name
-            const defaultName = selectedProjectTitle || path.basename(cwd);
-            const response = await prompts({
-                type: 'text',
-                name: 'name',
-                message: 'Project name:',
-                initial: defaultName,
-            }, {
-                onCancel: () => {
-                    console.log(pc.gray('\n  Cancelled.'));
-                    process.exit(0);
-                },
-            });
-            projectName = response.name;
-        }
-    }
-    if (!projectName) {
-        console.error('Project name is required.');
-        process.exit(1);
-    }
-    // Create or update package.json
-    const packageJson = existingPackageJson || {
-        name: projectName,
-        version: '1.0.0',
-        type: 'module',
-    };
-    // Ensure name is set
-    if (!packageJson.name) {
-        packageJson.name = projectName;
-    }
-    // Ensure type is module
-    if (!packageJson.type) {
-        packageJson.type = 'module';
-    }
-    // Add @embeddables/cli as a dependency
-    if (!packageJson.dependencies) {
-        packageJson.dependencies = {};
-    }
-    if (!packageJson.dependencies['@embeddables/cli']) {
-        packageJson.dependencies['@embeddables/cli'] = '^0.1.0';
-    }
-    // Write package.json
-    fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2) + '\n', 'utf8');
-    if (existingPackageJson) {
-        console.log(pc.green('  ✓ Updated package.json'));
-    }
-    else {
-        console.log(pc.green('  ✓ Created package.json'));
-    }
     // Write embeddables.json config
     if (projectId) {
         writeProjectConfig({
+            org_id: selectedOrgId,
+            org_title: selectedOrgTitle,
             project_id: projectId,
-            project_name: selectedProjectTitle || projectName,
+            project_name: selectedProjectTitle,
         });
         console.log(pc.green('  ✓ Created embeddables.json'));
     }
     // Create or update .gitignore
-    const gitignoreEntries = ['node_modules/', '**/.generated/', '.DS_Store'];
+    const gitignoreEntries = ['**/.generated/', '**/.types/', '.DS_Store'];
     let existingGitignore = '';
     if (fs.existsSync(gitignorePath)) {
         existingGitignore = fs.readFileSync(gitignorePath, 'utf8');
@@ -162,27 +180,66 @@ export async function runInit(opts) {
     else {
         console.log(pc.gray('  ✓ embeddables/ directory exists'));
     }
+    // Copy .cursor/ folder with Cursor rules
+    const packageRoot = path.resolve(__dirname, '..', '..');
+    const sourceCursorDir = path.join(packageRoot, '.cursor');
+    const targetCursorDir = path.join(cwd, '.cursor');
+    if (fs.existsSync(sourceCursorDir)) {
+        copyDirSync(sourceCursorDir, targetCursorDir);
+        console.log(pc.green('  ✓ Injected .cursor/ rules'));
+    }
+    // Create tsconfig.json for editor support (JSX, type checking)
+    const tsconfigPath = path.join(cwd, 'tsconfig.json');
+    if (!fs.existsSync(tsconfigPath)) {
+        const tsconfig = {
+            compilerOptions: {
+                target: 'esnext',
+                module: 'esnext',
+                moduleResolution: 'bundler',
+                jsx: 'react-jsx',
+                noEmit: true,
+                strict: false,
+                skipLibCheck: true,
+                esModuleInterop: true,
+                baseUrl: '.',
+                paths: {
+                    'react/jsx-runtime': ['./embeddables/.types/react-jsx-runtime'],
+                    '@embeddables/cli/components': ['./embeddables/.types/components'],
+                    '@embeddables/cli/types': ['./embeddables/.types/types'],
+                },
+            },
+            include: ['embeddables'],
+        };
+        fs.writeFileSync(tsconfigPath, JSON.stringify(tsconfig, null, 2) + '\n', 'utf8');
+        console.log(pc.green('  ✓ Created tsconfig.json'));
+    }
+    else {
+        console.log(pc.gray('  ✓ tsconfig.json already exists'));
+    }
+    // Generate type declaration stubs for editor support (no npm install needed)
+    writeTypeStubs(embeddablesDir);
+    console.log(pc.green('  ✓ Generated type declarations'));
+    // Remind user to install dependencies
+    console.log('');
+    console.log(pc.yellow('  → Run `npm install` to install dependencies'));
     // Print next steps
     console.log('');
     console.log(pc.bold('  Next steps:'));
     console.log('');
-    console.log(pc.cyan('    1. Install dependencies:'));
-    console.log(pc.white('       npm install'));
-    console.log('');
-    console.log(pc.cyan('    2. Login to Embeddables:'));
-    console.log(pc.white('       npx embeddables login'));
+    console.log(pc.cyan('    1. Login to Embeddables:'));
+    console.log(pc.white('       embeddables login'));
     console.log('');
     if (projectId) {
-        console.log(pc.cyan('    3. Pull an embeddable:'));
-        console.log(pc.white('       npx embeddables pull'));
+        console.log(pc.cyan('    2. Pull an embeddable:'));
+        console.log(pc.white('       embeddables pull'));
         console.log(pc.gray('       (will show a list of embeddables in your project)'));
     }
     else {
-        console.log(pc.cyan('    3. Pull an existing embeddable:'));
-        console.log(pc.white('       npx embeddables pull --id <embeddable-id>'));
+        console.log(pc.cyan('    2. Pull an existing embeddable:'));
+        console.log(pc.white('       embeddables pull --id <embeddable-id>'));
     }
     console.log('');
-    console.log(pc.cyan('    4. Start developing:'));
-    console.log(pc.white('       npx embeddables dev'));
+    console.log(pc.cyan('    3. Start developing:'));
+    console.log(pc.white('       embeddables dev'));
     console.log('');
 }

package/dist/commands/pull.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pull.d.ts","sourceRoot":"","sources":["../../src/commands/pull.ts"],"names":[],"mappings":"AAUA,wBAAsB,OAAO,CAAC,IAAI,EAAE;IAAE,EAAE,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,OAAO,CAAA;CAAE,iBAmMhG"}
+{"version":3,"file":"pull.d.ts","sourceRoot":"","sources":["../../src/commands/pull.ts"],"names":[],"mappings":"AAUA,wBAAsB,OAAO,CAAC,IAAI,EAAE;IAAE,EAAE,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,OAAO,CAAA;CAAE,iBAwNhG"}

package/dist/commands/pull.js

@@ -29,6 +29,8 @@ export async function runPull(opts) {
             projectId = selectedProject.id;
             // Save the selected project to config
             writeProjectConfig({
+                org_id: selectedProject.org_id || undefined,
+                org_title: selectedProject.org_title || undefined,
                 project_id: projectId,
                 project_name: selectedProject.title || undefined,
             });
@@ -170,6 +172,24 @@ export async function runPull(opts) {
                 throw compileError;
             }
         }
+        // Store version number in config.json so save knows the base version
+        if (version != null) {
+            const versionNumber = typeof version === 'number' ? version : parseInt(String(version), 10);
+            if (!isNaN(versionNumber)) {
+                const configPath = path.join('embeddables', embeddableId, 'config.json');
+                if (fs.existsSync(configPath)) {
+                    try {
+                        const configContent = fs.readFileSync(configPath, 'utf8');
+                        const config = JSON.parse(configContent);
+                        config._version = versionNumber;
+                        fs.writeFileSync(configPath, JSON.stringify(config, null, 2), 'utf8');
+                    }
+                    catch {
+                        // Ignore errors updating config.json - versioned files are a fallback
+                    }
+                }
+            }
+        }
     }
     catch (error) {
         console.error('Error pulling embeddable:', error);

package/dist/commands/save.d.ts

@@ -0,0 +1,8 @@
+export declare function runSave(opts: {
+    id?: string;
+    label?: string;
+    branch?: string;
+    skipBuild?: boolean;
+    fromVersion?: string;
+}): Promise<void>;
+//# sourceMappingURL=save.d.ts.map

package/dist/commands/save.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"save.d.ts","sourceRoot":"","sources":["../../src/commands/save.ts"],"names":[],"mappings":"AA+FA,wBAAsB,OAAO,CAAC,IAAI,EAAE;IAClC,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,iBAoPA"}