treege 3.0.0-beta.85 → 3.0.0-beta.87

package/dist/main.js

@@ -1,6 +1,6 @@
-import { t as e } from "./editor-Cd5_DOUg.js";
+import { t as e } from "./editor-B3qu0VAn.js";
 import { G as t, I as n, J as r, K as i, L as a, U as o, W as s, Y as c, _ as l, a as u, b as d, c as f, g as p, h as m, i as h, l as g, m as _, n as v, o as y, q as b, r as x, s as S, t as C, v as w, y as T } from "./ThemeContext-BnPOFQC7.js";
 import { C as E, L as D, S as O, _ as k, a as A, b as j, c as M, d as N, g as P, h as F, i as I, m as L, n as R, o as z, r as B, u as V, v as H, x as U, y as W } from "./DefaultSubmitButton-DpeL3OxC.js";
 import { a as G, c as K, i as q, l as J, n as Y, o as X, r as Z, s as Q } from "./useRenderNode-DQ5lvXuj.js";
-import { a as $, i as ee, n as te, o as ne, r as re, s as ie, t as ae } from "./renderer-DrHbS6NW.js";
-export { E as DefaultAddressInput, O as DefaultAutocompleteInput, U as DefaultCheckboxInput, j as DefaultDateInput, W as DefaultDateRangeInput, H as DefaultFileInput, k as DefaultHiddenInput, P as DefaultHttpInput, D as DefaultInputLabel, F as DefaultNumberInput, L as DefaultPasswordInput, N as DefaultRadioInput, V as DefaultSelectInput, M as DefaultSwitchInput, z as DefaultTextAreaInput, A as DefaultTextInput, I as DefaultTimeInput, B as DefaultTimeRangeInput, $ as Divider, C as ThemeProvider, ne as Title, e as TreegeEditor, ee as TreegeRenderer, K as TreegeRendererProvider, ae as TreegeViewer, x as applyReferenceTransformation, h as buildInitialFormValues, u as calculateReferenceFieldUpdates, y as checkFormFieldHasValue, S as convertFormValuesToNamedFormat, R as defaultInputRenderers, ie as defaultUI, X as evaluateCondition, Q as evaluateConditions, _ as fileNameFromUrl, m as fileToSerializable, p as filesToSerializable, Z as findStartNode, l as formatFileSize, q as getFlowRenderState, o as getStaticTranslations, s as getTranslatableValue, t as getTranslatedText, te as getViewerFields, f as isFieldEmpty, b as isGroupNode, re as isImageFile, r as isInputNode, w as isRemoteFileData, G as isStartNode, c as isUINode, T as normalizeSerializableFiles, g as resolveNodeDefaultValue, n as sanitize, a as sanitizeHttpResponse, d as serializableToFile, i as setTranslatableValue, v as useTheme, Y as useTreegeRenderer, J as useTreegeRendererConfig };
+import { a as $, c as ee, i as te, l as ne, n as re, o as ie, r as ae, s as oe, t as se } from "./renderer-D2-LozgF.js";
+export { E as DefaultAddressInput, O as DefaultAutocompleteInput, U as DefaultCheckboxInput, j as DefaultDateInput, W as DefaultDateRangeInput, H as DefaultFileInput, k as DefaultHiddenInput, P as DefaultHttpInput, D as DefaultInputLabel, F as DefaultNumberInput, L as DefaultPasswordInput, N as DefaultRadioInput, V as DefaultSelectInput, M as DefaultSwitchInput, z as DefaultTextAreaInput, A as DefaultTextInput, I as DefaultTimeInput, B as DefaultTimeRangeInput, ie as Divider, C as ThemeProvider, oe as Title, e as TreegeEditor, $ as TreegeRenderer, K as TreegeRendererProvider, se as TreegeViewer, ne as TreegeViewerProvider, x as applyReferenceTransformation, h as buildInitialFormValues, u as calculateReferenceFieldUpdates, y as checkFormFieldHasValue, S as convertFormValuesToNamedFormat, R as defaultInputRenderers, ee as defaultUI, X as evaluateCondition, Q as evaluateConditions, _ as fileNameFromUrl, m as fileToSerializable, p as filesToSerializable, Z as findStartNode, l as formatFileSize, q as getFlowRenderState, o as getStaticTranslations, s as getTranslatableValue, t as getTranslatedText, re as getViewerFields, f as isFieldEmpty, b as isGroupNode, ae as isImageFile, r as isInputNode, w as isRemoteFileData, G as isStartNode, c as isUINode, T as normalizeSerializableFiles, g as resolveNodeDefaultValue, n as sanitize, a as sanitizeHttpResponse, d as serializableToFile, i as setTranslatableValue, v as useTheme, Y as useTreegeRenderer, J as useTreegeRendererConfig, te as viewerFieldsFromResponse };

