@codenotch/codenotch.react 2.0.0 → 2.0.1

package/src/index.ts

@@ -1,15 +1,11 @@
 import { createElement, useSyncExternalStore, type ComponentType, type ComponentProps, type FunctionComponent, type ReactNode, type RefAttributes } from "react";
 import { flushSync } from "react-dom";
 import { createRoot, Root } from "react-dom/client";
-import { SignalR } from "./core/SignalR";
-import ProcessUtils from "./core/ProcessUtils";
 import { IDisposable } from "./models/Misc";
 import { ICodenotchApi, ICodenotchDialog, ICodenotchEnv, IProcessResult, WithCodenotchProps } from "./models/Codenotch";
 import { v4 } from "uuid";
 import CodeEditor from "./components/CodeEditor";
 
-var signalR: SignalR | undefined = undefined;
-
 /**
  * The Codenotch runtime environment, populated by {@link init}.
  * Prefer reading it through `useCodenotch().env`.
@@ -51,7 +47,6 @@ function subscribe(listener: () => void): () => void {
  * any other source). It must be called before `useCodenotch()` is used.
  *
  * Recognized key formats:
- * - `i18n.<key>.<language>` — a translation, stored in `env.i18n[language][key]`.
  *   The first language found becomes the current language if none is set.
  * - `GLOBAL.<name>` — JSON value assigned to `window[name]` (or `globalThis`).
  * - `appManifest` / `projectManifest` — parsed as JSON into the environment.
@@ -66,9 +61,7 @@ function subscribe(listener: () => void): () => void {
  * init({
  *     clusterUrl: 'https://cluster.example.com',
  *     serviceName: 'myproject',
- *     tenantName: 'acme',
- *     'i18n.welcome.en': 'Welcome',
- *     'i18n.welcome.fr': 'Bienvenue'
+ *     tenantName: 'acme'
  * });
  */
 function init(envVariables: any): void {
@@ -77,8 +70,6 @@ function init(envVariables: any): void {
     // Ensure envVariables is an object
     if (typeof envVariables === 'object' && envVariables !== null) {
 
-        let i18nLanguages = new Set<string>();
-
         Object.keys(envVariables).forEach((key) => {
             try {
                 if (key.startsWith('GLOBAL.')) {
@@ -89,23 +80,6 @@ function init(envVariables: any): void {
                     console.log(`Codenotch global variable ${globalKey} set!`);
                     return;
                 }
-                else if (key.startsWith("i18n.")) {
-                    // Special case
-                    let parts = key.split("."); // i18n.someKey.fr
-                    let language = parts[parts.length - 1]; // fr
-                    let keyName = parts.slice(1, parts.length - 1).join("."); // someKey
-                    i18nLanguages.add(language);
-
-                    let value = `${envVariables[key]}`.trim();
-                    if (value.startsWith('"') && value.endsWith('"')) {
-                        // Parse like json
-                        value = JSON.parse(value);
-                    }
-
-                    env.i18n = env.i18n ?? {};
-                    env.i18n[language] = env.i18n[language] ?? {};
-                    env.i18n[language][keyName] = value;
-                }
                 else {
                     (env as any)[key] = envVariables[key];
 
@@ -126,20 +100,6 @@ function init(envVariables: any): void {
                 console.error(`Error processing Codenotch environment variable ${key}:`, error);
             }
         });
-
-        if (env.language === undefined) {
-            // If current language is not defined, we set it to the first language found in i18n
-            if (i18nLanguages.size > 0) {
-                env.language = Array.from(i18nLanguages)[0];
-                console.log(`Codenotch current language set to ${env.language}`);
-            }
-        }
-
-    }
-
-    // Instantiate SignalR for further use in the API
-    if (env.clusterUrl && env.serviceName) {
-        signalR = new SignalR(env.clusterUrl, env.serviceName, false, env.accessToken);
     }
 
     // Get theme like AEC does
@@ -217,57 +177,8 @@ function createApi(): ICodenotchApi {
 
             return await response.json();
         },
-        i18n: (key: string, ...args: any[]): string => {
-            try {
-                if (env.i18n === undefined || Object.keys(env.i18n).length === 0) {
-                    console.warn("Codenotch i18n is not defined. Please set it in the Codenotch configuration.");
-                    return key;
-                }
-
-                let language = env.language ?? "en";
-                let isLanguageExists = env.i18n[language] !== undefined;
-                if (isLanguageExists === false) {
-                    let fallbackLanguage = Object.keys(env.i18n)[0];
-                    console.warn(`Codenotch i18n language ${language} is not defined. Falling back to ${fallbackLanguage}. Please set the correct language in the Codenotch configuration.`);
-                    language = fallbackLanguage;
-                }
-
-                let dico = env.i18n[language];
-                let value = dico[key];
-
-                if (typeof value !== "string") {
-                    console.warn(`Codenotch i18n key ${key} is not defined for language ${language}. Please set it in the Codenotch configuration.`);
-                    return key;
-                }
-                args = args ?? [];
-
-                let result = value.replace(/{([\d ]*)}/g, (match, p1) => {
-                    let argValue = args[p1.trim()];
-                    // Instead of returning 'undefined', returns an empty string
-                    return argValue !== undefined ? argValue : "";
-                });
-
-                return result;
-            }
-            catch (error) {
-                console.error("Error in i18n function:", error);
-                return key;
-            }
-        },
-        startProcess: async (processName: any, startNodeId: any, inputs: any): Promise<IProcessResult> => {
-            if (env.clusterUrl === undefined) throw new Error(MISSING_CLUSTER_URL_ERROR);
-            if (env.serviceName === undefined) throw new Error(MISSING_SERVICE_NAME_ERROR);
-            if (env.tenantName === undefined) throw new Error(MISSING_TENANT_NAME_ERROR);
-            if (signalR === undefined) throw new Error("SignalR not available. Cannot start process.");
-            return ProcessUtils.startProcess((processInstanceId, callbacks) => signalR!.subscribeToProcessInstance(processInstanceId, callbacks),
-                env.clusterUrl,
-                env.tenantName,
-                env.serviceName,
-                processName,
-                inputs,
-                undefined,
-                startNodeId ?? 'start',
-                env.accessToken);
+        startProcess: async <TProcess, TInput, TOutput>(process: TProcess, inputs: TInput): Promise<IProcessResult<TOutput>> => {
+            throw new Error('Not implemented.');
         },
         getUrlParams: () => {
             let result: { [key: string]: string } = {};
@@ -345,21 +256,6 @@ function createApi(): ICodenotchApi {
 
             return result;
         },
-        listenSignal: async (signalId: string, callback: (data: any) => void): Promise<IDisposable> => {
-
-            if (!signalR) {
-                throw new Error("SignalR not available. Cannot listen to signal.");
-            }
-
-            let unsubscribeFunc = await signalR.subscribeToSignal(signalId, callback);
-
-            return {
-                dispose: () => {
-                    unsubscribeFunc();
-                }
-            };
-
-        },
         setTheme: (theme: 'light' | 'dark') => {
             if (env.theme === theme) return;
             if (env.theme) document.documentElement.classList.remove(env.theme);
@@ -427,7 +323,7 @@ function getCodenotch(): ICodenotchApi {
  *
  * The reference is stable across renders and only changes when the environment
  * changes (`setLanguage`, `setTheme`, `init`), in which case every component
- * using the hook re-renders — so `cn.i18n(...)` output follows the current
+ * using the hook re-renders output follows the current
  * language automatically, and the object is safe to use in `useMemo` /
  * `useEffect` dependency arrays.
  *
@@ -435,15 +331,6 @@ function getCodenotch(): ICodenotchApi {
  * component or a custom hook). Outside of components — handlers defined in
  * plain modules, services, class components — use {@link getCodenotch} or
  * {@link withCodenotch} instead.
- *
- * @returns The Codenotch API: BPMN processes, CNQL queries, i18n, signals, theme…
- * @example
- * import { useCodenotch } from 'codenotch-react';
- *
- * const MyApp = () => {
- *     const cn = useCodenotch();
- *     return <h1>{cn.i18n('welcome')}</h1>;
- * };
  */
 function useCodenotch(): ICodenotchApi {
     return useSyncExternalStore(subscribe, getCodenotch, getCodenotch);
@@ -485,21 +372,6 @@ type ComponentInstance<C> = C extends new (...args: any[]) => infer I ? I : neve
  *
  * @param Component A component whose props extend {@link WithCodenotchProps}.
  * @returns A component with the same props minus `cn`.
- * @example
- * import { withCodenotch, WithCodenotchProps } from 'codenotch-react';
- *
- * interface Props extends WithCodenotchProps {
- *     userId: string;
- * }
- *
- * class TodoList extends React.Component<Props> {
- *     render() {
- *         return <h1>{this.props.cn.i18n('todos.title')}</h1>;
- *     }
- * }
- *
- * export default withCodenotch(TodoList);
- * // <TodoList userId="42" />  — `cn` is injected
  */
 function withCodenotch<C extends ComponentType<any>>(
     Component: C
@@ -523,10 +395,6 @@ export {
     CodeEditor
 };
 
-// Public models. Re-exported from the package root so that the typings
-// generated by the Codenotch IDE (typings/i18n.d.ts and typings/process.d.ts,
-// which augment the 'codenotch-react' module) merge with the real
-// TranslationRegistry / ProcessRegistry declarations.
 export * from "./models/Codenotch";
 export * from "./models/Misc";
 export * from "@codenotch/codenotch.core";

package/src/models/Codenotch.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { ProjectManifest, IAppManifest } from "@codenotch/codenotch.core";
+import { IAppManifest, ICodenotchProjectManifest } from "@codenotch/codenotch.core";
 import { ICodenotchSignal, IDisposable } from "./Misc";
 
 /**
@@ -21,9 +21,7 @@ export interface ICodenotchEnv {
     accessToken?: string;
     /** Base URL of the current application. */
     baseUrl?: string;
-    /** Translation dictionaries, keyed by language then by translation key: `i18n[language][key] = text`. */
-    i18n?: { [language: string]: { [key: string]: string } };
-    /** Current language code (e.g. `"en"`). Defaults to the first language found in {@link i18n}. */
+    /** Current language code (e.g. `"en"`). */
     language?: string;
     /** Current UI theme. Resolved from the `_theme` URL parameter, or `prefers-color-scheme` as a fallback. */
     theme?: 'light' | 'dark';
@@ -31,94 +29,12 @@ export interface ICodenotchEnv {
     /** Manifest of the current application (the `<AppName>.manifest.json` file next to the app). */
     appManifest?: IAppManifest;
     /** Manifest of the Codenotch project (the project's `manifest.json` file). */
-    projectManifest?: ProjectManifest;
+    projectManifest?: ICodenotchProjectManifest;
 
     /** Any additional environment variable passed to `init()`. */
     [key: string]: any; // Allow additional properties
 }
 
-
-/**
- * Registry of the project's BPMN processes, used to type {@link ICodenotchApi.startProcess}.
- *
- * Empty by default: the Codenotch IDE fills it through declaration merging in the
- * auto-generated `typings/process.d.ts` file of each project, with one entry per
- * BPMN process. Each entry maps the process name to its start events (`nodes`,
- * keyed by start node id, valued with the start event's input parameters) and to
- * the `output` of its end event.
- *
- * When the registry has not been augmented (project built without the IDE
- * typings), `startProcess` falls back to plain string names and untyped inputs,
- * so the code still compiles.
- *
- * @example
- * // typings/process.d.ts (auto-generated by the Codenotch IDE)
- * import 'codenotch-react';
- * declare module 'codenotch-react' {
- *     interface ProcessRegistry {
- *         'getTodos': {
- *             nodes: { 'start': { UserId: string } };
- *             output: { todos: any[] };
- *         };
- *     }
- * }
- */
-export interface ProcessRegistry {
-    // Extended by codenotch IDE
-}
-
-/**
- * Registry of the project's translation keys, used to type {@link ICodenotchApi.i18n}.
- *
- * Empty by default: the Codenotch IDE fills it through declaration merging in the
- * auto-generated `typings/i18n.d.ts` file of each project, from the project's
- * `.i18n.csv` files. Each entry maps a translation key to the tuple of arguments
- * expected by its `{0}`, `{1}`, … placeholders.
- *
- * When the registry has not been augmented (project built without the IDE
- * typings), `i18n` falls back to plain string keys and untyped arguments,
- * so the code still compiles.
- *
- * @example
- * // typings/i18n.d.ts (auto-generated by the Codenotch IDE)
- * import 'codenotch-react';
- * declare module 'codenotch-react' {
- *     interface TranslationRegistry {
- *         'welcome': [];
- *         'greeting': [arg1: any, arg2: any];
- *     }
- * }
- */
-export interface TranslationRegistry {
-    // Extended by codenotch IDE
-}
-
-// When the codenotch IDE has not augmented the registries, `keyof Registry` is `never`
-// and every call would fail to compile. These helpers fall back to plain string keys
-// and untyped arguments so the API stays usable without code generation.
-
-/** A BPMN process name: a key of {@link ProcessRegistry}, or any string when the registry is empty. */
-export type ProcessName = keyof ProcessRegistry extends never ? string : keyof ProcessRegistry;
-
-/** The start nodes of process `P`: its `nodes` map from {@link ProcessRegistry}, or an open map when unknown. */
-export type ProcessNodes<P> = P extends keyof ProcessRegistry
-    ? ProcessRegistry[P] extends { nodes: infer N } ? N : { [nodeId: string]: any }
-    : { [nodeId: string]: any };
-
-/** The end-event output of process `P` from {@link ProcessRegistry}, or `any` when unknown. */
-export type ProcessOutput<P> = P extends keyof ProcessRegistry
-    ? ProcessRegistry[P] extends { output: infer O } ? O : any
-    : any;
-
-/** A translation key: a key of {@link TranslationRegistry}, or any string when the registry is empty. */
-export type TranslationKey = keyof TranslationRegistry extends never ? string : keyof TranslationRegistry;
-
-/** The placeholder arguments of translation key `K` from {@link TranslationRegistry}, or `any[]` when unknown. */
-export type TranslationArgs<K> = K extends keyof TranslationRegistry
-    ? TranslationRegistry[K] extends any[] ? TranslationRegistry[K] : any[]
-    : any[];
-
-
 /**
  * Result of a BPMN process execution started with {@link ICodenotchApi.startProcess}.
  */
@@ -142,56 +58,17 @@ export interface IProcessResult<T = any> {
  * plain `getCodenotch()` function anywhere else (handlers, modules, services).
  *
  * It is the bridge between a React app and the Codenotch runtime: it starts
- * server-side BPMN processes, runs CNQL queries, translates i18n keys,
+ * server-side BPMN processes, runs CNQL queries,
  * listens to real-time signals and manages theme/language.
- *
- * @example
- * import { useCodenotch } from 'codenotch-react';
- *
- * const cn = useCodenotch();
- * const title = cn.i18n('welcome');
- * const result = await cn.startProcess('getTodos', 'start', { UserId: '42' });
  */
 export interface ICodenotchApi {
 
     /**
      * Start a server-side BPMN process and wait for its completion.
-     *
-     * @param processName Name of the process — the `.bpmn` file name without extension (e.g. `processes/getTodos.bpmn` → `'getTodos'`).
-     * @param startNodeId Id of the start event to trigger (conventionally `'start'`).
-     * @param inputs Input parameters declared by that start event.
-     * @returns The process result; check `isError` before using `output` (the parameters of the end event reached).
-     * @example
-     * const result = await cn.startProcess('getTodos', 'start', { UserId: userId });
-     * if (!result.isError) {
-     *     setTodos(result.output.todos);
-     * }
-     */
-    startProcess<P extends ProcessName, N extends keyof ProcessNodes<P>>(
-        processName: P,
-        startNodeId: N,
-        inputs: ProcessNodes<P>[N]
-    ): Promise<IProcessResult<ProcessOutput<P>>>;
-
-    /**
-     * Translate a key for the current language ({@link ICodenotchEnv.language}).
-     *
-     * Placeholders `{0}`, `{1}`, … in the translated text are replaced by `args`.
-     * Never throws: if the key or the language is missing, a warning is logged
-     * and the key itself is returned.
-     *
-     * @param key Translation key, as defined in the project's `.i18n.csv` files.
-     * @param args Values for the `{0}`, `{1}`, … placeholders of the translation.
-     * @example
-     * cn.i18n('welcome');                    // "Bienvenue"
-     * cn.i18n('greeting', 'Fabian', 3);      // "Bonjour Fabian, 3 messages" (from "Bonjour {0}, {1} messages")
      */
-    i18n<K extends TranslationKey>(
-        key: K,
-        ...args: TranslationArgs<K>
-    ): string;
+    startProcess<TProcess, TInput, TOutput>(process: TProcess, inputs: TInput): Promise<IProcessResult<TOutput>>;
 
-    /** Runtime environment (cluster, service, language, theme, i18n dictionaries, manifests…). Populated by `init()`. */
+    /** Runtime environment (cluster, service, language, theme dictionaries, manifests…). Populated by `init()`. */
     readonly env: ICodenotchEnv;
 
     /**
@@ -243,26 +120,11 @@ export interface ICodenotchApi {
      */
     readonly getProjectFileUrl: (relativePath: string) => string;
 
-    /**
-     * Subscribe to a real-time signal emitted by the project's BPMN processes (via SignalR).
-     *
-     * @param signalId Id of the signal, as declared in the BPMN process.
-     * @param callback Called each time the signal is received, with `{ signalId, data }`.
-     * @returns A disposable — call `dispose()` to unsubscribe (e.g. in a `useEffect` cleanup).
-     * @example
-     * useEffect(() => {
-     *     let sub: IDisposable | undefined;
-     *     cn.listenSignal('todosChanged', () => refresh()).then(s => sub = s);
-     *     return () => sub?.dispose();
-     * }, []);
-     */
-    readonly listenSignal: (signalId: string, callback: (data: ICodenotchSignal) => void) => Promise<IDisposable>;
-
     /** Set the UI theme. Also toggles the `light`/`dark` class on `<html>` (Tailwind `dark:` variants). */
     readonly setTheme: (theme: 'light' | 'dark') => void;
     /** Current UI theme, if resolved. */
     readonly getTheme: () => 'light' | 'dark' | undefined;
-    /** Set the current language used by {@link i18n}. Must be one of the project's languages. */
+    /** Set the current language. Must be one of the project's languages. */
     readonly setLanguage: (lang: string) => void;
     /** Current language code, if any. */
     readonly getLanguage: () => string | undefined;
@@ -273,7 +135,7 @@ export interface ICodenotchApi {
     /** Generate a random UUID v4. */
     readonly uuid: () => string;
     /** Manifest of the Codenotch project. Throws if not available in the environment. */
-    readonly getProjectManifest: () => ProjectManifest;
+    readonly getProjectManifest: () => ICodenotchProjectManifest;
     /** Manifest of the current application, if any. */
     readonly getAppManifest: () => IAppManifest | undefined;
 }

package/README.md

@@ -1,183 +0,0 @@
-# codenotch-react
-
-React bindings for [Codenotch](https://codenotch.com) applications.
-
-Codenotch is a full-stack development platform: a project combines server-side **BPMN processes**, **SQL tables** / **NoSQL documents**, **i18n** translations and **React** apps. This package is the client-side bridge between those React apps and the Codenotch runtime: it lets a component start BPMN processes, run CNQL queries, translate i18n keys, listen to real-time signals, and manage theme/language.
-
-> **Requirements** — Codenotch apps run on **React 19** (`react@^19`, `react-dom@^19`). The package uses the automatic JSX runtime and `createRoot`; all modern React APIs (hooks, `useId`, `use`, Actions…) are available.
-
-## Quick start
-
-```tsx
-import { useCodenotch } from 'codenotch-react';
-
-const MyApp = () => {
-    const cn = useCodenotch();
-
-    return <div className="p-4">
-        <h1 className="text-xl font-bold">{cn.i18n('welcome')}</h1>
-    </div>;
-};
-
-export default MyApp;
-```
-
-`useCodenotch()` is a real React hook: the returned object is stable across renders and is replaced — re-rendering the component — whenever the environment changes (`setLanguage`, `setTheme`, `init`). Regular hook rules apply. The same API is available everywhere else through two non-hook entry points:
-
-| Where | Use |
-|-------|-----|
-| Function component / custom hook | `const cn = useCodenotch();` — re-renders on language/theme change. |
-| Class component | `export default withCodenotch(MyClass);` — injects `this.props.cn`, re-renders on change, forwards `ref`. |
-| Event handler, plain module, service, anywhere | `getCodenotch()` — plain function, never stale, no re-render. |
-| Manual subscription (rare) | `onCodenotchChange(listener)` → `IDisposable`. |
-
-```tsx
-import React from 'react';
-import { withCodenotch, WithCodenotchProps } from 'codenotch-react';
-
-interface Props extends WithCodenotchProps {
-    userId: string;
-}
-
-class TodoList extends React.Component<Props> {
-    render() {
-        return <h1>{this.props.cn.i18n('todos.title')}</h1>;
-    }
-}
-
-export default withCodenotch(TodoList);   // <TodoList userId="42" /> — `cn` is injected
-```
-
-```ts
-// services/todos.ts — outside React
-import { getCodenotch } from 'codenotch-react';
-
-export async function loadTodos(userId: string) {
-    const result = await getCodenotch().startProcess('getTodos', 'start', { UserId: userId });
-    return result.output.todos;
-}
-```
-
-The environment (cluster URL, service name, language, translations…) is set up by `init(envVariables)`, which the Codenotch runtime calls automatically from the page hosting the application. You only call `init` yourself in custom hosting scenarios.
-
-## API overview
-
-| Member | Description |
-|--------|-------------|
-| `cn.env` | Readonly environment: `clusterUrl`, `serviceName`, `tenantName`, `accessToken`, `language`, `theme`, `i18n`, `appManifest`, `projectManifest`. |
-| `cn.i18n(key, ...args)` | Translate a key for the current language, filling `{0}`, `{1}`, … placeholders. |
-| `cn.startProcess(name, startNodeId, inputs)` | Start a server-side BPMN process and await its result. |
-| `cn.requestCnql(cnql, verbose?)` | Run a CNQL query (XML, SELECT-only) against the project's tables. |
-| `cn.listenSignal(signalId, callback)` | Subscribe to real-time signals emitted by BPMN processes. |
-| `cn.showDialog(node)` | Render a React node in a fullscreen modal dialog (own React root, unmounted on `close()`). |
-| `cn.setTheme(t)` / `cn.getTheme()` | `'light' \| 'dark'`; `setTheme` also toggles the class on `<html>` (Tailwind `dark:`). |
-| `cn.setLanguage(l)` / `cn.getLanguage()` / `cn.getLanguages()` | Current language and the languages declared in `manifest.json`. |
-| `cn.getProjectFile(path)` / `cn.getProjectFileUrl(path)` | Read/link a file of the deployed project. |
-| `cn.getUrlParams()` | Query-string parameters of the current URL as a plain object. |
-| `cn.uuid()` | Random UUID v4. |
-| `cn.getProjectManifest()` / `cn.getAppManifest()` | Project / application manifests. |
-
-Full signatures and JSDoc live in `dist/index.d.ts` (sources in `src/`).
-
-## Calling a BPMN process
-
-`processName` is the `.bpmn` file name without extension; `startNodeId` is the id of the start event to trigger (conventionally `'start'`); `inputs` are the input parameters declared by that start event. The result's `output` contains the parameters of the end event reached.
-
-```tsx
-const result = await cn.startProcess('getTodos', 'start', { UserId: userId });
-
-if (!result.isError) {
-    setTodos(result.output.todos);
-} else {
-    console.error(result.errorMessage);
-}
-```
-
-## Querying tables with CNQL
-
-CNQL is Codenotch's XML query language over the project's SQL tables (SELECT only — writes go through BPMN processes). The root `xmlns` must be the project's `serviceName`; each queried table's `Ref` attribute names its result set:
-
-```tsx
-const data = await cn.requestCnql(`
-    <CNQL xmlns="myproject" PageSize="10" PageIndex="0">
-        <Users Ref="results">
-            <Id />
-            <Email />
-            <IsAdmin Equal="true" />
-        </Users>
-    </CNQL>`);
-
-console.log(data.results); // [{ Id: '...', Email: '...' }, ...]
-```
-
-## Translations (i18n)
-
-Translations come from the project's `.i18n.csv` files and are injected into `cn.env.i18n` at startup. `cn.i18n(key, ...args)` translates for the current language and replaces `{0}`, `{1}`, … placeholders; it never throws — an unknown key is returned as-is (with a console warning).
-
-```tsx
-cn.i18n('welcome');               // "Bienvenue"
-cn.i18n('greeting', 'Ada', 3);    // "Bonjour Ada, 3 messages"  (from "Bonjour {0}, {1} messages")
-cn.setLanguage('en');             // switch language at runtime — every component using
-                                  // useCodenotch() / withCodenotch() re-renders
-```
-
-## Real-time signals
-
-BPMN processes can broadcast signals; subscribe from the UI with `listenSignal`:
-
-```tsx
-useEffect(() => {
-    let sub: IDisposable | undefined;
-    let cancelled = false;
-    getCodenotch().listenSignal('todosChanged', (signal) => refresh(signal.data))
-        .then(s => { if (cancelled) s.dispose(); else sub = s; });
-    return () => { cancelled = true; sub?.dispose(); };
-}, []);
-```
-
-Two details: the `cancelled` flag matters under React 19's StrictMode, which mounts / unmounts / remounts effects in development — without it the first subscription would leak when the cleanup runs before the promise resolves. And the effect uses `getCodenotch()` rather than the `cn` from `useCodenotch()`: the hook's object changes on every language/theme change, so listing it in the dependency array would re-subscribe on each change, while omitting it trips `react-hooks/exhaustive-deps`. `getCodenotch()` sidesteps both.
-
-## Dialogs
-
-```tsx
-const dialog = cn.showDialog(
-    <div className="bg-white dark:bg-gray-800 p-6 rounded shadow">
-        <p>{cn.i18n('confirm.message')}</p>
-        <button onClick={() => dialog.close()}>{cn.i18n('close')}</button>
-    </div>
-);
-```
-
-The dialog stays open until you call `dialog.close()`, which unmounts the React tree and removes the `<dialog>` element. The content is rendered in its own React root, so it does not share context (providers) with the calling component.
-
-## Type-safe processes and translation keys
-
-`startProcess` and `i18n` are typed through two registries, `ProcessRegistry` and `TranslationRegistry`, that the **Codenotch IDE fills by declaration merging**: it generates `typings/process.d.ts` and `typings/i18n.d.ts` in each project from the `.bpmn` and `.i18n.csv` files (never edit those files — refresh the project instead). The generated files look like:
-
-```ts
-import 'codenotch-react';
-
-declare module 'codenotch-react' {
-    interface TranslationRegistry {
-        'welcome': [];
-        'greeting': [arg1: any, arg2: any];
-    }
-
-    interface ProcessRegistry {
-        'getTodos': {
-            nodes: { 'start': { UserId: string } };
-            output: { todos: any[] };
-        };
-    }
-}
-```
-
-With these in the compilation, keys, inputs and outputs are strictly checked and autocompleted. **Without them** (project compiled outside the IDE), the registries are empty and both methods gracefully fall back to plain `string` keys and untyped arguments — the code still compiles.
-
-## Notes for AI assistants
-
-- The complete typed API surface is in `dist/index.d.ts`; the readable implementation ships in `src/` (entry point `src/index.ts`).
-- `useCodenotch()` is a real hook (hook rules apply; re-renders on language/theme change). In class components use `withCodenotch(Component)` and read `this.props.cn`; in event handlers, services, plain modules or effects use `getCodenotch()`. Never call `useCodenotch()` outside a function component / custom hook.
-- The object returned by `useCodenotch()` changes when the environment changes: fine in `useMemo` deps, but in `useEffect` prefer `getCodenotch()` unless the effect should re-run on language/theme change.
-- Never hand-edit a project's `typings/i18n.d.ts` / `typings/process.d.ts`: they are regenerated by the Codenotch IDE.
-- Codenotch apps are React 19 + Tailwind CSS (automatic JSX runtime — no `import React` needed for JSX); CNQL is SELECT-only (writes go through BPMN processes via `startProcess`).