import * as react_jsx_runtime from 'react/jsx-runtime';
import * as React from 'react';
import { RadioGroupProps } from './radio-group.js';
import 'class-variance-authority/types';
import 'class-variance-authority';
import 'radix-ui';
import './label.js';

interface SelectionTileOption<T extends string = string> {
    value: T;
    label: string;
    /** Font Awesome icon class without prefix (e.g. `fa-table`); rendered with `fa-light`. Ignored when `leading` is set. */
    icon?: string;
    /** Custom graphic (SVG, swatch, etc.) instead of `icon`. */
    leading?: React.ReactNode;
}
/** Shared surface classes for icon+label tiles (Properties view type, Export format, etc.).
 *
 * `aspect-square` + horizontal padding keeps every tile a uniform square regardless of how
 * many tiles are in the row — without it, the last row of a `grid-cols-N` grid (e.g. 3 tiles
 * in a 4-col grid for the Properties view selector) renders the same width per cell but the
 * eye reads them as inconsistent when the row's empty trailing cell shifts visual rhythm.
 * Two-line labels (e.g. "List & details", "Tree & details") still fit because the icon
 * column is only ~18px and the square grows with the cell. */
declare function selectionTileClassNames(selected: boolean): string;
/** Preview box only — label rendered below (Settings appearance pattern). */
declare function selectionTilePreviewClassNames(selected: boolean): string;
interface SelectionTileGridProps<T extends string> {
    /** Section caption above the grid (e.g. “View type”). */
    sectionLabel?: string;
    options: readonly SelectionTileOption<T>[];
    columns?: 2 | 3 | 4;
    value: T;
    onValueChange: (value: T) => void;
    /** `radio` — Form / RadioGroup; `button` — toggle buttons with aria-pressed. */
    interaction: "radio" | "button";
    /** Prefix for radio ids (`${idPrefix}-${value}`). */
    idPrefix?: string;
    /** Forwarded to `RadioGroup` when `interaction="radio"` (sr-only inputs; affects focus ring / state tokens). */
    itemVariant?: RadioGroupProps["itemVariant"];
    itemSize?: RadioGroupProps["itemSize"];
    itemMotion?: RadioGroupProps["itemMotion"];
    className?: string;
    /**
     * `inside` — label in the bordered tile (default). `below` — label under the preview
     * (matches system settings: preview box + caption outside).
     */
    labelPlacement?: "inside" | "below";
}
declare function SelectionTileGrid<T extends string>({ sectionLabel, options, columns, value, onValueChange, interaction, idPrefix, className, labelPlacement, itemVariant, itemSize, itemMotion, }: SelectionTileGridProps<T>): react_jsx_runtime.JSX.Element;

export { SelectionTileGrid, type SelectionTileGridProps, type SelectionTileOption, selectionTileClassNames, selectionTilePreviewClassNames };
