import { type BreakpointKey, type StyleProp, type ViewStyle } from "../../style/index.js";
import { type FilterPanelSkin, type CheckboxComponent, type BadgeComponent, type ButtonComponent } from "./filter-panel.styles.js";
export interface FilterOption {
    /** Row label, shown beside the checkbox. */
    label: string;
    /**
     * Stable key this option is identified by in the controlled `value`/`defaultValue`
     * arrays. Defaults to `"groupIndex:optionIndex"`; set it (e.g. a slug) when you
     * drive selection from a URL/query so reordering groups doesn't break the mapping.
     */
    value?: string;
    /** Whether this option is initially checked (seeds uncontrolled state when
     *  `defaultValue` is not given). */
    checked?: boolean;
    /** Optional trailing count, rendered as a secondary badge. */
    count?: string;
}
export interface FilterGroup {
    /** Group heading, rendered uppercase and muted. */
    title: string;
    /** The checkbox options under this group. */
    options: FilterOption[];
}
export interface FilterPanelProps {
    /** Filter groups, each a heading plus its checkbox options. */
    groups: FilterGroup[];
    /**
     * Controlled selection: the keys of the checked options (each option's `value`,
     * falling back to `"groupIndex:optionIndex"`). Provide it with `onSelectionChange`
     * to drive or reset selection from a parent (e.g. from a URL query).
     */
    value?: string[];
    /** Initial selection for uncontrolled use. When omitted, the panel seeds from each
     *  option's `checked` flag. */
    defaultValue?: string[];
    /** Active-filter count shown next to the "Filters" title. Omit to derive it from the checked options. */
    activeCount?: number;
    /** Fired when the header "Clear" action is pressed. */
    onClear?: () => void;
    /** Fired with the full set of checked keys whenever the selection changes (both
     *  modes) — the controlled signal a parent mirrors into `value`. */
    onSelectionChange?: (selected: string[]) => void;
    /** Fired when a single option row toggles, with its group/option indexes and next
     *  value. Fires alongside `onSelectionChange`. */
    onChange?: (groupIndex: number, optionIndex: number, next: boolean) => void;
    bordered?: boolean;
    compact?: boolean;
    /** Opt in to the responsive panel->drawer behavior. Off by default: a bare
     *  panel is the docked column at every width, exactly as before. */
    responsive?: boolean;
    /** The width at and below which `responsive` collapses to the drawer
     *  (default `sm` = 640). */
    drawerBreakpoint?: BreakpointKey;
    /** The responsive drawer's open state (CONTROLLED). Omit for the
     *  self-managed trigger button. */
    open?: boolean;
    /** Initial open state for the uncontrolled responsive drawer (default closed). */
    defaultOpen?: boolean;
    /** Fired when the responsive drawer opens or closes (trigger, scrim, back). */
    onOpenChange?: (open: boolean) => void;
    /** 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 FilterPanel component from a platform skin.
 *
 * `Checkbox` / `Badge` / `Button` are the platform-correct atoms for the option
 * rows, the counts, and the header Clear action. Each platform's thin
 * `.tsx`/`.ios`/`.android` file passes the variants it already resolves for that
 * platform, so the panel matches its OS. They default to the WEB atoms because a
 * bare barrel import always resolves the WEB atoms in a browser bundler, which is
 * wrong in the docs 3-up; the device Metro resolves the right atoms by extension
 * regardless, so the defaults only matter for the web column.
 */
export declare function createFilterPanel(skin: FilterPanelSkin, Checkbox?: CheckboxComponent, Badge?: BadgeComponent, Button?: ButtonComponent): (props: FilterPanelProps) => import("react").JSX.Element;
//# sourceMappingURL=filter-panel.shared.d.ts.map