treege 3.0.0-beta.7 → 3.0.0-beta.70

package/dist/renderer/features/TreegeRenderer/useTreegeRenderer.d.ts

@@ -1,43 +1,111 @@
 import { Node } from '@xyflow/react';
-import { FormValues } from '../../types/renderer';
-import { Flow, TreegeNodeData } from '../../../shared/types/node';
+import { FormValues, TreegeRendererProps } from '../../types/renderer';
+import { GroupNodeData, TreegeNodeData } from '../../../shared/types/node';
 /**
- * PURE STATE LOGIC HOOK
+ * Main TreegeRenderer hook
  *
- * This hook manages the internal form state and visibility logic.
- * It contains NO side effects (no useEffect).
- * All state is keyed by nodeId for uniqueness.
+ * Manages all form state, configuration, validation, and submission logic.
+ * Can be used directly in custom components for headless mode.
  *
  * Responsibilities:
+ * - Config merging (props + global provider)
  * - Form values state (keyed by nodeId)
  * - Errors state
  * - Node visibility calculation (progressive rendering)
- * - Form validation (built-in: required, pattern)
- * - Submit button state (combines end-of-path detection + form validity)
+ * - Form validation (built-in: required, pattern + custom validation)
+ * - Submit handling (with HTTP integration support)
+ * - Side effects (onChange callbacks, validation modes, reference field sync)
  *
- * NOT responsible for:
- * - Export/conversion to external format (done in component)
- * - Side effects like onChange callbacks (done in component)
- * - Custom validation (passed to component)
+ * @param props - Configuration props (flow, initialValues, callbacks, etc.)
+ * @returns Complete form state and control methods
  */
