treege 3.0.0-beta.56 → 3.0.0-beta.58

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

@@ -38,54 +38,87 @@ export type Meta = {
  */
 export type InputValue = string | number | boolean | string[] | SerializableFile | SerializableFile[] | [string, string] | [string | undefined, string | undefined] | null | undefined;
 /**
- * Props for input components with dynamic value typing
- * All form state is provided via props for easier custom component implementation
+ * A field the input's dynamic options depend on that is not yet filled.
  */
-export type InputRenderProps<T extends InputType = InputType> = {
+export type MissingDependency = {
     /**
-     * The node data for this input field
+     * The referenced node id.
      */
-    node: Node<InputNodeData>;
+    id: string;
     /**
-     * Current value of the input field (typed based on input type when T is specified)
+     * The referenced field's translated, end-user-facing label.
      */
-    value: InputValueTypeMap[T];
+    label: string;
+};
+/**
+ * HTML-spreadable props for an input control — safe to spread directly onto a
+ * DOM element: `<input {...field} />`. Intentionally excludes `label`,
+ * `helperText`, and `error` (not valid DOM attributes); those live in
+ * `InputExtraProps`.
+ */
+export type InputFieldProps<T extends InputType = InputType> = {
     /**
-     * Unique field ID (nodeId)
+     * Unique field id (nodeId). Use for the element `id`.
      */
     id: string;
     /**
-     * Field name (resolved using priority: name > label > nodeId)
-     * Use this for the name and id attributes of the input element
+     * Field name (resolved using priority: name > label > nodeId).
      */
     name: string;
     /**
-     * Function to update the input value
-     * @param value - The new value (typed based on input type when T is specified)
+     * Current value of the input (typed by input type when T is specified).
      */
-    setValue: (value: InputValueTypeMap[T]) => void;
+    value: InputValueTypeMap[T];
     /**
-     * Validation error message for this field (if any)
+     * Translated placeholder (already processed with current language).
      */
-    error?: string;
+    placeholder?: string;
     /**
-     * Translated label (already processed with current language)
+     *  Whether the field is required.
      */
-    label?: string;
+    required?: boolean;
     /**
-     * Translated placeholder (already processed with current language)
+     * Set when the field has a validation error.
      */
-    placeholder?: string;
+    "aria-invalid"?: boolean;
+};
+/**
+ * Treege-specific props that are NOT DOM attributes: state setters, resolved
+ * translations, validation and runtime metadata. Passed as the second argument
+ * of an input renderer so the first one (`InputFieldProps`) stays spreadable.
+ */
+export type InputExtraProps<T extends InputType = InputType> = {
     /**
-     * Translated helper text (already processed with current language)
+     * The node data for this input field.
+     */
+    node: Node<InputNodeData>;
+    /**
+     * Function to update the input value.
+     * @param value - The new value (typed by input type when T is specified)
+     */
+    setValue: (value: InputValueTypeMap[T]) => void;
+    /**
+     * Validation error message for this field (if any).
+     */
+    error?: string;
+    /** Translated label (already processed with current language). */
+    label?: string;
+    /**
+     * Translated helper text (already processed with current language).
      */
     helperText?: string;
     /**
-     * Missing required fields on form submit (for submit inputs)
+     * Fields this input's dynamic options depend on that are not yet filled
+     * (its unresolved `{{nodeId}}` template variables). Empty when none — use it
+     * to hint the user which fields to complete before this input can load.
+     */
+    missingDependencies: MissingDependency[];
+    /**
+     * Missing required fields on form submit (for submit inputs).
      */
     missingRequiredFields?: string[];
     /**
-     * Whether the form is currently being submitted (for submit inputs)
+     * Whether the form is currently being submitted (for submit inputs).
      */
     isSubmitting?: boolean;
     /**
@@ -109,6 +142,12 @@ export type InputRenderProps<T extends InputType = InputType> = {
      */
     compactOptions?: boolean;
 };
+/**
+ * An input renderer. Receives the spreadable `field` props (DOM-safe) and the
+ * Treege `extra` props (state setters, translations, metadata) as two separate
+ * arguments, so `field` can be spread onto a control: `<input {...field} />`.
+ */
+export type InputRenderer<T extends InputType = InputType> = (field: InputFieldProps<T>, extra: InputExtraProps<T>) => ReactNode;
 export type UiRenderProps = {
     node: Node<UINodeData>;
 };
@@ -123,7 +162,7 @@ export type NodeRenderProps = {
  * Each input type gets its own properly typed InputRenderProps
  */
 export type InputRenderers = {
-    [K in InputType]?: (props: InputRenderProps<K>) => ReactNode;
+    [K in InputType]?: InputRenderer<K>;
 };
 /**
  * Props passed to a step renderer. Steps are derived at runtime from the flow's
@@ -257,6 +296,21 @@ export type TreegeRendererConfig = {
      * @default "onSubmit"
      */
     validationMode?: "onChange" | "onSubmit";
+    /**
+     * Base URL prepended to every **relative** HTTP url issued by the renderer
+     * (HTTP inputs, dynamic options, and submit). Use this to keep the tree
+     * JSON environment-agnostic — store relative paths in the tree and supply
+     * the host here per environment:
+     *
+     * @example
+     * // In the tree: "url": "/v2/entities/{{nodeId}}/sub-entities"
+     * <TreegeRenderer flows={tree} baseUrl={import.meta.env.VITE_API_URL} />
+     *
+     * Absolute urls (starting with `http://` or `https://`) are left untouched,
+     * so a field can still point at an external API. Template variables are
+     * resolved first, then the base URL is applied to the result.
+     */
+    baseUrl?: string;
 };
 /**
  * Props for the TreegeRenderer component

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

@@ -14,6 +14,17 @@ export declare const mergeHttpHeaders: (...sources: (HttpHeader[] | undefined)[]
  * to already have their template variables resolved.
  */
 export declare const appendQueryParams: (url: string, params?: QueryParam[]) => string;
+/**
+ * Prepend a base URL to a relative URL. Absolute urls (starting with
+ * `http://` or `https://`, case-insensitive) and protocol-relative urls
+ * (`//host/...`) are returned untouched, so individual fields can still
+ * target an external API. A single slash is enforced at the join so a
+ * trailing slash on the base and/or a leading slash on the path don't
+ * produce `//`. When no base URL is configured, the url is returned as-is.
+ *
+ * Expects the url to already have its template variables resolved.
+ */
+export declare const resolveUrl: (url: string, baseUrl?: string) => string;
 /**
  * Result of an HTTP request
  */

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

@@ -13,6 +13,17 @@ export declare const getInputNodes: (nodes: Node<TreegeNodeData>[]) => Node<Inpu
  * @returns The resolved key (name, label, or node ID)
  */
 export declare const resolveNodeKey: (node: Node<InputNodeData>) => string;
+/**
+ * Resolve a human, end-user-facing label for an input node, preferring the
+ * translated `label` for the given language over the technical `name`. Used
+ * when surfacing field references to users (e.g. dependency hints). Priority:
+ * translated label > name > node id. This differs from `resolveNodeKey`, which
+ * prioritizes `name` for form-submission keys.
+ * @param node - The input node
+ * @param language - The current language code
+ * @returns The resolved display label
+ */
+export declare const resolveNodeLabel: (node: Node<InputNodeData>, language: string) => string;
 /**
  * Resolve the placeholder text for an input, falling back to the static
  * "newAnswer" translation for textfield-like types when the user has not

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

@@ -35,9 +35,10 @@ export interface SubmitResult {
  * @param formValues - Current form values
  * @param inputNodes - All input nodes (required when sendAllFormValues is true)
  * @param headers
+ * @param baseUrl - Base URL prepended to a relative submit url
  * @returns Promise with submission result
  */
-export declare const submitFormData: (config: SubmitConfig, formValues: FormValues, inputNodes: Node<InputNodeData>[], headers?: HttpHeader[]) => Promise<SubmitResult>;
+export declare const submitFormData: (config: SubmitConfig, formValues: FormValues, inputNodes: Node<InputNodeData>[], headers?: HttpHeader[], baseUrl?: string) => Promise<SubmitResult>;
 /**
  * Perform redirect to the specified URL
  *

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

@@ -0,0 +1,17 @@
+import { Node } from '@xyflow/react';
+import { FormValues, MissingDependency } from '../types/renderer';
+import { InputNodeData } from '../../shared/types/node';
+/**
+ * The node ids an input's dynamic request depends on — every `{{nodeId}}`
+ * referenced in its `httpConfig` or `optionsSource` url, query-param values, or
+ * body. These are the fields that must be filled before the input can fetch its
+ * options. Headers are excluded: they carry auth/global values, not user-filled
+ * form fields.
+ */
+export declare const getTemplateDependencyIds: (node: Node<InputNodeData>) => string[];
+/**
+ * The input's template dependencies that are not yet filled, paired with the
+ * referenced field's translated label. Computed centrally in `useRenderNode`
+ * and passed to every input renderer as `extra.missingDependencies`.
+ */
+export declare const getMissingDependencies: (node: Node<InputNodeData>, formValues: FormValues, inputNodes: Node<InputNodeData>[], language: string) => MissingDependency[];