@intrig/plugin-react 0.0.2-0 → 0.0.2-3

package/dist/index.cjs

@@ -0,0 +1,4329 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var pluginSdk = require('@intrig/plugin-sdk');
+var path = require('path');
+var fsx = require('fs-extra');
+var mimeType = require('mime-types');
+
+function _interopNamespaceDefault(e) {
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var path__namespace = /*#__PURE__*/_interopNamespaceDefault(path);
+var fsx__namespace = /*#__PURE__*/_interopNamespaceDefault(fsx);
+var mimeType__namespace = /*#__PURE__*/_interopNamespaceDefault(mimeType);
+
+class InternalGeneratorContext {
+    getCounter(sourceId) {
+        this.codeGenerationBreakdown[sourceId] = this.codeGenerationBreakdown[sourceId] || new pluginSdk.StatsCounter(sourceId);
+        return this.codeGenerationBreakdown[sourceId];
+    }
+    getCounters() {
+        return [
+            ...Object.values(this.codeGenerationBreakdown)
+        ];
+    }
+    constructor(potentiallyConflictingDescriptors){
+        this.potentiallyConflictingDescriptors = potentiallyConflictingDescriptors;
+        this.codeGenerationBreakdown = {};
+    }
+}
+
+function packageJsonTemplate(ctx) {
+    var _ctx_rootDir;
+    const projectDir = (_ctx_rootDir = ctx.rootDir) != null ? _ctx_rootDir : process.cwd();
+    const packageJson = fsx__namespace.readJsonSync(path__namespace.resolve(projectDir, 'package.json'));
+    const json = pluginSdk.jsonLiteral(path__namespace.resolve('package.json'));
+    var _packageJson_devDependencies_typescript;
+    return json`
+{
+  "name": "@intrig/generated",
+  "version": "d${Date.now()}",
+  "private": true,
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "swc src -d dist --copy-files --strip-leading-paths && tsc --emitDeclarationOnly"
+  },
+  "dependencies": {
+    "axios": "^1.7.7",
+    "date-fns": "^4.1.0",
+    "eventsource-parser": "^3.0.2",
+    "fast-xml-parser": "^4.5.0",
+    "immer": "^10.1.1",
+    "loglevel": "1.8.1",
+    "module-alias": "^2.2.2",
+    "zod": "^3.23.8"
+  },
+  "devDependencies": {
+    "@swc/cli": "^0.7.7",
+    "@swc/core": "^1.12.6",
+    "@types/node": "^24.0.4",
+    "typescript": "${(_packageJson_devDependencies_typescript = packageJson.devDependencies.typescript) != null ? _packageJson_devDependencies_typescript : packageJson.dependencies.typescript}",
+    "react": "${packageJson.dependencies.react}",
+    "react-dom": "${packageJson.dependencies['react-dom']}"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "_moduleAliases": {
+    "@intrig/react": "./src"
+  },
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./src/index.js",
+      "require": "./src/index.js",
+      "types": "./src/index.d.ts"
+    },
+    "./*": {
+      "import": "./src/*.js",
+      "require": "./src/*.js",
+      "types": "./src/*.d.ts"
+    } 
+  },
+  "typesVersions": {
+    "*": {
+      "*": ["src/*"]
+    }
+  }
+}
+  `;
+}
+
+function indexTemplate() {
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "index.ts"));
+    return ts`
+  export * from './intrig-provider-main';
+  export * from './network-state';
+  export * from './extra';
+  export * from './media-type-utils';
+  `;
+}
+
+function networkStateTemplate() {
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "network-state.tsx"));
+    return ts`import { ZodError } from 'zod';
+import {AxiosResponseHeaders, RawAxiosResponseHeaders} from "axios";
+
+/**
+ * State of an asynchronous call. Network state follows the state diagram given below.
+ *
+ *
+ * <pre>
+ *                 ┌──────┐
+ *   ┌─────────────► Init ◄────────────┐
+ *   │             └▲────┬┘            │
+ *   │              │    │             │
+ *   │           Reset  Execute        │
+ * Reset            │    │           Reset
+ *   │           ┌──┴────┴──┐          │
+ *   │      ┌────► Pending  ◄────┐     │
+ *   │      │    └──┬────┬──┘    │     │
+ *   │   Execute    │    │    Execute  │
+ *   │      │       │    │       │     │
+ *   │      │ OnSuccess OnError  │     │
+ *   │ ┌────┴──┐    │    │    ┌──┴───┐ │
+ *   └─┤Success◄────┘    └────►Error ├─┘
+ *     └───────┘              └──────┘
+ *
+ * </pre>
+ */
+export interface NetworkState<T = unknown> {
+  state: 'init' | 'pending' | 'success' | 'error';
+}
+
+/**
+ * Network call is not yet started
+ */
+export interface InitState<T> extends NetworkState<T> {
+  state: 'init';
+}
+
+/**
+ * Checks whether the state is init state
+ * @param state
+ */
+export function isInit<T>(
+  state: NetworkState<T>,
+): state is InitState<T> {
+  return state.state === 'init';
+}
+
+/**
+ * Initializes a new state.
+ *
+ * @template T The type of the state.
+ * @return {InitState<T>} An object representing the initial state.
+ */
+export function init<T>(): InitState<T> {
+  return {
+    state: 'init',
+  };
+}
+
+/**
+ * Network call is not yet completed
+ */
+export interface PendingState<T> extends NetworkState<T> {
+  state: 'pending';
+  progress?: Progress;
+  data?: T;
+}
+
+/**
+ * Interface representing progress information for an upload or download operation.
+ *
+ * @typedef {object} Progress
+ *
+ * @property {'upload' | 'download'} type - The type of the operation.
+ *
+ * @property {number} loaded - The amount of data that has been loaded so far.
+ *
+ * @property {number} [total] - The total amount of data to be loaded (if known).
+ */
+export interface Progress {
+  type?: 'upload' | 'download';
+  loaded: number;
+  total?: number;
+}
+
+/**
+ * Checks whether the state is pending state
+ * @param state
+ */
+export function isPending<T>(
+  state: NetworkState<T>,
+): state is PendingState<T> {
+  return state.state === 'pending';
+}
+
+/**
+ * Generates a PendingState object with a state of "pending".
+ *
+ * @return {PendingState<T>} An object representing the pending state.
+ */
+export function pending<T>(
+  progress: Progress | undefined = undefined,
+  data: T | undefined = undefined,
+): PendingState<T> {
+  return {
+    state: 'pending',
+    progress,
+    data,
+  };
+}
+
+/**
+ * Network call is completed with success state
+ */
+export interface SuccessState<T> extends NetworkState<T> {
+  state: 'success';
+  data: T;
+  headers?: Record<string, any | undefined>;
+}
+
+/**
+ * Checks whether the state is success response
+ * @param state
+ */
+export function isSuccess<T>(
+  state: NetworkState<T>,
+): state is SuccessState<T> {
+  return state.state === 'success';
+}
+
+/**
+ * Creates a success state object with the provided data.
+ *
+ * @param {T} data - The data to be included in the success state.
+ * @param headers
+ * @return {SuccessState<T>} An object representing a success state containing the provided data.
+ */
+export function success<T>(
+  data: T,
+  headers?: Record<string, any | undefined>,
+): SuccessState<T> {
+  return {
+    state: 'success',
+    data,
+    headers,
+  };
+}
+
+/**
+ * Network call is completed with error response
+ */
+export interface ErrorState<T> extends NetworkState<T> {
+  state: 'error';
+  error: IntrigError;
+}
+
+/**
+ * Checks whether the state is error state
+ * @param state
+ */
+export function isError<T>(
+  state: NetworkState<T>,
+): state is ErrorState<T> {
+  return state.state === 'error';
+}
+
+/**
+ * Constructs an ErrorState object representing an error.
+ *
+ * @param {any} error - The error object or message.
+ * @param {string} [statusCode] - An optional status code associated with the error.
+ * @return {ErrorState<T>} An object representing the error state.
+ */
+export function error<T>(
+  error: IntrigError,
+): ErrorState<T> {
+  return {
+    state: 'error',
+    error
+  };
+}
+
+/**
+ * Represents the base structure for error information in the application.
+ *
+ * This interface is used to define the type of error encountered in various contexts.
+ *
+ * Properties:
+ * - type: Specifies the category of the error which determines its nature and source.
+ *   - 'http': Indicates the error is related to HTTP operations.
+ *   - 'network': Indicates the error occurred due to network issues.
+ *   - 'request-validation': Represents errors that occurred during request validation.
+ *   - 'response-validation': Represents errors that occurred during response validation.
+ *   - 'config': Pertains to errors associated with configuration issues.
+ */
+export interface IntrigErrorBase {
+  type: 'http' | 'network' | 'request-validation' | 'response-validation' | 'config';
+}
+
+/**
+ * Interface representing an HTTP-related error.
+ * Extends the \`IntrigErrorBase\` base interface to provide information specific to HTTP errors.
+ *
+ * @property type - The type identifier for the error, always set to 'http'.
+ * @property status - The HTTP status code associated with the error.
+ * @property url - The URL that caused the error.
+ * @property method - The HTTP method used in the request that resulted in the error.
+ * @property headers - Optional. The HTTP headers relevant to the request and/or response, represented as a record of key-value pairs.
+ * @property body - Optional. The parsed body of the server error, if available.
+ */
+export interface HttpError extends IntrigErrorBase {
+  type: 'http';
+  status: number;
+  url: string;
+  method: string;
+  headers?: RawAxiosResponseHeaders | AxiosResponseHeaders;
+  body?: unknown; // parsed server error body if any
+}
+
+/**
+ * Determines if the given error is an HTTP error.
+ *
+ * @param {IntrigError} error - The error object to check.
+ * @return {boolean} Returns true if the error is an instance of HttpError; otherwise, false.
+ */
+export function isHttpError(error: IntrigError): error is HttpError {
+  return error.type === 'http';
+}
+
+/**
+ * Creates an object representing an HTTP error.
+ *
+ * @param {number} status - The HTTP status code of the error.
+ * @param {string} url - The URL associated with the HTTP error.
+ * @param {string} method - The HTTP method that resulted in the error.
+ * @param {Record<string, string | string[] | undefined>} [headers] - Optional headers involved in the HTTP error.
+ * @param {unknown} [body] - Optional body data related to the HTTP error.
+ * @return {HttpError} An object encapsulating details about the HTTP error.
+ */
+export function httpError(
+  status: number,
+  url: string,
+  method: string,
+  headers?: RawAxiosResponseHeaders | AxiosResponseHeaders,
+  body?: unknown
+): HttpError {
+  return {
+    type: 'http',
+    status,
+    url,
+    method,
+    headers,
+    body
+  };
+}
+
+/**
+ * Represents a network-related error. This error type is used to indicate issues during network operations.
+ * Extends the base error functionality from IntrigErrorBase.
+ *
+ * Properties:
+ * - \`type\`: Specifies the type of error as 'network'.
+ * - \`reason\`: Indicates the specific reason for the network error. Possible values include:
+ *   - 'timeout': Occurs when the network request times out.
+ *   - 'dns': Represents DNS resolution issues.
+ *   - 'offline': Indicates the device is offline or has no network connectivity.
+ *   - 'aborted': The network request was aborted.
+ *   - 'unknown': An unspecified network issue occurred.
+ * - \`request\`: Optional property representing the network request that caused the error. Its structure can vary depending on the implementation context.
+ */
+export interface NetworkError extends IntrigErrorBase {
+  type: 'network';
+  reason: 'timeout' | 'dns' | 'offline' | 'aborted' | 'unknown';
+  request?: any;
+}
+
+/**
+ * Determines if the provided error is of type NetworkError.
+ *
+ * @param {IntrigError} error - The error object to be checked.
+ * @return {boolean} Returns true if the error is of type NetworkError, otherwise false.
+ */
+export function isNetworkError(error: IntrigError): error is NetworkError {
+  return error.type === 'network';
+}
+
+/**
+ * Creates a network error object with the specified reason and optional request details.
+ *
+ * @param {'timeout' | 'dns' | 'offline' | 'aborted' | 'unknown'} reason - The reason for the network error.
+ * @param {any} [request] - Optional information about the network request that caused the error.
+ * @return {NetworkError} An object representing the network error.
+ */
+export function networkError(
+  reason: 'timeout' | 'dns' | 'offline' | 'aborted' | 'unknown',
+  request?: any,
+): NetworkError {
+  return {
+    type: 'network',
+    reason,
+    request,
+  };
+}
+
+/**
+ * Represents an error that occurs during request validation.
+ *
+ * This interface extends the \`IntrigErrorBase\` to provide
+ * additional details about validation errors in the request.
+ *
+ * \`RequestValidationError\` includes a specific error type
+ * identifier, details about the validation error, and information
+ * about the fields that failed validation.
+ *
+ * The \`type\` property indicates the error type as 'request-validation'.
+ * The \`error\` property holds the ZodError object with detailed validation
+ * errors from the Zod library.
+ * The \`fieldErrors\` property is a mapping of field names to an array
+ * of validation error messages for that field.
+ */
+export interface RequestValidationError extends IntrigErrorBase {
+  type: 'request-validation';
+  error: ZodError;
+}
+
+/**
+ * Checks if the given error is of type RequestValidationError.
+ *
+ * @param {IntrigError} error - The error object to be checked.
+ * @return {boolean} Returns true if the error is a RequestValidationError; otherwise, false.
+ */
+export function isRequestValidationError(error: IntrigError): error is RequestValidationError {
+  return error.type === 'request-validation';
+}
+
+/**
+ * Constructs a RequestValidationError object, capturing details about validation errors.
+ *
+ * @param {ZodError} error - The primary Zod validation error object containing detailed error information.
+ * @param {Record<string, string[]>} fieldErrors - An object mapping field names to arrays of validation error messages.
+ * @return {RequestValidationError} An object representing the request validation error, including the error type, detailed error, and field-specific errors.
+ */
+export function requestValidationError(
+  error: ZodError
+): RequestValidationError {
+  return {
+    type: 'request-validation',
+    error
+  };
+}
+
+/**
+ * Describes an error encountered during response validation, typically
+ * when the structure or content of a response does not meet the expected schema.
+ *
+ * This interface extends the \`IntrigErrorBase\` to provide additional
+ * details specific to validation issues.
+ *
+ * The \`type\` property is a discriminative field, always set to 'response-validation',
+ * for identifying this specific kind of error.
+ *
+ * The \`error\` property contains a \`ZodError\` object, which provides structured
+ * details about the validation failure, including paths and specific issues.
+ *
+ * The optional \`raw\` property may hold the unprocessed or unparsed response data,
+ * which can be useful for debugging and troubleshooting.
+ */
+export interface ResponseValidationError extends IntrigErrorBase {
+  type: 'response-validation';
+  error: ZodError;
+  // optional: raw/unparsed response for troubleshooting
+  raw?: unknown;
+}
+
+/**
+ * Determines if the provided error is of type ResponseValidationError.
+ *
+ * @param {IntrigError} error - The error object to be evaluated.
+ * @return {boolean} Returns true if the error is a ResponseValidationError, otherwise false.
+ */
+export function isResponseValidationError(error: IntrigError): error is ResponseValidationError {
+  return error.type === 'response-validation';
+}
+
+/**
+ * Constructs a ResponseValidationError object to represent a response validation failure.
+ *
+ * @param {ZodError} error - The error object representing the validation issue.
+ * @param {unknown} [raw] - Optional raw data related to the validation error.
+ * @return {ResponseValidationError} An object containing the type of error, the validation error object, and optional raw data.
+ */
+export function responseValidationError(
+  error: ZodError,
+  raw?: unknown,
+): ResponseValidationError {
+  return {
+    type: 'response-validation',
+    error,
+    raw,
+  };
+}
+
+/**
+ * Represents an error related to configuration issues.
+ * ConfigError is an extension of IntrigErrorBase, designed specifically
+ * to handle and provide details about errors encountered in application
+ * configuration.
+ *
+ * @interface ConfigError
+ * @extends IntrigErrorBase
+ *
+ * @property type - Identifies the error type as 'config'.
+ * @property message - Describes the details of the configuration error encountered.
+ */
+export interface ConfigError extends IntrigErrorBase {
+  type: 'config';
+  message: string;
+}
+
+/**
+ * Determines if the provided error is a configuration error.
+ *
+ * @param {IntrigError} error - The error object to be checked.
+ * @return {boolean} Returns true if the error is of type 'ConfigError', otherwise false.
+ */
+export function isConfigError(error: IntrigError): error is ConfigError {
+  return error.type === 'config';
+}
+
+/**
+ * Generates a configuration error object with a specified error message.
+ *
+ * @param {string} message - The error message to be associated with the configuration error.
+ * @return {ConfigError} The configuration error object containing the error type and message.
+ */
+export function configError(message: string): ConfigError {
+  return {
+    type: 'config',
+    message,
+  };
+}
+
+/**
+ * Represents a union type for errors that may occur while handling HTTP requests,
+ * network operations, request and response validations, or configuration issues.
+ *
+ * This type encompasses various error types to provide a unified representation
+ * for different error scenarios during the execution of a program.
+ *
+ * Types:
+ * - HttpError: Represents an error occurred in HTTP responses.
+ * - NetworkError: Represents an error related to underlying network operations.
+ * - RequestValidationError: Represents an error in request validation logic.
+ * - ResponseValidationError: Represents an error in response validation logic.
+ * - ConfigError: Represents an error related to configuration issues.
+ */
+export type IntrigError =
+  | HttpError
+  | NetworkError
+  | RequestValidationError
+  | ResponseValidationError
+  | ConfigError;
+
+/**
+ * Represents an error state with additional contextual information.
+ *
+ * @typedef {Object} ErrorWithContext
+ * @template T
+ * @extends ErrorState<T>
+ *
+ * @property {string} source - The origin of the error.
+ * @property {string} operation - The operation being performed when the error occurred.
+ * @property {string} key - A unique key identifying the specific error instance.
+ */
+export interface ErrorWithContext<T = unknown>
+  extends ErrorState<T> {
+  source: string;
+  operation: string;
+  key: string;
+}
+
+/**
+ * Represents an action in the network context.
+ *
+ * @template T - The type of data associated with the network action
+ *
+ * @property {NetworkState<any>} state - The current state of the network action
+ * @property {string} key - The unique identifier for the network action
+ */
+export interface NetworkAction<T> {
+  key: string;
+  source: string;
+  operation: string;
+  state: NetworkState<T>;
+  handled?: boolean;
+}
+
+type HookWithKey = {
+  key: string;
+};
+
+export type UnitHookOptions =
+  | { key?: string; fetchOnMount?: false; clearOnUnmount?: boolean }
+  | {
+      key?: string;
+      fetchOnMount: true;
+      params?: Record<string, any>;
+      clearOnUnmount?: boolean;
+    };
+export type UnitHook = ((
+  options: UnitHookOptions,
+) => [
+  NetworkState<never>,
+  (params?: Record<string, any>) => DispatchState<any>,
+  () => void,
+]) &
+  HookWithKey;
+export type ConstantHook<T> = ((
+  options: UnitHookOptions,
+) => [
+  NetworkState<T>,
+  (params?: Record<string, any>) => DispatchState<any>,
+  () => void,
+]) &
+  HookWithKey;
+
+export type UnaryHookOptions<P> =
+  | { key?: string; fetchOnMount?: false; clearOnUnmount?: boolean }
+  | { key?: string; fetchOnMount: true; params: P; clearOnUnmount?: boolean };
+export type UnaryProduceHook<P> = ((
+  options?: UnaryHookOptions<P>,
+) => [NetworkState<never>, (params: P) => DispatchState<any>, () => void]) &
+  HookWithKey;
+export type UnaryFunctionHook<P, T> = ((
+  options?: UnaryHookOptions<P>,
+) => [NetworkState<T>, (params: P) => DispatchState<any>, () => void]) &
+  HookWithKey;
+
+export type BinaryHookOptions<P, B> =
+  | { key?: string; fetchOnMount?: false; clearOnUnmount?: boolean }
+  | {
+      key?: string;
+      fetchOnMount: true;
+      params: P;
+      body: B;
+      clearOnUnmount?: boolean;
+    };
+export type BinaryProduceHook<P, B> = ((
+  options?: BinaryHookOptions<P, B>,
+) => [
+  NetworkState<never>,
+  (body: B, params: P) => DispatchState<any>,
+  () => void,
+]) &
+  HookWithKey;
+export type BinaryFunctionHook<P, B, T> = ((
+  options?: BinaryHookOptions<P, B>,
+) => [
+  NetworkState<T>,
+  (body: B, params: P) => DispatchState<any>,
+  () => void,
+]) &
+  HookWithKey;
+
+export type IntrigHookOptions<P = undefined, B = undefined> =
+  | UnitHookOptions
+  | UnaryHookOptions<P>
+  | BinaryHookOptions<P, B>;
+export type IntrigHook<P = undefined, B = undefined, T = any> =
+  | UnitHook
+  | ConstantHook<T>
+  | UnaryProduceHook<P>
+  | UnaryFunctionHook<P, T>
+  | BinaryProduceHook<P, B>
+  | BinaryFunctionHook<P, B, T>;
+
+export interface AsyncRequestOptions {
+  hydrate?: boolean;
+  key?: string;
+}
+
+// Async hook variants for transient (promise-returning) network requests
+
+export type UnaryFunctionAsyncHook<P, T> = (() => [
+  (params: P) => Promise<T>,
+  () => void,
+]) & {
+  key: string;
+};
+
+export type BinaryFunctionAsyncHook<P, B, T> = (() => [
+  (body: B, params: P) => Promise<T>,
+  () => void,
+]) & {
+  key: string;
+};
+
+export type UnaryProduceAsyncHook<P> = (() => [
+  (params: P) => Promise<void>,
+  () => void,
+]) & {
+  key: string;
+};
+
+export type BinaryProduceAsyncHook<P, B> = (() => [
+  (body: B, params: P) => Promise<void>,
+  () => void,
+]) & {
+  key: string;
+};
+
+/**
+ * Represents the dispatch state of a process.
+ *
+ * @template T The type of the state information.
+ * @interface
+ *
+ * @property {string} state The current state of the dispatch process.
+ */
+export interface DispatchState<T> {
+  state: string;
+}
+
+/**
+ * Represents a successful dispatch state.
+ *
+ * @template T - Type of the data associated with the dispatch.
+ *
+ * @extends DispatchState<T>
+ *
+ * @property {string} state - The state of the dispatch, always 'success'.
+ */
+export interface SuccessfulDispatch<T> extends DispatchState<T> {
+  state: 'success';
+}
+
+/**
+ * Indicates a successful dispatch state.
+ *
+ * @return {DispatchState<T>} An object representing a successful state.
+ */
+export function successfulDispatch<T>(): DispatchState<T> {
+  return {
+    state: 'success',
+  };
+}
+
+/**
+ * Determines if the provided dispatch state represents a successful dispatch.
+ *
+ * @param {DispatchState<T>} value - The dispatch state to check.
+ * @return {value is SuccessfulDispatch<T>} - True if the dispatch state indicates success, false otherwise.
+ */
+export function isSuccessfulDispatch<T>(
+  value: DispatchState<T>,
+): value is SuccessfulDispatch<T> {
+  return value.state === 'success';
+}
+
+/**
+ * ValidationError interface represents a specific type of dispatch state
+ * where a validation error has occurred.
+ *
+ * @typeparam T - The type of the data associated with this dispatch state.
+ */
+export interface ValidationError<T> extends DispatchState<T> {
+  state: 'validation-error';
+  error: any;
+}
+
+/**
+ * Generates a ValidationError object.
+ *
+ * @param error The error details that caused the validation to fail.
+ * @return The ValidationError object containing the error state and details.
+ */
+export function validationError<T>(error: any): ValidationError<T> {
+  return {
+    state: 'validation-error',
+    error,
+  };
+}
+
+/**
+ * Determines if a provided DispatchState object is a ValidationError.
+ *
+ * @param {DispatchState<T>} value - The DispatchState object to evaluate.
+ * @return {boolean} - Returns true if the provided DispatchState object is a ValidationError, otherwise returns false.
+ */
+export function isValidationError<T>(
+  value: DispatchState<T>,
+): value is ValidationError<T> {
+  return value.state === 'validation-error';
+}
+
+  `;
+}
+
+function contextTemplate(apisToSync) {
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "intrig-context.ts"));
+    const configType = `{
+  defaults?: DefaultConfigs,
+  ${apisToSync.map((a)=>`${a.id}?: DefaultConfigs`).join(",\n  ")}
+  }`;
+    return ts`
+import { NetworkAction, NetworkState } from '@intrig/react/network-state';
+import { AxiosProgressEvent, AxiosRequestConfig } from 'axios';
+import { ZodSchema, ZodType, ZodTypeDef } from 'zod';
+import { createContext, useContext, Dispatch } from 'react';
+import { DefaultConfigs } from './interfaces';
+
+type GlobalState = Record<string, NetworkState>;
+
+interface RequestType<T = any> extends AxiosRequestConfig {
+  originalData?: T; // Keeps track of the original data type.
+  key: string;
+  source: string
+}
+
+export type SchemaOf<T> = ZodType<T, ZodTypeDef, any>;
+
+/**
+ * Defines the ContextType interface for managing global state, dispatching actions,
+ * and holding a collection of Axios instances.
+ *
+ * @interface ContextType
+ * @property {GlobalState} state - The global state of the application.
+ * @property {Dispatch<NetworkAction<unknown>>} dispatch - The dispatch function to send network actions.
+ * @property {Record<string, AxiosInstance>} axios - A record of Axios instances for making HTTP requests.
+ */
+export interface ContextType {
+  state: GlobalState;
+  filteredState: GlobalState;
+  dispatch: Dispatch<NetworkAction<unknown>>;
+  configs: ${configType};
+  execute: <T>(request: RequestType, dispatch: (state: NetworkState<T>) => void, schema: SchemaOf<T> | undefined, errorSchema: SchemaOf<T> | undefined) => Promise<void>;
+}
+
+/**
+ * Context object created using \`createContext\` function. Provides a way to share state, dispatch functions,
+ * and axios instance across components without having to pass props down manually at every level.
+ *
+ * @type {ContextType}
+ */
+const Context = createContext<ContextType>({
+  state: {},
+  filteredState: {},
+  dispatch() {
+    //intentionally left blank
+  },
+  configs: {},
+  async execute() {
+    //intentionally left blank
+  },
+});
+
+export function useIntrigContext() {
+  return useContext(Context);
+}
+
+export {
+  Context,
+  GlobalState,
+  RequestType,
+}
+`;
+}
+
+function reactLoggerTemplate() {
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', 'logger.ts'));
+    return ts`
+// logger.ts
+
+import log, { LogLevelDesc } from 'loglevel';
+
+// Extend the global interfaces
+declare global {
+  interface Window {
+    setLogLevel?: (level: LogLevelDesc) => void;
+  }
+}
+
+// 1) Build-time default via Vite (if available)
+//    Cast import.meta to any to avoid TS errors if env isn't typed
+const buildDefault =
+  typeof import.meta !== 'undefined'
+    ? ((import.meta as any).env?.VITE_LOG_LEVEL as string | undefined)
+    : undefined;
+
+// 2) Stored default in localStorage
+const storedLevel =
+  typeof localStorage !== 'undefined'
+    ? (localStorage.getItem('LOG_LEVEL') as string | null)
+    : null;
+
+// Determine initial log level: build-time → stored → 'error'
+const defaultLevel: LogLevelDesc =
+  (buildDefault as LogLevelDesc) ?? (storedLevel as LogLevelDesc) ?? 'error';
+
+// Apply initial level
+log.setLevel(defaultLevel);
+
+// Expose a console setter to change level at runtime
+if (typeof window !== 'undefined') {
+  window.setLogLevel = (level: LogLevelDesc): void => {
+    log.setLevel(level);
+    try {
+      localStorage.setItem('LOG_LEVEL', String(level));
+    } catch {
+      // ignore if storage is unavailable
+    }
+    console.log(\`✏️  loglevel set to '\${level}'\`);
+  };
+}
+
+// Consistent wrapper API
+export const logger = {
+  info: (msg: unknown, meta?: unknown): void =>
+    meta ? log.info(msg, meta) : log.info(msg),
+  warn: (msg: unknown, meta?: unknown): void =>
+    meta ? log.warn(msg, meta) : log.warn(msg),
+  error: (msg: unknown, meta?: unknown): void =>
+    meta ? log.error(msg, meta) : log.error(msg),
+  debug: (msg: unknown, meta?: unknown): void =>
+    meta ? log.debug(msg, meta) : log.debug(msg),
+};
+
+export default logger;
+
+`;
+}
+
+function reactExtraTemplate() {
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "extra.ts"));
+    return ts`import {
+  BinaryFunctionHook,
+  BinaryHookOptions,
+  BinaryProduceHook,
+  ConstantHook,
+  error,
+  init,
+  IntrigHook,
+  IntrigHookOptions,
+  isSuccess,
+  NetworkState,
+  pending,
+  success,
+  UnaryFunctionHook,
+  UnaryHookOptions,
+  UnaryProduceHook,
+  UnitHook,
+  UnitHookOptions,
+} from '@intrig/react/network-state';
+import {
+  useCallback,
+  useEffect,
+  useId,
+  useMemo,
+  useState,
+} from 'react';
+import { useIntrigContext } from '@intrig/react/intrig-context';
+
+/**
+ * A custom hook that manages and returns the network state of a promise-based function,
+ * providing a way to execute the function and clear its state.
+ *
+ * @param fn The promise-based function whose network state is to be managed. It should be a function that returns a promise.
+ * @param key An optional identifier for the network state. Defaults to 'default'.
+ * @return A tuple containing the current network state, a function to execute the promise, and a function to clear the state.
+ */
+export function useAsNetworkState<T, F extends (...args: any) => Promise<T>>(
+  fn: F,
+  options: any = {},
+): [NetworkState<T>, (...params: Parameters<F>) => void, () => void] {
+  const id = useId();
+
+  const context = useIntrigContext();
+
+  const key = options.key ?? 'default';
+
+  const networkState = useMemo(() => {
+    return context.state?.[${"`promiseState:${id}:${key}}`"}] ?? init();
+  }, [context.state?.[${"`promiseState:${id}:${key}}`"}]]);
+
+  const dispatch = useCallback(
+    (state: NetworkState<T>) => {
+      context.dispatch({ key, operation: id, source: 'promiseState', state });
+    },
+    [key, context.dispatch],
+  );
+
+  const execute = useCallback((...args: any[]) => {
+    dispatch(pending());
+    return fn(...args).then(
+      (data) => {
+        dispatch(success(data));
+      },
+      (e) => {
+        dispatch(error(e));
+      },
+    );
+  }, []);
+
+  const clear = useCallback(() => {
+    dispatch(init());
+  }, []);
+
+  return [networkState, execute, clear];
+}
+
+/**
+ * A custom hook that resolves the value from the provided hook's state and updates it whenever the state changes.
+ *
+ * @param {IntrigHook<P, B, T>} hook - The hook that provides the state to observe and resolve data from.
+ * @param options
+ * @return {T | undefined} The resolved value from the hook's state or undefined if the state is not successful.
+ */
+export function useResolvedValue(
+  hook: UnitHook,
+  options: UnitHookOptions,
+): undefined;
+
+export function useResolvedValue<T>(
+  hook: ConstantHook<T>,
+  options: UnitHookOptions,
+): T | undefined;
+
+export function useResolvedValue<P>(
+  hook: UnaryProduceHook<P>,
+  options: UnaryHookOptions<P>,
+): undefined;
+
+export function useResolvedValue<P, T>(
+  hook: UnaryFunctionHook<P, T>,
+  options: UnaryHookOptions<P>,
+): T | undefined;
+
+export function useResolvedValue<P, B>(
+  hook: BinaryProduceHook<P, B>,
+  options: BinaryHookOptions<P, B>,
+): undefined;
+
+export function useResolvedValue<P, B, T>(
+  hook: BinaryFunctionHook<P, B, T>,
+  options: BinaryHookOptions<P, B>,
+): T | undefined;
+
+// **Implementation**
+export function useResolvedValue<P, B, T>(
+  hook: IntrigHook<P, B, T>,
+  options: IntrigHookOptions<P, B>,
+): T | undefined {
+  const [value, setValue] = useState<T | undefined>();
+
+  const [state] = hook(options as any); // Ensure compatibility with different hook types
+
+  useEffect(() => {
+    if (isSuccess(state)) {
+      setValue(state.data);
+    } else {
+      setValue(undefined);
+    }
+  }, [state]);
+
+  return value;
+}
+
+/**
+ * A custom hook that resolves and caches the value from a successful state provided by the given hook.
+ * The state is updated only when it is in a successful state.
+ *
+ * @param {IntrigHook<P, B, T>} hook - The hook that provides the state to observe and cache data from.
+ * @param options
+ * @return {T | undefined} The cached value from the hook's state or undefined if the state is not successful.
+ */
+export function useResolvedCachedValue(
+  hook: UnitHook,
+  options: UnitHookOptions,
+): undefined;
+
+export function useResolvedCachedValue<T>(
+  hook: ConstantHook<T>,
+  options: UnitHookOptions,
+): T | undefined;
+
+export function useResolvedCachedValue<P>(
+  hook: UnaryProduceHook<P>,
+  options: UnaryHookOptions<P>,
+): undefined;
+
+export function useResolvedCachedValue<P, T>(
+  hook: UnaryFunctionHook<P, T>,
+  options: UnaryHookOptions<P>,
+): T | undefined;
+
+export function useResolvedCachedValue<P, B>(
+  hook: BinaryProduceHook<P, B>,
+  options: BinaryHookOptions<P, B>,
+): undefined;
+
+export function useResolvedCachedValue<P, B, T>(
+  hook: BinaryFunctionHook<P, B, T>,
+  options: BinaryHookOptions<P, B>,
+): T | undefined;
+
+// **Implementation**
+export function useResolvedCachedValue<P, B, T>(
+  hook: IntrigHook<P, B, T>,
+  options: IntrigHookOptions<P, B>,
+): T | undefined {
+  const [cachedValue, setCachedValue] = useState<T | undefined>();
+
+  const [state] = hook(options as any); // Ensure compatibility with different hook types
+
+  useEffect(() => {
+    if (isSuccess(state)) {
+      setCachedValue(state.data);
+    }
+    // Do not clear cached value if state is unsuccessful
+  }, [state]);
+
+  return cachedValue;
+}
+
+`;
+}
+
+function reactMediaTypeUtilsTemplate() {
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "media-type-utils.ts"));
+    return ts`
+import { ZodSchema } from 'zod';
+import { XMLParser } from 'fast-xml-parser';
+type EncodersSync = {
+  [k: string]: <T>(request: T,
+                   mediaType: string,
+                   schema: ZodSchema) => any;
+};
+
+const encoders: EncodersSync = {};
+
+export function encode<T>(request: T, mediaType: string, schema: ZodSchema) {
+  if (encoders[mediaType]) {
+    return encoders[mediaType](request, mediaType, schema);
+  }
+  return request;
+}
+
+encoders['application/json'] = (request, mediaType, schema) => {
+  return request;
+}
+
+function appendFormData(
+  formData: FormData,
+  data: any,
+  parentKey: string
+): void {
+  if (data instanceof Blob || typeof data === 'string') {
+    formData.append(parentKey, data);
+  } else if (data !== null && typeof data === 'object') {
+    if (Array.isArray(data)) {
+      data.forEach((item: any, index: number) => {
+        const key = ${"`${parentKey}`"};
+        appendFormData(formData, item, key);
+      });
+    } else {
+      Object.keys(data).forEach((key: string) => {
+        const newKey = parentKey ? ${"`${parentKey}[${key}]`"} : key;
+        appendFormData(formData, data[key], newKey);
+      });
+    }
+  } else {
+    formData.append(parentKey, data == null ? '' : String(data));
+  }
+}
+
+encoders['multipart/form-data'] = (request, mediaType, schema) => {
+  const _request = request as Record<string, any>;
+  const formData = new FormData();
+  Object.keys(_request).forEach((key: string) => {
+    appendFormData(formData, _request[key], key);
+  });
+  return formData;
+}
+
+encoders['application/octet-stream'] = (request, mediaType, schema) => {
+  return request;
+}
+
+encoders['application/x-www-form-urlencoded'] = (request, mediaType, schema) => {
+  const formData = new FormData();
+  for (const key in request) {
+    const value = request[key];
+    formData.append(key, value instanceof Blob || typeof value === 'string' ? value : String(value));
+  }
+  return formData;
+}
+
+type Transformers = {
+  [k: string]: <T>(
+    request: Request,
+    mediaType: string,
+    schema: ZodSchema
+  ) => Promise<T>;
+};
+
+const transformers: Transformers = {};
+
+export function transform<T>(
+  request: Request,
+  mediaType: string,
+  schema: ZodSchema
+): Promise<T> {
+  if (transformers[mediaType]) {
+    return transformers[mediaType](request, mediaType, schema);
+  }
+  throw new Error(\`Unsupported media type: \` + mediaType);
+}
+
+transformers['application/json'] = async (request, mediaType, schema) => {
+  return schema.parse(await request.json());
+};
+
+transformers['multipart/form-data'] = async (request, mediaType, schema) => {
+  const formData = await request.formData();
+  const content: Record<string, any> = {};
+  formData.forEach((value, key) => {
+    if (content[key]) {
+      if (!(content[key] instanceof Array)) {
+        content[key] = [content[key]];
+      }
+      content[key].push(value);
+    } else {
+      content[key] = value
+    }
+  });
+  return schema.parse(content);
+};
+
+transformers['application/octet-stream'] = async (
+  request,
+  mediaType,
+  schema
+) => {
+  return schema.parse(
+    new Blob([await request.arrayBuffer()], {
+      type: 'application/octet-stream',
+    })
+  );
+};
+
+transformers['application/x-www-form-urlencoded'] = async (
+  request,
+  mediaType,
+  schema
+) => {
+  const formData = await request.formData();
+  const content: Record<string, any> = {};
+  formData.forEach((value, key) => (content[key] = value));
+  return schema.parse(content);
+};
+
+transformers['application/xml'] = async (request, mediaType, schema) => {
+  const xmlParser = new XMLParser();
+  const content = await xmlParser.parse(await request.text());
+  return schema.parse(await content);
+};
+
+transformers['text/plain'] = async (request, mediaType, schema) => {
+  return schema.parse(await request.text());
+};
+
+transformers['text/html'] = async (request, mediaType, schema) => {
+  return schema.parse(await request.text());
+};
+
+transformers['text/css'] = async (request, mediaType, schema) => {
+  return schema.parse(await request.text());
+};
+
+transformers['text/javascript'] = async (request, mediaType, schema) => {
+  return schema.parse(await request.text());
+};
+
+type ResponseTransformers = {
+  [k: string]: <T>(
+    data: any,
+    mediaType: string,
+    schema: ZodSchema
+  ) => Promise<T>;
+};
+
+const responseTransformers: ResponseTransformers = {};
+
+responseTransformers['application/json'] = async (data, mediaType, schema) => {
+  return schema.parse(data);
+};
+
+responseTransformers['application/xml'] = async (data, mediaType, schema) => {
+  const parsed = new XMLParser().parse(data);
+  return schema.parse(parsed);
+}
+
+export async function transformResponse<T>(
+  data: any,
+  mediaType: string,
+  schema: ZodSchema
+): Promise<T> {
+  if (responseTransformers[mediaType]) {
+    return await responseTransformers[mediaType](data, mediaType, schema);
+  }
+  return data
+}
+  `;
+}
+
+function typeUtilsTemplate() {
+    const ts = pluginSdk.typescript(path.resolve('src', 'type-utils.ts'));
+    return ts`import { z } from 'zod';
+
+export type BinaryData = Blob;
+export const BinaryDataSchema: z.ZodType<BinaryData> = z.instanceof(Blob);
+
+// Base64 helpers (browser + Node compatible; no Buffer required)
+export function base64ToUint8Array(b64: string): Uint8Array {
+  if (typeof atob === 'function') {
+    // Browser
+    const bin = atob(b64);
+    const bytes = new Uint8Array(bin.length);
+    for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i);
+    return bytes;
+  } else {
+    // Node
+    const buf = Buffer.from(b64, 'base64');
+    return new Uint8Array(buf.buffer, buf.byteOffset, buf.byteLength);
+  }
+}
+
+  `;
+}
+
+function reactTsConfigTemplate() {
+    const json = pluginSdk.jsonLiteral(path__namespace.resolve('tsconfig.json'));
+    return json`
+{
+  "compilerOptions": {
+    "target": "es2020",
+    "module": "ESNext",
+    "declaration": true,
+    "outDir": "./dist",
+    "strict": true,
+    "esModuleInterop": true,
+    "noImplicitAny": false,
+    "moduleResolution": "node",
+    "baseUrl": "./",
+    "paths": {
+      "@intrig/react": [
+        "./src"
+      ],
+      "@intrig/react/*": [
+        "./src/*"
+      ],
+      "intrig-hook": ["src/config/intrig"]
+    },
+    "jsx": "react-jsx",
+    "skipLibCheck": true
+  },
+  "exclude": [
+    "node_modules",
+    "../../node_modules",
+    "**/__tests__/*"
+  ]
+}
+  `;
+}
+
+function reactSwcrcTemplate() {
+    const json = pluginSdk.jsonLiteral(path__namespace.resolve('.swcrc'));
+    return json`
+{
+  "jsc": {
+    "parser": {
+      "syntax": "typescript",
+      "decorators": false,
+      "dynamicImport": true
+    },
+    "target": "es2022",
+    "externalHelpers": false
+  },
+  "module": {
+    "type": "es6",
+    "noInterop": false
+  },
+  "sourceMaps": true,  
+  "exclude": ["../../node_modules"]
+}
+  `;
+}
+
+function intrigMiddlewareTemplate() {
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', 'intrig-middleware.ts'));
+    return ts`
+import axios from 'axios';
+import { requestInterceptor } from 'intrig-hook';
+
+export function getAxiosInstance(key: string) {
+  let axiosInstance = axios.create({
+    baseURL: process.env[${"`${key.toUpperCase()}_API_URL`"}],
+  });
+
+  axiosInstance.interceptors.request.use(requestInterceptor);
+
+  return axiosInstance;
+}
+`;
+}
+
+function flushSyncUtilTemplate(ctx) {
+    var _packageJson_dependencies, _packageJson_devDependencies, _packageJson_peerDependencies;
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', 'utils', 'flush-sync.ts'));
+    var _ctx_rootDir;
+    const projectDir = (_ctx_rootDir = ctx.rootDir) != null ? _ctx_rootDir : process.cwd();
+    const packageJson = fsx__namespace.readJsonSync(path__namespace.resolve(projectDir, 'package.json'));
+    // Check if react-dom is available at generation time
+    const hasReactDom = !!(((_packageJson_dependencies = packageJson.dependencies) == null ? void 0 : _packageJson_dependencies['react-dom']) || ((_packageJson_devDependencies = packageJson.devDependencies) == null ? void 0 : _packageJson_devDependencies['react-dom']) || ((_packageJson_peerDependencies = packageJson.peerDependencies) == null ? void 0 : _packageJson_peerDependencies['react-dom']));
+    if (hasReactDom) {
+        // Generate DOM-compatible version
+        return ts`/**
+ * Platform-compatible flushSync utility
+ * 
+ * This utility provides flushSync functionality for React DOM environments.
+ * Uses the native flushSync from react-dom for synchronous updates.
+ */
+
+import { flushSync as reactDomFlushSync } from 'react-dom';
+
+/**
+ * Cross-platform flushSync implementation
+ * 
+ * Forces React to flush any pending updates synchronously.
+ * Uses react-dom's native flushSync implementation.
+ * 
+ * @param callback - The callback to execute synchronously
+ */
+export const flushSync = reactDomFlushSync;
+
+/**
+ * Check if we're running in a DOM environment
+ * Always true when react-dom is available
+ */
+export const isDOMEnvironment = true;
+`;
+    } else {
+        // Generate React Native/non-DOM version
+        return ts`/**
+ * Platform-compatible flushSync utility
+ * 
+ * This utility provides flushSync functionality for React Native and other non-DOM environments.
+ * In React Native, we don't have the same concurrent rendering concerns,
+ * so we execute the callback immediately.
+ */
+
+/**
+ * Cross-platform flushSync implementation
+ * 
+ * Forces React to flush any pending updates synchronously.
+ * In React Native, executes the callback immediately.
+ * 
+ * @param callback - The callback to execute synchronously
+ */
+export const flushSync = (callback: () => void) => {
+  callback();
+};
+
+/**
+ * Check if we're running in a DOM environment
+ * Always false when react-dom is not available
+ */
+export const isDOMEnvironment = false;
+`;
+    }
+}
+
+function providerMainTemplate(apisToSync) {
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "intrig-provider-main.tsx"));
+    return ts`// Re-export all provider functionality from modular templates
+export * from './interfaces';
+export * from './reducer';
+export * from './axios-config';
+export * from './intrig-provider';
+export * from './intrig-provider-stub';
+export * from './status-trap';
+export * from './provider-hooks';
+
+// Main provider exports for backward compatibility
+export { IntrigProvider } from './intrig-provider';
+export { IntrigProviderStub } from './intrig-provider-stub';
+export { StatusTrap } from './status-trap';
+
+export {
+  useNetworkState,
+  useTransitionCall,
+  useCentralError,
+  useCentralPendingState,
+} from './provider-hooks';
+
+export {
+  requestReducer,
+  inferNetworkReason,
+  debounce,
+} from './reducer';
+
+export {
+  createAxiosInstance,
+  createAxiosInstances,
+} from './axios-config';
+
+export type {
+  DefaultConfigs,
+  IntrigProviderProps,
+  IntrigProviderStubProps,
+  StatusTrapProps,
+  NetworkStateProps,
+  StubType,
+  WithStubSupport,
+} from './interfaces';
+  `;
+}
+
+function providerHooksTemplate() {
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "provider-hooks.ts"));
+    return ts`import React, {
+  useCallback,
+  useContext,
+  useMemo,
+  useState,
+  useRef,
+} from 'react';
+import {
+  ErrorState,
+  ErrorWithContext,
+  isSuccess,
+  isError,
+  isPending,
+  NetworkState,
+  pending,
+  Progress,
+  init,
+} from './network-state';
+import {
+  AxiosProgressEvent,
+} from 'axios';
+import { ZodSchema } from 'zod';
+import logger from './logger';
+
+import { Context, RequestType, SchemaOf } from './intrig-context';
+import { NetworkStateProps } from './interfaces';
+import { debounce } from './reducer';
+
+/**
+ * useNetworkState is a custom hook that manages the network state within the specified context.
+ * It handles making network requests, dispatching appropriate states based on the request lifecycle,
+ * and allows aborting ongoing requests.
+ */
+export function useNetworkState<T>({
+  key,
+  operation,
+  source,
+  schema,
+  errorSchema,
+  debounceDelay: requestDebounceDelay,
+}: NetworkStateProps<T>): [
+  NetworkState<T>,
+  (request: RequestType) => void,
+  () => void,
+  (state: NetworkState<T>) => void,
+] {
+  const context = useContext(Context);
+
+  const [abortController, setAbortController] = useState<AbortController>();
+
+  const networkState = useMemo(() => {
+    logger.info(${"`Updating status ${key} ${operation} ${source}`"});
+    logger.debug("<=", context.state?.[${"`${source}:${operation}:${key}`"}])
+    return (
+      (context.state?.[${"`${source}:${operation}:${key}`"}] as NetworkState<T>) ??
+      init()
+    );
+  }, [JSON.stringify(context.state?.[${"`${source}:${operation}:${key}`"}])]);
+
+  const dispatch = useCallback(
+    (state: NetworkState<T>) => {
+      context.dispatch({ key, operation, source, state });
+    },
+    [key, operation, source, context.dispatch],
+  );
+
+  const debounceDelay = useMemo(() => {
+    return (
+      requestDebounceDelay ?? context.configs?.[source as keyof (typeof context)['configs']]?.debounceDelay ?? 0
+    );
+  }, [context.configs, requestDebounceDelay, source]);
+
+  const execute = useCallback(
+    async (request: RequestType) => {
+      logger.info(${"`Executing request ${key} ${operation} ${source}`"});
+      logger.debug("=>", request)
+
+      const abortController = new AbortController();
+      setAbortController(abortController);
+
+      const requestConfig: RequestType = {
+        ...request,
+        onUploadProgress(event: AxiosProgressEvent) {
+          dispatch(
+            pending({
+              type: 'upload',
+              loaded: event.loaded,
+              total: event.total,
+            }),
+          );
+          request.onUploadProgress?.(event);
+        },
+        onDownloadProgress(event: AxiosProgressEvent) {
+          dispatch(
+            pending({
+              type: 'download',
+              loaded: event.loaded,
+              total: event.total,
+            }),
+          );
+          request.onDownloadProgress?.(event);
+        },
+        signal: abortController.signal,
+      };
+
+      await context.execute(
+        requestConfig,
+        dispatch,
+        schema,
+        errorSchema as any,
+      );
+    },
+    [networkState, context.dispatch],
+  );
+
+  const deboundedExecute = useMemo(
+    () => debounce(execute, debounceDelay ?? 0),
+    [execute],
+  );
+
+  const clear = useCallback(() => {
+    logger.info(${"`Clearing request ${key} ${operation} ${source}`"});
+    dispatch(init());
+    setAbortController((abortController) => {
+      logger.info(${"`Aborting request ${key} ${operation} ${source}`"});
+      abortController?.abort();
+      return undefined;
+    });
+  }, [dispatch, abortController]);
+
+  return [networkState, deboundedExecute, clear, dispatch];
+}
+
+/**
+ * A hook for making transient calls that can be aborted and validated against schemas.
+ */
+export function useTransitionCall<T>({
+  schema,
+  errorSchema,
+}: {
+  schema?: SchemaOf<T>;
+  errorSchema?: SchemaOf<T>;
+}): [(request: RequestType) => Promise<T>, () => void] {
+  const ctx = useContext(Context);
+  const controller = useRef<AbortController | undefined>(undefined);
+
+  const call = useCallback(
+    async (request: RequestType) => {
+      controller.current?.abort();
+      const abort = new AbortController();
+      controller.current = abort;
+
+      return new Promise<T>((resolve, reject) => {
+        ctx.execute(
+          { ...request, signal: abort.signal },
+          (state) => {
+            if (isSuccess(state)) {
+              resolve(state.data as T);
+            } else if (isError(state)) {
+              reject(state.error);
+            }
+          },
+          schema,
+          errorSchema,
+        );
+      });
+    },
+    [ctx, schema, errorSchema],
+  );
+
+  const abort = useCallback(() => {
+    controller.current?.abort();
+  }, []);
+
+  return [call, abort];
+}
+
+/**
+ * Handles central error extraction from the provided context.
+ * It filters the state to retain error states and maps them to a structured error object with additional context information.
+ * @return {Object[]} An array of objects representing the error states with context information such as source, operation, and key.
+ */
+export function useCentralError() {
+  const ctx = useContext(Context);
+
+  return useMemo(() => {
+    return Object.entries(ctx.filteredState as Record<string, NetworkState>)
+      .filter(([, state]) => isError(state))
+      .map(([k, state]) => {
+        const [source, operation, key] = k.split(':');
+        return {
+          ...(state as ErrorState<unknown>),
+          source,
+          operation,
+          key,
+        } satisfies ErrorWithContext;
+      });
+  }, [ctx.filteredState]);
+}
+
+/**
+ * Uses central pending state handling by aggregating pending states from context.
+ * It calculates the overall progress of pending states if any, or returns an initial state otherwise.
+ *
+ * @return {NetworkState} The aggregated network state based on the pending states and their progress.
+ */
+export function useCentralPendingState() {
+  const ctx = useContext(Context);
+
+  const result: NetworkState = useMemo(() => {
+    const pendingStates = Object.values(
+      ctx.filteredState as Record<string, NetworkState>,
+    ).filter(isPending);
+    if (!pendingStates.length) {
+      return init();
+    }
+
+    const progress = pendingStates
+      .filter((a) => a.progress)
+      .reduce(
+        (progress, current) => {
+          return {
+            total: progress.total + (current.progress?.total ?? 0),
+            loaded: progress.loaded + (current.progress?.loaded ?? 0),
+          };
+        },
+        { total: 0, loaded: 0 } satisfies Progress,
+      );
+    return pending(progress.total ? progress : undefined);
+  }, [ctx.filteredState]);
+
+  return result;
+}
+  `;
+}
+
+function providerInterfacesTemplate(apisToSync) {
+    const configType = `{
+  defaults?: DefaultConfigs,
+  ${apisToSync.map((a)=>`${a.id}?: DefaultConfigs`).join(",\n  ")}
+  }`;
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "interfaces.ts"));
+    return ts`import {
+  CreateAxiosDefaults,
+  InternalAxiosRequestConfig,
+  AxiosResponse,
+} from 'axios';
+import {
+  IntrigHook,
+  NetworkState,
+} from './network-state';
+import { SchemaOf } from './intrig-context';
+
+export interface DefaultConfigs extends CreateAxiosDefaults {
+  debounceDelay?: number;
+  requestInterceptor?: (
+    config: InternalAxiosRequestConfig,
+  ) => Promise<InternalAxiosRequestConfig>;
+  responseInterceptor?: (
+    config: AxiosResponse<any>,
+  ) => Promise<AxiosResponse<any>>;
+}
+
+export interface IntrigProviderProps {
+  configs?: ${configType};
+  children: React.ReactNode;
+}
+
+export interface StubType {
+  <P, B, T>(
+    hook: IntrigHook<P, B, T>,
+    fn: (
+      params: P,
+      body: B,
+      dispatch: (state: NetworkState<T>) => void,
+    ) => Promise<void>,
+  ): void;
+}
+
+export type WithStubSupport<T> = T & {
+  stubs?: (stub: StubType) => void;
+};
+
+export interface IntrigProviderStubProps {
+  configs?: ${configType};
+  stubs?: (stub: StubType) => void;
+  children: React.ReactNode;
+}
+
+export interface StatusTrapProps {
+  type: 'pending' | 'error' | 'pending + error';
+  propagate?: boolean;
+}
+
+export interface NetworkStateProps<T> {
+  key: string;
+  operation: string;
+  source: string;
+  schema?: SchemaOf<T>;
+  errorSchema?: SchemaOf<any>;
+  debounceDelay?: number;
+}
+  `;
+}
+
+function providerReducerTemplate() {
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "reducer.ts"));
+    return ts`import {
+  NetworkAction,
+} from './network-state';
+import { GlobalState } from './intrig-context';
+
+/**
+ * Handles state updates for network requests based on the provided action.
+ *
+ * @param {GlobalState} state - The current state of the application.
+ * @param {NetworkAction<unknown>} action - The action containing source, operation, key, and state.
+ * @return {GlobalState} - The updated state after applying the action.
+ */
+export function requestReducer(
+  state: GlobalState,
+  action: NetworkAction<unknown>,
+): GlobalState {
+  return {
+    ...state,
+    [${"`${action.source}:${action.operation}:${action.key}`"}]: action.state,
+  };
+}
+
+function inferNetworkReason(e: any): 'timeout' | 'dns' | 'offline' | 'aborted' | 'unknown' {
+  if (e?.code === 'ECONNABORTED') return 'timeout';
+  if (typeof navigator !== 'undefined' && navigator.onLine === false) return 'offline';
+  if (e?.name === 'AbortError') return 'aborted';
+  return 'unknown';
+}
+
+function debounce<T extends (...args: any[]) => void>(func: T, delay: number) {
+  let timeoutId: any;
+
+  return (...args: Parameters<T>) => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
+    }
+    timeoutId = setTimeout(() => {
+      func(...args);
+    }, delay);
+  };
+}
+
+export { inferNetworkReason, debounce };
+  `;
+}
+
+function providerAxiosConfigTemplate(apisToSync) {
+    const axiosConfigs = apisToSync.map((a)=>`
+  ${a.id}: createAxiosInstance(configs.defaults, configs['${a.id}']),
+  `).join("\n");
+    const ts = pluginSdk.typescript(path__namespace.resolve("src", "axios-config.ts"));
+    return ts`import axios, {
+  Axios,
+  AxiosResponse,
+  InternalAxiosRequestConfig,
+} from 'axios';
+import { DefaultConfigs } from './interfaces';
+
+export function createAxiosInstance(
+  defaultConfig?: DefaultConfigs,
+  config?: DefaultConfigs,
+) {
+  const axiosInstance = axios.create({
+    ...(defaultConfig ?? {}),
+    ...(config ?? {}),
+  });
+  
+  async function requestInterceptor(cfg: InternalAxiosRequestConfig) {
+    const intermediate = (await defaultConfig?.requestInterceptor?.(cfg)) ?? cfg;
+    return config?.requestInterceptor?.(intermediate) ?? intermediate;
+  }
+
+  async function responseInterceptor(cfg: AxiosResponse<any>) {
+    const intermediate = (await defaultConfig?.responseInterceptor?.(cfg)) ?? cfg;
+    return config?.responseInterceptor?.(intermediate) ?? intermediate;
+  }
+
+  axiosInstance.interceptors.request.use(requestInterceptor);
+  axiosInstance.interceptors.response.use(responseInterceptor, (error) => {
+    return Promise.reject(error);
+  });
+  return axiosInstance;
+}
+
+export function createAxiosInstances(configs: any): Record<string, Axios> {
+  return {
+    ${axiosConfigs}
+  };
+}
+  `;
+}
+
+function reactIntrigProviderTemplate(_apisToSync) {
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', 'intrig-provider.tsx'));
+    return ts`import React, { useMemo, useReducer } from 'react';
+import {
+  error,
+  NetworkState,
+  pending,
+  success,
+  responseValidationError,
+  configError,
+  httpError,
+  networkError,
+} from './network-state';
+import { Axios, AxiosResponse, isAxiosError } from 'axios';
+import { ZodError, ZodSchema } from 'zod';
+import { flushSync } from './utils/flush-sync';
+import { createParser } from 'eventsource-parser';
+
+import { Context, RequestType, GlobalState } from './intrig-context';
+import { IntrigProviderProps } from './interfaces';
+import { createAxiosInstances } from './axios-config';
+import { requestReducer, inferNetworkReason } from './reducer';
+
+/**
+ * IntrigProvider is a context provider component that sets up global state management
+ * and provides Axios instances for API requests.
+ */
+export function IntrigProvider({ children, configs = {} }: IntrigProviderProps) {
+  const [state, dispatch] = useReducer(requestReducer, {} as GlobalState);
+
+  const axiosInstances: Record<string, Axios> = useMemo(() => {
+    return createAxiosInstances(configs);
+  }, [configs]);
+
+  const contextValue = useMemo(() => {
+    async function execute<T>(
+      request: RequestType,
+      setState: (s: NetworkState<T>) => void,
+      schema?: ZodSchema<T>,          // success payload schema (optional)
+      errorSchema?: ZodSchema<any>,   // error-body schema for non-2xx (optional)
+    ) {
+      try {
+        setState(pending());
+
+        const axios = axiosInstances[request.source];
+        if (!axios) {
+          setState(error(configError(${"`Unknown axios source '${request.source}'`"})));
+          return;
+        }
+
+        const response = await axios.request(request);
+        const status  = response.status;
+        const method  = (response.config?.method || 'GET').toUpperCase();
+        const url     = response.config?.url || '';
+        const ctype   = String(response.headers?.['content-type'] || '');
+
+        // -------------------- 2xx branch --------------------
+        if (status >= 200 && status < 300) {
+          // SSE stream
+          if (ctype.includes('text/event-stream')) {
+            const reader  = response.data.getReader();
+            const decoder = new TextDecoder();
+
+            let lastMessage: any;
+
+            const parser = createParser({
+              onEvent(evt) {
+                let decoded: unknown = evt.data;
+
+                // Try JSON parse; if schema is defined, we require valid JSON for validation
+                try {
+                  let parsed: unknown = JSON.parse(String(decoded));
+                  if (schema) {
+                    const vr = schema.safeParse(parsed);
+                    if (!vr.success) {
+                      setState(error(responseValidationError(vr.error, parsed)));
+                      return;
+                    }
+                    parsed = vr.data;
+                  }
+                  decoded = parsed;
+                } catch (ignore) {
+                  if (schema) {
+                    // schema expects structured data but chunk wasn't JSON
+                    setState(error(responseValidationError(new ZodError([]), decoded)));
+                    return;
+                  }
+                  // if no schema, pass raw text
+                }
+
+                lastMessage = decoded;
+                flushSync(() => setState(pending(undefined, decoded as T)));
+              },
+            });
+
+            while (true) {
+              const { done, value } = await reader.read();
+              if (done) {
+                flushSync(() => setState(success(lastMessage as T, response.headers)));
+                break;
+              }
+              parser.feed(decoder.decode(value, { stream: true }));
+            }
+            return;
+          }
+
+          // Non-SSE: validate body if a schema is provided
+          if (schema) {
+            const parsed = schema.safeParse(response.data);
+            if (!parsed.success) {
+              setState(error(responseValidationError(parsed.error, response.data)));
+              return;
+            }
+            setState(success(parsed.data, response.headers));
+            return;
+          }
+
+          // No schema → pass through
+          setState(success(response.data as T, response.headers));
+          return;
+        }
+
+        // -------------------- non-2xx (HTTP error) --------------------
+        let errorBody: unknown = response.data;
+
+        if (errorSchema) {
+          const ev = errorSchema.safeParse(errorBody ?? {});
+          if (!ev.success) {
+            setState(error(responseValidationError(ev.error, errorBody)));
+            return;
+          }
+          errorBody = ev.data;
+        }
+
+        setState(error(httpError(status, url, method, response.headers, errorBody)));
+
+      } catch (e: any) {
+        // -------------------- thrown / transport --------------------
+        if (isAxiosError(e)) {
+          const status = e.response?.status;
+          const method = (e.config?.method || 'GET').toUpperCase();
+          const url    = e.config?.url || '';
+
+          if (status != null) {
+            // HTTP error with response
+            let errorBody: unknown = e.response?.data;
+
+            if (errorSchema) {
+              const ev = errorSchema.safeParse(errorBody ?? {});
+              if (!ev.success) {
+                setState(error(responseValidationError(ev.error, errorBody)));
+                return;
+              }
+              errorBody = ev.data;
+            }
+
+            setState(error(httpError(status, url, method, e.response?.headers, errorBody)));
+            return;
+          }
+
+          // No response → network layer
+          setState(error(networkError(inferNetworkReason(e), e.request)));
+          return;
+        }
+
+        // Non-Axios exception → treat as unknown network-ish failure
+        setState(error(networkError('unknown')));
+      }
+    }
+    return {
+      state,
+      dispatch,
+      filteredState: state,
+      configs,
+      execute,
+    };
+  }, [state, axiosInstances]);
+
+  return <Context.Provider value={contextValue}>{children}</Context.Provider>;
+}
+`;
+}
+
+function reactIntrigProviderStubTemplate(_apisToSync) {
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', 'intrig-provider-stub.tsx'));
+    return ts`import { useMemo, useReducer } from 'react';
+import { ZodSchema } from 'zod';
+import { Context, RequestType, GlobalState } from './intrig-context';
+import { IntrigProviderStubProps } from './interfaces';
+import { error, configError, init, NetworkState } from './network-state';
+import { requestReducer } from './reducer';
+
+export function IntrigProviderStub({
+  children,
+  configs = {},
+  stubs = () => {
+    //intentionally left blank
+  },
+}: IntrigProviderStubProps) {
+  const [state, dispatch] = useReducer(requestReducer, {} as GlobalState);
+
+  const collectedStubs = useMemo(() => {
+    const fns: Record<string, (
+      params: any,
+      body: any,
+      dispatch: (state: NetworkState<any>) => void,
+    ) => Promise<void>> = {};
+    function stub<P, B, T>(
+      hook: any,
+      fn: (
+        params: P,
+        body: B,
+        dispatch: (state: NetworkState<T>) => void,
+      ) => Promise<void>,
+    ) {
+      fns[hook.key] = fn;
+    }
+    stubs(stub);
+    return fns;
+  }, [stubs]);
+
+  const contextValue = useMemo(() => {
+    async function execute<T>(
+      request: RequestType,
+      dispatch: (state: NetworkState<T>) => void,
+      schema: ZodSchema<T> | undefined,
+    ) {
+      const stub = collectedStubs[request.key];
+
+      if (stub) {
+        try {
+          await stub(request.params, request.data, dispatch);
+        } catch (e: any) {
+          dispatch(error(configError(e?.message ?? '')));
+        }
+      } else {
+        dispatch(init());
+      }
+    }
+
+    return {
+      state,
+      dispatch,
+      filteredState: state,
+      configs,
+      execute,
+    };
+  }, [state, dispatch, configs, collectedStubs]);
+
+  return <Context.Provider value={contextValue}>{children}</Context.Provider>;
+}
+`;
+}
+
+function reactStatusTrapTemplate(_apisToSync) {
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', 'status-trap.tsx'));
+    return ts`import React, { PropsWithChildren, useCallback, useContext, useMemo, useState } from 'react';
+import { isError, isPending, NetworkState } from './network-state';
+import { Context } from './intrig-context';
+import { StatusTrapProps } from './interfaces';
+
+/**
+ * StatusTrap component is used to track and manage network request states.
+ */
+export function StatusTrap({
+  children,
+  type,
+  propagate = true,
+}: PropsWithChildren<StatusTrapProps>) {
+  const ctx = useContext(Context);
+
+  const [requests, setRequests] = useState<string[]>([]);
+
+  const shouldHandleEvent = useCallback(
+    (state: NetworkState) => {
+      switch (type) {
+        case 'error':
+          return isError(state);
+        case 'pending':
+          return isPending(state);
+        case 'pending + error':
+          return isPending(state) || isError(state);
+        default:
+          return false;
+      }
+    },
+    [type],
+  );
+
+  const dispatch = useCallback(
+    (event: any) => {
+      const composite = ${"`${event.source}:${event.operation}:${event.key}`"};
+      if (!event.handled) {
+        if (shouldHandleEvent(event.state)) {
+          setRequests((prev) => [...prev, composite]);
+          if (!propagate) {
+            ctx.dispatch({
+              ...event,
+              handled: true,
+            });
+            return;
+          }
+        } else {
+          setRequests((prev) => prev.filter((k) => k !== composite));
+        }
+      }
+      ctx.dispatch(event);
+    },
+    [ctx, propagate, shouldHandleEvent],
+  );
+
+  const filteredState = useMemo(() => {
+    return Object.fromEntries(
+      Object.entries(ctx.state).filter(([key]) => requests.includes(key)),
+    );
+  }, [ctx.state, requests]);
+
+  return (
+    <Context.Provider
+      value={{
+        ...ctx,
+        dispatch,
+        filteredState,
+      }}
+    >
+      {children}
+    </Context.Provider>
+  );
+}
+`;
+}
+
+function extractHookShapeAndOptionsShape$1(response, requestBody, imports) {
+    if (response) {
+        if (requestBody) {
+            imports.add(`import { BinaryFunctionHook, BinaryHookOptions } from "@intrig/react"`);
+            return {
+                hookShape: `BinaryFunctionHook<Params, RequestBody, Response>`,
+                optionsShape: `BinaryHookOptions<Params, RequestBody>`
+            };
+        } else {
+            imports.add(`import { UnaryFunctionHook, UnaryHookOptions } from "@intrig/react"`);
+            return {
+                hookShape: `UnaryFunctionHook<Params, Response>`,
+                optionsShape: `UnaryHookOptions<Params>`
+            };
+        }
+    } else {
+        if (requestBody) {
+            imports.add(`import { BinaryProduceHook, BinaryHookOptions } from "@intrig/react"`);
+            return {
+                hookShape: `BinaryProduceHook<Params, RequestBody>`,
+                optionsShape: `BinaryHookOptions<Params, RequestBody>`
+            };
+        } else {
+            imports.add(`import { UnaryProduceHook, UnaryHookOptions } from "@intrig/react"`);
+            return {
+                hookShape: `UnaryProduceHook<Params>`,
+                optionsShape: `UnaryHookOptions<Params>`
+            };
+        }
+    }
+}
+function extractParamDeconstruction$2(variables, requestBody) {
+    const isParamMandatory = (variables == null ? void 0 : variables.some((a)=>a.in === 'path')) || false;
+    if (requestBody) {
+        if (isParamMandatory) {
+            return {
+                paramExpression: 'data, p',
+                paramType: 'data: RequestBody, params: Params'
+            };
+        } else {
+            return {
+                paramExpression: 'data, p = {}',
+                paramType: 'data: RequestBody, params?: Params'
+            };
+        }
+    } else {
+        if (isParamMandatory) {
+            return {
+                paramExpression: 'p',
+                paramType: 'params: Params'
+            };
+        } else {
+            return {
+                paramExpression: 'p = {}',
+                paramType: 'params?: Params'
+            };
+        }
+    }
+}
+function extractErrorParams$2(errorTypes) {
+    switch(errorTypes.length){
+        case 0:
+            return `
+      export type _ErrorType = any
+      const errorSchema = z.any()`;
+        case 1:
+            return `
+      export type _ErrorType = ${errorTypes[0]}
+      const errorSchema = ${errorTypes[0]}Schema`;
+        default:
+            return `
+      export type _ErrorType = ${errorTypes.join(' | ')}
+      const errorSchema = z.union([${errorTypes.map((a)=>`${a}Schema`).join(', ')}])`;
+    }
+}
+async function requestHookTemplate({ source, data: { paths, operationId, response, requestUrl, variables, requestBody, contentType, responseType, errorResponses, method } }, ctx) {
+    var _ctx_getCounter;
+    const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? pluginSdk.generatePostfix(contentType, responseType) : '';
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', source, ...paths, pluginSdk.camelCase(operationId), `use${pluginSdk.pascalCase(operationId)}${postfix}.ts`));
+    (_ctx_getCounter = ctx.getCounter(source)) == null ? void 0 : _ctx_getCounter.inc("Stateful Hooks");
+    const modifiedRequestUrl = `${requestUrl == null ? void 0 : requestUrl.replace(/\{/g, "${")}`;
+    const imports = new Set();
+    imports.add(`import { z } from 'zod'`);
+    imports.add(`import { useCallback, useEffect } from 'react'`);
+    imports.add(`import {useNetworkState, NetworkState, DispatchState, error, successfulDispatch, validationError, encode, requestValidationError} from "@intrig/react"`);
+    const { hookShape, optionsShape } = extractHookShapeAndOptionsShape$1(response, requestBody, imports);
+    const { paramExpression, paramType } = extractParamDeconstruction$2(variables != null ? variables : [], requestBody);
+    if (requestBody) {
+        imports.add(`import { ${requestBody} as RequestBody, ${requestBody}Schema as requestBodySchema } from "@intrig/react/${source}/components/schemas/${requestBody}"`);
+    }
+    if (response) {
+        imports.add(`import { ${response} as Response, ${response}Schema as schema } from "@intrig/react/${source}/components/schemas/${response}"`);
+    }
+    imports.add(`import {${pluginSdk.pascalCase(operationId)}Params as Params} from './${pluginSdk.pascalCase(operationId)}.params'`);
+    const errorTypes = [
+        ...new Set(Object.values(errorResponses != null ? errorResponses : {}).map((a)=>a.response))
+    ];
+    errorTypes.forEach((ref)=>imports.add(`import {${ref}, ${ref}Schema } from "@intrig/react/${source}/components/schemas/${ref}"`));
+    var _variables_filter_map;
+    const paramExplode = [
+        ...(_variables_filter_map = variables == null ? void 0 : variables.filter((a)=>a.in === "path").map((a)=>a.name)) != null ? _variables_filter_map : [],
+        "...params"
+    ].join(",");
+    const finalRequestBodyBlock = requestBody ? `,data: encode(data, "${contentType}", requestBodySchema)` : '';
+    function responseTypePart() {
+        switch(responseType){
+            case "application/octet-stream":
+                return `responseType: 'blob', adapter: 'fetch',`;
+            case "text/event-stream":
+                return `responseType: 'stream', adapter: 'fetch',`;
+        }
+        return '';
+    }
+    return ts`
+    ${[
+        ...imports
+    ].join('\n')}
+
+    ${!response ? `
+    type Response = any;
+    const schema = z.any();
+    ` : ''}
+
+    ${extractErrorParams$2(errorTypes.map((a)=>a))}
+
+    const operation = "${method.toUpperCase()} ${requestUrl}| ${contentType} -> ${responseType}"
+    const source = "${source}"
+
+    function use${pluginSdk.pascalCase(operationId)}Hook(options: ${optionsShape} = {}): [NetworkState<Response>, (${paramType}) => DispatchState<any>, () => void] {
+      const [state, dispatch, clear, dispatchState] = useNetworkState<Response>({
+        key: options?.key ?? 'default',
+        operation,
+        source,
+        schema,
+        errorSchema
+      });
+
+      const doExecute = useCallback<(${paramType}) => DispatchState<any>>((${paramExpression}) => {
+        const { ${paramExplode}} = p
+
+          ${requestBody ? `
+          const validationResult = requestBodySchema.safeParse(data);
+          if (!validationResult.success) {
+            dispatchState(error(requestValidationError(validationResult.error)));
+            return validationError(validationResult.error.errors);
+          }
+          ` : ``}
+
+          dispatch({
+            method: '${method}',
+            url: \`${modifiedRequestUrl}\`,
+            headers: {
+              ${contentType ? `"Content-Type": "${contentType}",` : ''}
+            },
+            params,
+            key: \`${"${source}: ${operation}"}\`,
+            source: '${source}'
+            ${requestBody ? finalRequestBodyBlock : ''},
+            ${responseTypePart()}
+          })
+          return successfulDispatch();
+      }, [dispatch])
+
+      useEffect(() => {
+        if (options.fetchOnMount) {
+          doExecute(${[
+        requestBody ? `options.body!` : undefined,
+        "options.params!"
+    ].filter((a)=>a).join(",")});
+        }
+
+        return () => {
+          if (options.clearOnUnmount) {
+            clear();
+          }
+        }
+      }, [])
+
+      return [
+        state,
+        doExecute,
+        clear
+      ]
+    }
+
+    use${pluginSdk.pascalCase(operationId)}Hook.key = \`${"${source}: ${operation}"}\`
+
+    export const use${pluginSdk.pascalCase(operationId)}: ${hookShape} = use${pluginSdk.pascalCase(operationId)}Hook;
+  `;
+}
+
+async function paramsTemplate({ source, data: { paths, operationId, variables } }, ctx) {
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', source, ...paths, pluginSdk.camelCase(operationId), `${pluginSdk.pascalCase(operationId)}.params.ts`));
+    const { variableImports, variableTypes } = pluginSdk.decodeVariables(variables != null ? variables : [], source, "@intrig/react");
+    if (variableTypes.length === 0) return ts`
+  export type ${pluginSdk.pascalCase(operationId)}Params = Record<string, any>
+  `;
+    return ts`
+     ${variableImports}
+
+     export interface ${pluginSdk.pascalCase(operationId)}Params extends Record<string, any> {
+      ${variableTypes}
+    }
+  `;
+}
+
+function extractAsyncHookShape(response, requestBody, imports) {
+    if (response) {
+        if (requestBody) {
+            imports.add(`import { BinaryFunctionAsyncHook } from "@intrig/react"`);
+            return `BinaryFunctionAsyncHook<Params, RequestBody, Response>`;
+        } else {
+            imports.add(`import { UnaryFunctionAsyncHook } from "@intrig/react"`);
+            return `UnaryFunctionAsyncHook<Params, Response>`;
+        }
+    } else {
+        if (requestBody) {
+            imports.add(`import { BinaryProduceAsyncHook } from "@intrig/react"`);
+            return `BinaryProduceAsyncHook<Params, RequestBody>`;
+        } else {
+            imports.add(`import { UnaryProduceAsyncHook } from "@intrig/react"`);
+            return `UnaryProduceAsyncHook<Params>`;
+        }
+    }
+}
+function extractErrorParams$1(errorTypes) {
+    switch(errorTypes.length){
+        case 0:
+            return `
+      export type _ErrorType = any
+      const errorSchema = z.any()`;
+        case 1:
+            return `
+      export type _ErrorType = ${errorTypes[0]}
+      const errorSchema = ${errorTypes[0]}Schema`;
+        default:
+            return `
+      export type _ErrorType = ${errorTypes.join(' | ')}
+      const errorSchema = z.union([${errorTypes.map((a)=>`${a}Schema`).join(', ')}])`;
+    }
+}
+function extractParamDeconstruction$1(variables, requestBody) {
+    const isParamMandatory = (variables == null ? void 0 : variables.some((a)=>a.in === 'path')) || false;
+    if (requestBody) {
+        if (isParamMandatory) {
+            return {
+                paramExpression: 'data, p',
+                paramType: 'data: RequestBody, params: Params'
+            };
+        } else {
+            return {
+                paramExpression: 'data, p = {}',
+                paramType: 'data: RequestBody, params?: Params'
+            };
+        }
+    } else {
+        if (isParamMandatory) {
+            return {
+                paramExpression: 'p',
+                paramType: 'params: Params'
+            };
+        } else {
+            return {
+                paramExpression: 'p = {}',
+                paramType: 'params?: Params'
+            };
+        }
+    }
+}
+async function asyncFunctionHookTemplate({ source, data: { paths, operationId, response, requestUrl, variables, requestBody, contentType, responseType, errorResponses, method } }, ctx) {
+    var _ctx_getCounter;
+    const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? pluginSdk.generatePostfix(contentType, responseType) : '';
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', source, ...paths, pluginSdk.camelCase(operationId), `use${pluginSdk.pascalCase(operationId)}Async${postfix}.ts`));
+    (_ctx_getCounter = ctx.getCounter(source)) == null ? void 0 : _ctx_getCounter.inc("Stateless Hooks");
+    const modifiedRequestUrl = `${requestUrl == null ? void 0 : requestUrl.replace(/\{/g, "${")}`;
+    const imports = new Set();
+    // Basic imports
+    imports.add(`import { z } from 'zod'`);
+    imports.add(`import { useCallback } from 'react'`);
+    imports.add(`import { useTransitionCall, encode, isError, isSuccess } from '@intrig/react'`);
+    // Hook signature type
+    const hookShape = extractAsyncHookShape(response, requestBody, imports);
+    // Add body/response param imports
+    if (requestBody) {
+        imports.add(`import { ${requestBody} as RequestBody, ${requestBody}Schema as requestBodySchema } from "@intrig/react/${source}/components/schemas/${requestBody}"`);
+    }
+    if (response) {
+        imports.add(`import { ${response} as Response, ${response}Schema as schema } from "@intrig/react/${source}/components/schemas/${response}"`);
+    }
+    imports.add(`import { ${pluginSdk.pascalCase(operationId)}Params as Params } from './${pluginSdk.pascalCase(operationId)}.params'`);
+    // Error types
+    const errorTypes = [
+        ...new Set(Object.values(errorResponses != null ? errorResponses : {}).map((a)=>a.response))
+    ];
+    errorTypes.forEach((ref)=>imports.add(`import { ${ref}, ${ref}Schema } from "@intrig/react/${source}/components/schemas/${ref}"`));
+    // Error schema block
+    const errorSchemaBlock = extractErrorParams$1(errorTypes.map((a)=>a));
+    // Param deconstruction
+    const { paramExpression, paramType } = extractParamDeconstruction$1(variables != null ? variables : [], requestBody);
+    var _variables_filter_map;
+    const paramExplode = [
+        ...(_variables_filter_map = variables == null ? void 0 : variables.filter((a)=>a.in === 'path').map((a)=>a.name)) != null ? _variables_filter_map : [],
+        '...params'
+    ].join(',');
+    const finalRequestBodyBlock = requestBody ? `, data: encode(data, "${contentType}", requestBodySchema)` : '';
+    function responseTypePart() {
+        switch(responseType){
+            case "application/octet-stream":
+                return `responseType: 'blob', adapter: 'fetch',`;
+            case "text/event-stream":
+                return `responseType: 'stream', adapter: 'fetch',`;
+        }
+        return '';
+    }
+    return ts`
+${[
+        ...imports
+    ].join('\n')}
+
+${!response ? `
+type Response = any;
+const schema = z.any();
+` : ''}
+
+${errorSchemaBlock}
+
+const operation = "${method.toUpperCase()} ${requestUrl}| ${contentType} -> ${responseType}";
+const source = "${source}";
+
+function use${pluginSdk.pascalCase(operationId)}AsyncHook(): [(${paramType}) => Promise<Response>, () => void] {
+  const [call, abort] = useTransitionCall<Response>({
+    schema,
+    errorSchema
+  });
+
+  const doExecute = useCallback<(${paramType}) => Promise<Response>>(async (${paramExpression}) => {
+    const { ${paramExplode} } = p;
+
+    ${requestBody ? `
+    const validationResult = requestBodySchema.safeParse(data);
+    if (!validationResult.success) {
+      return Promise.reject(validationResult.error);
+    }
+    ` : ''}
+
+    return await call({
+      method: '${method}',
+      url: \`${modifiedRequestUrl}\`,
+      headers: {
+        ${contentType ? `"Content-Type": "${contentType}",` : ''}
+      },
+      params,
+      key: \`${"${source}: ${operation}"}\`,
+      source: '${source}'
+      ${requestBody ? finalRequestBodyBlock : ''},
+      ${responseTypePart()}
+    });
+  }, [call]);
+
+  return [doExecute, abort];
+}
+
+use${pluginSdk.pascalCase(operationId)}AsyncHook.key = \`${"${source}: ${operation}"}\`;
+
+export const use${pluginSdk.pascalCase(operationId)}Async: ${hookShape} = use${pluginSdk.pascalCase(operationId)}AsyncHook;
+  `;
+}
+
+async function clientIndexTemplate(descriptors, ctx) {
+    var _ctx_getCounter;
+    const { source, data: { paths, operationId, responseType, contentType } } = descriptors[0];
+    (_ctx_getCounter = ctx.getCounter(source)) == null ? void 0 : _ctx_getCounter.inc("Endpoints");
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', source, ...paths, pluginSdk.camelCase(operationId), `client.ts`));
+    const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? pluginSdk.generatePostfix(contentType, responseType) : '';
+    if (descriptors.length === 1) return ts`
+    export { use${pluginSdk.pascalCase(operationId)} } from './use${pluginSdk.pascalCase(operationId)}${postfix}'
+    export { use${pluginSdk.pascalCase(operationId)}Async } from './use${pluginSdk.pascalCase(operationId)}Async${postfix}'
+  `;
+    const exports = descriptors.map(({ data: { contentType, responseType } })=>{
+        const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? pluginSdk.generatePostfix(contentType, responseType) : '';
+        return `
+      export { use${pluginSdk.pascalCase(operationId)} as use${pluginSdk.pascalCase(operationId)}${postfix} } from './use${pluginSdk.pascalCase(operationId)}${postfix}'
+      export { use${pluginSdk.pascalCase(operationId)}Async as use${pluginSdk.pascalCase(operationId)}Async${postfix} } from './use${pluginSdk.pascalCase(operationId)}Async${postfix}'
+      `;
+    }).join('\n');
+    return ts`
+    ${exports}
+  `;
+}
+
+function extractHookShapeAndOptionsShape(response, requestBody, imports) {
+    if (response) {
+        if (requestBody) {
+            imports.add(`import { BinaryFunctionHook, BinaryHookOptions } from "@intrig/react"`);
+            return {
+                hookShape: `BinaryFunctionHook<Params, RequestBody, Response>`,
+                optionsShape: `BinaryHookOptions<Params, RequestBody>`
+            };
+        } else {
+            imports.add(`import { UnaryFunctionHook, UnaryHookOptions } from "@intrig/react"`);
+            return {
+                hookShape: `UnaryFunctionHook<Params, Response>`,
+                optionsShape: `UnaryHookOptions<Params>`
+            };
+        }
+    } else {
+        if (requestBody) {
+            imports.add(`import { BinaryProduceHook, BinaryHookOptions } from "@intrig/react"`);
+            return {
+                hookShape: `BinaryProduceHook<Params, RequestBody>`,
+                optionsShape: `BinaryHookOptions<Params, RequestBody>`
+            };
+        } else {
+            imports.add(`import { UnaryProduceHook, UnaryHookOptions } from "@intrig/react"`);
+            return {
+                hookShape: `UnaryProduceHook<Params>`,
+                optionsShape: `UnaryHookOptions<Params>`
+            };
+        }
+    }
+}
+function extractParamDeconstruction(variables, requestBody) {
+    const isParamMandatory = (variables == null ? void 0 : variables.some((a)=>a.in === 'path')) || false;
+    if (requestBody) {
+        if (isParamMandatory) {
+            return {
+                paramExpression: 'data, p',
+                paramType: 'data: RequestBody, params: Params'
+            };
+        } else {
+            return {
+                paramExpression: 'data, p = {}',
+                paramType: 'data: RequestBody, params?: Params'
+            };
+        }
+    } else {
+        if (isParamMandatory) {
+            return {
+                paramExpression: 'p',
+                paramType: 'params: Params'
+            };
+        } else {
+            return {
+                paramExpression: 'p = {}',
+                paramType: 'params?: Params'
+            };
+        }
+    }
+}
+function extractErrorParams(errorTypes) {
+    switch(errorTypes.length){
+        case 0:
+            return `
+      export type _ErrorType = any
+      const errorSchema = z.any()`;
+        case 1:
+            return `
+      export type _ErrorType = ${errorTypes[0]}
+      const errorSchema = ${errorTypes[0]}Schema`;
+        default:
+            return `
+      export type _ErrorType = ${errorTypes.join(' | ')}
+      const errorSchema = z.union([${errorTypes.map((a)=>`${a}Schema`).join(', ')}])`;
+    }
+}
+async function downloadHookTemplate({ source, data: { paths, operationId, response, requestUrl, variables, requestBody, contentType, responseType, errorResponses, method } }, ctx) {
+    var _ctx_getCounter;
+    const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? pluginSdk.generatePostfix(contentType, responseType) : '';
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', source, ...paths, pluginSdk.camelCase(operationId), `use${pluginSdk.pascalCase(operationId)}${postfix}Download.ts`));
+    (_ctx_getCounter = ctx.getCounter(source)) == null ? void 0 : _ctx_getCounter.inc("Download Hooks");
+    const modifiedRequestUrl = `${requestUrl == null ? void 0 : requestUrl.replace(/\{/g, "${")}`;
+    const imports = new Set();
+    imports.add(`import { z } from 'zod'`);
+    imports.add(`import { useCallback, useEffect } from 'react'`);
+    imports.add(`import {useNetworkState, NetworkState, DispatchState, pending, success, error, init, successfulDispatch, validationError, encode, isSuccess, requestValidationError} from "@intrig/react"`);
+    const { hookShape, optionsShape } = extractHookShapeAndOptionsShape(response, requestBody, imports);
+    const { paramExpression, paramType } = extractParamDeconstruction(variables, requestBody);
+    if (requestBody) {
+        imports.add(`import { ${requestBody} as RequestBody, ${requestBody}Schema as requestBodySchema } from "@intrig/react/${source}/components/schemas/${requestBody}"`);
+    }
+    if (response) {
+        imports.add(`import { ${response} as Response, ${response}Schema as schema } from "@intrig/react/${source}/components/schemas/${response}"`);
+    }
+    imports.add(`import {${pluginSdk.pascalCase(operationId)}Params as Params} from './${pluginSdk.pascalCase(operationId)}.params'`);
+    const errorTypes = [
+        ...new Set(Object.values(errorResponses != null ? errorResponses : {}).map((a)=>a.response))
+    ];
+    errorTypes.forEach((ref)=>imports.add(`import {${ref}, ${ref}Schema } from "@intrig/react/${source}/components/schemas/${ref}"`));
+    var _variables_filter_map;
+    const paramExplode = [
+        ...(_variables_filter_map = variables == null ? void 0 : variables.filter((a)=>a.in === "path").map((a)=>a.name)) != null ? _variables_filter_map : [],
+        "...params"
+    ].join(",");
+    const finalRequestBodyBlock = requestBody ? `,data: encode(data, "${contentType}", requestBodySchema)` : '';
+    function responseTypePart() {
+        switch(responseType){
+            case "application/octet-stream":
+                return `responseType: 'blob', adapter: 'fetch',`;
+            case "text/event-stream":
+                return `responseType: 'stream', adapter: 'fetch',`;
+        }
+        return '';
+    }
+    return ts`
+    ${[
+        ...imports
+    ].join('\n')}
+
+    ${!response ? `
+    type Response = any;
+    const schema = z.any();
+    ` : ''}
+
+    ${extractErrorParams(errorTypes.map((a)=>a))}
+
+    const operation = "${method.toUpperCase()} ${requestUrl}| ${contentType} -> ${responseType}"
+    const source = "${source}"
+
+    function use${pluginSdk.pascalCase(operationId)}Hook(options: ${optionsShape} = {}): [NetworkState<Response>, (${paramType}) => DispatchState<any>, () => void] {
+      let [state, dispatch, clear, dispatchState] = useNetworkState<Response>({
+        key: options?.key ?? 'default',
+        operation,
+        source,
+        schema,
+        errorSchema
+      });
+      
+      useEffect(() => {
+        if (isSuccess(state)) {
+          let a = document.createElement('a');
+          const ct =
+            state.headers?.['content-type'] ?? 'application/octet-stream';
+          let data: any = state.data;
+          if (ct.startsWith('application/json')) {
+            let data: any[];
+            if (ct.startsWith('application/json')) {
+              data = [JSON.stringify(state.data, null, 2)];
+            } else {
+              data = [state.data];
+            }
+          }
+          a.href = URL.createObjectURL(new Blob(Array.isArray(data) ? data : [data], {type: ct}));
+          const contentDisposition = state.headers?.['content-disposition'];
+          let filename = '${pluginSdk.pascalCase(operationId)}.${mimeType__namespace.extension(contentType)}';
+          if (contentDisposition) {
+            const rx = /filename\\*=(?:UTF-8'')?([^;\\r\\n]+)|filename="?([^";\\r\\n]+)"?/i;
+            const m = contentDisposition.match(rx);
+            if (m && m[1]) {
+              filename = decodeURIComponent(m[1].replace(/\\+/g, ' '));
+            } else if (m && m[2]) {
+              filename = decodeURIComponent(m[2].replace(/\\+/g, ' '));
+            }
+          } 
+          a.download = filename;
+          document.body.appendChild(a);
+          a.click();
+          document.body.removeChild(a);
+          dispatchState(init())
+        }
+      }, [state])
+
+      let doExecute = useCallback<(${paramType}) => DispatchState<any>>((${paramExpression}) => {
+        let { ${paramExplode}} = p
+
+          ${requestBody ? `
+          const validationResult = requestBodySchema.safeParse(data);
+          if (!validationResult.success) {
+            dispatchState(error(requestValidationError(validationResult.error)));
+            return validationError(validationResult.error.errors);
+          }
+          ` : ``}
+
+          dispatch({
+            method: '${method}',
+            url: \`${modifiedRequestUrl}\`,
+            headers: {
+              ${contentType ? `"Content-Type": "${contentType}",` : ''}
+            },
+            params,
+            key: \`${"${source}: ${operation}"}\`,
+            source: '${source}'
+            ${requestBody ? finalRequestBodyBlock : ''},
+            ${responseTypePart()}
+          })
+          return successfulDispatch();
+      }, [dispatch])
+      
+      useEffect(() => {
+        if (options.fetchOnMount) {
+          doExecute(${[
+        requestBody ? `options.body!` : undefined,
+        "options.params!"
+    ].filter((a)=>a).join(",")});
+        }
+
+        return () => {
+          if (options.clearOnUnmount) {
+            clear();
+          }
+        }
+      }, [])
+
+      return [
+        state,
+        doExecute,
+        clear
+      ]
+    }
+
+    use${pluginSdk.pascalCase(operationId)}Hook.key = \`${"${source}: ${operation}"}\`
+
+    export const use${pluginSdk.pascalCase(operationId)}Download: ${hookShape} = use${pluginSdk.pascalCase(operationId)}Hook;
+  `;
+}
+
+async function typeTemplate(descriptor) {
+    const { data: { schema, name: typeName }, source } = descriptor;
+    const { imports, zodSchema, tsType } = openApiSchemaToZod(schema);
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', source, 'components', 'schemas', `${typeName}.ts`));
+    const simpleType = (await pluginSdk.jsonLiteral('')`${JSON.stringify(schema)}`).content;
+    const transport = schema.type === 'string' && schema.format === 'binary' ? 'binary' : 'json';
+    var _JSON_stringify;
+    return ts`
+  import { z } from 'zod'
+
+  ${[
+        ...imports
+    ].join('\n')}
+
+  //--- Zod Schemas  ---//
+
+  export const ${typeName}Schema = ${zodSchema}
+
+  //--- Typescript Type  ---//
+
+  export type ${typeName} = ${tsType}
+
+  //--- JSON Schema  ---//
+
+  export const ${typeName}_jsonschema = ${(_JSON_stringify = JSON.stringify(schema)) != null ? _JSON_stringify : "{}"}
+
+  //--- Simple Type  ---//
+  /*[${simpleType}]*/
+  
+  // Transport hint for clients ("binary" => use arraybuffer/blob)
+  export const ${typeName}_transport = '${transport}' as const;
+  `;
+}
+function isRef(schema) {
+    return '$ref' in (schema != null ? schema : {});
+}
+// Helper function to convert OpenAPI schema types to TypeScript types and Zod schemas
+function openApiSchemaToZod(schema, imports = new Set()) {
+    if (!schema) {
+        return {
+            tsType: 'any',
+            zodSchema: 'z.any()',
+            imports: new Set()
+        };
+    }
+    if (isRef(schema)) {
+        return handleRefSchema(schema.$ref, imports);
+    }
+    if (!schema.type) {
+        if ('properties' in schema) {
+            schema.type = 'object';
+        } else if ('items' in schema) {
+            schema.type = 'array';
+        }
+    }
+    switch(schema.type){
+        case 'string':
+            return handleStringSchema(schema);
+        case 'number':
+            return handleNumberSchema(schema);
+        case 'integer':
+            return handleIntegerSchema(schema);
+        case 'boolean':
+            return handleBooleanSchema();
+        case 'array':
+            return handleArraySchema(schema, imports);
+        case 'object':
+            return handleObjectSchema(schema, imports);
+        default:
+            return handleComplexSchema(schema, imports);
+    }
+}
+function handleRefSchema(ref, imports) {
+    const refParts = ref.split('/');
+    const refName = refParts[refParts.length - 1];
+    imports.add(`import { ${refName}, ${refName}Schema } from './${refName}';`);
+    return {
+        tsType: refName,
+        zodSchema: `z.lazy(() => ${refName}Schema)`,
+        imports
+    };
+}
+function handleStringSchema(schema) {
+    const imports = new Set();
+    let binaryish = false;
+    if (schema.enum) {
+        const enumValues = schema.enum.map((value)=>`'${value}'`).join(' | ');
+        const zodEnum = `z.enum([${schema.enum.map((value)=>`'${value}'`).join(', ')}])`;
+        return {
+            tsType: enumValues,
+            zodSchema: zodEnum,
+            imports: new Set()
+        };
+    }
+    let zodSchema = 'z.string()';
+    let tsType = 'string';
+    if (schema.format === 'date' && !schema.pattern) {
+        tsType = 'Date';
+        zodSchema = 'z.coerce.date()';
+        zodSchema += `.transform((val) => {
+        const parsedDate = new Date(val);
+        if (isNaN(parsedDate.getTime())) {
+          throw new Error('Invalid date format');
+        }
+        return parsedDate;
+    })`;
+    } else if (schema.format === 'time') {
+        zodSchema = 'z.string()';
+        if (schema.pattern) {
+            zodSchema += `.regex(new RegExp('${schema.pattern}'))`;
+        }
+    } else if (schema.format === 'date-time' && !schema.pattern) {
+        tsType = 'Date';
+        zodSchema = 'z.coerce.date()';
+        zodSchema += `.transform((val) => {
+        const parsedDateTime = new Date(val);
+        if (isNaN(parsedDateTime.getTime())) {
+          throw new Error('Invalid date-time format');
+        }
+        return parsedDateTime;
+    })`;
+    } else if (schema.format === 'binary') {
+        tsType = 'BinaryData';
+        zodSchema = 'BinaryDataSchema';
+        imports.add(`import { BinaryData, BinaryDataSchema } from '@intrig/react/type-utils'`);
+        binaryish = true;
+    } else if (schema.format === 'byte') {
+        tsType = 'Uint8Array';
+        zodSchema = 'z.string().transform((val) => base64ToUint8Array(val))';
+        imports.add(`import { base64ToUint8Array } from '@intrig/react/type-utils'`);
+        binaryish = true;
+    } else if (schema.format === 'email') {
+        zodSchema = 'z.string().email()';
+    } else if (schema.format === 'uuid') {
+        zodSchema = 'z.string().uuid()';
+    } else if (schema.format === 'uri') {
+        zodSchema = 'z.string().url()';
+    } else if (schema.format === 'hostname') {
+        zodSchema = 'z.string()'; // Zod does not have a direct hostname validator
+    } else if (schema.format === 'ipv4') {
+        zodSchema = 'z.string().regex(/^((25[0-5]|2[0-4][0-9]|[0-1]?[0-9][0-9]?)\\.){3}(25[0-5]|2[0-4][0-9]|[0-1]?[0-9][0-9]?)$/)';
+    } else if (schema.format === 'ipv6') {
+        zodSchema = 'z.string().regex(/^(([0-9a-fA-F]{1,4}:){7}[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,7}:|([0-9a-fA-F]{1,4}:){1,6}:[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,5}(:[0-9a-fA-F]{1,4}){1,2}|([0-9a-fA-F]{1,4}:){1,4}(:[0-9a-fA-F]{1,4}){1,3}|([0-9a-fA-F]{1,4}:){1,3}(:[0-9a-fA-F]{1,4}){1,4}|([0-9a-fA-F]{1,4}:){1,2}(:[0-9a-fA-F]{1,4}){1,5}|[0-9a-fA-F]{1,4}:((:[0-9a-fA-F]{1,4}){1,6}|:)|::(ffff(:0{1,4}){0,1}:)?((25[0-5]|(2[0-4]|1[0-9]|[0-9])\\.){3}(25[0-5]|(2[0-4]|1[0-9]|[0-9]))))$/)';
+    } else {
+        if (schema.minLength !== undefined) zodSchema += `.min(${schema.minLength})`;
+        if (schema.maxLength !== undefined) zodSchema += `.max(${schema.maxLength})`;
+        if (schema.pattern !== undefined) zodSchema += `.regex(new RegExp('${schema.pattern}'))`;
+    }
+    return {
+        tsType,
+        zodSchema,
+        imports,
+        binaryish
+    };
+}
+function handleNumberSchema(schema) {
+    let zodSchema = 'z.number()';
+    if (schema.minimum !== undefined) zodSchema += `.min(${schema.minimum})`;
+    if (schema.maximum !== undefined) zodSchema += `.max(${schema.maximum})`;
+    return {
+        tsType: 'number',
+        zodSchema,
+        imports: new Set()
+    };
+}
+function handleIntegerSchema(schema) {
+    let zodSchema = 'z.number().int()';
+    if (schema.minimum !== undefined) zodSchema += `.min(${schema.minimum})`;
+    if (schema.maximum !== undefined) zodSchema += `.max(${schema.maximum})`;
+    return {
+        tsType: 'number',
+        zodSchema,
+        imports: new Set()
+    };
+}
+function handleBooleanSchema() {
+    const zodSchema = 'z.boolean()';
+    return {
+        tsType: 'boolean',
+        zodSchema,
+        imports: new Set()
+    };
+}
+function handleArraySchema(schema, imports) {
+    if (!schema.items) {
+        throw new Error('Array schema must have an items property');
+    }
+    const { tsType, zodSchema: itemZodSchema, imports: itemImports, binaryish } = openApiSchemaToZod(schema.items, imports);
+    let zodSchema = binaryish ? `z.array(${itemZodSchema})` : `(z.preprocess((raw) => (Array.isArray(raw) ? raw : [raw]), z.array(${itemZodSchema})) as z.ZodType<${tsType}[], z.ZodTypeDef, ${tsType}[]>)`;
+    if (schema.minItems !== undefined) zodSchema += `.min(${schema.minItems})`;
+    if (schema.maxItems !== undefined) zodSchema += `.max(${schema.maxItems})`;
+    return {
+        tsType: `(${tsType})[]`,
+        zodSchema,
+        imports: new Set([
+            ...imports,
+            ...itemImports
+        ])
+    };
+}
+function handleObjectSchema(schema, imports) {
+    const updatedRequiredFields = schema.required || [];
+    if (schema.properties) {
+        const propertiesTs = Object.entries(schema.properties).map(([key, value])=>{
+            const { tsType, optional } = openApiSchemaToZod(value);
+            const isRequired = !optional && updatedRequiredFields.includes(key);
+            return `${key}${isRequired ? '' : '?'}: ${tsType} ${isRequired ? '' : ' | null'};`;
+        });
+        const propertiesZod = Object.entries(schema.properties).map(([key, value])=>{
+            const { zodSchema, imports: propImports } = openApiSchemaToZod(value);
+            imports = new Set([
+                ...imports,
+                ...propImports
+            ]);
+            const isRequired = updatedRequiredFields.includes(key);
+            return `${key}: ${isRequired ? zodSchema : zodSchema.includes('.optional().nullable()') ? zodSchema : zodSchema + '.optional().nullable()'}`;
+        });
+        return {
+            tsType: `{ ${propertiesTs.join(' ')} }`,
+            zodSchema: `z.object({ ${propertiesZod.join(', ')} })`,
+            imports
+        };
+    }
+    return {
+        tsType: 'any',
+        zodSchema: 'z.any()',
+        imports: new Set(),
+        optional: true
+    };
+}
+function handleComplexSchema(schema, imports) {
+    if (schema.oneOf) {
+        const options = schema.oneOf.map((subSchema)=>openApiSchemaToZod(subSchema));
+        const zodSchemas = options.map((option)=>option.zodSchema);
+        const tsTypes = options.map((option)=>option.tsType);
+        return {
+            tsType: tsTypes.join(' | '),
+            zodSchema: `z.union([${zodSchemas.join(', ')}])`,
+            imports: new Set([
+                ...imports,
+                ...options.flatMap((option)=>Array.from(option.imports))
+            ])
+        };
+    }
+    if (schema.anyOf) {
+        const options = schema.anyOf.map((subSchema)=>openApiSchemaToZod(subSchema));
+        const zodSchemas = options.map((option)=>option.zodSchema);
+        const tsTypes = options.map((option)=>option.tsType);
+        return {
+            tsType: tsTypes.join(' | '),
+            zodSchema: `z.union([${zodSchemas.join(', ')}])`,
+            imports: new Set([
+                ...imports,
+                ...options.flatMap((option)=>Array.from(option.imports))
+            ])
+        };
+    }
+    if (schema.allOf) {
+        const options = schema.allOf.map((subSchema)=>openApiSchemaToZod(subSchema));
+        const zodSchemas = options.map((option)=>option.zodSchema);
+        const tsTypes = options.map((option)=>option.tsType);
+        if (zodSchemas.length === 1) return {
+            tsType: tsTypes.join(' & '),
+            zodSchema: zodSchemas[0],
+            imports: new Set([
+                ...imports,
+                ...options.flatMap((option)=>Array.from(option.imports))
+            ])
+        };
+        return {
+            tsType: tsTypes.join(' & '),
+            zodSchema: `z.intersection(${zodSchemas.join(', ')})`,
+            imports: new Set([
+                ...imports,
+                ...options.flatMap((option)=>Array.from(option.imports))
+            ])
+        };
+    }
+    return {
+        tsType: 'any',
+        zodSchema: 'z.any()',
+        imports
+    };
+}
+
+async function generateCode(ctx) {
+    // Root/project files
+    await ctx.dump(packageJsonTemplate(ctx));
+    await ctx.dump(reactTsConfigTemplate());
+    await ctx.dump(reactSwcrcTemplate());
+    // Top-level src files
+    await ctx.dump(indexTemplate());
+    await ctx.dump(networkStateTemplate());
+    await ctx.dump(contextTemplate(ctx.sources));
+    await ctx.dump(reactLoggerTemplate());
+    await ctx.dump(reactExtraTemplate());
+    await ctx.dump(reactMediaTypeUtilsTemplate());
+    await ctx.dump(typeUtilsTemplate());
+    await ctx.dump(intrigMiddlewareTemplate());
+    await ctx.dump(flushSyncUtilTemplate(ctx));
+    // Provider modular files (placed under src)
+    await ctx.dump(providerMainTemplate(ctx.sources));
+    await ctx.dump(providerHooksTemplate());
+    await ctx.dump(providerInterfacesTemplate(ctx.sources));
+    await ctx.dump(providerReducerTemplate());
+    await ctx.dump(providerAxiosConfigTemplate(ctx.sources));
+    await ctx.dump(reactIntrigProviderTemplate(ctx.sources));
+    await ctx.dump(reactIntrigProviderStubTemplate(ctx.sources));
+    await ctx.dump(reactStatusTrapTemplate(ctx.sources));
+    const potentiallyConflictingDescriptors = ctx.restDescriptors.sort((a, b)=>(a.data.contentType === "application/json" ? -1 : 0) - (b.data.contentType === "application/json" ? -1 : 0)).filter((descriptor, index, array)=>array.findIndex((other)=>other.data.operationId === descriptor.data.operationId) !== index).map((descriptor)=>descriptor.id);
+    const internalGeneratorContext = new InternalGeneratorContext(potentiallyConflictingDescriptors);
+    for (const restDescriptor of ctx.restDescriptors){
+        await ctx.dump(requestHookTemplate(restDescriptor, internalGeneratorContext));
+        await ctx.dump(paramsTemplate(restDescriptor));
+        await ctx.dump(asyncFunctionHookTemplate(restDescriptor, internalGeneratorContext));
+        if (restDescriptor.data.isDownloadable) {
+            await ctx.dump(downloadHookTemplate(restDescriptor, internalGeneratorContext));
+        }
+        await ctx.dump(clientIndexTemplate([
+            restDescriptor
+        ], internalGeneratorContext));
+    }
+    for (const schemaDescriptor of ctx.schemaDescriptors){
+        ctx.dump(typeTemplate(schemaDescriptor));
+    }
+    return internalGeneratorContext.getCounters();
+}
+
+/**
+ * Schema documentation tab builders for React binding.
+ * We keep a small, composable API similar to other docs templates.
+ */ async function schemaTypescriptDoc(result) {
+    const md = pluginSdk.mdLiteral('schema-typescript.md');
+    const name = result.data.name;
+    const source = result.source;
+    const { tsType } = openApiSchemaToZod(result.data.schema);
+    const ts = pluginSdk.typescript(path.resolve('src', source, 'temp', name, `${name}.ts`));
+    const importContent = await ts`
+    import type { ${name} } from '@intrig/react/${source}/components/schemas/${name}';
+  `;
+    const codeContent = await ts`
+    export type ${name} = ${tsType};
+  `;
+    return md`
+# Typescript Type
+Use this TypeScript type anywhere you need static typing for this object shape in your app code: component props, function params/returns, reducers, and local state in .ts/.tsx files.
+
+## Import
+${'```ts'}
+${importContent}
+${'```'}
+
+## Definition
+${'```ts'}
+${codeContent}
+${'```'}
+  `;
+}
+async function schemaJsonSchemaDoc(result) {
+    const md = pluginSdk.mdLiteral('schema-json.md');
+    const name = result.data.name;
+    const source = result.source;
+    const ts = pluginSdk.typescript(path.resolve('src', source, 'temp', name, `${name}.ts`));
+    const importContent = await ts`
+    import { ${name}_jsonschema } from '@intrig/react/${source}/components/schemas/${name}';
+  `;
+    var _JSON_stringify;
+    const codeContent = await ts`
+    export const ${name}_jsonschema = ${(_JSON_stringify = JSON.stringify(result.data.schema, null, 2)) != null ? _JSON_stringify : "{}"};
+  `;
+    return md`
+# JSON Schema
+Use this JSON Schema with tools that consume JSON Schema: UI form builders (e.g. react-jsonschema-form), validators (AJV, validators in backends), and generators.
+
+## Import
+${'```ts'}
+${importContent}
+${'```'}
+
+## Definition
+${'```ts'}
+${codeContent}
+${'```'}
+  `;
+}
+async function schemaZodSchemaDoc(result) {
+    const md = pluginSdk.mdLiteral('schema-zod.md');
+    const name = result.data.name;
+    const source = result.source;
+    const { zodSchema } = openApiSchemaToZod(result.data.schema);
+    const ts = pluginSdk.typescript(path.resolve('src', source, 'temp', name, `${name}.ts`));
+    const importContent = await ts`
+    import { ${name}Schema } from '@intrig/react/${source}/components/schemas/${name}';
+  `;
+    const codeContent = await ts`
+    export const ${name}Schema = ${zodSchema};
+  `;
+    return md`
+# Zod Schema
+Use this Zod schema for runtime validation and parsing: form validation, client/server payload guards, and safe transformations before using or storing data.
+
+## Import
+${'```ts'}
+${importContent}
+${'```'}
+
+## Definition
+${'```ts'}
+${codeContent}
+${'```'}
+  `;
+}
+
+async function getSchemaDocumentation(result) {
+    const tabs = [];
+    tabs.push({
+        name: 'Typescript Type',
+        content: (await schemaTypescriptDoc(result)).content
+    });
+    tabs.push({
+        name: 'JSON Schema',
+        content: (await schemaJsonSchemaDoc(result)).content
+    });
+    tabs.push({
+        name: 'Zod Schema',
+        content: (await schemaZodSchemaDoc(result)).content
+    });
+    return tabs;
+}
+
+function reactSseHookDocs(descriptor) {
+    const md = pluginSdk.mdLiteral("sse-hook.md");
+    var _descriptor_data_variables;
+    // ===== Derived names =====
+    const hasPathParams = ((_descriptor_data_variables = descriptor.data.variables) != null ? _descriptor_data_variables : []).some((v)=>{
+        var _v_in;
+        return ((_v_in = v.in) == null ? void 0 : _v_in.toUpperCase()) === "PATH";
+    });
+    const actionName = pluginSdk.camelCase(descriptor.name); // e.g. streamBuildLogs
+    const respVar = `${actionName}Resp`; // e.g. streamBuildLogsResp
+    const clearName = `clear${pluginSdk.pascalCase(descriptor.name)}`; // e.g. clearStreamBuildLogs
+    const requestBodyVar = descriptor.data.requestBody ? pluginSdk.camelCase(descriptor.data.requestBody) : undefined;
+    const requestBodyType = descriptor.data.requestBody ? pluginSdk.pascalCase(descriptor.data.requestBody) : undefined;
+    const paramsVar = hasPathParams ? `${actionName}Params` : undefined; // e.g. streamBuildLogsParams
+    const paramsType = hasPathParams ? `${pluginSdk.pascalCase(descriptor.name)}Params` : undefined; // e.g. StreamBuildLogsParams
+    const responseTypeName = `${pluginSdk.pascalCase(descriptor.name)}ResponseBody`; // if generated by your build
+    const callArgs = [
+        requestBodyVar,
+        paramsVar != null ? paramsVar : "{}"
+    ].filter(Boolean).join(", ");
+    return md`
+# Intrig SSE Hooks — Quick Guide
+
+## When should I use the SSE hook?
+- **Your endpoint streams events** (Server-Sent Events) and you want **incremental updates** in the UI → use this **SSE hook**.
+- **You only need a final result** → use the regular **stateful hook**.
+- **One-off validate/submit/update** with no shared state → use the **async hook**.
+
+> Intrig SSE hooks are **stateful hooks** under the hood. **Events arrive while the hook is in \`Pending\`**. When the stream completes, the hook transitions to **\`Success\`** (or **\`Error\`**).
+
+---
+
+## Copy-paste starter (fast lane)
+
+### 1) Hook import
+\`\`\`ts
+import { use${pluginSdk.pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
+\`\`\`
+
+### 2) Utility guards
+\`\`\`ts
+import { isPending, isSuccess, isError } from '@intrig/react';
+\`\`\`
+
+### 3) Hook instance (auto-clear on unmount)
+\`\`\`ts
+const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}({ clearOnUnmount: true });
+\`\`\`
+
+---
+
+## TL;DR (copy–paste)
+
+\`\`\`tsx
+import { use${pluginSdk.pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
+import { isPending, isSuccess, isError } from '@intrig/react';
+import { useEffect, useState } from 'react';
+
+export default function Example() {
+  const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}({ clearOnUnmount: true });
+  const [messages, setMessages] = useState<any[]>([]);
+
+  useEffect(() => {
+    ${actionName}(${callArgs}); // start stream
+  }, [${actionName}]);
+
+  useEffect(() => {
+    // SSE delivers messages while state is Pending
+    if (isPending(${respVar})) {
+      setMessages((prev) => [...prev, ${respVar}.data]);
+    }
+  }, [${respVar}]);
+
+  if (isError(${respVar})) return <>An error occurred</>;
+  if (isPending(${respVar})) return <pre>{JSON.stringify(messages, null, 2)}</pre>;
+  if (isSuccess(${respVar})) return <>Completed</>;
+
+  return null;
+}
+\`\`\`
+
+${requestBodyType || paramsType ? `### Optional types (if generated by your build)
+\`\`\`ts
+${requestBodyType ? `import type { ${requestBodyType} } from '@intrig/react/${descriptor.source}/components/schemas/${requestBodyType}';\n` : ''}${paramsType ? `import type { ${paramsType} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.params';\n` : ''}import type { ${responseTypeName} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.response';
+\`\`\`
+` : ''}
+
+---
+
+## Hook API
+
+\`\`\`ts
+// Signature (shape shown; concrete generics vary per generated hook)
+declare function use${pluginSdk.pascalCase(descriptor.name)}(options?: {
+  fetchOnMount?: boolean;
+  clearOnUnmount?: boolean;   // recommended for streams
+  key?: string;               // isolate multiple subscriptions
+  params?: ${paramsType != null ? paramsType : 'unknown'};
+  body?: ${requestBodyType != null ? requestBodyType : 'unknown'};
+}): [
+  // While streaming: isPending(state) === true and state.data is the latest event
+  NetworkState<${responseTypeName} /* or event payload type */, any>,
+  // Start streaming:
+  (req: { params?: ${paramsType != null ? paramsType : 'unknown'}; body?: ${requestBodyType != null ? requestBodyType : 'unknown'} }) => void,
+  // Clear/close stream:
+  () => void
+];
+\`\`\`
+
+> **Important:** For SSE, **each incoming event** is surfaced as \`${respVar}.data\` **only while** \`isPending(${respVar})\` is true. On stream completion the hook flips to \`isSuccess\`.
+
+---
+
+## Usage patterns
+
+### 1) Lifecycle-bound stream (start on mount, auto-clear)
+\`\`\`tsx
+const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}({ clearOnUnmount: true });
+
+useEffect(() => {
+  ${actionName}(${callArgs});
+}, [${actionName}]);
+\`\`\`
+<details><summary>Description</summary>
+Starts the stream when the component mounts and closes it when the component unmounts.
+</details>
+
+### 2) Collect messages into an array (simple collector)
+\`\`\`tsx
+const [messages, setMessages] = useState<any[]>([]);
+
+useEffect(() => {
+  if (isPending(${respVar})) setMessages((m) => [...m, ${respVar}.data]);
+}, [${respVar}]);
+\`\`\`
+<details><summary>Description</summary>
+Appends each event to an in-memory array. Good for logs and chat-like feeds; consider capping length to avoid memory growth.
+</details>
+
+### 3) Keep only the latest event (cheap UI)
+\`\`\`tsx
+const latest = isPending(${respVar}) ? ${respVar}.data : undefined;
+\`\`\`
+<details><summary>Description</summary>
+When you only need the most recent message (progress percentage, status line).
+</details>
+
+### 4) Controlled start/stop (user-triggered)
+\`\`\`tsx
+const [${respVar}, ${actionName}, ${clearName}] = use${pluginSdk.pascalCase(descriptor.name)}();
+
+const start = () => ${actionName}(${callArgs});
+const stop  = () => ${clearName}();
+\`\`\`
+<details><summary>Description</summary>
+Expose play/pause UI for long streams or admin tools.
+</details>
+
+---
+
+## Full example (with flushSync option)
+
+\`\`\`tsx
+import { use${pluginSdk.pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
+import { isPending, isSuccess, isError } from '@intrig/react';
+import { useEffect, useState } from 'react';
+import { flushSync } from '../utils/flush-sync';
+
+function MyComponent() {
+  const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}({ clearOnUnmount: true });
+  const [events, setEvents] = useState<any[]>([]);
+
+  useEffect(() => {
+    ${actionName}(${callArgs});
+  }, [${actionName}]);
+
+  useEffect(() => {
+    if (isPending(${respVar})) {
+      // Use flushSync only if you must render every single event (high-frequency streams).
+      flushSync(() => setEvents((xs) => [...xs, ${respVar}.data]));
+    }
+  }, [${respVar}]);
+
+  if (isError(${respVar})) return <>Stream error</>;
+  return (
+    <>
+      {isPending(${respVar}) && <pre>{JSON.stringify(events, null, 2)}</pre>}
+      {isSuccess(${respVar}) && <>Completed ({events.length} events)</>}
+    </>
+  );
+}
+\`\`\`
+
+---
+
+## Tips, anti-patterns & gotchas
+
+- **Prefer \`clearOnUnmount: true\`** so the EventSource/web request is closed when the component disappears.
+- **Don’t store unbounded arrays** for infinite streams—cap the length or batch to IndexedDB.
+- **Avoid unnecessary \`flushSync\`**; it’s expensive. Use it only when you truly must render every event.
+- **Multiple streams:** supply a unique \`key\` to isolate independent subscriptions.
+- **Server requirements:** SSE endpoints should send \`Content-Type: text/event-stream\`, disable buffering, and flush regularly; add relevant CORS headers if needed.
+- **Completion:** UI can switch from progress view (\`isPending\`) to final view (\`isSuccess\`) automatically.
+
+---
+
+## Troubleshooting
+
+- **No intermediate messages:** ensure the server is truly streaming SSE (correct content type + flush) and that proxies/CDNs aren’t buffering responses.
+- **UI not updating for each event:** remove expensive work from the event effect, consider throttling; only use \`flushSync\` if absolutely necessary.
+- **Stream never completes:** check server end conditions and that you call \`${clearName}\` when appropriate.
+
+`;
+}
+
+function reactHookDocs(descriptor) {
+    const md = pluginSdk.mdLiteral('react-hook.md');
+    var _descriptor_data_variables;
+    // ===== Derived names (preserve these) =====
+    const hasPathParams = ((_descriptor_data_variables = descriptor.data.variables) != null ? _descriptor_data_variables : []).some((v)=>{
+        var _v_in;
+        return ((_v_in = v.in) == null ? void 0 : _v_in.toUpperCase()) === 'PATH';
+    });
+    const actionName = pluginSdk.camelCase(descriptor.name) // e.g. getUser
+    ;
+    const respVar = `${actionName}Resp` // e.g. getUserResp
+    ;
+    const dataVar = `${actionName}Data` // e.g. getUserData
+    ;
+    const clearName = `clear${pluginSdk.pascalCase(descriptor.name)}` // e.g. clearGetUser
+    ;
+    const requestBodyVar = descriptor.data.requestBody ? pluginSdk.camelCase(descriptor.data.requestBody) : undefined;
+    const requestBodyType = descriptor.data.requestBody ? pluginSdk.pascalCase(descriptor.data.requestBody) : undefined;
+    const paramsVar = hasPathParams ? `${actionName}Params` : undefined // e.g. getUserParams
+    ;
+    const paramsType = hasPathParams ? `${pluginSdk.pascalCase(descriptor.name)}Params` : undefined // e.g. GetUserParams
+    ;
+    const responseTypeName = `${pluginSdk.pascalCase(descriptor.name)}ResponseBody`;
+    return md`
+# Intrig React Hooks — Quick Guide
+
+## Copy-paste starter (fast lane)
+
+### 1) Hook import
+${"```ts"}
+import { use${pluginSdk.pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
+${"```"}
+
+### 2) Utility guards
+${"```ts"}
+import { isPending, isError, isSuccess } from '@intrig/react';
+${"```"}
+
+### 3) Hook instance (auto-clear on unmount)
+${"```ts"}
+const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}({ clearOnUnmount: true });
+${"```"}
+
+Intrig stateful hooks expose a **NetworkState** plus **actions** to fetch / clear.
+Use this when you want a cached, reusable result tied to a global store.
+
+---
+
+## TL;DR (copy–paste)
+${"```tsx"}
+import { use${pluginSdk.pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
+import { isPending, isError, isSuccess } from '@intrig/react';
+import { useEffect, useMemo } from 'react';
+
+export default function Example() {
+  const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}({ clearOnUnmount: true });
+
+  useEffect(() => {
+    ${actionName}(${[
+        requestBodyVar,
+        paramsVar != null ? paramsVar : '{}'
+    ].filter(Boolean).join(', ')});
+  }, [${[
+        '' + actionName,
+        requestBodyVar,
+        paramsVar
+    ].filter(Boolean).join(', ')}]);
+
+  const ${dataVar} = useMemo(
+    () => (isSuccess(${respVar}) ? ${respVar}.data : undefined),
+    [${respVar}]
+  );
+
+  if (isPending(${respVar})) return <>Loading…</>;
+  if (isError(${respVar})) return <>Error: {String(${respVar}.error)}</>;
+  return <pre>{JSON.stringify(${dataVar}, null, 2)}</pre>;
+}
+${"```"}
+
+${requestBodyType || paramsType ? `### Optional types (if generated by your build)
+${"```ts"}
+${requestBodyType ? `import type { ${requestBodyType} } from '@intrig/react/${descriptor.source}/components/schemas/${requestBodyType}';
+` : ''}${paramsType ? `import type { ${paramsType} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.params';
+` : ''}// Prefer the concrete response type:
+import type { ${responseTypeName} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.response';
+${"```"}
+` : ''}
+
+---
+
+## Hook API
+${"```ts"}
+// Options are consistent across hooks.
+type UseHookOptions = {
+  /** Execute once after mount with provided params/body (if required). */
+  fetchOnMount?: boolean;
+  /** Reset the state on unmount (recommended). */
+  clearOnUnmount?: boolean;
+  /** Distinguish multiple instances of the same hook. */
+  key?: string;
+  /** Initial path params for endpoints that require them. */
+  params?: ${paramsType != null ? paramsType : 'unknown'};
+  /** Initial request body (for POST/PUT/etc.). */
+  body?: ${requestBodyType != null ? requestBodyType : 'unknown'};
+};
+
+// Prefer concrete types if your build emits them:
+// import type { ${responseTypeName} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.response';
+
+type ${pluginSdk.pascalCase(descriptor.name)}Data = ${'typeof ' + responseTypeName !== 'undefined' ? responseTypeName : 'unknown'}; // replace with ${responseTypeName} if generated
+type ${pluginSdk.pascalCase(descriptor.name)}Request = { params?: ${paramsType != null ? paramsType : 'unknown'}; body?: ${requestBodyType != null ? requestBodyType : 'unknown'}; };
+
+// Signature (shape shown; concrete generics vary per generated hook)
+declare function use${pluginSdk.pascalCase(descriptor.name)}(options?: UseHookOptions): [
+  NetworkState<${pluginSdk.pascalCase(descriptor.name)}Data>,
+  (req: ${pluginSdk.pascalCase(descriptor.name)}Request) => void,
+  () => void
+];
+${"```"}
+
+### NetworkState & guards
+${"```ts"}
+import { isPending, isError, isSuccess } from '@intrig/react';
+${"```"}
+
+---
+
+## Conceptual model (Stateful = single source of truth)
+- Lives in a shared store keyed by \`key\` + request signature.
+- Best for **read** endpoints you want to **reuse** or keep **warm** (lists, details, search).
+- Lifecycle helpers:
+  - \`fetchOnMount\` to kick off automatically.
+  - \`clearOnUnmount\` to clean up (recommended default).
+  - \`key\` to isolate multiple independent instances.
+
+---
+
+## Usage patterns
+
+### 1) Controlled (most explicit)
+${"```tsx"}
+const [${respVar}, ${actionName}, ${clearName}] = use${pluginSdk.pascalCase(descriptor.name)}();
+
+useEffect(() => {
+  ${actionName}(${[
+        requestBodyVar,
+        paramsVar != null ? paramsVar : '{}'
+    ].filter(Boolean).join(', ')});
+  return ${clearName}; // optional cleanup
+}, [${[
+        '' + actionName,
+        clearName
+    ].join(', ')}]);
+${"```"}
+
+<details><summary>Description</summary>
+<p><strong>Use when</strong> you need explicit control over when a request fires, what params/body it uses, and when to clean up. Ideal for search forms, pagination, conditional fetches.</p>
+</details>
+
+### 2) Lifecycle-bound (shorthand)
+${"```tsx"}
+const [${respVar}] = use${pluginSdk.pascalCase(descriptor.name)}({
+  fetchOnMount: true,
+  clearOnUnmount: true,
+  ${requestBodyType ? `body: ${requestBodyVar},` : ''} ${paramsType ? `params: ${paramsVar != null ? paramsVar : '{}'},` : 'params: {},'}
+});
+${"```"}
+
+<details><summary>Description</summary>
+<p><strong>Use when</strong> the data should follow the component lifecycle: fetch once on mount, reset on unmount.</p>
+</details>
+
+### 3) Passive observer (render when data arrives)
+${"```tsx"}
+const [${respVar}] = use${pluginSdk.pascalCase(descriptor.name)}();
+return isSuccess(${respVar}) ? <>{String(${respVar}.data)}</> : null;
+${"```"}
+
+<details><summary>Description</summary>
+<p><strong>Use when</strong> another part of the app triggers the fetch and this component only reads the state.</p>
+</details>
+
+### 4) Keep previous success while refetching (sticky)
+${"```tsx"}
+const [${dataVar}, set${pluginSdk.pascalCase(descriptor.name)}Data] = useState<any>();
+const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}();
+
+useEffect(() => {
+  if (isSuccess(${respVar})) set${pluginSdk.pascalCase(descriptor.name)}Data(${respVar}.data);
+}, [${respVar}]);
+
+return (
+  <>
+    {isPending(${respVar}) && ${dataVar} ? <div>Refreshing…</div> : null}
+    <pre>{JSON.stringify(isSuccess(${respVar}) ? ${respVar}.data : ${dataVar}, null, 2)}</pre>
+  </>
+);
+${"```"}
+
+<details><summary>Description</summary>
+<p><strong>Use when</strong> you want SWR-like UX without flicker.</p>
+</details>
+
+### 5) Multiple instances of the same hook (isolate with \`key\`)
+${"```tsx"}
+const a = use${pluginSdk.pascalCase(descriptor.name)}({ key: 'A', fetchOnMount: true, ${paramsType ? `params: ${paramsVar != null ? paramsVar : '{}'} ` : 'params: {}'} });
+const b = use${pluginSdk.pascalCase(descriptor.name)}({ key: 'B', fetchOnMount: true, ${paramsType ? `params: ${paramsVar != null ? paramsVar : '{}'} ` : 'params: {}'} });
+${"```"}
+
+<details><summary>Description</summary>
+<p>Use unique keys to prevent state collisions.</p>
+</details>
+
+---
+
+## Before / After mini-migrations
+
+### If you mistakenly used Stateful for a simple submit → switch to Async
+${"```diff"}
+- const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}();
+- ${actionName}(${[
+        requestBodyVar,
+        paramsVar != null ? paramsVar : '{}'
+    ].filter(Boolean).join(', ')});
++ const [fn] = use${pluginSdk.pascalCase(descriptor.name)}Async();
++ await fn(${[
+        requestBodyVar,
+        paramsVar
+    ].filter(Boolean).join(', ')});
+${"```"}
+
+### If you started with Async but need to read later in another component → Stateful
+${"```diff"}
+- const [fn] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+- const data = await fn(${[
+        requestBodyVar,
+        paramsVar
+    ].filter(Boolean).join(', ')});
++ const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}({ fetchOnMount: true, clearOnUnmount: true, ${paramsType ? `params: ${paramsVar != null ? paramsVar : '{}'},` : 'params: {},'} ${requestBodyType ? `body: ${requestBodyVar}` : ''} });
++ // read from ${respVar} anywhere with use${pluginSdk.pascalCase(descriptor.name)}()
+${"```"}
+
+---
+
+## Anti-patterns
+<details><summary>Don’t use Stateful for field validations or a one-off submit</summary>
+Use the Async variant instead: \`const [fn] = use${pluginSdk.pascalCase(descriptor.name)}Async()\`.
+</details>
+<details><summary>Don’t use Async for long-lived lists or detail views</summary>
+Use Stateful so other components can read the same data and you can avoid refetch churn.
+</details>
+<details><summary>Don’t forget required \`params\` when using \`fetchOnMount\`</summary>
+Provide \`params\` (and \`body\` if applicable) or switch to the controlled pattern.
+</details>
+<details><summary>Rendering the same hook twice without a \`key\`</summary>
+If they should be independent, add a unique \`key\`.
+</details>
+
+---
+
+## Error & UX guidance
+- **Loading:** early return or inline spinner. Prefer **sticky data** to avoid blanking content.
+- **Errors:** show a banner or inline errors depending on UX; keep previous good state if possible.
+- **Cleanup:** prefer \`clearOnUnmount: true\` as the default.
+
+---
+
+## Concurrency patterns
+- **Refresh:** call the action again; combine with sticky data for smooth UX.
+- **Dedupe:** isolate instances with \`key\`.
+- **Parallel:** render two keyed instances; don’t share the same key.
+
+---
+
+## Full examples
+
+### Short format (lifecycle-bound)
+${"```tsx"}
+import { use${pluginSdk.pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
+import { isPending, isError, isSuccess } from '@intrig/react';
+import { useMemo } from 'react';
+
+function ShortExample() {
+  const [${respVar}] = use${pluginSdk.pascalCase(descriptor.name)}({
+    fetchOnMount: true,
+    clearOnUnmount: true,
+    ${requestBodyType ? `body: ${requestBodyVar},` : ''} ${paramsType ? `params: ${paramsVar != null ? paramsVar : '{}'},` : 'params: {},'}
+  });
+
+  const ${dataVar} = useMemo(() => (isSuccess(${respVar}) ? ${respVar}.data : undefined), [${respVar}]);
+
+  if (isPending(${respVar})) return <>Loading…</>;
+  if (isError(${respVar})) return <>Error: {String(${respVar}.error)}</>;
+  return <pre>{JSON.stringify(${dataVar}, null, 2)}</pre>;
+}
+${"```"}
+
+<details><summary>Description</summary>
+<p>Compact lifecycle-bound approach. Great for read-only pages that load once and clean up on unmount.</p>
+</details>
+
+### Controlled format (explicit actions)
+${"```tsx"}
+import { use${pluginSdk.pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
+import { isPending, isError, isSuccess } from '@intrig/react';
+import { useEffect, useMemo } from 'react';
+
+function ControlledExample() {
+  const [${respVar}, ${actionName}, ${clearName}] = use${pluginSdk.pascalCase(descriptor.name)}();
+
+  useEffect(() => {
+    ${actionName}(${[
+        requestBodyVar,
+        paramsVar != null ? paramsVar : '{}'
+    ].filter(Boolean).join(', ')});
+    return ${clearName};
+  }, [${[
+        '' + actionName,
+        clearName
+    ].join(', ')}]);
+
+  const ${dataVar} = useMemo(() => (isSuccess(${respVar}) ? ${respVar}.data : undefined), [${respVar}]);
+
+  if (isPending(${respVar})) return <>Loading…</>;
+  if (isError(${respVar})) return <>An error occurred: {String(${respVar}.error)}</>;
+  return <pre>{JSON.stringify(${dataVar}, null, 2)}</pre>;
+}
+${"```"}
+
+---
+
+## Gotchas & Tips
+- Prefer **\`clearOnUnmount: true\`** in most components.
+- Use **\`key\`** for multiple independent instances.
+- Memoize derived values with **\`useMemo\`** to avoid churn.
+- Inline indicators keep the rest of the page interactive.
+
+---
+
+## Reference: State helpers
+${"```ts"}
+if (isPending(${respVar})) { /* show spinner */ }
+if (isError(${respVar}))   { /* show error */ }
+if (isSuccess(${respVar})) { /* read ${respVar}.data */ }
+${"```"}
+`;
+}
+
+function reactAsyncFunctionHookDocs(descriptor) {
+    const md = pluginSdk.mdLiteral('async-hook.md');
+    var _descriptor_data_variables;
+    // ===== Derived names (preserve these) =====
+    const hasPathParams = ((_descriptor_data_variables = descriptor.data.variables) != null ? _descriptor_data_variables : []).some((v)=>{
+        var _v_in;
+        return ((_v_in = v.in) == null ? void 0 : _v_in.toUpperCase()) === 'PATH';
+    });
+    const actionName = pluginSdk.camelCase(descriptor.name) // e.g. getUser
+    ;
+    const abortName = `abort${pluginSdk.pascalCase(descriptor.name)}` // e.g. abortGetUser
+    ;
+    const requestBodyVar = descriptor.data.requestBody ? pluginSdk.camelCase(descriptor.data.requestBody) // e.g. createUser
+     : undefined;
+    const requestBodyType = descriptor.data.requestBody ? pluginSdk.pascalCase(descriptor.data.requestBody) // e.g. CreateUser
+     : undefined;
+    const paramsVar = hasPathParams ? `${actionName}Params` : undefined // e.g. getUserParams
+    ;
+    const paramsType = hasPathParams ? `${pluginSdk.pascalCase(descriptor.name)}Params` : undefined // e.g. GetUserParams
+    ;
+    const responseTypeName = `${pluginSdk.pascalCase(descriptor.name)}ResponseBody` // e.g. GetUserResponseBody
+    ;
+    const callArgs = [
+        requestBodyVar,
+        paramsVar
+    ].filter(Boolean).join(', ');
+    return md`
+# Intrig Async Hooks — Quick Guide
+
+## Copy-paste starter (fast lane)
+
+### 1) Hook import
+${"```ts"}
+import { use${pluginSdk.pascalCase(descriptor.name)}Async } from '@intrig/react/${descriptor.path}/client';
+${"```"}
+
+### 2) Create an instance
+${"```ts"}
+const [${actionName}, ${abortName}] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+${"```"}
+
+### 3) Call it (awaitable)
+${"```ts"}
+// body?, params? — pass what your endpoint needs (order: body, params)
+await ${actionName}(${callArgs});
+${"```"}
+
+Async hooks are for one-off, low-friction calls (e.g., validations, submissions). They return an **awaitable function** plus an **abort** function. No NetworkState.
+
+---
+
+## TL;DR (copy–paste)
+${"```tsx"}
+import { use${pluginSdk.pascalCase(descriptor.name)}Async } from '@intrig/react/${descriptor.path}/client';
+import { useCallback, useEffect } from 'react';
+
+export default function Example() {
+  const [${actionName}, ${abortName}] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+
+  const run = useCallback(async () => {
+    try {
+      const result = await ${actionName}(${callArgs});
+      // do something with result
+      console.log(result);
+    } catch (e) {
+      // request failed or was aborted
+      console.error(e);
+    }
+  }, [${actionName}]);
+
+  // Optional: abort on unmount
+  useEffect(() => ${abortName}, [${abortName}]);
+
+  return <button onClick={run}>Call</button>;
+}
+${"```"}
+
+${requestBodyType || paramsType ? `### Optional types (if generated by your build)
+${"```ts"}
+${requestBodyType ? `import type { ${requestBodyType} } from '@intrig/react/${descriptor.source}/components/schemas/${requestBodyType}';
+` : ''}${paramsType ? `import type { ${paramsType} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.params';
+` : ''}import type { ${responseTypeName} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.response';
+${"```"}
+` : ''}
+
+---
+
+## Hook API
+${"```ts"}
+// Prefer concrete types if your build emits them:
+// import type { ${responseTypeName} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.response';
+// ${paramsType ? `import type { ${paramsType} } from '@intrig/react/${descriptor.path}/${pluginSdk.pascalCase(descriptor.name)}.params';` : ''}
+
+type ${pluginSdk.pascalCase(descriptor.name)}Data = ${'unknown'}; // replace with ${responseTypeName} if generated
+type ${pluginSdk.pascalCase(descriptor.name)}Request = {
+  body?: ${requestBodyType != null ? requestBodyType : 'unknown'};
+  params?: ${paramsType != null ? paramsType : 'unknown'};
+};
+
+// Signature (shape shown; return type depends on your endpoint)
+declare function use${pluginSdk.pascalCase(descriptor.name)}Async(): [
+  (body?: ${pluginSdk.pascalCase(descriptor.name)}Request['body'], params?: ${pluginSdk.pascalCase(descriptor.name)}Request['params']) => Promise<${pluginSdk.pascalCase(descriptor.name)}Data>,
+  () => void // abort
+];
+${"```"}
+
+### Why async hooks?
+- **No state machine:** just \`await\` the result.
+- **Great for validations & submits:** uniqueness checks, field-level checks, updates.
+- **Abortable:** cancel in-flight work on demand.
+
+---
+
+## Usage Patterns
+
+### 1) Simple try/catch (recommended)
+${"```tsx"}
+const [${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+
+try {
+  const res = await ${actionName}(${callArgs});
+  // use res
+} catch (e) {
+  // network error or abort
+}
+${"```"}
+
+<details><summary>Description</summary>
+<p><strong>Use when</strong> you just need the value or an error. Ideal for validators, uniqueness checks, or quick lookups.</p>
+</details>
+
+### 2) Abort on unmount (safe cleanup)
+${"```tsx"}
+const [${actionName}, ${abortName}] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+
+useEffect(() => ${abortName}, [${abortName}]);
+${"```"}
+
+<details><summary>Description</summary>
+<p><strong>Use when</strong> the component may unmount while a request is in-flight (route changes, conditional UI).</p>
+</details>
+
+### 3) Debounced validation (e.g., on input change)
+${"```tsx"}
+const [${actionName}, ${abortName}] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+
+const onChange = useMemo(() => {
+  let t: any;
+  return (${requestBodyVar ? `${requestBodyVar}: ${requestBodyType != null ? requestBodyType : 'any'}` : 'value: string'}) => {
+    clearTimeout(t);
+    t = setTimeout(async () => {
+      try {
+        // Optionally abort before firing a new request
+        ${abortName}();
+        await ${actionName}(${[
+        requestBodyVar != null ? requestBodyVar : '/* body from value */',
+        paramsVar != null ? paramsVar : '/* params? */'
+    ].join(', ')});
+      } catch {}
+    }, 250);
+  };
+}, [${actionName}, ${abortName}]);
+${"```"}
+
+<details><summary>Description</summary>
+<p><strong>Use when</strong> validating as the user types. Debounce to reduce chatter; consider <code>${abortName}()</code> before firing a new call.</p>
+</details>
+
+### 4) Guard against races (latest-only)
+${"```tsx"}
+const [${actionName}, ${abortName}] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+
+const latestOnly = async () => {
+  ${abortName}();
+  return ${actionName}(${callArgs});
+};
+${"```"}
+
+<details><summary>Description</summary>
+<p><strong>Use when</strong> only the most recent call should win (search suggestions, live filters).</p>
+</details>
+
+---
+
+## Full example
+${"```tsx"}
+import { use${pluginSdk.pascalCase(descriptor.name)}Async } from '@intrig/react/${descriptor.path}/client';
+import { useCallback } from 'react';
+
+function MyComponent() {
+  const [${actionName}, ${abortName}] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+
+  const run = useCallback(async () => {
+    try {
+      const data = await ${actionName}(${callArgs});
+      alert(JSON.stringify(data));
+    } catch (e) {
+      console.error('Call failed/aborted', e);
+    }
+  }, [${actionName}]);
+
+  return (
+    <>
+      <button onClick={run}>Call remote</button>
+      <button onClick={${abortName}}>Abort</button>
+    </>
+  );
+}
+${"```"}
+
+---
+
+## Gotchas & Tips
+- **No \`NetworkState\`:** async hooks return a Promise, not a state machine.
+- **Abort:** always available; call it to cancel the latest in-flight request.
+- **Errors:** wrap calls with \`try/catch\` to handle network failures or abort errors.
+- **Debounce & throttle:** combine with timers to cut down chatter for typeahead/validators.
+- **Types:** prefer generated \`${responseTypeName}\` and \`${paramsType != null ? paramsType : '...Params'}\` if your build emits them.
+
+---
+
+## Reference: Minimal cheat sheet
+${"```ts"}
+const [fn, abort] = use${pluginSdk.pascalCase(descriptor.name)}Async();
+await fn(${callArgs});
+abort(); // optional
+${"```"}
+`;
+}
+
+function reactDownloadHookDocs(descriptor) {
+    const md = pluginSdk.mdLiteral('download-hook.md');
+    var _descriptor_data_variables;
+    // ===== Derived names (preserve these) =====
+    const hasPathParams = ((_descriptor_data_variables = descriptor.data.variables) != null ? _descriptor_data_variables : []).some((v)=>{
+        var _v_in;
+        return ((_v_in = v.in) == null ? void 0 : _v_in.toUpperCase()) === 'PATH';
+    });
+    const actionName = pluginSdk.camelCase(descriptor.name); // e.g. downloadTaskFile
+    const respVar = `${actionName}Resp`; // e.g. downloadTaskFileResp
+    const paramsVar = hasPathParams ? `${actionName}Params` : undefined; // e.g. downloadTaskFileParams
+    const paramsType = hasPathParams ? `${pluginSdk.pascalCase(descriptor.name)}Params` : undefined; // e.g. DownloadTaskFileParams
+    const pascal = pluginSdk.pascalCase(descriptor.name);
+    const responseTypeName = `${pascal}ResponseBody`; // e.g. DownloadTaskFileResponseBody
+    return md`
+# Intrig Download Hooks — Quick Guide
+
+## Copy-paste starter (fast lane)
+
+### Auto-download (most common)
+${"```ts"}
+import { use${pascal}Download } from '@intrig/react/${descriptor.path}/client';
+${"```"}
+${"```ts"}
+import { isPending, isError } from '@intrig/react';
+${"```"}
+${"```tsx"}
+const [${respVar}, ${actionName}] = use${pascal}Download({ clearOnUnmount: true });
+// e.g., in a click handler:
+${actionName}(${paramsType ? paramsVar != null ? paramsVar : '{}' : '{}'});
+${"```"}
+
+### Manual/stateful (you handle the blob/UI)
+${"```ts"}
+import { use${pascal} } from '@intrig/react/${descriptor.path}/client';
+${"```"}
+${"```ts"}
+import { isSuccess, isPending, isError } from '@intrig/react';
+${"```"}
+${"```tsx"}
+const [${respVar}, ${actionName}] = use${pascal}({ clearOnUnmount: true });
+// later:
+${actionName}(${paramsType ? paramsVar != null ? paramsVar : '{}' : '{}'});
+${"```"}
+
+---
+
+## TL;DR (auto-download)
+${"```tsx"}
+import { use${pascal}Download } from '@intrig/react/${descriptor.path}/client';
+import { isPending, isError } from '@intrig/react';
+
+export default function Example() {
+  const [${respVar}, ${actionName}] = use${pascal}Download({ clearOnUnmount: true });
+
+  return (
+    <button
+      onClick={() => ${actionName}(${paramsType ? paramsVar != null ? paramsVar : '{}' : '{}'})}
+      disabled={isPending(${respVar})}
+    >
+      {isPending(${respVar}) ? 'Downloading…' : 'Download'}
+    </button>
+  );
+}
+${"```"}
+
+${paramsType ? `### Optional types (if generated by your build)
+${"```ts"}
+import type { ${paramsType} } from '@intrig/react/${descriptor.path}/${pascal}.params';
+import type { ${responseTypeName} } from '@intrig/react/${descriptor.path}/${pascal}.response';
+${"```"}
+` : ''}
+
+---
+
+## Hook APIs
+
+### \`use${pascal}Download\` (auto-download)
+- **What it does:** requests the file with \`responseType: 'blob'\` + \`adapter: 'fetch'\`, derives filename from \`Content-Disposition\` if present, creates a temporary object URL, clicks a hidden \`<a>\`, **downloads**, then resets state to \`init\`.
+- **Signature:** \`[state, download, clear]\`
+  - \`download(params: ${paramsType != null ? paramsType : 'Record<string, unknown>'}) => void\`
+
+### \`use${pascal}\` (manual/stateful)
+- **What it does:** same request but **does not** auto-save. You control preview/saving using \`state.data\` + \`state.headers\`.
+- **Signature:** \`[state, fetchFile, clear]\`
+  - \`fetchFile(params: ${paramsType != null ? paramsType : 'Record<string, unknown>'}) => void\`
+
+---
+
+## Usage Patterns
+
+### 1) Auto-download on click (recommended)
+${"```tsx"}
+const [${respVar}, ${actionName}] = use${pascal}Download({ clearOnUnmount: true });
+
+<button
+  onClick={() => ${actionName}(${paramsType ? paramsVar != null ? paramsVar : '{}' : '{}'})}
+  disabled={isPending(${respVar})}
+>
+  {isPending(${respVar}) ? 'Downloading…' : 'Download file'}
+</button>
+{isError(${respVar}) ? <p className="text-red-500">Failed to download.</p> : null}
+${"```"}
+
+<details><summary>Description</summary>
+<p>Most users just need a button that saves the file. This variant handles object URL creation, filename extraction, click, and state reset.</p>
+</details>
+
+### 2) Auto-download on mount (e.g., “Your file is ready” page)
+${"```tsx"}
+useEffect(() => {
+  ${actionName}(${paramsType ? paramsVar != null ? paramsVar : '{}' : '{}'});
+}, [${actionName}]);
+${"```"}
+
+<details><summary>Description</summary>
+<p>Good for post-processing routes that immediately start a download.</p>
+</details>
+
+### 3) Manual handling (preview or custom filename)
+${"```tsx"}
+const [${respVar}, ${actionName}] = use${pascal}({ clearOnUnmount: true });
+
+useEffect(() => {
+  if (isSuccess(${respVar})) {
+    const ct = ${respVar}.headers?.['content-type'] ?? 'application/octet-stream';
+    const parts = Array.isArray(${respVar}.data) ? ${respVar}.data : [${respVar}.data];
+    const url = URL.createObjectURL(new Blob(parts, { type: ct }));
+    // preview/save with your own UI...
+    return () => URL.revokeObjectURL(url);
+  }
+}, [${respVar}]);
+${"```"}
+
+<details><summary>Description</summary>
+<p>Use when you need to inspect headers, show a preview, or control the filename/UI flow.</p>
+</details>
+
+---
+
+## Behavior notes (what the auto-download variant does)
+- Forces \`responseType: 'blob'\` and \`adapter: 'fetch'\`.
+- If \`content-type\` is JSON, stringifies payload so the saved file is human-readable.
+- Parses \`Content-Disposition\` to derive a filename; falls back to a default.
+- Creates and clicks a temporary link, then **resets state to \`init\`**.
+
+---
+
+## Gotchas & Tips
+- **Expose headers in CORS:** server should send  
+  \`Access-Control-Expose-Headers: Content-Disposition, Content-Type\`
+- **Disable double clicks:** guard with \`isPending(state)\`.
+- **Revoke URLs** when you create them manually in the stateful variant.
+- **iOS Safari:** blob downloads may open a new tab—consider server-side direct-download URLs for a smoother UX.
+
+---
+
+## Troubleshooting
+- **No filename shown:** your server didn’t include \`Content-Disposition\`. Add it.
+- **Got JSON instead of a file:** server returned \`application/json\` (maybe an error). The auto hook saves it as text; surface the error in UI.
+- **Nothing happens on click:** ensure you’re using the **Download** variant and the request succeeds (check Network tab); verify CORS headers.
+
+---
+`;
+}
+
+async function getEndpointDocumentation(result) {
+    const tabs = [];
+    if (result.data.responseType === 'text/event-stream') {
+        tabs.push({
+            name: 'SSE Hook',
+            content: (await reactSseHookDocs(result)).content
+        });
+    } else {
+        tabs.push({
+            name: 'Stateful Hook',
+            content: (await reactHookDocs(result)).content
+        });
+    }
+    tabs.push({
+        name: 'Stateless Hook',
+        content: (await reactAsyncFunctionHookDocs(result)).content
+    });
+    if (result.data.isDownloadable) {
+        tabs.push({
+            name: 'Download Hook',
+            content: (await reactDownloadHookDocs(result)).content
+        });
+    }
+    return tabs;
+}
+
+function createPlugin() {
+    return {
+        meta () {
+            return {
+                name: 'intrig-binding',
+                version: '0.0.1',
+                compat: '^0.0.15'
+            };
+        },
+        generate: generateCode,
+        getSchemaDocumentation,
+        getEndpointDocumentation
+    };
+}
+
+exports.createPlugin = createPlugin;
+exports.default = createPlugin;