treege 3.0.0-beta.86 → 3.0.0-beta.88

package/dist/renderer/features/TreegeViewer/web/TreegeViewer.d.ts

@@ -1,48 +1,44 @@
 import { ReactNode } from 'react';
-import { ViewerField } from '../utils/viewerFields';
+import { FlowResponseEntry, ViewerField } from '../utils/viewerFields';
 import { FormValues } from '../../../types/renderer';
 import { Flow, InputType } from '../../../../shared/types/node';
 /** Per-type override map: `{ file: (field) => <Thumbnails /> }`. */
 export type ViewerFieldRenderers = Partial<Record<InputType, (field: ViewerField) => ReactNode>>;
-export interface TreegeViewerProps {
+interface TreegeViewerBaseProps {
     /**
-     * The flow the values were submitted against
-     */
-    flow: Flow;
-    /**
-     * The submitted values (`name`- or `id`-keyed, e.g. the `onSubmit` payload).
-     */
-    values: FormValues;
-    /**
-     *  Language used to resolve translatable labels/options (defaults to `en`).
+     * Language used to resolve translatable labels/options (defaults to the provider config, then `en`).
      */
     language?: string;
     /**
-     * Light/dark theme. Falls back to the `TreegeRendererProvider` config, then
-     * `"dark"` — same resolution as `TreegeRenderer`.
+     * Light/dark theme. Falls back to the `TreegeRendererProvider` config, then `"dark"`.
      */
     theme?: "light" | "dark";
     /**
-     * Base URL used to resolve relative file paths into absolute URLs — same role
-     * as on `TreegeRenderer`/`TreegeEditor`. `data:`/`blob:`/absolute URLs are
-     * left untouched.
+     * Base URL to resolve relative file paths into absolute URLs. `data:`/`blob:`/absolute URLs are left untouched.
      */
     baseUrl?: string;
     /**
-     * Field names (or ids) to hide from the view.
+     *  Field names (or ids) to hide from the view.
      */
     excludedFields?: string[];
     /**
      * Hide fields that have no submitted value (instead of showing `emptyText`).
-     * Useful to render a compact recap of only the filled-in fields.
      */
     excludeEmptyFields?: boolean;
+    /**
+     *  When `true`, only the first `collapsedVisibleCount` fields are rendered.
+     */
+    collapsed?: boolean;
+    /**
+     * Number of fields kept visible while `collapsed` (defaults to all).
+     */
+    collapsedVisibleCount?: number;
     /**
      * Text shown when a field has no submitted value (defaults to `"—"`).
      */
     emptyText?: string;
     /**
-     * Extra class names on the root element. *
+     * Extra class names on the root element.
      */
     className?: string;
     /**
@@ -57,6 +53,26 @@ export interface TreegeViewerProps {
      */
     renderRow?: (field: ViewerField, defaultRow: ReactNode) => ReactNode;
 }
+/**
+ * `flowResponse` is typed conditionally on `flow`:
+ * - **with** a `flow` → the renderer's `FormValues` (`name`- or `id`-keyed), resolved against the flow;
+ * - **without** a `flow` → a self-describing `FlowResponseEntry[]` (each carries its own
+ *   `name`/`type`/`value`/`label`), rendered as-is.
+ */
+export type TreegeViewerProps = TreegeViewerBaseProps & ({
+    /**
+     * The flow the values were submitted against.
+     */
+    flow: Flow;
+    /** The submitted values as the renderer's `FormValues` (`name`- or `id`-keyed). */
+    flowResponse: FormValues;
+} | {
+    flow?: undefined;
+    /**
+     * Self-describing stored values rendered without a flow.
+     */
+    flowResponse: FlowResponseEntry[];
+});
 /**
  * Read-only viewer for a submitted Treege form. Given the `flow` and the
  * submitted `values`, it renders every reachable field as a label/value pair —
@@ -68,13 +84,11 @@ export interface TreegeViewerProps {
  * change the whole row layout pass `renderRow`.
  *
  * @example
- * <TreegeViewer
- *   flow={flow}
- *   values={submitted}
- *   language="fr"
- *   excludedFields={["internalNote"]}
- *   renderField={{ file: ({ rawValue }) => <Thumbnails files={rawValue} /> }}
- * />
+ * // With a flow — `flowResponse` is the renderer's FormValues:
+ * <TreegeViewer flow={flow} flowResponse={submitted} language="fr" excludeEmptyFields />
+ *
+ * // Without a flow — `flowResponse` is a self-describing list:
+ * <TreegeViewer flowResponse={[{ name: "city", type: "text", value: "Paris", label: { en: "City" } }]} />
  */
-declare const TreegeViewer: ({ flow, values, baseUrl, theme, excludedFields, excludeEmptyFields, className, renderField, renderRow, language, emptyText, }: TreegeViewerProps) => import("react/jsx-runtime").JSX.Element;
+declare const TreegeViewer: ({ flow, flowResponse, baseUrl, theme, excludedFields, excludeEmptyFields, collapsed, collapsedVisibleCount, className, renderField, renderRow, language, emptyText, }: TreegeViewerProps) => import("react/jsx-runtime").JSX.Element;
 export default TreegeViewer;

package/dist/renderer/hooks/useSubmitHandler.d.ts

@@ -1,5 +1,5 @@
 import { Node } from '@xyflow/react';
-import { FormValues } from '../types/renderer';
+import { ExtraPayload, FormValues } from '../types/renderer';
 import { SubmitResult } from '../utils/submit';
 import { HttpHeaders, InputNodeData, TreegeNodeData } from '../../shared/types/node';
 /**
@@ -18,9 +18,10 @@ import { HttpHeaders, InputNodeData, TreegeNodeData } from '../../shared/types/n
  * @param inputNodes - All input nodes for form data conversion
  * @param headers
  * @param baseUrl - Base URL prepended to a relative submit url
+ * @param extraPayload - Consumer-injected fields merged into the submit body
  * @returns Submit handler state and functions
  */
-export declare const useSubmitHandler: (visibleNodes: Node<TreegeNodeData>[], formValues: FormValues, language: string, inputNodes: Node<InputNodeData>[], headers?: HttpHeaders, baseUrl?: string) => {
+export declare const useSubmitHandler: (visibleNodes: Node<TreegeNodeData>[], formValues: FormValues, language: string, inputNodes: Node<InputNodeData>[], headers?: HttpHeaders, baseUrl?: string, extraPayload?: ExtraPayload) => {
     clearSubmitMessage: () => void;
     handleSubmitWithConfig: (onSuccess?: (data: unknown) => void) => Promise<SubmitResult | null>;
     hasSubmitConfig: boolean;

package/dist/renderer/types/renderer.d.ts

@@ -33,6 +33,18 @@ export type FormValues = Record<string, any>;
 export type Meta = {
     httpResponse?: unknown;
 };
+/**
+ * Extra data injected by the consuming app into every submission, merged at the
+ * top level of the payload — both the object passed to `onSubmit` and the body
+ * of the built-in HTTP submit request. Use it for fields that live in the host
+ * app rather than the form itself (e.g. the logged-in `userId`, a tenant id).
+ *
+ * Either a static object or a function of the current (name-keyed) form values,
+ * evaluated at submit time so the extra data can be derived from the answers or
+ * read fresh (e.g. a rotating auth token). The extra keys are spread last, so
+ * they intentionally override a same-named form field.
+ */
+export type ExtraPayload = Record<string, unknown> | ((values: FormValues) => Record<string, unknown>);
 /**
  * Union of all possible input value types
  */
@@ -400,6 +412,18 @@ export interface TreegeRendererProps extends TreegeRendererConfig {
      * Additional class name for the renderer container
      */
     className?: string;
+    /**
+     * Extra data injected into every submission, merged at the top level of both
+     * the `onSubmit` payload and the built-in HTTP submit body. Use it for values
+     * owned by the host app rather than the form (e.g. the logged-in `userId`).
+     * See {@link ExtraPayload}.
+     *
+     * @example
+     * <TreegeRenderer flow={tree} extraPayload={{ userId }} />
+     * @example
+     * <TreegeRenderer flow={tree} extraPayload={() => ({ token: getToken() })} />
+     */
+    extraPayload?: ExtraPayload;
     /**
      * Flow to render. `null` / `undefined` renders nothing.
      */

package/dist/renderer/utils/extraPayload.d.ts

@@ -0,0 +1,21 @@
+import { ExtraPayload, FormValues } from '../types/renderer';
+/**
+ * Merge the consumer-provided `extraPayload` onto a base submission payload.
+ * This is the single chokepoint behind the `extraPayload` prop, used both for
+ * the `onSubmit` callback payload and the built-in HTTP submit body.
+ *
+ * `extraPayload` may be a static object or a function of the current
+ * (name-keyed) values — the function form lets the extra data be read at submit
+ * time (e.g. a freshly-read auth token). The extra fields are spread **last**,
+ * so a consumer-injected key (e.g. `userId`) intentionally wins over a
+ * same-named form field.
+ *
+ * Edge cases:
+ * - No `extraPayload`, or it resolves to a non-object (array / primitive) →
+ *   the base is returned untouched (nothing to merge).
+ * - Base is `undefined`/`null` (e.g. a submit config that would otherwise send
+ *   no body) → the extra is sent on its own, so the injected data still goes out.
+ * - Base is a non-object → returned untouched, since there is no top level to
+ *   merge into.
+ */
+export declare const mergeExtraPayload: <T>(base: T, extraPayload: ExtraPayload | undefined, values: FormValues) => T | Record<string, unknown>;

package/dist/renderer/utils/submit.d.ts

@@ -1,5 +1,5 @@
 import { Node } from '@xyflow/react';
-import { FormValues } from '../types/renderer';
+import { ExtraPayload, FormValues } from '../types/renderer';
 import { HttpHeaders, InputNodeData, SubmitConfig } from '../../shared/types/node';
 /**
  * Result of a form submission
@@ -36,9 +36,10 @@ export interface SubmitResult {
  * @param inputNodes - All input nodes (required when sendAllFormValues is true)
  * @param headers
  * @param baseUrl - Base URL prepended to a relative submit url
+ * @param extraPayload - Consumer-injected fields merged into the request body
  * @returns Promise with submission result
  */
-export declare const submitFormData: (config: SubmitConfig, formValues: FormValues, inputNodes: Node<InputNodeData>[], headers?: HttpHeaders, baseUrl?: string) => Promise<SubmitResult>;
+export declare const submitFormData: (config: SubmitConfig, formValues: FormValues, inputNodes: Node<InputNodeData>[], headers?: HttpHeaders, baseUrl?: string, extraPayload?: ExtraPayload) => Promise<SubmitResult>;
 /**
  * Perform redirect to the specified URL
  *