import React, { type ReactNode } from 'react';
import { type IconName } from '../Icon';
export type PopoverListItemProps = {
    /**
     * Child node(s) that can be nested inside component
     */
    children?: ReactNode;
    /**
     * CSS class names that can be appended to the component.
     */
    className?: string;
    __type?: 'selectitem' | 'listitem' | 'label' | 'separator' | 'caption';
    /**
     * Icon from the set of defined EDS icon set. This prop is deprecated in favor of `leadingContent`.
     * @deprecated
     */
    icon?: IconName;
    /**
     * Handling behavior for whether the marked menu item is destructive or not (deletes, removes, etc.)
     */
    isDestructiveAction?: boolean;
    /**
     * Whether the component is in focus (programmatically or otherwise)
     */
    isFocused?: boolean;
    /**
     * Whether the list item is treated as disabled
     */
    isDisabled?: boolean;
    /**
     * Content (icon, text, other component) to appear at the start of the list item. Recommended maximum size of 24 pixels.
     */
    leadingContent?: ReactNode;
    /**
     * Text below the main menu item call-to-action, briefly describing the menu item's function
     */
    subLabel?: ReactNode;
    /**
     * Content (icon, text, other component) to appear at the end of the list item. Recommended maximum size of 24 pixels.
     */
    trailingContent?: ReactNode;
};
/**
 * `import {PopoverListItem} from "@chanzuckerberg/eds";`
 *
 * This abstracts the structure of an item in a popover, when the popover contains a
 * list of items (e.g., Menus and Selects)
 * - Contains styles for when active/disabled or not
 * - contains styles for when there is an icon on the left
 *
 * Given headless implements listbox options as a renderProp, this can work for both
 * Listbox and Menu examples, in the latter case not specifying an icon
 */
export declare const PopoverListItem: React.ForwardRefExoticComponent<PopoverListItemProps & React.RefAttributes<HTMLDivElement>>;