import { type ComponentType, type ReactNode } from "react";
import { type LayoutStyle } from "../../style/index.js";
import { type ButtonProps } from "../../atoms/button/button.shared.js";
import { type SwitchProps } from "../../atoms/switch/switch.shared.js";
import { type ActionPanelSkin, type Tone, type Layout } from "./action-panels.styles.js";
export interface ActionPanelProps {
    /** The headline: what the action acts on. */
    title?: string;
    /** The consequence copy beneath the title: what happens when the action fires. */
    description?: string;
    /** The action button label. */
    actionLabel?: string;
    /** Fired when the action button is pressed. */
    onAction?: () => void;
    destructive?: boolean;
    inline?: boolean;
    toggle?: boolean;
    /** The Switch on/off state when `toggle` is set (CONTROLLED). Omit for uncontrolled use. */
    checked?: boolean;
    /** Initial Switch state for uncontrolled use (the toggle flips itself on press). */
    defaultChecked?: boolean;
    /** Fired with the next checked value when the toggle Switch is flipped. */
    onToggle?: (next: boolean) => void;
    /**
     * Content embedded in the panel under the copy (a block of field rows in a settings
     * panel, say). The Button then closes the panel on the right, under a hairline, as
     * the action that commits it; a toggle stays pinned beside the copy.
     */
    children?: ReactNode;
    /** E2E hook forwarded to the root element. */
    testID?: string;
    /** Composition within a parent only, never a restyle hook and never a width: the parent layout container provides the bounds. */
    style?: LayoutStyle;
}
export type ButtonComponent = ComponentType<ButtonProps>;
export type SwitchComponent = ComponentType<SwitchProps>;
export declare function toneOf(p: ActionPanelProps): Tone;
export declare function layoutOf(p: ActionPanelProps): Layout;
/**
 * Build an ActionPanel component from a platform skin.
 *
 * `Button` and `Switch` are the platform-correct atoms, passed in by each platform's
 * thin `.tsx`/`.ios`/`.android` file, so the action matches the panel's platform on
 * every build path. This matters for the WEB docs 3-up preview: a bare barrel import
 * always resolves the WEB atom in a browser bundler, which would paint a web-styled
 * Button/Switch inside the iOS/Android rows. Both default to the web base when omitted.
 *
 * The panel itself is the hand-off's own surface (not a Card: it has no shade and the
 * danger zone washes it), a content-layer pane under glass, tinted with the danger wash.
 */
export declare function createActionPanel(skin: ActionPanelSkin, Button?: ButtonComponent, Switch?: SwitchComponent): (props: ActionPanelProps) => import("react").JSX.Element;
//# sourceMappingURL=action-panels.shared.d.ts.map