/**
 * Core component base classes.
 *
 * Every UI component inherits from Component. Container components
 * (Column, Row, Card, etc.) extend ContainerComponent which adds children.
 * StatefulMixin adds name/value tracking for form elements.
 *
 * Serialization: Components produce a flat JSON tree matching the
 * Python prefab-ui wire format:
 *   { type: "Button", label: "Hi", variant: "default" }
 *   { type: "Column", gap: 4, children: [...] }
 */
import type { Action, ActionJSON } from '../actions/types.js';
import type { Rx } from '../rx/rx.js';
import type { Ref } from '../rx/collection.js';
/** Any value that can be a plain string, a reactive Rx expression, or a Ref */
export type RxStr = string | Rx | Ref;
/** Serialized component JSON */
export interface ComponentJSON {
    type: string;
    id?: string;
    cssClass?: string;
    onMount?: ActionJSON | ActionJSON[];
    children?: ComponentJSON[];
    [key: string]: unknown;
}
/** Convert snake_case or camelCase prop name to JSON camelCase */
export declare function toCamelCase(key: string): string;
/** Convert camelCase or snake_case prop name to snake_case */
export declare function toSnakeCase(key: string): string;
/** Serialize a value for JSON output */
export declare function serializeValue(v: unknown): unknown;
export interface ComponentProps {
    id?: string;
    cssClass?: RxStr;
    onClick?: Action | Action[];
    onMount?: Action | Action[];
}
export declare class Component {
    readonly componentType: string;
    id?: string;
    cssClass?: RxStr;
    onClick?: Action | Action[];
    onMount?: Action | Action[];
    constructor(type: string, props?: ComponentProps);
    /** Override in subclasses to add component-specific props */
    getProps(): Record<string, unknown>;
    toJSON(): ComponentJSON;
}
export interface ContainerProps extends ComponentProps {
    children?: Component[];
}
export declare class ContainerComponent extends Component {
    children: Component[];
    constructor(type: string, props?: ContainerProps);
    toJSON(): ComponentJSON;
}
export interface StatefulProps extends ComponentProps {
    name: string;
    value?: unknown;
    onChange?: Action | Action[];
}
/**
 * Base class for stateful form components (Input, Checkbox, Select, etc.).
 * Provides a `name` for state binding and an optional `onChange` action.
 */
export declare class StatefulComponent extends Component {
    name: string;
    value?: unknown;
    onChange?: Action | Action[];
    constructor(type: string, props: StatefulProps);
    getProps(): Record<string, unknown>;
}
//# sourceMappingURL=component.d.ts.map