treege 3.0.0-beta.26 → 3.0.0-beta.27

package/dist/renderer/features/TreegeRenderer/native/components/DefaultInputs.d.ts

@@ -1,15 +1,26 @@
-/**
- * Default Input Components for React Native
- *
- * TODO: Implement React Native versions of all input renderers
- * This should mirror the web version but use React Native components:
- * - TextInput instead of <input>
- * - Picker instead of <select>
- * - Switch instead of <input type="checkbox">
- * - etc.
- *
- * Should export:
- * - defaultInputRenderers object with all input types
- * - Individual input components (DefaultTextInput, DefaultNumberInput, etc.)
- */
-export {};
+import { default as DefaultAddressInput } from './inputs/DefaultAddressInput';
+import { default as DefaultAutocompleteInput } from './inputs/DefaultAutocompleteInput';
+import { default as DefaultCheckboxInput } from './inputs/DefaultCheckboxInput';
+import { default as DefaultDateInput } from './inputs/DefaultDateInput';
+import { default as DefaultDateRangeInput } from './inputs/DefaultDateRangeInput';
+import { default as DefaultFileInput } from './inputs/DefaultFileInput';
+import { default as DefaultHiddenInput } from './inputs/DefaultHiddenInput';
+import { default as DefaultHttpInput } from './inputs/DefaultHttpInput';
+import { default as DefaultNumberInput } from './inputs/DefaultNumberInput';
+import { default as DefaultPasswordInput } from './inputs/DefaultPasswordInput';
+import { default as DefaultRadioInput } from './inputs/DefaultRadioInput';
+import { default as DefaultSelectInput } from './inputs/DefaultSelectInput';
+import { default as DefaultSwitchInput } from './inputs/DefaultSwitchInput';
+import { default as DefaultTextareaInput } from './inputs/DefaultTextareaInput';
+import { default as DefaultTextInput } from './inputs/DefaultTextInput';
+import { default as DefaultTimeInput } from './inputs/DefaultTimeInput';
+import { default as DefaultTimeRangeInput } from './inputs/DefaultTimeRangeInput';
+import { InputRenderers, InputRenderProps } from '../../../../types/renderer';
+export { DefaultTextInput, DefaultNumberInput, DefaultPasswordInput, DefaultTextareaInput };
+export { DefaultCheckboxInput, DefaultSwitchInput, DefaultRadioInput, DefaultSelectInput };
+export { DefaultHiddenInput };
+export { DefaultAddressInput, DefaultAutocompleteInput, DefaultHttpInput };
+export { DefaultDateInput, DefaultDateRangeInput, DefaultTimeInput, DefaultTimeRangeInput };
+export { DefaultFileInput };
+export declare const DefaultSubmitInput: ({ node }: InputRenderProps<"submit">) => import("react/jsx-runtime").JSX.Element;
+export declare const defaultInputRenderers: InputRenderers;

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

