import * as React from "react";
import type { ListRowDensityProp } from "../../props/components/data-display.prop.js";
/**
 * ListRow vertical/inline geometry — `default` (the roomy entity row) or `compact` (the
 * inline-actions row: avatar + title + small trailing Buttons on one line in a narrow card).
 * A ListRow-local subset of the density vocabulary — it has no `comfortable` step.
 */
export type ListRowDensity = ListRowDensityProp;
/**
 * ListRow — a single-line entity row (indicator · leading · title/description · trailing) for
 * SHORT lists inside a Card: active sessions, API tokens, linked accounts, passkeys, MFA factors,
 * invitations, notifications. Use it INSTEAD of a hand-rolled `<div className="flex items-center
 * justify-between border-b …">`.
 */
export interface ListRowProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
    /**
     * Render element — `div` (default) or `li` when the parent is a `<ul>`/`<ol>`.
     *
     * With `asChild`, the child owns the row element, so `as` steps out and becomes the
     * LIST ITEM around it: `<li data-slot="list-row-item"><a data-slot="list-row">`. That is
     * the only reading under which both props can hold at once, and it is the shape a list
     * of links needs — the alternative, wrapping the row yourself, moves every row into a
     * wrapper of its own and the row-to-row divider (keyed on `:not(:last-child)` among
     * siblings) stops matching entirely.
     */
    as?: "div" | "li";
    /** Use the supplied link as the entire row. Do not nest interactive trailing controls. */
    asChild?: boolean;
    /** Leading slot — a decorative icon or an Avatar. Mark a purely decorative icon `aria-hidden`. */
    leading?: React.ReactNode;
    /** Primary line — rendered in medium weight. */
    title: React.ReactNode;
    /** Secondary line under the title (muted, xs). */
    description?: React.ReactNode;
    /** Trailing slot — the row action(s): a Button / DropdownMenu trigger, a Badge, or a Switch. */
    trailing?: React.ReactNode;
    /** Cross-axis alignment of the columns — `center` (default) or `start` for multi-line content. */
    align?: "center" | "start";
    /**
     * How title/description resolve content too long for the row — `truncate` (default: one line
     * with an ellipsis) or `wrap` (multi-line; long unbroken tokens break so the row never widens).
     */
    overflow?: "truncate" | "wrap";
    /** Retune per theme with `--list-row-compact-*`. */
    density?: ListRowDensity;
    /**
     * Read/unread state — renders the indicator dot (with localized `sr-only` text, never colour
     * alone) and the tokenized unread surface. OMIT the prop entirely for rows that have no read
     * state; pass `false` for a read row so its title stays on the same optical axis as unread ones.
     */
    unread?: boolean;
}
export declare const ListRow: React.ForwardRefExoticComponent<ListRowProps & React.RefAttributes<HTMLDivElement>>;