package/dist/renderer/context/TreegeViewerProvider.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+export interface TreegeViewerProviderProps {
+    children: ReactNode;
+    /**
+     * Light/dark theme applied to every `TreegeViewer` underneath.
+     */
+    theme?: "light" | "dark";
+    /**
+     * Base URL used to resolve relative file paths into absolute URLs.
+     */
+    baseUrl?: string;
+    /**
+     * Language used to resolve translatable labels/options.
+     */
+    language?: string;
+}
+/**
+ * Config provider for {@link TreegeViewer}. It's a thin wrapper over
+ * `TreegeRendererProvider` that exposes only the options a read-only viewer
+ * actually uses — `theme`, `baseUrl` and `language` — so an app that consumes
+ * `TreegeViewer` (without `TreegeRenderer`) gets a focused API and can set them
+ * once for the whole subtree instead of on every viewer.
+ *
+ * Since it delegates to `TreegeRendererProvider`, `TreegeViewer` reads the values
+ * through the same `useTreegeRendererConfig` context.
+ */
+declare const TreegeViewerProvider: ({ children, theme, baseUrl, language }: TreegeViewerProviderProps) => import("react/jsx-runtime").JSX.Element;
+export default TreegeViewerProvider;

package/dist/renderer/features/TreegeViewer/utils/viewerFields.d.ts

@@ -2,6 +2,7 @@ import { Node } from '@xyflow/react';
 import { FormValues } from '../../../types/renderer';
 import { SerializableFile } from '../../../../shared/types/file';
 import { Flow, InputNodeData, InputType } from '../../../../shared/types/node';
+import { Translatable } from '../../../../shared/types/translate';
 /**
  * Display-ready representation of a submitted field value, normalized per input
  * type so a viewer can render it without re-deriving formatting rules:
@@ -40,8 +41,19 @@ export interface ViewerField {
     rawValue: unknown;
     /** Normalized, render-ready representation of the value. */
     display: ViewerFieldDisplay;
-    /** The originating flow node (escape hatch for custom rendering). */
-    node: Node<InputNodeData>;
+    /** The originating flow node — present only in flow-based resolution (escape hatch for custom rendering). */
+    node?: Node<InputNodeData>;
+}
+/**
+ * A self-describing stored value, used to render a viewer **without** a `flow`
+ * (e.g. a persisted `WorkflowValue[]`). Each entry carries its own metadata so
+ * the value can be formatted by type and labelled without a flow definition.
+ */
+export interface FlowResponseEntry {
+    name?: string;
+    type?: string;
+    value?: unknown;
+    label?: Translatable | string;
 }
 export interface GetViewerFieldsOptions {
     /** Language used to resolve translatable labels/options (defaults to `en`). */
@@ -76,3 +88,15 @@ export declare const isImageFile: (file: SerializableFile) => boolean;
  * @returns The ordered, visible, display-ready fields
  */
 export declare const getViewerFields: (flow: Flow | null | undefined, values: FormValues | null | undefined, options?: GetViewerFieldsOptions) => ViewerField[];
+/**
+ * Build a render-ready field list straight from a self-describing response —
+ * each entry supplies its own `name`/`type`/`value`/`label`, so no `flow` is
+ * needed. Used by {@link TreegeViewer} in its flow-less mode. Option values are
+ * shown as-is (there's no flow to resolve their labels), and `hidden`/`submit`
+ * entries are skipped.
+ *
+ * @param response - The self-describing stored values
+ * @param options - Resolution options (language, baseUrl)
+ * @returns The ordered, display-ready fields
+ */
+export declare const viewerFieldsFromResponse: (response: readonly FlowResponseEntry[] | null | undefined, options?: GetViewerFieldsOptions) => ViewerField[];

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

@@ -1,43 +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
+     * Language used to resolve translatable labels/options (defaults to the provider config, then `en`).
      */
-    flow: Flow;
-    /**
-     * The submitted values (`name`- or `id`-keyed, e.g. the `onSubmit` payload).
-     */
-    values: FormValues;
+    language?: string;
     /**
-     *  Language used to resolve translatable labels/options (defaults to `en`).
+     * Light/dark theme. Falls back to the `TreegeRendererProvider` config, then `"dark"`.
      */
-    language?: string;
+    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;
     /**
@@ -52,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 —
@@ -63,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, excludedFields, excludeEmptyFields, className, renderField, renderRow, emptyText, language, }: 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/index.d.ts

@@ -1,4 +1,6 @@
 export { TreegeRendererProvider, useTreegeRendererConfig } from './context/TreegeRendererProvider';
+export type { TreegeViewerProviderProps } from './context/TreegeViewerProvider';
+export { default as TreegeViewerProvider } from './context/TreegeViewerProvider';
 export type { UseTreegeRendererReturn } from './features/TreegeRenderer/useTreegeRenderer';
 export { useTreegeRenderer } from './features/TreegeRenderer/useTreegeRenderer';
 export * from './features/TreegeRenderer/web/components/DefaultFormWrapper';