@ic-reactor/vite-plugin 0.6.0 → 0.7.1

package/README.md

@@ -38,12 +38,12 @@ pnpm add @ic-reactor/react @tanstack/react-query @icp-sdk/core
 // vite.config.ts
 import { defineConfig } from "vite"
 import react from "@vitejs/plugin-react"
-import { icReactor } from "@ic-reactor/vite-plugin"
+import { icReactorPlugin } from "@ic-reactor/vite-plugin"
 
 export default defineConfig({
   plugins: [
     react(),
-    icReactor({
+    icReactorPlugin({
       canisters: [
         {
           name: "backend",
@@ -87,56 +87,6 @@ function MyComponent() {
 }
 ```
 
-### Reactor Mode (raw vs display)
-
-By default, generated hooks use `DisplayReactor` (backward compatible). You can switch the default globally, and override specific canisters that need raw Candid shapes.
-
-```ts
-icReactor({
-  canisters: [
-    { name: "backend", didFile: "./backend/backend.did" },
-    { name: "workflow_engine", didFile: "./workflow/workflow_engine.did" },
-  ],
-  reactor: {
-    defaultMode: "display",
-    canisters: {
-      workflow_engine: "raw",
-    },
-  },
-})
-```
-
-Generated canister folders now contain:
-
-- `index.generated.ts` (overwritten on regenerate)
-- `index.ts` (created once if missing, never overwritten)
-
-The generated implementation exports both factories so apps can opt in explicitly without editing generated files:
-
-```ts
-// display-default canister (generated)
-export function createBackendRawReactor() {
-  /* ... */
-}
-export function createBackendDisplayReactor() {
-  /* ... */
-}
-export const backendReactor = createBackendDisplayReactor()
-export const BackendReactorMode = "display" as const
-```
-
-```ts
-// raw-default canister (generated)
-export function createWorkflowEngineRawReactor() {
-  /* ... */
-}
-export function createWorkflowEngineDisplayReactor() {
-  /* ... */
-}
-export const workflowEngineReactor = createWorkflowEngineRawReactor()
-export const WorkflowEngineReactorMode = "raw" as const
-```
-
 ## Configuration
 
 ### Plugin Options
@@ -147,7 +97,6 @@ export const WorkflowEngineReactorMode = "raw" as const
 | `outDir`            | `string`           | Base output directory for generated files.          | `"src/declarations"` |
 | `clientManagerPath` | `string`           | Path to client manager import.                      | `"../../clients"`    |
 | `injectEnvironment` | `boolean`          | Inject `ic_env` cookie for local development.       | `true`               |
-| `reactor`           | `ReactorConfig`    | Default/per-canister raw vs display reactor mode.   | display default      |
 
 ### Canister Config
 
@@ -159,13 +108,6 @@ export const WorkflowEngineReactorMode = "raw" as const
 | `clientManagerPath` | `string` | Override client manager path.                   | No       |
 | `canisterId`        | `string` | Optional fixed canister ID.                     | No       |
 
-### ReactorConfig
-
-| Option        | Type                                 | Description                              | Required |
-| :------------ | :----------------------------------- | :--------------------------------------- | :------- |
-| `defaultMode` | `"raw" \| "display"`                 | Global default mode for generated hooks. | No       |
-| `canisters`   | `Record<string, "raw" \| "display">` | Per-canister overrides keyed by name.    | No       |
-
 ## Local Development (Environment Injection)
 
 When running `vite dev`, the plugin automatically handles local canister environment connection:

package/dist/index.cjs

@@ -30,7 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  icReactor: () => icReactor
+  icReactorPlugin: () => icReactorPlugin
 });
 module.exports = __toCommonJS(index_exports);
 var import_node_path = __toESM(require("path"), 1);
@@ -78,21 +78,21 @@ function buildIcEnvCookie(canisterIds, rootKey) {
 }
 
 // src/index.ts
-function icReactor(options) {
+function icReactorPlugin(options) {
   const {
     canisters,
     outDir = "src/declarations",
     clientManagerPath = "../../clients",
-    injectEnvironment = true,
-    reactor
+    injectEnvironment = true
   } = options;
   const globalConfig = {
     outDir,
     clientManagerPath
   };
-  if (reactor != null) {
-    globalConfig.reactor = reactor;
-  }
+  const projectRoot = process.cwd();
+  const resolveDidPath = (didFile) => import_node_path.default.normalize(
+    import_node_path.default.isAbsolute(didFile) ? didFile : import_node_path.default.resolve(projectRoot, didFile)
+  );
   const plugin = {
     name: "ic-reactor-plugin",
     enforce: "pre",
@@ -133,8 +133,11 @@ function icReactor(options) {
         }
       };
     },
+    configureServer(server) {
+      const didFiles = canisters.map((c) => resolveDidPath(c.didFile));
+      server.watcher.add(didFiles);
+    },
     async buildStart() {
-      const projectRoot = process.cwd();
       console.log(
         `[ic-reactor] Generating hooks for ${canisters.length} canisters...`
       );
@@ -162,14 +165,13 @@ function icReactor(options) {
     handleHotUpdate({ file, server }) {
       if (file.endsWith(".did")) {
         const affectedCanister = canisters.find((c) => {
-          const configPath = import_node_path.default.resolve(process.cwd(), c.didFile);
-          return configPath === file;
+          const configPath = resolveDidPath(c.didFile);
+          return configPath === import_node_path.default.normalize(file);
         });
         if (affectedCanister) {
           console.log(
             `[ic-reactor] .did file changed: ${affectedCanister.name}. Regenerating...`
           );
-          const projectRoot = process.cwd();
           (0, import_codegen.runCanisterPipeline)({
             canisterConfig: affectedCanister,
             projectRoot,
@@ -189,5 +191,5 @@ function icReactor(options) {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  icReactor
+  icReactorPlugin
 });

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-import { CanisterConfig, ReactorGenerationConfig } from '@ic-reactor/codegen';
+import { CanisterConfig } from '@ic-reactor/codegen';
 
 /**
  * @ic-reactor/vite-plugin
@@ -30,12 +30,7 @@ interface IcReactorPluginOptions {
      * Default: true
      */
     injectEnvironment?: boolean;
-    /**
-     * Reactor generation behavior.
-     * Controls whether generated default hooks use raw (Reactor) or display (DisplayReactor).
-     */
-    reactor?: ReactorGenerationConfig;
 }
-declare function icReactor(options: IcReactorPluginOptions): any;
+declare function icReactorPlugin(options: IcReactorPluginOptions): any;
 
-export { type IcReactorPluginOptions, icReactor };
+export { type IcReactorPluginOptions, icReactorPlugin };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { CanisterConfig, ReactorGenerationConfig } from '@ic-reactor/codegen';
+import { CanisterConfig } from '@ic-reactor/codegen';
 
 /**
  * @ic-reactor/vite-plugin
@@ -30,12 +30,7 @@ interface IcReactorPluginOptions {
      * Default: true
      */
     injectEnvironment?: boolean;
-    /**
-     * Reactor generation behavior.
-     * Controls whether generated default hooks use raw (Reactor) or display (DisplayReactor).
-     */
-    reactor?: ReactorGenerationConfig;
 }
-declare function icReactor(options: IcReactorPluginOptions): any;
+declare function icReactorPlugin(options: IcReactorPluginOptions): any;
 
-export { type IcReactorPluginOptions, icReactor };
+export { type IcReactorPluginOptions, icReactorPlugin };

package/dist/index.js

@@ -46,21 +46,21 @@ function buildIcEnvCookie(canisterIds, rootKey) {
 }
 
 // src/index.ts
-function icReactor(options) {
+function icReactorPlugin(options) {
   const {
     canisters,
     outDir = "src/declarations",
     clientManagerPath = "../../clients",
-    injectEnvironment = true,
-    reactor
+    injectEnvironment = true
   } = options;
   const globalConfig = {
     outDir,
     clientManagerPath
   };
-  if (reactor != null) {
-    globalConfig.reactor = reactor;
-  }
+  const projectRoot = process.cwd();
+  const resolveDidPath = (didFile) => path.normalize(
+    path.isAbsolute(didFile) ? didFile : path.resolve(projectRoot, didFile)
+  );
   const plugin = {
     name: "ic-reactor-plugin",
     enforce: "pre",
@@ -101,8 +101,11 @@ function icReactor(options) {
         }
       };
     },
+    configureServer(server) {
+      const didFiles = canisters.map((c) => resolveDidPath(c.didFile));
+      server.watcher.add(didFiles);
+    },
     async buildStart() {
-      const projectRoot = process.cwd();
       console.log(
         `[ic-reactor] Generating hooks for ${canisters.length} canisters...`
       );
@@ -130,14 +133,13 @@ function icReactor(options) {
     handleHotUpdate({ file, server }) {
       if (file.endsWith(".did")) {
         const affectedCanister = canisters.find((c) => {
-          const configPath = path.resolve(process.cwd(), c.didFile);
-          return configPath === file;
+          const configPath = resolveDidPath(c.didFile);
+          return configPath === path.normalize(file);
         });
         if (affectedCanister) {
           console.log(
             `[ic-reactor] .did file changed: ${affectedCanister.name}. Regenerating...`
           );
-          const projectRoot = process.cwd();
           runCanisterPipeline({
             canisterConfig: affectedCanister,
             projectRoot,
@@ -156,5 +158,5 @@ function icReactor(options) {
   return plugin;
 }
 export {
-  icReactor
+  icReactorPlugin
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ic-reactor/vite-plugin",
-  "version": "0.6.0",
+  "version": "0.7.1",
   "description": "Vite plugin for zero-config IC reactor generation from Candid files",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -37,7 +37,7 @@
     "url": "https://github.com/B3Pay/ic-reactor/issues"
   },
   "dependencies": {
-    "@ic-reactor/codegen": "0.6.0"
+    "@ic-reactor/codegen": "0.7.1"
   },
   "peerDependencies": {
     "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0"

package/src/index.test.ts

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, beforeEach } from "vitest"
-import { icReactor, type IcReactorPluginOptions } from "./index"
+import { icReactorPlugin, type IcReactorPluginOptions } from "./index"
 import path from "path"
 import { execFileSync } from "child_process"
 import { runCanisterPipeline } from "@ic-reactor/codegen"
@@ -24,7 +24,7 @@ vi.mock("fs", () => ({
   },
 }))
 
-describe("icReactor", () => {
+describe("icReactorPlugin", () => {
   const mockOptions: IcReactorPluginOptions = {
     canisters: [
       {
@@ -50,6 +50,9 @@ describe("icReactor", () => {
     ws: {
       send: vi.fn(),
     },
+    watcher: {
+      add: vi.fn(),
+    },
   }
 
   beforeEach(() => {
@@ -60,7 +63,7 @@ describe("icReactor", () => {
   })
 
   it("should return correct plugin structure", () => {
-    const plugin = icReactor(mockOptions)
+    const plugin = icReactorPlugin(mockOptions)
     expect(plugin.name).toBe("ic-reactor-plugin")
     expect(plugin.buildStart).toBeDefined()
     expect(plugin.handleHotUpdate).toBeDefined()
@@ -89,7 +92,7 @@ describe("icReactor", () => {
         }
       )
 
-      const plugin = icReactor(mockOptions)
+      const plugin = icReactorPlugin(mockOptions)
       const config = (plugin as any).config({}, { command: "serve" })
 
       expect(config.server.headers["Set-Cookie"]).toContain("ic_env=")
@@ -107,7 +110,7 @@ describe("icReactor", () => {
         throw new Error("Command not found")
       })
 
-      const plugin = icReactor(mockOptions)
+      const plugin = icReactorPlugin(mockOptions)
       const config = (plugin as any).config({}, { command: "serve" })
 
       expect(config.server.headers).toBeUndefined()
@@ -115,7 +118,7 @@ describe("icReactor", () => {
     })
 
     it("should return empty config for build command", () => {
-      const plugin = icReactor(mockOptions)
+      const plugin = icReactorPlugin(mockOptions)
       const config = (plugin as any).config({}, { command: "build" })
 
       expect(config).toEqual({})
@@ -124,7 +127,7 @@ describe("icReactor", () => {
 
   describe("buildStart", () => {
     it("should generate declarations and reactor file", async () => {
-      const plugin = icReactor(mockOptions)
+      const plugin = icReactorPlugin(mockOptions)
       await (plugin.buildStart as any)()
 
       expect(runCanisterPipeline).toHaveBeenCalledWith({
@@ -147,7 +150,7 @@ describe("icReactor", () => {
         error: "Failed to generate",
       })
 
-      const plugin = icReactor(mockOptions)
+      const plugin = icReactorPlugin(mockOptions)
       await (plugin.buildStart as any)()
 
       expect(consoleErrorSpy).toHaveBeenCalledWith(
@@ -156,40 +159,20 @@ describe("icReactor", () => {
 
       consoleErrorSpy.mockRestore()
     })
+  })
 
-    it("should pass reactor mode config to codegen", async () => {
-      const plugin = icReactor({
-        ...mockOptions,
-        reactor: {
-          defaultMode: "display",
-          canisters: {
-            test_canister: "raw",
-          },
-        },
-      })
-
-      await (plugin.buildStart as any)()
+  describe("handleHotUpdate", () => {
+    it("should register configured .did files with the watcher", () => {
+      const plugin = icReactorPlugin(mockOptions)
+      ;(plugin.configureServer as any)(mockServer)
 
-      expect(runCanisterPipeline).toHaveBeenCalledWith({
-        canisterConfig: mockOptions.canisters[0],
-        projectRoot: expect.any(String),
-        globalConfig: {
-          outDir: "src/declarations",
-          clientManagerPath: "../../clients",
-          reactor: {
-            defaultMode: "display",
-            canisters: {
-              test_canister: "raw",
-            },
-          },
-        },
-      })
+      expect(mockServer.watcher.add).toHaveBeenCalledWith([
+        expect.stringContaining("src/declarations/test.did"),
+      ])
     })
-  })
 
-  describe("handleHotUpdate", () => {
     it("should restart server when .did file changes", async () => {
-      const plugin = icReactor(mockOptions)
+      const plugin = icReactorPlugin(mockOptions)
       const ctx = {
         file: "/absolute/path/to/src/declarations/test.did",
         server: mockServer,
@@ -210,7 +193,7 @@ describe("icReactor", () => {
     })
 
     it("should ignore other files", () => {
-      const plugin = icReactor(mockOptions)
+      const plugin = icReactorPlugin(mockOptions)
       const ctx = {
         file: "/some/other/file.ts",
         server: mockServer,

package/src/index.ts

@@ -13,7 +13,6 @@ import {
   runCanisterPipeline,
   type CanisterConfig,
   type CodegenConfig,
-  type ReactorGenerationConfig,
 } from "@ic-reactor/codegen"
 import { getIcEnvironmentInfo, buildIcEnvCookie } from "./env.js"
 
@@ -38,33 +37,26 @@ export interface IcReactorPluginOptions {
    * Default: true
    */
   injectEnvironment?: boolean
-  /**
-   * Reactor generation behavior.
-   * Controls whether generated default hooks use raw (Reactor) or display (DisplayReactor).
-   */
-  reactor?: ReactorGenerationConfig
 }
 
-export function icReactor(options: IcReactorPluginOptions): any {
+export function icReactorPlugin(options: IcReactorPluginOptions): any {
   const {
     canisters,
     outDir = "src/declarations",
     clientManagerPath = "../../clients",
     injectEnvironment = true,
-    reactor,
   } = options
 
   // Construct a partial CodegenConfig to pass to the pipeline
-  const globalConfig: Pick<
-    CodegenConfig,
-    "outDir" | "clientManagerPath" | "reactor"
-  > = {
+  const globalConfig: Pick<CodegenConfig, "outDir" | "clientManagerPath"> = {
     outDir,
     clientManagerPath,
   }
-  if (reactor != null) {
-    globalConfig.reactor = reactor
-  }
+  const projectRoot = process.cwd()
+  const resolveDidPath = (didFile: string) =>
+    path.normalize(
+      path.isAbsolute(didFile) ? didFile : path.resolve(projectRoot, didFile)
+    )
 
   const plugin: Plugin = {
     name: "ic-reactor-plugin",
@@ -118,10 +110,15 @@ export function icReactor(options: IcReactorPluginOptions): any {
       }
     },
 
+    configureServer(server) {
+      // Explicitly watch configured DID files so HMR works even when they are not in the module graph.
+      const didFiles = canisters.map((c) => resolveDidPath(c.didFile))
+      server.watcher.add(didFiles)
+    },
+
     async buildStart() {
       // ── Code Generation ──────────────────────────────────────────────────
 
-      const projectRoot = process.cwd()
       console.log(
         `[ic-reactor] Generating hooks for ${canisters.length} canisters...`
       )
@@ -161,8 +158,8 @@ export function icReactor(options: IcReactorPluginOptions): any {
         const affectedCanister = canisters.find((c) => {
           // Check if changed file matches configured didFile
           // Cast is safe because didFile is required in CanisterConfig
-          const configPath = path.resolve(process.cwd(), c.didFile)
-          return configPath === file
+          const configPath = resolveDidPath(c.didFile)
+          return configPath === path.normalize(file)
         })
 
         if (affectedCanister) {
@@ -171,7 +168,6 @@ export function icReactor(options: IcReactorPluginOptions): any {
           )
 
           // Re-run pipeline for this canister
-          const projectRoot = process.cwd()
           runCanisterPipeline({
             canisterConfig: affectedCanister,
             projectRoot,