@ic-reactor/vite-plugin 0.5.1 → 0.6.0

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 { icReactorPlugin } from "@ic-reactor/vite-plugin"
+import { icReactor } from "@ic-reactor/vite-plugin"
 
 export default defineConfig({
   plugins: [
     react(),
-    icReactorPlugin({
+    icReactor({
       canisters: [
         {
           name: "backend",
@@ -87,6 +87,56 @@ 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
@@ -97,6 +147,7 @@ function MyComponent() {
 | `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
 
@@ -108,6 +159,13 @@ function MyComponent() {
 | `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, {
-  icReactorPlugin: () => icReactorPlugin
+  icReactor: () => icReactor
 });
 module.exports = __toCommonJS(index_exports);
 var import_node_path = __toESM(require("path"), 1);
@@ -78,17 +78,21 @@ function buildIcEnvCookie(canisterIds, rootKey) {
 }
 
 // src/index.ts
-function icReactorPlugin(options) {
+function icReactor(options) {
   const {
     canisters,
     outDir = "src/declarations",
     clientManagerPath = "../../clients",
-    injectEnvironment = true
+    injectEnvironment = true,
+    reactor
   } = options;
   const globalConfig = {
     outDir,
     clientManagerPath
   };
+  if (reactor != null) {
+    globalConfig.reactor = reactor;
+  }
   const plugin = {
     name: "ic-reactor-plugin",
     enforce: "pre",
@@ -185,5 +189,5 @@ function icReactorPlugin(options) {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  icReactorPlugin
+  icReactor
 });

package/dist/index.d.cts

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

package/dist/index.d.ts

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

package/dist/index.js

@@ -46,17 +46,21 @@ function buildIcEnvCookie(canisterIds, rootKey) {
 }
 
 // src/index.ts
-function icReactorPlugin(options) {
+function icReactor(options) {
   const {
     canisters,
     outDir = "src/declarations",
     clientManagerPath = "../../clients",
-    injectEnvironment = true
+    injectEnvironment = true,
+    reactor
   } = options;
   const globalConfig = {
     outDir,
     clientManagerPath
   };
+  if (reactor != null) {
+    globalConfig.reactor = reactor;
+  }
   const plugin = {
     name: "ic-reactor-plugin",
     enforce: "pre",
@@ -152,5 +156,5 @@ function icReactorPlugin(options) {
   return plugin;
 }
 export {
-  icReactorPlugin
+  icReactor
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ic-reactor/vite-plugin",
-  "version": "0.5.1",
+  "version": "0.6.0",
   "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.5.1"
+    "@ic-reactor/codegen": "0.6.0"
   },
   "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 { icReactorPlugin, type IcReactorPluginOptions } from "./index"
+import { icReactor, 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("icReactorPlugin", () => {
+describe("icReactor", () => {
   const mockOptions: IcReactorPluginOptions = {
     canisters: [
       {
@@ -60,7 +60,7 @@ describe("icReactorPlugin", () => {
   })
 
   it("should return correct plugin structure", () => {
-    const plugin = icReactorPlugin(mockOptions)
+    const plugin = icReactor(mockOptions)
     expect(plugin.name).toBe("ic-reactor-plugin")
     expect(plugin.buildStart).toBeDefined()
     expect(plugin.handleHotUpdate).toBeDefined()
@@ -89,7 +89,7 @@ describe("icReactorPlugin", () => {
         }
       )
 
-      const plugin = icReactorPlugin(mockOptions)
+      const plugin = icReactor(mockOptions)
       const config = (plugin as any).config({}, { command: "serve" })
 
       expect(config.server.headers["Set-Cookie"]).toContain("ic_env=")
@@ -107,7 +107,7 @@ describe("icReactorPlugin", () => {
         throw new Error("Command not found")
       })
 
-      const plugin = icReactorPlugin(mockOptions)
+      const plugin = icReactor(mockOptions)
       const config = (plugin as any).config({}, { command: "serve" })
 
       expect(config.server.headers).toBeUndefined()
@@ -115,7 +115,7 @@ describe("icReactorPlugin", () => {
     })
 
     it("should return empty config for build command", () => {
-      const plugin = icReactorPlugin(mockOptions)
+      const plugin = icReactor(mockOptions)
       const config = (plugin as any).config({}, { command: "build" })
 
       expect(config).toEqual({})
@@ -124,7 +124,7 @@ describe("icReactorPlugin", () => {
 
   describe("buildStart", () => {
     it("should generate declarations and reactor file", async () => {
-      const plugin = icReactorPlugin(mockOptions)
+      const plugin = icReactor(mockOptions)
       await (plugin.buildStart as any)()
 
       expect(runCanisterPipeline).toHaveBeenCalledWith({
@@ -147,7 +147,7 @@ describe("icReactorPlugin", () => {
         error: "Failed to generate",
       })
 
-      const plugin = icReactorPlugin(mockOptions)
+      const plugin = icReactor(mockOptions)
       await (plugin.buildStart as any)()
 
       expect(consoleErrorSpy).toHaveBeenCalledWith(
@@ -156,11 +156,40 @@ describe("icReactorPlugin", () => {
 
       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)()
+
+      expect(runCanisterPipeline).toHaveBeenCalledWith({
+        canisterConfig: mockOptions.canisters[0],
+        projectRoot: expect.any(String),
+        globalConfig: {
+          outDir: "src/declarations",
+          clientManagerPath: "../../clients",
+          reactor: {
+            defaultMode: "display",
+            canisters: {
+              test_canister: "raw",
+            },
+          },
+        },
+      })
+    })
   })
 
   describe("handleHotUpdate", () => {
     it("should restart server when .did file changes", async () => {
-      const plugin = icReactorPlugin(mockOptions)
+      const plugin = icReactor(mockOptions)
       const ctx = {
         file: "/absolute/path/to/src/declarations/test.did",
         server: mockServer,
@@ -181,7 +210,7 @@ describe("icReactorPlugin", () => {
     })
 
     it("should ignore other files", () => {
-      const plugin = icReactorPlugin(mockOptions)
+      const plugin = icReactor(mockOptions)
       const ctx = {
         file: "/some/other/file.ts",
         server: mockServer,

package/src/index.ts

@@ -13,6 +13,7 @@ import {
   runCanisterPipeline,
   type CanisterConfig,
   type CodegenConfig,
+  type ReactorGenerationConfig,
 } from "@ic-reactor/codegen"
 import { getIcEnvironmentInfo, buildIcEnvCookie } from "./env.js"
 
@@ -37,21 +38,33 @@ 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 icReactorPlugin(options: IcReactorPluginOptions): any {
+export function icReactor(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"> = {
+  const globalConfig: Pick<
+    CodegenConfig,
+    "outDir" | "clientManagerPath" | "reactor"
+  > = {
     outDir,
     clientManagerPath,
   }
+  if (reactor != null) {
+    globalConfig.reactor = reactor
+  }
 
   const plugin: Plugin = {
     name: "ic-reactor-plugin",