@ikas/component-cli 1.4.0-beta.7 → 1.4.0-beta.70

package/dist/commands/create.js

@@ -1,9 +1,176 @@
-import { createCreateCommand as createCreateCommandImpl } from "create-ikas-component";
-/**
- * Re-export of the `create` command. The actual implementation (and the
- * project templates) live in the standalone `create-ikas-component` package
- * so users can run `npx create-ikas-component` without pulling in the full
- * dev/build/publish CLI.
- */
-export const createCreateCommand = createCreateCommandImpl;
+import chalk from "chalk";
+import { Command } from "commander";
+import * as fs from "fs";
+import inquirer from "inquirer";
+import ora from "ora";
+import * as path from "path";
+import { generateComponentId, generateProjectId } from "../utils/component-helpers.js";
+import { readTemplate } from "../utils/template.js";
+const PROP_TYPES = [
+    "TEXT",
+    "NUMBER",
+    "BOOLEAN",
+    "IMAGE",
+    "LINK",
+    "LIST_OF_LINK",
+    "COLOR",
+    "PRODUCT",
+    "PRODUCT_LIST",
+    "CATEGORY",
+    "CATEGORY_LIST",
+    "BRAND",
+    "BRAND_LIST",
+    "BLOG",
+    "BLOG_LIST",
+    "BLOG_CATEGORY",
+    "BLOG_CATEGORY_LIST",
+    "TYPE",
+    "ENUM",
+    "COMPONENT",
+    "COMPONENT_LIST",
+];
+async function createProject(projectName) {
+    const spinner = ora("Creating project...").start();
+    try {
+        const projectPath = path.resolve(process.cwd(), projectName);
+        // Check if directory exists
+        if (fs.existsSync(projectPath)) {
+            spinner.fail(`Directory "${projectName}" already exists`);
+            process.exit(1);
+        }
+        // Create directory structure
+        fs.mkdirSync(projectPath, { recursive: true });
+        fs.mkdirSync(path.join(projectPath, "src/components/ExampleComponent"), { recursive: true });
+        fs.mkdirSync(path.join(projectPath, "src/components/ExampleSection"), { recursive: true });
+        // Generate IDs for the example config
+        const projectId = generateProjectId();
+        const exampleComponentId = generateComponentId(projectId, "example-component");
+        const exampleSectionId = generateComponentId(projectId, "example-section");
+        const vars = {
+            PROJECT_NAME: projectName,
+            PROJECT_ID: projectId,
+            EXAMPLE_COMPONENT_ID: exampleComponentId,
+            EXAMPLE_SECTION_ID: exampleSectionId,
+        };
+        // Write all template files
+        const files = [
+            { template: "create/package.json", dest: "package.json", vars },
+            { template: "create/tsconfig.json", dest: "tsconfig.json" },
+            { template: "create/vite.config.ts", dest: "vite.config.ts" },
+            { template: "create/ikas.config.json", dest: "ikas.config.json", vars },
+            { template: "create/gitignore", dest: ".gitignore" },
+            { template: "create/mcp.json", dest: ".mcp.json" },
+            { template: "create/README.md", dest: "README.md", vars },
+            { template: "create/claude-md", dest: "CLAUDE.md" },
+            { template: "create/cursorrules", dest: ".cursorrules" },
+            { template: "create/src/global.css", dest: "src/global.css" },
+            { template: "create/src/global-types.ts", dest: "src/global-types.ts" },
+            { template: "create/src/ikas-component-utils.d.ts", dest: "src/ikas-component-utils.d.ts" },
+            { template: "create/src/components/index.ts", dest: "src/components/index.ts" },
+            { template: "create/src/components/ExampleComponent/index.tsx", dest: "src/components/ExampleComponent/index.tsx" },
+            { template: "create/src/components/ExampleComponent/types.ts", dest: "src/components/ExampleComponent/types.ts" },
+            { template: "create/src/components/ExampleComponent/styles.css", dest: "src/components/ExampleComponent/styles.css" },
+            { template: "create/src/components/ExampleSection/index.tsx", dest: "src/components/ExampleSection/index.tsx" },
+            { template: "create/src/components/ExampleSection/types.ts", dest: "src/components/ExampleSection/types.ts" },
+            { template: "create/src/components/ExampleSection/styles.css", dest: "src/components/ExampleSection/styles.css" },
+        ];
+        for (const file of files) {
+            fs.writeFileSync(path.join(projectPath, file.dest), readTemplate(file.template, file.vars));
+        }
+        // Create or merge .cursor/mcp.json for Cursor editor
+        // Uses node + ${workspaceFolder} instead of npx because Cursor
+        // doesn't reliably inherit the shell PATH.
+        const cursorDir = path.join(projectPath, ".cursor");
+        const cursorMcpPath = path.join(cursorDir, "mcp.json");
+        fs.mkdirSync(cursorDir, { recursive: true });
+        let cursorMcpConfig = { mcpServers: {} };
+        if (fs.existsSync(cursorMcpPath)) {
+            try {
+                cursorMcpConfig = JSON.parse(fs.readFileSync(cursorMcpPath, "utf-8"));
+                if (!cursorMcpConfig.mcpServers) {
+                    cursorMcpConfig.mcpServers = {};
+                }
+            }
+            catch {
+                cursorMcpConfig = { mcpServers: {} };
+            }
+        }
+        cursorMcpConfig.mcpServers["ikas-code-components"] = {
+            command: "node",
+            args: ["${workspaceFolder}/node_modules/@ikas/code-components-mcp/dist/index.js"]
+        };
+        fs.writeFileSync(cursorMcpPath, JSON.stringify(cursorMcpConfig, null, 2));
+        spinner.succeed(chalk.green(`Project "${projectName}" created successfully!`));
+        console.log("\n" + chalk.cyan("Next steps:"));
+        console.log(chalk.white(`  cd ${projectName}`));
+        console.log(chalk.white("  npm install"));
+        console.log(chalk.white("  npm run dev"));
+        console.log("\n" + chalk.gray("Happy coding! 🚀"));
+    }
+    catch (error) {
+        spinner.fail("Failed to create project");
+        console.error(error);
+        process.exit(1);
+    }
+}
+export function createCreateCommand() {
+    return new Command("create")
+        .description("Create a new ikas component project")
+        .argument("[name]", "Project name")
+        .action(async (name) => {
+        let projectName = name;
+        if (!projectName) {
+            const answers = await inquirer.prompt([
+                {
+                    type: "input",
+                    name: "projectName",
+                    message: "What is your project name?",
+                    default: "my-ikas-components",
+                    validate: (input) => {
+                        if (!input.trim())
+                            return "Project name is required";
+                        if (!/^[a-z0-9-_]+$/i.test(input)) {
+                            return "Project name can only contain letters, numbers, hyphens, and underscores";
+                        }
+                        return true;
+                    }
+                }
+            ]);
+            projectName = answers.projectName;
+        }
+        await createProject(projectName);
+    });
+}
+// Standalone runner for create-ikas-component command
+export async function run() {
+    const program = new Command();
+    program
+        .name("create-ikas-component")
+        .description("Create a new ikas component project")
+        .argument("[name]", "Project name")
+        .action(async (name) => {
+        let projectName = name;
+        if (!projectName) {
+            const answers = await inquirer.prompt([
+                {
+                    type: "input",
+                    name: "projectName",
+                    message: "What is your project name?",
+                    default: "my-ikas-components",
+                    validate: (input) => {
+                        if (!input.trim())
+                            return "Project name is required";
+                        if (!/^[a-z0-9-_]+$/i.test(input)) {
+                            return "Project name can only contain letters, numbers, hyphens, and underscores";
+                        }
+                        return true;
+                    }
+                }
+            ]);
+            projectName = answers.projectName;
+        }
+        await createProject(projectName);
+    });
+    program.parse(process.argv);
+}
 //# sourceMappingURL=create.js.map

