import type { SelectOption, SelectRow } from './types';
import type { Snippet } from 'svelte';
declare function $$render<T>(): {
    props: {
        /** Anchor element — listbox positions itself below this. */
        triggerEl: HTMLElement | undefined;
        isOpen: boolean;
        rows: SelectRow<T>[];
        /** Index into `rows` — highlighted row gets the active background and scrolls into view. */
        highlight: number;
        loading?: boolean;
        /** Stable id for aria-controls + aria-activedescendant. */
        listboxId: string;
        /** When true, panel width equals trigger width. @default true */
        matchTriggerWidth?: boolean;
        /**
         * How rows render selected state:
         * - `'checkmark'` (default) — ✓ on the right when selected; group headers binary.
         * - `'checkbox'` — checkbox on the left of every row; group headers tri-state when `row.state==='indeterminate'`.
         * - `'highlight'` — selected rows get the active background only; no glyph.
         */
        selectedDisplay?: "checkmark" | "checkbox" | "highlight";
        optionSnippet?: Snippet<[{
            option: SelectOption<T>;
        }]>;
        /** Optional snippet rendered ABOVE the rows list (e.g. Multi's create-with-parent section). */
        headerSnippet?: Snippet;
        /** When provided, replaces the entire rows iteration — consumer renders the listbox body (e.g. a grid of tiles for IconPicker). Receives the same `rows` + `highlight` + `on.pickRow/hoverRow` the default rendering uses. `triggerWidth` is the trigger's current width in px (or `undefined` before the first layout pass) — the consumer can choose to stretch/shrink to it; the listbox panel itself stays content-sized when this snippet is set. */
        bodySnippet?: Snippet<[{
            rows: SelectRow<T>[];
            highlight: number;
            triggerWidth: number | undefined;
            on: {
                pickRow: (row: SelectRow<T>) => void;
                hoverRow: (index: number) => void;
            };
        }]>;
        /** When true, `kind:'create'` rows are skipped (used when `headerSnippet` already renders the create UI). @default false */
        hideCreateRows?: boolean;
        /** Text in front of the query on a `kind:'create'` row, replacing the localized default ("Create"). When set, the leading `+` glyph is dropped. */
        createPrefix?: string;
        /** When true, the panel is not rendered at all if there's nothing to show (no rows, no create, not loading) — suppresses the "No matches" empty state. Used by tag-input style hosts. @default false */
        suppressEmpty?: boolean;
        on: {
            pickRow: (row: SelectRow<T>) => void;
            hoverRow: (index: number) => void;
            dismiss: () => void;
        };
    };
    exports: {};
    bindings: "";
    slots: {};
    events: {};
};
declare class __sveltets_Render<T> {
    props(): ReturnType<typeof $$render<T>>['props'];
    events(): ReturnType<typeof $$render<T>>['events'];
    slots(): ReturnType<typeof $$render<T>>['slots'];
    bindings(): "";
    exports(): {};
}
interface $$IsomorphicComponent {
    new <T>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
    } & ReturnType<__sveltets_Render<T>['exports']>;
    <T>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
}
/**
 * Shared popover + listbox renderer for Singleselect / SingleselectAsync (and future
 * Multiselect / MultiselectAsync). Parent owns selection semantics and builds the flat
 * `SelectRow[]` list; this component just positions, renders rows, and proxies pick / hover /
 * dismiss events upward. Floating UI handles placement with autoUpdate on scroll/resize.
 *
 * ### CSS Custom Properties
 * | Property | Description | Default |
 * |---|---|---|
 * | `--sc-kit--select--panel--background` | Panel background | `var(--sc-kit--color--bg--panel)` |
 * | `--sc-kit--select--panel--border-color` | Panel border | `var(--sc-kit--color--border)` |
 * | `--sc-kit--select--panel--border-radius` | Panel radius | `var(--sc-kit--radius--md)` |
 * | `--sc-kit--select--panel--box-shadow` | Panel shadow | `var(--sc-kit--shadow--lg)` |
 * | `--sc-kit--select--panel--font-size` | Option / group / empty-state text size | `var(--sc-kit--font-size--md)` |
 * | `--sc-kit--select--panel--max-height` | Panel max height | `18rem` |
 * | `--sc-kit--select--panel--padding` | Panel inner padding | `var(--sc-kit--space--1)` |
 * | `--sc-kit--select--option--height` | Option row height | `var(--sc-kit--field--height--md)` (32px) |
 * | `--sc-kit--select--option--padding-inline` | Option horizontal padding | `var(--sc-kit--space--3)` |
 * | `--sc-kit--select--option--background--active` | Active / focused row background | `var(--sc-kit--color--accent--softer)` |
 * | `--sc-kit--select--option--color` | Row text color | `var(--sc-kit--color--text--primary)` |
 * | `--sc-kit--select--option--color--selected` | Selected row text color | `var(--sc-kit--color--accent)` |
 * | `--sc-kit--select--group-header--color` | Group header text color | `var(--sc-kit--color--text--muted)` |
 * | `--sc-kit--select--group-header--font-size` | Group header font size | `var(--sc-kit--font-size--xs)` |
 * | `--sc-kit--select--empty--color` | Empty/loading text color | `var(--sc-kit--color--text--muted)` |
 */
declare const SelectListbox: $$IsomorphicComponent;
type SelectListbox<T> = InstanceType<typeof SelectListbox<T>>;
export default SelectListbox;