import React from 'react';
import { Popover } from '@instructure/ui-popover/v11_6';
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
import type { WithDeterministicIdProps } from '@instructure/ui-react-utils';
import type { PlacementPropValues, PositionConstraint, PositionMountNode } from '@instructure/ui-position';
import type { DrilldownTheme, OtherHTMLAttributes, AsElementType } from '@instructure/shared-types';
import { DrilldownPage } from './DrilldownPage';
import type { DrilldownPageProps } from './DrilldownPage/props';
import { DrilldownGroup } from './DrilldownGroup';
import type { DrilldownGroupProps } from './DrilldownGroup/props';
import { DrilldownOption } from './DrilldownOption';
import type { DrilldownOptionProps, DrilldownOptionValue } from './DrilldownOption/props';
import { DrilldownSeparator } from './DrilldownSeparator';
import type { DrilldownSeparatorProps } from './DrilldownSeparator/props';
import { Drilldown } from './index';
type PageChild = React.ComponentElement<DrilldownPageProps, DrilldownPage>;
type GroupChild = React.ComponentElement<DrilldownGroupProps, DrilldownGroup>;
type OptionChild = React.ComponentElement<DrilldownOptionProps, DrilldownOption>;
type SeparatorChild = React.ComponentElement<DrilldownSeparatorProps, DrilldownSeparator>;
type DrilldownOwnProps = {
    /**
     * The id of the root page
     */
    rootPageId: string;
    /**
     * Children of type `<Drilldown.Page />`
     */
    children?: PageChild | PageChild[];
    /**
     * The id of the `<Drilldown />`
     */
    id?: string;
    /**
     * Description of the `<Drilldown />` (used as `aria-label` attribute)
     */
    label?: string;
    /**
     * Is the `<Drilldown />` disabled
     */
    disabled?: boolean;
    /**
     * Whether the focus should rotate with keyboard navigation
     * when reaching the first or last option
     */
    rotateFocus?: boolean;
    /**
     * Element type to render as.
     */
    as?: AsElementType;
    /**
     * The ARIA role of the element
     */
    role?: string;
    /**
     * A function that returns a reference to root HTML element
     */
    elementRef?: (el: Element | null) => void;
    /**
     * A function that returns a reference to the `<Drilldown />`
     */
    drilldownRef?: (el: HTMLDivElement | null) => void;
    overflowX?: 'auto' | 'hidden' | 'visible';
    overflowY?: 'auto' | 'hidden' | 'visible';
    height?: string | number;
    width?: string | number;
    minHeight?: string | number;
    minWidth?: string | number;
    maxHeight?: string | number;
    maxWidth?: string | number;
    /**
     * The trigger element, if the `<Drilldown />` is to render as a popover
     */
    trigger?: React.ReactNode;
    /**
     * If a trigger is supplied, where should the `<Drilldown />` be placed
     * (relative to the trigger)
     *
     * `stretch` will stretch the `Drilldown` to the same size as its `trigger`
     * (provided that the `trigger` is at least as large as the `Drilldown`).
     * In this case you should not set `width`/`maxHeight`, it will be set
     * automatically.
     */
    placement?: PlacementPropValues;
    /**
     * Should the `<Drilldown />` be open for the initial render
     */
    defaultShow?: boolean;
    /**
     * Is the `<Drilldown />` open (should be accompanied by `onToggle` and `trigger`)
     */
    show?: boolean;
    /**
     * Callback fired when the `<Drilldown />` is toggled open/closed.
     * When used with `show`, the component will not control its own state.
     */
    onToggle?: (event: React.UIEvent | React.FocusEvent, args: {
        shown: boolean;
        drilldown: Drilldown;
        pageHistory: string[];
        goToPage: (pageId: string) => {
            prevPageId: string;
            newPageId: string;
        } | undefined;
        goToPreviousPage: () => {
            prevPageId: string;
            newPageId: string;
        } | undefined;
    }) => void;
    /**
     * Callback fired when an item within the `<Drilldown />` is selected
     */
    onSelect?: (event: React.SyntheticEvent, args: {
        value: DrilldownOptionValue | DrilldownOptionValue[];
        isSelected: boolean;
        selectedOption: OptionChild;
        drilldown: Drilldown;
    }) => void;
    /**
     * If a trigger is supplied, callback fired when the `<Drilldown />` is closed
     */
    onDismiss?: (event: React.UIEvent | React.FocusEvent, documentClick: boolean) => void;
    /**
     * If a trigger is supplied, callback fired when the `<Drilldown />` trigger is focused
     */
    onFocus?: (event: React.FocusEvent) => void;
    /**
     * If a trigger is supplied, callback fired onMouseOver for the `<Drilldown />` trigger
     */
    onMouseOver?: (event: React.MouseEvent) => void;
    /**
     * If a trigger is supplied, A function that returns a reference to the `<Popover />`
     */
    popoverRef?: (el: Popover | null) => void;
    /**
     * If a trigger is supplied, an element or a function returning an element
     * to use as the mount node for the `<Drilldown />` (defaults to the component itself)
     */
    mountNode?: PositionMountNode;
    /**
     * Target element for positioning the Popover (if it differs from the trigger)
     */
    positionTarget?: PositionMountNode;
    /**
     * If a trigger is supplied, this prop can set the CSS `display` property on the `<span>` container element of the underlying Position component
     */
    positionContainerDisplay?: 'inline-block' | 'block';
    /**
     * The parent in which to constrain the placement.
     */
    constrain?: PositionConstraint;
    /**
     * If a trigger is supplied, should the `<Drilldown />` hide when an item is selected
     */
    shouldHideOnSelect?: boolean;
    /**
     * Whether focus should be contained within the `<Drilldown/>` when it is open.
     * Works only if `trigger` is provided.
     */
    shouldContainFocus?: boolean;
    /**
     * Whether focus should be returned to the trigger
     * when the `<Drilldown/>` is closed.
     * Works only if `trigger` is provided.
     */
    shouldReturnFocus?: boolean;
    /**
     * Whether or not an arrow pointing to the trigger should be rendered.
     * Works only if `trigger` is provided.
     */
    withArrow?: boolean;
    /**
     * The horizontal offset for the positioned content.
     * Works only if `trigger` is provided.
     */
    offsetX?: string | number;
    /**
     * The vertical offset for the positioned content.
     * Works only if `trigger` is provided.
     */
    offsetY?: string | number;
    /**
     * If true (default), then the aria-expanded prop is added to the trigger.
     * If its supplied via the aria-expanded prop then it takes the given value,
     * otherwise its calculated automatically based on whether the content is shown.
     */
    shouldSetAriaExpanded?: boolean;
};
type PropKeys = keyof DrilldownOwnProps;
type AllowedPropKeys = Readonly<Array<PropKeys>>;
type DrilldownProps = DrilldownOwnProps & WithStyleProps<DrilldownTheme, DrilldownStyle> & WithDeterministicIdProps & OtherHTMLAttributes<DrilldownOwnProps>;
type DrilldownStyle = ComponentStyle<'drilldown' | 'container' | 'headerBack' | 'headerTitle' | 'optionContainer' | 'optionLabelInfo' | 'optionContent'> & {
    headerActionColor: string;
};
type DrilldownStyleProps = {
    hasHighlightedOption: boolean;
};
type SelectedGroupOptionsMap = {
    [groupId: string]: Map<string, DrilldownOptionValue>;
};
type DrilldownState = {
    isShowingPopover: boolean;
    activePageId: string;
    highlightedOptionId?: string;
    lastSelectedId?: string;
    selectedGroupOptionsMap: SelectedGroupOptionsMap;
};
declare const allowedProps: AllowedPropKeys;
export type { DrilldownProps, DrilldownState, DrilldownStyle, DrilldownStyleProps, DrilldownPageProps, PageChild, GroupChild, OptionChild, SeparatorChild, SelectedGroupOptionsMap };
export { allowedProps };
//# sourceMappingURL=props.d.ts.map