@tachui/primitives/dist/forms/BasicForm.d.ts

Basic UI components for tachUI framework

/**
 * BasicForm Component (Phase 6.4.1)
 *
 * Lightweight SwiftUI-inspired Form component for Core-only applications.
 * Provides essential form functionality with automatic styling and basic validation
 * without the complexity of the full Forms plugin. Perfect for simple forms,
 * contact forms, and login pages where minimal bundle size is important.
 *
 * For advanced form features (comprehensive validation, state management,
 * multi-step forms), use the Form component from @tachui/forms.
 */
import type { ModifiableComponent, ModifierBuilder } from '@tachui/core';
import type { ComponentInstance, ComponentProps } from '@tachui/core';
/**
 * BasicForm component properties
 */
export interface BasicFormProps extends ComponentProps {
    children?: ComponentInstance[];
    onSubmit?: (data: FormData) => void | Promise<void>;
    onValidationChange?: (isValid: boolean, errors: ValidationError[]) => void;
    validateOnChange?: boolean;
    validateOnSubmit?: boolean;
    showValidationSummary?: boolean;
    style?: 'automatic' | 'grouped' | 'inset' | 'plain';
    spacing?: number;
    accessibilityLabel?: string;
    accessibilityRole?: string;
}
/**
 * Validation error structure
 */
export interface ValidationError {
    field: string;
    message: string;
    code?: string;
}
/**
 * Form data structure
 */
export interface FormData {
    [key: string]: any;
}
/**
 * BasicForm component class
 */
export declare class BasicFormImplementation implements ComponentInstance<BasicFormProps> {
    props: BasicFormProps;
    readonly type: "component";
    readonly id: string;
    mounted: boolean;
    cleanup: (() => void)[];
    private formElement;
    private validationErrors;
    private setValidationErrors;
    private setIsValid;
    constructor(props: BasicFormProps);
    /**
     * Extract form data from form elements
     */
    private extractFormData;
    /**
     * Validate all form fields
     */
    private validateForm;
    /**
     * Handle form submission
     */
    private handleSubmit;
    /**
     * Handle form input changes
     */
    private handleChange;
    /**
     * Get form styling based on style prop
     */
    private getFormStyles;
    /**
     * Render validation summary
     */
    private renderValidationSummary;
    render(): import("@tachui/core").DOMNode[];
}
/**
 * BasicForm component function
 */
export declare function BasicForm(children: ComponentInstance[], props?: Omit<BasicFormProps, 'children'>): ModifiableComponent<BasicFormProps> & {
    modifier: ModifierBuilder<ModifiableComponent<BasicFormProps>>;
};
/**
 * BasicForm style variants
 */
export declare const BasicFormStyles: {
    /**
     * Automatic form styling (default)
     */
    Automatic(children: ComponentInstance[], props?: Omit<BasicFormProps, "children" | "style">): ModifiableComponent<BasicFormProps> & {
        modifier: ModifierBuilder<ModifiableComponent<BasicFormProps>>;
    };
    /**
     * Grouped form with container styling
     */
    Grouped(children: ComponentInstance[], props?: Omit<BasicFormProps, "children" | "style">): ModifiableComponent<BasicFormProps> & {
        modifier: ModifierBuilder<ModifiableComponent<BasicFormProps>>;
    };
    /**
     * Inset form styling
     */
    Inset(children: ComponentInstance[], props?: Omit<BasicFormProps, "children" | "style">): ModifiableComponent<BasicFormProps> & {
        modifier: ModifierBuilder<ModifiableComponent<BasicFormProps>>;
    };
    /**
     * Plain form without styling
     */
    Plain(children: ComponentInstance[], props?: Omit<BasicFormProps, "children" | "style">): ModifiableComponent<BasicFormProps> & {
        modifier: ModifierBuilder<ModifiableComponent<BasicFormProps>>;
    };
};
/**
 * BasicForm validation utilities
 */
export declare const BasicFormValidation: {
    /**
     * Common validation rules
     */
    rules: {
        required: (value: any) => boolean;
        email: (value: string) => boolean;
        minLength: (min: number) => (value: string) => boolean;
        maxLength: (max: number) => (value: string) => boolean;
        pattern: (regex: RegExp) => (value: string) => boolean;
        number: (value: string) => boolean;
        integer: (value: string) => boolean;
        min: (min: number) => (value: string) => boolean;
        max: (max: number) => (value: string) => boolean;
    };
    /**
     * Validate a single field
     */
    validateField(value: any, rules: Array<(value: any) => boolean | string>): ValidationError | null;
};
//# sourceMappingURL=BasicForm.d.ts.map