package/dist/commands/create.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.js","sourceRoot":"","sources":["../../src/commands/create.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,IAAI,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AAEvF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,uBAAuB,CAAC"}
+{"version":3,"file":"create.js","sourceRoot":"","sources":["../../src/commands/create.ts"],"names":[],"mappings":"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"}

package/dist/commands/delete-theme-globals.d.ts

@@ -0,0 +1,4 @@
+import { Command } from "commander";
+export declare function createDeleteGlobalVariableCommand(): Command;
+export declare function createDeleteDesignTokenCommand(): Command;
+//# sourceMappingURL=delete-theme-globals.d.ts.map

package/dist/commands/delete-theme-globals.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"delete-theme-globals.d.ts","sourceRoot":"","sources":["../../src/commands/delete-theme-globals.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAWpC,wBAAgB,iCAAiC,IAAI,OAAO,CAe3D;AAED,wBAAgB,8BAA8B,IAAI,OAAO,CAyBxD"}

package/dist/commands/delete-theme-globals.js

@@ -0,0 +1,48 @@
+import { Command } from "commander";
+import { printErrorAndExit, printResultAndExit, runEditorAction } from "../utils/editor-action-client.js";
+const TOKEN_TYPES = ["color", "typography", "breakpoint", "keyframe", "colorScheme"];
+function portOpts(port) {
+    const p = port ? parseInt(port, 10) : undefined;
+    return p ? { port: p } : {};
+}
+export function createDeleteGlobalVariableCommand() {
+    const cmd = new Command("delete-global-variable");
+    cmd
+        .description("Delete a global variable from the connected editor")
+        .requiredOption("--name <key>", "The variable's runtime key (from `list-theme-globals`)")
+        .option("--port <port>", "Dev server WebSocket port", "5201")
+        .action(async (options) => {
+        if (!options.name)
+            printErrorAndExit(new Error("--name is required"));
+        try {
+            printResultAndExit(await runEditorAction("delete-global-variable", { name: options.name }, portOpts(options.port)));
+        }
+        catch (e) {
+            printErrorAndExit(e);
+        }
+    });
+    return cmd;
+}
+export function createDeleteDesignTokenCommand() {
+    const cmd = new Command("delete-design-token");
+    cmd
+        .description("Delete a design token (color, typography, breakpoint, keyframe, or color scheme) from the connected editor")
+        .requiredOption("--token-type <type>", TOKEN_TYPES.join(" | "))
+        .requiredOption("--id <id>", "The token id (from `list-theme-globals`)")
+        .option("--port <port>", "Dev server WebSocket port", "5201")
+        .action(async (options) => {
+        if (!options.tokenType || !TOKEN_TYPES.includes(options.tokenType)) {
+            printErrorAndExit(new Error(`--token-type must be one of: ${TOKEN_TYPES.join(", ")}`));
+        }
+        if (!options.id)
+            printErrorAndExit(new Error("--id is required"));
+        try {
+            printResultAndExit(await runEditorAction("delete-design-token", { tokenType: options.tokenType, id: options.id }, portOpts(options.port)));
+        }
+        catch (e) {
+            printErrorAndExit(e);
+        }
+    });
+    return cmd;
+}
+//# sourceMappingURL=delete-theme-globals.js.map