@@ -1,7 +1,9 @@
-/**
- * Default Submit Button for React Native
- *
- * TODO: Implement React Native version of SubmitButton
- * Should use Pressable or TouchableOpacity component
- */
-export {};
+import { ReactNode } from 'react';
+export interface DefaultSubmitButtonProps {
+    children?: ReactNode;
+    disabled?: boolean;
+    isSubmitting?: boolean;
+    onPress?: () => void;
+}
+declare const DefaultSubmitButton: ({ children, disabled, isSubmitting, onPress }: DefaultSubmitButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default DefaultSubmitButton;

package/dist/renderer/features/TreegeRenderer/native/components/DefaultSubmitButtonWrapper.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+export interface SubmitButtonWrapperProps {
+    children: ReactNode;
+    missingFields?: string[];
+}
+/**
+ * Default submit button wrapper for React Native
+ * Simple wrapper that renders children (no tooltip like web version)
+ */
+declare const DefaultSubmitButtonWrapper: ({ children }: SubmitButtonWrapperProps) => ReactNode;
+export default DefaultSubmitButtonWrapper;

package/dist/renderer/features/TreegeRenderer/native/components/DefaultUI.d.ts

@@ -1,7 +1,8 @@
-/**
- * Default UI Components for React Native
- *
- * TODO: Implement React Native versions of UI components (Title, Description, Divider, etc.)
- * Should use Text, View and other React Native components
- */
-export {};
+import { UiRenderProps } from '../../../../types/renderer';
+declare const DefaultTitleUI: ({ node }: UiRenderProps) => import("react/jsx-runtime").JSX.Element;
+declare const DefaultDividerUI: () => import("react/jsx-runtime").JSX.Element;
+export { DefaultTitleUI, DefaultDividerUI };
+export declare const defaultUI: {
+    divider: () => import("react/jsx-runtime").JSX.Element;
+    title: ({ node }: UiRenderProps) => import("react/jsx-runtime").JSX.Element;
+};

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

@@ -0,0 +1,3 @@
+import { InputRenderProps } from '../../../../../types/renderer';
+declare const DefaultAddressInput: ({ node, value, setValue, error, label, placeholder, helperText, id: _id, name: _name, }: InputRenderProps<"address">) => import("react/jsx-runtime").JSX.Element;
+export default DefaultAddressInput;

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

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

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

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

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

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

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

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

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

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

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

@@ -0,0 +1,3 @@
+import { InputRenderProps } from '../../../../../types/renderer';
+declare const DefaultHiddenInput: (_props: InputRenderProps<"hidden">) => null;
+export default DefaultHiddenInput;

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

@@ -0,0 +1,3 @@
+import { InputRenderProps } from '../../../../../types/renderer';
+declare const DefaultHttpInput: ({ node, value, setValue, error, label, placeholder, helperText, id: _id, name: _name, }: InputRenderProps<"http">) => import("react/jsx-runtime").JSX.Element;
+export default DefaultHttpInput;

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

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

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

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

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

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

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

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

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

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

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

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

package/dist/renderer/features/TreegeRenderer/native/components/inputs/DefaultTextareaInput.d.ts

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

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

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

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

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

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

@@ -1,44 +1,97 @@
 import { Node } from '@xyflow/react';
-import { FormValues } from '../../types/renderer';
-import { Flow, TreegeNodeData } from '../../../shared/types/node';
+import { FormValues, TreegeRendererProps } from '../../types/renderer';
+import { 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 (flows, 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: ({ components, flows, googleApiKey, initialValues, language, onChange, onSubmit, theme, validate, validationMode, }: Pick<TreegeRendererProps, "components" | "flows" | "googleApiKey" | "initialValues" | "language" | "onChange" | "onSubmit" | "theme" | "validate" | "validationMode">) => {
     canSubmit: boolean;
+    clearSubmitMessage: () => void;
+    config: {
+        components: {
+            form: ((props: {
+                children: import('react').ReactNode;
+                onSubmit: (e: import('react').FormEvent) => void;
+            }) => import('react').ReactNode) | undefined;
+            group: ((props: import('../../types/renderer').NodeRenderProps & {
+                children?: import('react').ReactNode;
+            }) => import('react').ReactNode) | undefined;
+            inputs: {
+                number?: ((props: import('../../types/renderer').InputRenderProps<"number">) => import('react').ReactNode) | undefined;
+                address?: ((props: import('../../types/renderer').InputRenderProps<"address">) => import('react').ReactNode) | undefined;
+                autocomplete?: ((props: import('../../types/renderer').InputRenderProps<"autocomplete">) => import('react').ReactNode) | undefined;
+                checkbox?: ((props: import('../../types/renderer').InputRenderProps<"checkbox">) => import('react').ReactNode) | undefined;
+                date?: ((props: import('../../types/renderer').InputRenderProps<"date">) => import('react').ReactNode) | undefined;
+                daterange?: ((props: import('../../types/renderer').InputRenderProps<"daterange">) => import('react').ReactNode) | undefined;
+                file?: ((props: import('../../types/renderer').InputRenderProps<"file">) => import('react').ReactNode) | undefined;
+                hidden?: ((props: import('../../types/renderer').InputRenderProps<"hidden">) => import('react').ReactNode) | undefined;
+                http?: ((props: import('../../types/renderer').InputRenderProps<"http">) => import('react').ReactNode) | undefined;
+                password?: ((props: import('../../types/renderer').InputRenderProps<"password">) => import('react').ReactNode) | undefined;
+                radio?: ((props: import('../../types/renderer').InputRenderProps<"radio">) => import('react').ReactNode) | undefined;
+                select?: ((props: import('../../types/renderer').InputRenderProps<"select">) => import('react').ReactNode) | undefined;
+                submit?: ((props: import('../../types/renderer').InputRenderProps<"submit">) => import('react').ReactNode) | undefined;
+                switch?: ((props: import('../../types/renderer').InputRenderProps<"switch">) => import('react').ReactNode) | undefined;
+                text?: ((props: import('../../types/renderer').InputRenderProps<"text">) => import('react').ReactNode) | undefined;
+                textarea?: ((props: import('../../types/renderer').InputRenderProps<"textarea">) => import('react').ReactNode) | undefined;
+                time?: ((props: import('../../types/renderer').InputRenderProps<"time">) => import('react').ReactNode) | undefined;
+                timerange?: ((props: import('../../types/renderer').InputRenderProps<"timerange">) => import('react').ReactNode) | undefined;
+            };
+            submitButton: ((props: {
+                label?: string;
+                disabled?: 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;
+        language: string;
+        theme: "dark" | "light";
+        validationMode: "onChange" | "onSubmit";
+    };
+    firstErrorFieldId: string | undefined;
     formErrors: Record<string, string>;
     formValues: FormValues;
+    handleSubmit: () => Promise<boolean>;
     inputNodes: Node<import('../../../shared/types/node').InputNodeData>[];
-    mergedFlow: Flow;
+    isSubmitting: boolean;
+    mergedFlow: import('../../../shared/types/node').Flow;
     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>>>;
     setMultipleFieldValues: (updates: FormValues) => void;
+    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: {
@@ -50,3 +103,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, language, onChange, onSubmit, theme, validate, validationMode, initialValues, }: TreegeRendererProps) => import("react/jsx-runtime").JSX.Element;
+declare const TreegeRenderer: ({ components, className, flows, googleApiKey, language, onChange, onSubmit, theme, validate, validationMode, initialValues, }: TreegeRendererProps) => import("react/jsx-runtime").JSX.Element;
 export default TreegeRenderer;

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

@@ -0,0 +1,55 @@
+import { Node } from '@xyflow/react';
+import { ComponentType, ReactNode } from 'react';
+import { FormValues, InputRenderers, TreegeRendererComponents } from '../types/renderer';
+import { TreegeNodeData } from '../../shared/types/node';
+type AnyComponent = ComponentType<any>;
+type UseRenderNodeParams = {
+    config: {
+        components: TreegeRendererComponents;
+        language: string;
+    };
+    DefaultFormWrapper: AnyComponent;
+    DefaultGroup: AnyComponent;
+    DefaultSubmitButton: AnyComponent;
+    DefaultSubmitButtonWrapper?: AnyComponent;
+    defaultInputRenderers: InputRenderers;
+    defaultUI: Record<string, AnyComponent>;
+    formErrors: Record<string, string>;
+    formValues: FormValues;
+    missingRequiredFields: string[];
+    setFieldValue: (fieldId: string, value: unknown) => void;
+    visibleNodes: Node<TreegeNodeData>[];
+};
+/**
+ * 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, DefaultGroup, DefaultSubmitButton, DefaultSubmitButtonWrapper, config, defaultInputRenderers, defaultUI, formErrors, formValues, missingRequiredFields, setFieldValue, visibleNodes, }: UseRenderNodeParams) => {
+    FormWrapper: ((props: {
+        children: ReactNode;
+        onSubmit: (e: import('react').FormEvent) => void;
+    }) => ReactNode) | AnyComponent;
+    renderNode: (node: Node<TreegeNodeData>) => ReactNode;
+    SubmitButton: ((props: {
+        label?: string;
+        disabled?: 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/index.d.ts

@@ -1,4 +1,5 @@
 export { TreegeConfigProvider, useTreegeConfig } from './context/TreegeConfigContext';
+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';

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

@@ -0,0 +1,19 @@
+export { TreegeConfigProvider, useTreegeConfig } from './context/TreegeConfigContext';
+export * from './features/TreegeRenderer/native/components/DefaultFormWrapper';
+export * from './features/TreegeRenderer/native/components/DefaultGroup';
+export * from './features/TreegeRenderer/native/components/DefaultInputs';
+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';

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

@@ -120,7 +120,9 @@ export type TreegeRendererComponents = {
     /**
      * Custom group container renderer
      */
-    group?: (props: NodeRenderProps) => ReactNode;
+    group?: (props: NodeRenderProps & {
+        children?: ReactNode;
+    }) => ReactNode;
     /**
      * Custom form wrapper
      */
@@ -129,10 +131,20 @@ export type TreegeRendererComponents = {
         onSubmit: (e: FormEvent) => void;
     }) => ReactNode;
     /**
-     * Custom submit button (pure button without wrapper)
+     * Custom submit button (supports both web and native variants)
+     * Web variant: { label?: string; disabled?: boolean; ...otherHTMLAttributes }
+     * Native variant: { children?: ReactNode; disabled?: boolean; isSubmitting?: boolean; onPress?: () => void }
      */
     submitButton?: (props: {
         label?: string;
+        disabled?: boolean;
+        [key: string]: unknown;
+    } | {
+        children?: ReactNode;
+        disabled?: boolean;
+        isSubmitting?: boolean;
+        onPress?: () => void;
+        [key: string]: unknown;
     }) => ReactNode;
     /**
      * Custom submit button wrapper (e.g., for tooltip with missing fields)
@@ -175,7 +187,11 @@ export type TreegeRendererConfig = {
 /**
  * Props for the TreegeRenderer component
  */
-export type TreegeRendererProps = {
+export interface TreegeRendererProps {
+    /**
+     * Additional class name for the renderer container
+     */
+    className?: string;
     /**
      * Custom component renderers
      */
@@ -222,4 +238,4 @@ export type TreegeRendererProps = {
      * Validation mode
      */
     validationMode?: "onChange" | "onSubmit";
-};
+}

package/dist/renderer/utils/sanitize.native.d.ts

@@ -0,0 +1,69 @@
+/**
+ * React Native implementation of sanitization utilities
+ * Does not use DOMPurify as it depends on browser DOM
+ */
+/**
+ * Configuration for sanitization
+ */
+interface SanitizeOptions {
+    /**
+     * Allow only plain text (strip all HTML tags)
+     * @default true
+     */
+    plainTextOnly?: boolean;
+    /**
+     * Custom allowed tags (when plainTextOnly is false)
+     * Note: In React Native, HTML tags are always stripped
+     */
+    allowedTags?: string[];
+    /**
+     * Custom allowed attributes (when plainTextOnly is false)
+     * Note: In React Native, attributes are not applicable
+     */
+    allowedAttributes?: string[];
+}
+/**
+ * Sanitizes user input to prevent XSS attacks
+ *
+ * React Native implementation that strips all HTML tags and decodes entities.
+ * Since React Native doesn't render HTML, we focus on cleaning text content.
+ *
+ * @param input - The string to sanitize
+ * @param options - Sanitization options (maintained for API compatibility)
+ * @returns Sanitized string safe for rendering
+ *
+ * @example
+ * sanitize('<script>alert("xss")</script>Hello')
+ * // => 'Hello'
+ *
+ * @example
+ * sanitize('<b>Bold text</b><script>alert("xss")</script>')
+ * // => 'Bold text'
+ */
+export declare const sanitize: (input: string | undefined | null, _options?: SanitizeOptions) => string;
+/**
+ * Sanitizes data from HTTP responses
+ *
+ * This function recursively sanitizes all string values in an object or array.
+ * Useful for cleaning data received from external APIs before displaying it.
+ *
+ * Protection against:
+ * - Circular references: Uses WeakSet to detect and handle circular objects
+ * - Deep nesting attacks: Limits recursion depth to prevent DoS
+ * - XSS attacks: Sanitizes all string values
+ *
+ * @param data - The data to sanitize (can be any type)
+ * @param options - Sanitization options
+ * @param depth - Current recursion depth (internal use)
+ * @param seen - WeakSet to track visited objects (internal use)
+ * @returns Sanitized data with same structure
+ *
+ * @example
+ * sanitizeHttpResponse({
+ *   name: 'John <script>xss</script>',
+ *   nested: { title: 'Hello <b>world</b>' }
+ * })
+ * // => { name: 'John ', nested: { title: 'Hello world' } }
+ */
+export declare const sanitizeHttpResponse: (data: unknown, options?: SanitizeOptions, depth?: number, seen?: WeakSet<object>) => unknown;
+export {};

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

@@ -33,7 +33,7 @@ export interface SubmitResult {
  *
  * @param config - Submit configuration from the submit button node
  * @param formValues - Current form values
- * @param inputNodes - All input nodes (required when sendFormData is true)
+ * @param inputNodes - All input nodes (required when sendAllFormValues is true)
  * @returns Promise with submission result
  */
 export declare const submitFormData: (config: SubmitConfig, formValues: FormValues, inputNodes: Node<InputNodeData>[]) => Promise<SubmitResult>;

package/dist/renderer-native.d.ts

@@ -0,0 +1,2 @@
+export * from './renderer/index.native'
+export {}