import { type ComponentType, type ReactNode } from "react";
import { type ColorTokens, type StyleProp, type TextStyle, type ViewStyle } from "../../style/index.js";
import { type ButtonProps } from "../../atoms/button/button.shared.js";
export type ButtonComponent = ComponentType<ButtonProps>;
export interface FormSkin {
    /** A section's heading type (size / line-height / weight / tracking). */
    sectionTitle: (t: ColorTokens) => TextStyle;
    /** The muted supporting line under a section heading. */
    sectionDescription: (t: ColorTokens) => TextStyle;
    /** The right-aligned actions row. */
    actions: ViewStyle;
    /** The form's stacked rhythm (gap between rows). */
    stack: ViewStyle;
    /** A section's internal rhythm (header block to rows, row to row). */
    sectionStack: ViewStyle;
}
export interface FormSectionProps {
    /** Section heading naming this group of controls. */
    title?: string;
    /** Muted supporting line under the heading. */
    description?: ReactNode;
    /** The section's stitched controls. */
    children?: ReactNode;
    /** E2E hook forwarded to the root element. */
    testID?: string;
    /** Outer layout composition only (width/flex within a parent), never a restyle hook. */
    style?: StyleProp<ViewStyle>;
}
export interface FormProps {
    /**
     * The form rows, stitched by the caller: Input, Select, Checkbox, a
     * FormSection, any node. Each control keeps its own state (controlled or
     * uncontrolled); Form never intercepts it.
     */
    children?: ReactNode;
    /**
     * Two-column: rows flow into a two-up grid that collapses to a single column
     * on small screens (desktop-first). Omit for the stacked default.
     */
    twoColumn?: boolean;
    /** Label for the primary submit button. Passing it (or `cancelLabel`) renders the actions row. */
    submitLabel?: string;
    /** Renders an outline cancel button before the submit button. */
    cancelLabel?: string;
    /**
     * Fired when the submit button is pressed, and on the web when Enter is
     * pressed inside one of the form's single-line text fields. Form owns no field
     * state, so the caller reads its own values (no payload).
     */
    onSubmit?: () => void;
    /** Fired when the cancel button is pressed. */
    onCancel?: () => void;
    /** Disables the actions row and Enter-to-submit. */
    disabled?: boolean;
    /** E2E hook forwarded to the root element. */
    testID?: string;
    /** Outer layout composition only (width/flex within a parent), never a restyle hook. */
    style?: StyleProp<ViewStyle>;
}
/**
 * Build a FormSection component from a platform skin: a titled, described group
 * of stitched controls inside a Form (the composition successor to a fieldset
 * legend).
 */
export declare function createFormSection(skin: FormSkin): ({ title, description, children, testID, style }: FormSectionProps) => import("react").JSX.Element;
/** Build a Form component from a platform skin (plus the platform-correct Button its actions row composes; defaults to the web base when omitted). */
export declare function createForm(skin: FormSkin, Button?: ButtonComponent): (props: FormProps) => import("react").JSX.Element;
//# sourceMappingURL=form.shared.d.ts.map