package/dist/commands/delete-theme-globals.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"delete-theme-globals.js","sourceRoot":"","sources":["../../src/commands/delete-theme-globals.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AAE1G,MAAM,WAAW,GAAG,CAAC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC;AAErF,SAAS,QAAQ,CAAC,IAAa;IAC7B,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAChD,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;AAC9B,CAAC;AAED,MAAM,UAAU,iCAAiC;IAC/C,MAAM,GAAG,GAAG,IAAI,OAAO,CAAC,wBAAwB,CAAC,CAAC;IAClD,GAAG;SACA,WAAW,CAAC,oDAAoD,CAAC;SACjE,cAAc,CAAC,cAAc,EAAE,wDAAwD,CAAC;SACxF,MAAM,CAAC,eAAe,EAAE,2BAA2B,EAAE,MAAM,CAAC;SAC5D,MAAM,CAAC,KAAK,EAAE,OAAyC,EAAE,EAAE;QAC1D,IAAI,CAAC,OAAO,CAAC,IAAI;YAAE,iBAAiB,CAAC,IAAI,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC;QACtE,IAAI,CAAC;YACH,kBAAkB,CAAC,MAAM,eAAe,CAAC,wBAAwB,EAAE,EAAE,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,EAAE,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACtH,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,iBAAiB,CAAC,CAAC,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,CAAC,CAAC;IACL,OAAO,GAAG,CAAC;AACb,CAAC;AAED,MAAM,UAAU,8BAA8B;IAC5C,MAAM,GAAG,GAAG,IAAI,OAAO,CAAC,qBAAqB,CAAC,CAAC;IAC/C,GAAG;SACA,WAAW,CAAC,4GAA4G,CAAC;SACzH,cAAc,CAAC,qBAAqB,EAAE,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAC9D,cAAc,CAAC,WAAW,EAAE,0CAA0C,CAAC;SACvE,MAAM,CAAC,eAAe,EAAE,2BAA2B,EAAE,MAAM,CAAC;SAC5D,MAAM,CAAC,KAAK,EAAE,OAA2D,EAAE,EAAE;QAC5E,IAAI,CAAC,OAAO,CAAC,SAAS,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,CAAC;YACnE,iBAAiB,CAAC,IAAI,KAAK,CAAC,gCAAgC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;QACzF,CAAC;QACD,IAAI,CAAC,OAAO,CAAC,EAAE;YAAE,iBAAiB,CAAC,IAAI,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC;QAClE,IAAI,CAAC;YACH,kBAAkB,CAChB,MAAM,eAAe,CACnB,qBAAqB,EACrB,EAAE,SAAS,EAAE,OAAO,CAAC,SAAS,EAAE,EAAE,EAAE,OAAO,CAAC,EAAE,EAAE,EAChD,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CACvB,CACF,CAAC;QACJ,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,iBAAiB,CAAC,CAAC,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,CAAC,CAAC;IACL,OAAO,GAAG,CAAC;AACb,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"dev.d.ts","sourceRoot":"","sources":["../../src/commands/dev.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AA24CpC,wBAAgB,gBAAgB,IAAI,OAAO,CAI1C"}
+{"version":3,"file":"dev.d.ts","sourceRoot":"","sources":["../../src/commands/dev.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAkmDpC,wBAAgB,gBAAgB,IAAI,OAAO,CAI1C"}

package/dist/commands/dev.js

@@ -1,9 +1,10 @@
 import chalk from "chalk";
 import chokidar from "chokidar";
 import { Command } from "commander";
+import * as crypto from "crypto";
 import * as fs from "fs";
 import * as path from "path";
-import { toPascalCase, generateTypesFile, generateGlobalTypesFile, collectUsedEnumIds, collectUsedCustomTypeIds, generateComponentFile, generateStylesFile, updateBarrelExport, generateProjectId, generateComponentId, generateUniqueId, buildPropGroupHierarchy, findPropGroup, collectPropGroupIds, movePropGroupInTree, validateFilteredComponentIds, } from "../utils/component-helpers.js";
+import { toPascalCase, generateTypesFile, generateGlobalTypesFile, collectUsedEnumIds, collectUsedCustomTypeIds, shouldWriteGlobalTypes, generateComponentFile, generateStylesFile, updateBarrelExport, generateProjectId, generateComponentId, generateUniqueId, buildPropGroupHierarchy, findPropGroup, collectPropGroupIds, movePropGroupInTree, validateFilteredComponentIds, } from "../utils/component-helpers.js";
 import { compileAllComponents as compileAllComponentsMulti } from "../utils/compile.js";
 import { transformEsmToWindowGlobals, transformChunkForCanvas, buildChunkMapping, } from "../utils/esm-transform.js";
 import { DevServerWebSocket, } from "../utils/websocket-server.js";
@@ -12,10 +13,20 @@ const DEV_SERVER_PORT = 5201;
 const compiledComponents = new Map();
 const compiledSharedModules = new Map();
 let compiledGlobalStyles;
+// Hashes broadcast on the last cycle, used to compute deltas. Reset only on process
+// startup. Editors compare these hashes (sent on the wire as `contentHash`) against their
+// stored YJS value to decide whether to apply the update — so once we've seen a given hash
+// here, we can safely skip broadcasting it again.
+const lastBroadcastComponentHashes = new Map();
+const lastBroadcastSharedHashes = new Map();
+let lastBroadcastGlobalStyleHash;
 // Cached types list received from the editor via sync-types
 let cachedEditorTypes = null;
 // Cached custom type definitions received from the editor via sync-types (full IType objects)
 let cachedCustomTypes = null;
+// Cached theme global variables received from the editor via sync-types.
+// Drives the ThemeSettingName union in src/global-types.ts.
+let cachedThemeSettings = null;
 const LIBRARY_TYPE_PREFIX = "@ikas/";
 /**
  * Match custom types for a component's props from the cached custom types.
@@ -128,12 +139,23 @@ async function compileAllComponentsForDev(config) {
     if (chunkIds.length > 0) {
         console.log(chalk.cyan(`  Extracted ${chunkIds.length} shared chunk(s)`));
     }
-    // Store global CSS (unscoped)
+    // Store global CSS (unscoped). Preserve `updatedAt` across rebuilds when the compiled
+    // global CSS is byte-identical so the editor only sees a fresh timestamp when the
+    // designer actually changed `global.css` — the publish UI watches this timestamp to
+    // decide whether globals need (re)publishing independently of any code component.
     if (result.globalCss && config.projectId) {
-        compiledGlobalStyles = {
+        const previousHash = computeGlobalStyleHash(compiledGlobalStyles);
+        const previousUpdatedAt = compiledGlobalStyles?.updatedAt;
+        const next = {
             projectId: config.projectId,
             compiledCss: result.globalCss,
         };
+        const nextHash = computeGlobalStyleHash(next);
+        next.updatedAt =
+            nextHash === previousHash && previousUpdatedAt !== undefined
+                ? previousUpdatedAt
+                : Date.now();
+        compiledGlobalStyles = next;
         console.log(chalk.cyan(`  Compiled global styles`));
     }
     else {
@@ -208,6 +230,7 @@ async function compileAllComponentsForDev(config) {
         compiledComponents.set(component.id, data);
         console.log(chalk.green(`  Compiled: ${component.name}`));
     }
+    populateContentHashes();
     return true;
 }
 /**
@@ -267,6 +290,7 @@ function rebuildCompiledComponentFromConfig(config, componentId) {
             : undefined,
     };
     compiledComponents.set(componentId, updated);
+    populateContentHashes();
     return updated;
 }
 /**
@@ -275,6 +299,152 @@ function rebuildCompiledComponentFromConfig(config, componentId) {
 function getAllSharedModules() {
     return Array.from(compiledSharedModules.values());
 }
+function sha256Hex(input) {
+    return crypto.createHash("sha256").update(input).digest("hex");
+}
+/**
+ * Compute `contentHash` for every entry in `compiledSharedModules` and `compiledComponents`,
+ * mutating each entry in place. A component's hash incorporates the hashes of its referenced
+ * shared modules (sorted), so any shared-util change cascades into consumers without
+ * requiring a separate "shared module changed" message — the consumer's own hash already
+ * differs. Global styles are tracked separately via `updatedAt` on the global style payload;
+ * they intentionally do NOT roll into component hashes (designers publish globals as a
+ * standalone unit).
+ */
+function populateContentHashes() {
+    for (const mod of compiledSharedModules.values()) {
+        mod.contentHash = sha256Hex([mod.id, mod.compiledServerJs, mod.compiledClientJs, mod.canvasClientJs, mod.compiledCss].join("\0"));
+    }
+    for (const comp of compiledComponents.values()) {
+        const referencedHashes = (comp.usedSharedModuleIds || [])
+            .slice()
+            .sort()
+            .map((id) => `${id}:${compiledSharedModules.get(id)?.contentHash || ""}`)
+            .join("|");
+        comp.contentHash = sha256Hex([
+            comp.id,
+            comp.name,
+            comp.projectId || "",
+            comp.type || "component",
+            comp.isHeader ? "1" : "0",
+            comp.isFooter ? "1" : "0",
+            comp.compiledServerJs,
+            comp.compiledClientJs,
+            comp.compiledCss,
+            comp.canvasClientJs,
+            JSON.stringify(comp.props),
+            JSON.stringify(comp.propGroups || null),
+            JSON.stringify(comp.configPropGroups || null),
+            JSON.stringify(comp.customTypes || null),
+            (comp.usedSharedModuleIds || []).slice().sort().join(","),
+            referencedHashes,
+        ].join("\0"));
+    }
+}
+function computeGlobalStyleHash(g) {
+    if (!g)
+        return undefined;
+    return sha256Hex([g.projectId, g.compiledCss].join("\0"));
+}
+/**
+ * Build a `component-update` payload's `sharedModules` array for one component: the chunks
+ * the editor needs to resolve this component's imports. We always include the full
+ * transitive set (cheap) so the editor never sees a missing chunk during a partial update.
+ */
+function sharedModulesForComponent(comp) {
+    if (!comp.usedSharedModuleIds || comp.usedSharedModuleIds.length === 0)
+        return undefined;
+    const out = [];
+    for (const id of comp.usedSharedModuleIds) {
+        const mod = compiledSharedModules.get(id);
+        if (mod)
+            out.push(mod);
+    }
+    return out.length > 0 ? out : undefined;
+}
+/**
+ * Diff current compile state against `lastBroadcast*` maps and decide what to send:
+ *
+ * - Nothing changed → no broadcast at all (this is the whole point — quiet rebuilds).
+ * - Exactly one component changed, no deletes, no global change → single
+ *   `component-update` (cheap, no full-state replay on the editor).
+ * - Anything more (multi-component, deletes, global style change) → one bundled
+ *   `initial-state`. We deliberately collapse multi-component changes into ONE message so
+ *   the editor doesn't tick through N sequential `markUpdating` / refresh cycles. The
+ *   editor's `autoSyncToTheme` uses `contentHash` to skip YJS writes for components that
+ *   didn't actually change, so the full-state payload only mutates what really moved.
+ *
+ * Newly-connecting editors always receive a full `initial-state` via `onRequestState` in
+ * websocket-server.ts and are independent of this path.
+ */
+function broadcastCompileDelta(wsServer) {
+    const currentGlobalHash = computeGlobalStyleHash(compiledGlobalStyles);
+    const globalStylesChanged = currentGlobalHash !== lastBroadcastGlobalStyleHash;
+    const changedComponentIds = [];
+    for (const [id, comp] of compiledComponents) {
+        const prev = lastBroadcastComponentHashes.get(id);
+        if (prev !== comp.contentHash)
+            changedComponentIds.push(id);
+    }
+    const deletedComponentIds = [];
+    for (const id of lastBroadcastComponentHashes.keys()) {
+        if (!compiledComponents.has(id))
+            deletedComponentIds.push(id);
+    }
+    let changedSharedCount = 0;
+    for (const [id, mod] of compiledSharedModules) {
+        if (lastBroadcastSharedHashes.get(id) !== mod.contentHash)
+            changedSharedCount++;
+    }
+    const result = {
+        changedComponents: changedComponentIds.length,
+        deletedComponents: deletedComponentIds.length,
+        changedSharedModules: changedSharedCount,
+        globalStylesChanged,
+    };
+    const nothingChanged = changedComponentIds.length === 0 &&
+        deletedComponentIds.length === 0 &&
+        !globalStylesChanged;
+    if (nothingChanged)
+        return result;
+    // Single-component edit fast path: avoid making the editor clear+refill its devComponents
+    // map and run autoSyncToTheme for every component. One targeted update is enough.
+    const canUseSingleUpdate = changedComponentIds.length === 1 &&
+        deletedComponentIds.length === 0 &&
+        !globalStylesChanged;
+    if (canUseSingleUpdate) {
+        const comp = compiledComponents.get(changedComponentIds[0]);
+        wsServer.broadcastComponentUpdate(comp, sharedModulesForComponent(comp));
+        lastBroadcastComponentHashes.set(comp.id, comp.contentHash);
+    }
+    else {
+        for (const id of deletedComponentIds) {
+            wsServer.broadcastComponentDeleted(id);
+            lastBroadcastComponentHashes.delete(id);
+        }
+        wsServer.broadcast({
+            type: "initial-state",
+            payload: {
+                components: getAllComponents(),
+                sharedModules: getAllSharedModules(),
+                globalStyles: compiledGlobalStyles,
+                timestamp: Date.now(),
+            },
+        });
+        lastBroadcastComponentHashes.clear();
+        for (const [id, comp] of compiledComponents) {
+            if (comp.contentHash)
+                lastBroadcastComponentHashes.set(id, comp.contentHash);
+        }
+    }
+    lastBroadcastSharedHashes.clear();
+    for (const [id, mod] of compiledSharedModules) {
+        if (mod.contentHash)
+            lastBroadcastSharedHashes.set(id, mod.contentHash);
+    }
+    lastBroadcastGlobalStyleHash = currentGlobalHash;
+    return result;
+}
 /**
  * Read and return the current config from disk
  */
@@ -294,12 +464,20 @@ function writeConfig(configPath, config) {
 function writeGlobalTypesFile(config) {
     const globalTypesPath = path.resolve(process.cwd(), "src/global-types.ts");
     const usedEnumIds = collectUsedEnumIds(config.components);
-    const content = generateGlobalTypesFile(cachedEditorTypes, cachedCustomTypes, usedEnumIds);
-    // Avoid unnecessary writes (prevents file watcher loops)
-    if (fs.existsSync(globalTypesPath)) {
-        const existing = fs.readFileSync(globalTypesPath, "utf-8");
-        if (existing === content)
-            return;
+    const content = generateGlobalTypesFile(cachedEditorTypes, cachedCustomTypes, usedEnumIds, cachedThemeSettings);
+    // Single read instead of existsSync + readFileSync; absent file reads as null.
+    let existing = null;
+    try {
+        existing = fs.readFileSync(globalTypesPath, "utf-8");
+    }
+    catch {
+        existing = null;
+    }
+    // Skip unnecessary writes (file-watcher loops) and, crucially, don't let the
+    // startup write clobber editor-synced theme globals before the editor has
+    // connected and re-synced them.
+    if (!shouldWriteGlobalTypes(existing, content, cachedThemeSettings != null)) {
+        return;
     }
     fs.writeFileSync(globalTypesPath, content);
 }
@@ -323,7 +501,10 @@ function createEditorHandlers(configPath, getConfig, setConfig, wsServer) {
     const broadcastConfigChange = (componentId) => {
         const updated = rebuildCompiledComponentFromConfig(getConfig(), componentId);
         if (updated) {
-            wsServer.broadcastComponentUpdate(updated);
+            wsServer.broadcastComponentUpdate(updated, sharedModulesForComponent(updated));
+            if (updated.contentHash) {
+                lastBroadcastComponentHashes.set(updated.id, updated.contentHash);
+            }
         }
     };
     return {
@@ -701,8 +882,10 @@ function createEditorHandlers(configPath, getConfig, setConfig, wsServer) {
             regenerateAllComponentTypes(config);
             console.log(chalk.green(`  Deleted enum: ${removed.name} (${enumId})`));
         },
-        onSyncTypes: (types, customTypes) => {
+        onSyncTypes: (types, customTypes, themeSettings) => {
             cachedEditorTypes = types;
+            if (themeSettings)
+                cachedThemeSettings = themeSettings;
             // Merge incoming custom types with existing ones instead of replacing.
             // Custom types belong to the code component project and should not be
             // lost when a different editor project connects.
@@ -808,6 +991,18 @@ async function startDevServer(opts = {}) {
     // Initial compilation of all components (multi-entry with code splitting)
     console.log(chalk.cyan("  Compiling components..."));
     await compileAllComponentsForDev(config);
+    // Seed the broadcast-hash maps so the first delta-broadcast after startup doesn't replay
+    // the initial state — newly-connecting editors get a full `initial-state` directly via
+    // `onRequestState`, independent of the delta path.
+    for (const [id, comp] of compiledComponents) {
+        if (comp.contentHash)
+            lastBroadcastComponentHashes.set(id, comp.contentHash);
+    }
+    for (const [id, mod] of compiledSharedModules) {
+        if (mod.contentHash)
+            lastBroadcastSharedHashes.set(id, mod.contentHash);
+    }
+    lastBroadcastGlobalStyleHash = computeGlobalStyleHash(compiledGlobalStyles);
     console.log("");
     // Start WebSocket server
     const wsServer = new DevServerWebSocket(DEV_SERVER_PORT);
@@ -848,16 +1043,15 @@ async function startDevServer(opts = {}) {
             console.log(chalk.yellow(`  Recompiling all (triggered by: ${triggeredBy})...`));
             const success = await compileAllComponentsForDev(config);
             if (success) {
-                // Send full state to all connected editors
-                wsServer.broadcast({
-                    type: "initial-state",
-                    payload: {
-                        components: getAllComponents(),
-                        sharedModules: getAllSharedModules(),
-                        globalStyles: compiledGlobalStyles,
-                        timestamp: Date.now(),
-                    },
-                });
+                const delta = broadcastCompileDelta(wsServer);
+                if (delta.changedComponents === 0 &&
+                    delta.deletedComponents === 0 &&
+                    !delta.globalStylesChanged) {
+                    console.log(chalk.gray("  No editor-visible changes (skipped broadcast)"));
+                }
+                else {
+                    console.log(chalk.cyan(`  Broadcast delta: ${delta.changedComponents} changed, ${delta.deletedComponents} deleted, ${delta.changedSharedModules} shared chunks changed${delta.globalStylesChanged ? ", globals updated" : ""}`));
+                }
             }
             else {
                 // Broadcast error for the triggering component if identifiable
@@ -878,16 +1072,8 @@ async function startDevServer(opts = {}) {
                 cachedCustomTypes = config.customTypes || [];
                 writeGlobalTypesFile(config);
                 await compileAllComponentsForDev(config);
-                // Send full state to all connected editors
-                wsServer.broadcast({
-                    type: "initial-state",
-                    payload: {
-                        components: getAllComponents(),
-                        sharedModules: getAllSharedModules(),
-                        globalStyles: compiledGlobalStyles,
-                        timestamp: Date.now(),
-                    },
-                });
+                const delta = broadcastCompileDelta(wsServer);
+                console.log(chalk.cyan(`  Config reload delta: ${delta.changedComponents} changed, ${delta.deletedComponents} deleted, ${delta.changedSharedModules} shared chunks changed${delta.globalStylesChanged ? ", globals updated" : ""}`));
             }
             catch (e) {
                 console.error(chalk.red("  Failed to reload config"));