import { type HTMLAttributes } from "react";
import { type ComponentWithRippleProps } from "../interaction/types.js";
import { type BaseListItemClassNameOptions } from "./listItemStyles.js";
import { type ListItemChildrenProps } from "./types.js";
/**
 * @since 6.0.0 Renamed `threeLines` to `multiline` since it can
 * support more than three lines of text.
 * @since 6.3.1 Extends the BaseListItemClassNameOptions
 */
export interface ListItemProps extends HTMLAttributes<HTMLLIElement>, ListItemChildrenProps, BaseListItemClassNameOptions, ComponentWithRippleProps {
    /**
     * @defaultValue `"button"`
     */
    role?: HTMLAttributes<HTMLLIElement>["role"];
    /**
     * @defaultValue `disabled ? -1 : 0`
     */
    tabIndex?: number;
    /**
     * Set this to `false` if the list item should not gain the interaction
     * states: hover, focus, press, etc. This is kind of like being disabled
     * without the disabled styles being applied.
     *
     * @defaultValue `role === "presentation"`
     */
    presentational?: boolean;
}
/**
 * **Client Component**
 *
 * The `ListItem` is used to create a clickable/focusable button within a
 * `List` and removes the normal `<li>` styles.
 *
 * @example Simple Example
 * ```tsx
 * import { List } from "@react-md/core/list/List";
 * import { ListItem } from "@react-md/core/list/ListItem";
 * import type { ReactElement  } from "react";
 *
 * function Example(): ReactElement {
 *   return (
 *     <List>
 *       <ListItem
 *         onClick={() => {
 *           // do something
 *         }}
 *       >
 *         Item 1
 *       </ListItem>
 *       <ListItem
 *         onClick={() => {
 *           // do something
 *         }}
 *         secondaryText={<span>Some <strong>additional</strong> content.</span>}
 *       >
 *         Item 2
 *       </ListItem>
 *     </List>
 *   );
 *   );
 * }
 * ```
 *
 * @example Applying Addons Example
 * ```tsx
 * import { List } from "@react-md/core/list/List";
 * import { ListItem } from "@react-md/core/list/ListItem";
 * import FavoriteIcon from "@react-md/material-icons/FavoriteIcon";
 * import type { ReactElement  } from "react";
 *
 * function Example(): ReactElement {
 *   return (
 *     <List>
 *       <ListItem leftAddon={<FavoriteIcon />}>
 *         Item 1
 *       </ListItem>
 *       <ListItem rightAddon={<FavoriteIcon />}>
 *         Item 2
 *       </ListItem>
 *       <ListItem
 *         leftAddon={<FavoriteIcon />}
 *         rightAddon={<img alt="" src="/some-image.png" />}
 *         rightAddonType="media"
 *       >
 *         Item 3
 *       </ListItem>
 *     </List>
 *   );
 *   );
 * }
 * ```
 *
 * @see {@link https://react-md.dev/components/list | List Demos}
 */
export declare const ListItem: import("react").ForwardRefExoticComponent<ListItemProps & import("react").RefAttributes<HTMLLIElement>>;