-/**
- * Custom hook for TreegeRenderer - Pure state logic only
- *
- * @param flows - Flow or array of flows (can be null/undefined)
- * @param initialValues - Initial form values (will be merged with node defaults)
- * @param language - Preferred language for translations (defaults to 'en')
- * @returns Pure state and computed values (no side effects)
- */
-export declare const useTreegeRenderer: (flows: Flow | Flow[] | null | undefined, initialValues?: FormValues, language?: string) => {
+export declare const useTreegeRenderer: ({ baseUrl, components, flow, googleApiKey, headers, language, onChange, onSubmit, showPoweredBy, theme, validate, validationMode, initialValues, }: Pick<TreegeRendererProps, "baseUrl" | "components" | "flow" | "googleApiKey" | "headers" | "initialValues" | "language" | "onChange" | "onSubmit" | "showPoweredBy" | "theme" | "validate" | "validationMode">) => {
+    canContinueStep: boolean;
     canSubmit: boolean;
+    clearSubmitMessage: () => void;
+    config: {
+        baseUrl: string | undefined;
+        components: {
+            form: ((props: {
+                children: import('react').ReactNode;
+                id?: string;
+                onSubmit: (e: import('react').FormEvent<HTMLFormElement>) => void;
+            }) => import('react').ReactNode) | undefined;
+            inputs: {
+                number?: import('../../types/renderer').InputRenderer<"number"> | undefined;
+                checkbox?: import('../../types/renderer').InputRenderer<"checkbox"> | undefined;
+                radio?: import('../../types/renderer').InputRenderer<"radio"> | undefined;
+                switch?: import('../../types/renderer').InputRenderer<"switch"> | undefined;
+                address?: import('../../types/renderer').InputRenderer<"address"> | undefined;
+                autocomplete?: import('../../types/renderer').InputRenderer<"autocomplete"> | undefined;
+                date?: import('../../types/renderer').InputRenderer<"date"> | undefined;
+                daterange?: import('../../types/renderer').InputRenderer<"daterange"> | undefined;
+                file?: import('../../types/renderer').InputRenderer<"file"> | undefined;
+                hidden?: import('../../types/renderer').InputRenderer<"hidden"> | undefined;
+                http?: import('../../types/renderer').InputRenderer<"http"> | undefined;
+                password?: import('../../types/renderer').InputRenderer<"password"> | undefined;
+                select?: import('../../types/renderer').InputRenderer<"select"> | undefined;
+                submit?: import('../../types/renderer').InputRenderer<"submit"> | undefined;
+                text?: import('../../types/renderer').InputRenderer<"text"> | undefined;
+                textarea?: import('../../types/renderer').InputRenderer<"textarea"> | undefined;
+                time?: import('../../types/renderer').InputRenderer<"time"> | undefined;
+                timerange?: import('../../types/renderer').InputRenderer<"timerange"> | undefined;
+            };
+            loadingSkeleton: (() => import('react').ReactNode) | undefined;
+            step: ((props: import('../../types/renderer').StepRenderProps) => import('react').ReactNode) | undefined;
+            submitButton: ((props: {
+                label?: string;
+                disabled?: boolean;
+                isSubmitting?: boolean;
+                [key: string]: unknown;
+            } | {
+                children?: import('react').ReactNode;
+                disabled?: boolean;
+                isSubmitting?: boolean;
+                onPress?: () => void;
+                [key: string]: unknown;
+            }) => import('react').ReactNode) | undefined;
+            submitButtonWrapper: ((props: {
+                children: import('react').ReactNode;
+                missingFields?: string[];
+            }) => import('react').ReactNode) | undefined;
+            ui: {
+                divider?: ((props: import('../../types/renderer').NodeRenderProps) => import('react').ReactNode) | undefined;
+                title?: ((props: import('../../types/renderer').NodeRenderProps) => import('react').ReactNode) | undefined;
+            };
+        };
+        googleApiKey: string | undefined;
+        headers: import('../../../shared/types/node').HttpHeaders;
+        language: string;
+        showPoweredBy: boolean;
+        theme: "dark" | "light";
+        validationMode: "onChange" | "onSubmit";
+    };
+    currentStep: import('../../utils/step').FlowStep;
+    currentStepGroupNode: Node<GroupNodeData> | undefined;
+    currentStepIndex: number;
+    firstErrorFieldId: string | undefined;
     formErrors: Record<string, string>;
     formValues: FormValues;
+    goToNextStep: () => void;
+    goToPreviousStep: () => void;
+    handleSubmit: () => Promise<boolean>;
+    hasSubmitInput: boolean;
     inputNodes: Node<import('../../../shared/types/node').InputNodeData>[];
-    mergedFlow: Flow;
+    isFirstStep: boolean;
+    isLastStep: boolean;
+    isSubmitting: boolean;
     missingRequiredFields: string[];
+    prevFormValuesRef: import('react').RefObject<FormValues>;
+    setFieldErrors: import('react').Dispatch<import('react').SetStateAction<Record<string, string>>>;
     setFieldValue: (fieldName: string, value: unknown) => void;
-    setFormErrors: import('react').Dispatch<import('react').SetStateAction<Record<string, string>>>;
-    t: (key?: import('../../../main').Translatable | import('../../../main').TranslationKey | string) => string;
+    setMultipleFieldValues: (updates: FormValues) => void;
+    steps: import('../../utils/step').FlowStep[];
+    submitMessage: {
+        type: "success" | "error";
+        message: string;
+    } | null;
+    t: (key?: import('../../../main').Translatable | string) => string;
     validateForm: (customValidate?: (values: FormValues, visibleNodesList: Node<TreegeNodeData>[]) => Record<string, string>) => {
         errors: {
             [x: string]: string;
@@ -48,3 +116,8 @@ export declare const useTreegeRenderer: (flows: Flow | Flow[] | null | undefined
     visibleNodes: Node<TreegeNodeData>[];
     visibleRootNodes: Node<TreegeNodeData>[];
 };
+/**
+ * Type for the return value of useTreegeRenderer
+ * Useful for TypeScript users building custom components
+ */
+export type UseTreegeRendererReturn = ReturnType<typeof useTreegeRenderer>;

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

@@ -1,3 +1,3 @@
 import { TreegeRendererProps } from '../../../types/renderer';
-declare const TreegeRenderer: ({ components, flows, googleApiKey, initialValues, language, onChange, onSubmit, theme, validate, validationMode, }: TreegeRendererProps) => import("react/jsx-runtime").JSX.Element;
+declare const TreegeRenderer: ({ baseUrl, components, className, flow, formId, googleApiKey, headers, language, onBack, onChange, onSubmit, showPoweredBy, theme, validate, validationMode, initialValues, isLoading, isSubmitting: isSubmittingProp, }: TreegeRendererProps) => import("react/jsx-runtime").JSX.Element;
 export default TreegeRenderer;

package/dist/renderer/features/TreegeRenderer/web/components/DefaultFormWrapper.d.ts

@@ -1,6 +1,7 @@
 import { FormEvent, ReactNode } from 'react';
-declare const DefaultFormWrapper: ({ children, onSubmit }: {
+declare const DefaultFormWrapper: ({ children, id, onSubmit, }: {
     children: ReactNode;
-    onSubmit: (e: FormEvent) => void;
+    id?: string;
+    onSubmit: (e: FormEvent<HTMLFormElement>) => void;
 }) => import("react/jsx-runtime").JSX.Element;
 export default DefaultFormWrapper;

package/dist/renderer/features/TreegeRenderer/web/components/DefaultInputWrapper.d.ts

@@ -0,0 +1,9 @@
+import { Node } from '@xyflow/react';
+import { ReactNode } from 'react';
+import { InputNodeData } from '../../../../../shared/types/node';
+interface DefaultInputWrapperProps {
+    node: Node<InputNodeData>;
+    children: ReactNode;
+}
+export declare const DefaultInputWrapper: ({ node, children }: DefaultInputWrapperProps) => import("react/jsx-runtime").JSX.Element;
+export default DefaultInputWrapper;

package/dist/renderer/features/TreegeRenderer/web/components/DefaultLoadingSkeleton.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Default loading skeleton displayed by `TreegeRenderer` while `isLoading` is
+ * true. Mimics the visual structure of a step (title, a few fields and the
+ * navigation buttons) so the layout doesn't shift once the real form renders.
+ */
+declare const DefaultLoadingSkeleton: () => import("react/jsx-runtime").JSX.Element;
+export default DefaultLoadingSkeleton;

package/dist/renderer/features/TreegeRenderer/web/components/DefaultStep.d.ts

@@ -0,0 +1,3 @@
+import { StepRenderProps } from '../../../../types/renderer';
+declare const DefaultStep: ({ step, label, children, canGoBack, isLastStep, canContinue, isSubmitting, onBack, onContinue, missingFields, }: StepRenderProps) => import("react/jsx-runtime").JSX.Element;
+export default DefaultStep;

package/dist/renderer/features/TreegeRenderer/web/components/DefaultSubmitButton.d.ts

@@ -1,9 +1,13 @@
 import { ButtonHTMLAttributes } from 'react';
 export interface SubmitButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     label?: string;
+    /**
+     * When true, shows a spinner inside the button (and keeps it disabled).
+     */
+    isSubmitting?: boolean;
 }
 /**
  * Default submit button
  */
-declare const DefaultSubmitButton: ({ label, ...props }: SubmitButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultSubmitButton: import('react').ForwardRefExoticComponent<SubmitButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
 export default DefaultSubmitButton;

package/dist/renderer/features/TreegeRenderer/web/components/DependencyHint.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+import { MissingDependency } from '../../../../types/renderer';
+interface MissingProps {
+    /** Unfilled fields the input depends on (from `extra.missingDependencies`). */
+    missing: MissingDependency[];
+}
+/**
+ * Wraps a disabled input control with a tooltip listing the fields the user
+ * must fill before the input's dynamic options can load. Renders children
+ * untouched when there are no missing dependencies, so it's safe to wrap any
+ * trigger-based dynamic input (select, autocomplete, http) unconditionally.
+ */
+declare const DependencyHint: ({ missing, children }: MissingProps & {
+    children: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Inline variant for inputs that have no single trigger to hover (radio,
+ * checkbox): renders the same hint as always-visible muted text. Renders
+ * nothing when there are no missing dependencies.
+ */
+export declare const DependencyHintMessage: ({ missing }: MissingProps) => import("react/jsx-runtime").JSX.Element | null;
+export default DependencyHint;

package/dist/renderer/features/TreegeRenderer/web/components/OptionItemContent.d.ts

@@ -0,0 +1,17 @@
+interface OptionItemContentProps {
+    /** Already-translated option label. */
+    label: string;
+    /** Already-translated option description (optional). */
+    description?: string;
+    /** Option image — base64 data URL or remote URL (optional). */
+    image?: string;
+}
+/**
+ * Shared content for an option row in a dropdown/combobox/select, built from the
+ * shadcn `Item` primitives: an optional leading image, the label, and an
+ * optional muted description underneath. Rendered as a fragment — the enclosing
+ * `CommandItem`/`SelectItem` already provides the flex row. The selection
+ * indicator (check) is left to the caller so it can sit outside this block.
+ */
+declare const OptionItemContent: ({ label, description, image }: OptionItemContentProps) => import("react/jsx-runtime").JSX.Element;
+export default OptionItemContent;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultAddressInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultAddressInput: ({ node, value, setValue, error }: InputRenderProps<"address">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultAddressInput: ({ field, extra }: InputRenderProps<"address">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultAddressInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultAutocompleteInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultAutocompleteInput: ({ node, value, setValue, error }: InputRenderProps<"autocomplete">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultAutocompleteInput: ({ field, extra }: InputRenderProps<"autocomplete">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultAutocompleteInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultCheckboxInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultCheckboxInput: ({ node, value, setValue, error }: InputRenderProps<"checkbox">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultCheckboxInput: ({ field, extra }: InputRenderProps<"checkbox">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultCheckboxInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultDateInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultDateInput: ({ node, value, setValue, error }: InputRenderProps<"date">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultDateInput: ({ field, extra }: InputRenderProps<"date">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultDateInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultDateRangeInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultDateRangeInput: ({ node, value, setValue, error }: InputRenderProps<"daterange">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultDateRangeInput: ({ field, extra }: InputRenderProps<"daterange">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultDateRangeInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultFileInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultFileInput: ({ node, setValue, error }: InputRenderProps<"file">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultFileInput: ({ field, extra }: InputRenderProps<"file">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultFileInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultHiddenInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultHiddenInput: ({ node, value }: InputRenderProps<"hidden">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultHiddenInput: ({ field }: InputRenderProps<"hidden">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultHiddenInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultHttpInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultHttpInput: ({ node, value, setValue, error }: InputRenderProps<"http">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultHttpInput: ({ field, extra }: InputRenderProps<"http">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultHttpInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultNumberInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultNumberInput: ({ node, value, setValue, error }: InputRenderProps<"number">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultNumberInput: ({ field, extra }: InputRenderProps<"number">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultNumberInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultPasswordInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultPasswordInput: ({ node, value, setValue, error }: InputRenderProps<"password">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultPasswordInput: ({ field, extra }: InputRenderProps<"password">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultPasswordInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultRadioInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultRadioInput: ({ node, value, setValue, error }: InputRenderProps<"radio">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultRadioInput: ({ field, extra }: InputRenderProps<"radio">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultRadioInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultSelectInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultSelectInput: ({ node, value, setValue, error }: InputRenderProps<"select">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultSelectInput: ({ field, extra }: InputRenderProps<"select">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultSelectInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultSubmitInput.d.ts

@@ -0,0 +1,11 @@
+import { InputRenderProps } from '../../../../../types/renderer';
+/**
+ * The `submit` input node is declarative only: it marks where the flow submits
+ * and carries the optional custom label / `submitConfig`. The actual submit
+ * button is rendered once by the step (in its action row, next to Back) — see
+ * `DefaultStep` — so the node itself renders nothing. This guarantees a single,
+ * consistently-placed button whether submission comes from an explicit submit
+ * node, the default "Submit", or a "Continue" step.
+ */
+declare const DefaultSubmitInput: (_props: InputRenderProps<"submit">) => null;
+export default DefaultSubmitInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultSwitchInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultSwitchInput: ({ node, value, setValue, error }: InputRenderProps<"switch">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultSwitchInput: ({ field, extra }: InputRenderProps<"switch">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultSwitchInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultTextAreaInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultTextAreaInput: ({ node, value, setValue, error }: InputRenderProps<"textarea">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultTextAreaInput: ({ field, extra }: InputRenderProps<"textarea">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultTextAreaInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultTextInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultTextInput: ({ node, value, setValue, error }: InputRenderProps<"text">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultTextInput: ({ field, extra }: InputRenderProps<"text">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultTextInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultTimeInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultTimeInput: ({ node, value, setValue, error }: InputRenderProps<"time">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultTimeInput: ({ field, extra }: InputRenderProps<"time">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultTimeInput;

package/dist/renderer/features/TreegeRenderer/web/components/inputs/DefaultTimeRangeInput.d.ts

@@ -1,3 +1,3 @@
 import { InputRenderProps } from '../../../../../types/renderer';
-declare const DefaultTimeRangeInput: ({ node, value, setValue, error }: InputRenderProps<"timerange">) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultTimeRangeInput: ({ field, extra }: InputRenderProps<"timerange">) => import("react/jsx-runtime").JSX.Element;
 export default DefaultTimeRangeInput;

package/dist/renderer/features/TreegeRenderer/web/components/styles/RendererStyles.d.ts

@@ -0,0 +1,2 @@
+declare const RendererStyles: () => import("react/jsx-runtime").JSX.Element;
+export default RendererStyles;

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

@@ -0,0 +1,28 @@
+import { Node } from '@xyflow/react';
+import { InputNodeData, InputOption } from '../../shared/types/node';
+interface UseInputOptionsResult {
+    /**
+     * Resolved options for the input. When the node has an `optionsSource`,
+     * these are the fetched options (or the static fallback while loading or
+     * if the fetch errors). Otherwise the static `options` from the node data.
+     */
+    options: InputOption[];
+    /** True while a remote fetch is in flight. */
+    isLoading: boolean;
+    /** Error message if the latest remote fetch failed; otherwise `null`. */
+    error: string | null;
+}
+/**
+ * Resolves the options for an option-based input (radio, checkbox, select,
+ * autocomplete). If the node declares an `optionsSource`, options are fetched
+ * from that API at runtime, with `{{templateVar}}` substitution from form
+ * values and merging of global + field-level headers. While loading, before
+ * the first successful fetch, or on error, falls back to the static
+ * `options` array (if any).
+ *
+ * The fetch plan is computed once and serialized to JSON. The fetch effect
+ * keys off this string: changes that don't affect the actual request (e.g.
+ * an unrelated form field) produce the same JSON and don't re-trigger.
+ */
+export declare const useInputOptions: (node: Node<InputNodeData>) => UseInputOptionsResult;
+export {};

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

@@ -0,0 +1,61 @@
+import { Node } from '@xyflow/react';
+import { ComponentType, ReactNode } from 'react';
+import { FormValues, InputRenderers, TreegeRendererComponents } from '../types/renderer';
+import { InputNodeData, TreegeNodeData } from '../../shared/types/node';
+type AnyComponent = ComponentType<any>;
+type UseRenderNodeParams = {
+    config: {
+        components: TreegeRendererComponents;
+        language: string;
+    };
+    DefaultFormWrapper: AnyComponent;
+    DefaultInputWrapper: ComponentType<{
+        node: Node<InputNodeData>;
+        children: ReactNode;
+    }>;
+    DefaultSubmitButton: AnyComponent;
+    DefaultSubmitButtonWrapper?: AnyComponent;
+    defaultInputRenderers: InputRenderers;
+    defaultUI: Record<string, AnyComponent>;
+    formErrors: Record<string, string>;
+    formValues: FormValues;
+    inputNodes: Node<InputNodeData>[];
+    isSubmitting?: boolean;
+    missingRequiredFields: string[];
+    setFieldValue: (fieldId: string, value: unknown) => void;
+};
+/**
+ * Hook that returns rendering utilities for TreegeRenderer
+ * Shared between web and native TreegeRenderer
+ *
+ * Returns:
+ * - renderNode: Function to render individual nodes
+ * - FormWrapper: Form wrapper component with fallback
+ * - SubmitButton: Submit button component with fallback
+ * - SubmitButtonWrapper: Submit button wrapper component with fallback (web only, undefined for native)
+ */
+export declare const useRenderNode: ({ DefaultFormWrapper, DefaultInputWrapper, DefaultSubmitButton, DefaultSubmitButtonWrapper, config, defaultInputRenderers, defaultUI, formErrors, formValues, inputNodes, isSubmitting, missingRequiredFields, setFieldValue, }: UseRenderNodeParams) => {
+    FormWrapper: ((props: {
+        children: ReactNode;
+        id?: string;
+        onSubmit: (e: import('react').FormEvent<HTMLFormElement>) => void;
+    }) => ReactNode) | AnyComponent;
+    renderNode: (node: Node<TreegeNodeData>) => ReactNode;
+    SubmitButton: ((props: {
+        label?: string;
+        disabled?: boolean;
+        isSubmitting?: boolean;
+        [key: string]: unknown;
+    } | {
+        children?: ReactNode;
+        disabled?: boolean;
+        isSubmitting?: boolean;
+        onPress?: () => void;
+        [key: string]: unknown;
+    }) => ReactNode) | AnyComponent;
+    SubmitButtonWrapper: ((props: {
+        children: ReactNode;
+        missingFields?: string[];
+    }) => ReactNode) | AnyComponent;
+};
+export {};

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

@@ -0,0 +1,36 @@
+import { Node } from '@xyflow/react';
+import { FormValues } from '../types/renderer';
+import { SubmitResult } from '../utils/submit';
+import { HttpHeaders, InputNodeData, TreegeNodeData } from '../../shared/types/node';
+/**
+ * Hook for handling form submission with submit button configuration
+ *
+ * This hook provides:
+ * - Submit button node detection
+ * - HTTP submission handling
+ * - Loading state management
+ * - Success/error message handling
+ * - Redirect handling
+ *
+ * @param visibleNodes - Currently visible nodes in the form
+ * @param formValues - Current form values
+ * @param language - Current language for translations
+ * @param inputNodes - All input nodes for form data conversion
+ * @param headers
+ * @param baseUrl - Base URL prepended to a relative submit url
+ * @returns Submit handler state and functions
+ */
+export declare const useSubmitHandler: (visibleNodes: Node<TreegeNodeData>[], formValues: FormValues, language: string, inputNodes: Node<InputNodeData>[], headers?: HttpHeaders, baseUrl?: string) => {
+    clearSubmitMessage: () => void;
+    handleSubmitWithConfig: (onSuccess?: (data: unknown) => void) => Promise<SubmitResult | null>;
+    hasSubmitConfig: boolean;
+    isSubmitting: boolean;
+    submitButtonNode: {
+        id: string;
+        data: InputNodeData;
+    } | null;
+    submitMessage: {
+        type: "success" | "error";
+        message: string;
+    } | null;
+};

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

@@ -1,10 +1,12 @@
+import { Translatable } from '../../shared/types/translate';
 /**
  * Hook for translating text in the renderer with context-aware language preference.
  *
- * This hook uses the language from TreegeRendererContext (or explicit override) and delegates to the shared useTranslate hook.
+ * This hook uses the language from TreegeRenderRuntimeContext (or explicit override) and delegates to the shared useTranslate hook.
+ * All translations are automatically sanitized to prevent XSS attacks.
  *
  * @param language - Optional language override. If not provided, uses language from context.
- * @returns A function that translates either a translation key or a Translatable object
+ * @returns A function that translates either a translation key or a Translatable object (with XSS protection)
  *
  * @example
  * // Static translation (from translation files)
@@ -12,13 +14,13 @@
  * const errorMsg = t("validation.required"); // "This field is required"
  *
  * @example
- * // Dynamic translation (from node data)
+ * // Dynamic translation (from node data) - automatically sanitized
  * const t = useTranslate();
- * const label = t(node.data.label); // Translates user-defined content
+ * const label = t(node.data.label); // Translates and sanitizes user-defined content
  *
  * @example
  * // With explicit language
  * const t = useTranslate("fr");
  * const errorMsg = t("validation.required"); // "Ce champ est requis"
  */
-export declare const useTranslate: (language?: string) => (key?: import('../../main').Translatable | import('../../main').TranslationKey | string) => string;
+export declare const useTranslate: (language?: string) => (key?: Translatable | string) => string;

package/dist/renderer/index.d.ts

@@ -1,8 +1,9 @@
-export { TreegeConfigProvider, useTreegeConfig } from './context/TreegeConfigContext';
+export { TreegeRendererProvider, useTreegeRendererConfig } from './context/TreegeRendererProvider';
+export type { UseTreegeRendererReturn } from './features/TreegeRenderer/useTreegeRenderer';
 export { useTreegeRenderer } from './features/TreegeRenderer/useTreegeRenderer';
 export * from './features/TreegeRenderer/web/components/DefaultFormWrapper';
-export * from './features/TreegeRenderer/web/components/DefaultGroup';
 export * from './features/TreegeRenderer/web/components/DefaultInputs';
+export * from './features/TreegeRenderer/web/components/DefaultStep';
 export * from './features/TreegeRenderer/web/components/DefaultSubmitButton';
 export * from './features/TreegeRenderer/web/components/DefaultUI';
 export * from './features/TreegeRenderer/web/TreegeRenderer';
@@ -13,5 +14,6 @@ export * from './utils/conditions';
 export * from './utils/file';
 export * from './utils/flow';
 export * from './utils/form';
+export * from './utils/sanitize';
 export { ThemeProvider, useTheme } from '../shared/context/ThemeContext';
 export { getTranslatedText } from '../shared/utils/translations';

package/dist/renderer/index.native.d.ts

@@ -0,0 +1,19 @@
+export { TreegeRendererProvider, useTreegeRendererConfig } from './context/TreegeRendererProvider';
+export * from './features/TreegeRenderer/native/components/DefaultFormWrapper';
+export * from './features/TreegeRenderer/native/components/DefaultInputs';
+export * from './features/TreegeRenderer/native/components/DefaultStep';
+export * from './features/TreegeRenderer/native/components/DefaultSubmitButton';
+export * from './features/TreegeRenderer/native/components/DefaultSubmitButtonWrapper';
+export * from './features/TreegeRenderer/native/components/DefaultUI';
+export type { TreegeRendererNativeProps } from './features/TreegeRenderer/native/TreegeRenderer';
+export { default as TreegeRenderer } from './features/TreegeRenderer/native/TreegeRenderer';
+export type { UseTreegeRendererReturn } from './features/TreegeRenderer/useTreegeRenderer';
+export { useTreegeRenderer } from './features/TreegeRenderer/useTreegeRenderer';
+export type { TreegeRendererConfig } from './types/renderer';
+export * from './types/renderer';
+export * from './utils/conditions';
+export * from './utils/file';
+export * from './utils/flow';
+export * from './utils/form';
+export * from './utils/sanitize.native';
+export { getTranslatedText } from '../shared/utils/translations';