import type { ComponentProps } from '@fluentui/react-utilities';
import type { ComponentState } from '@fluentui/react-utilities';
import type { EventData } from '@fluentui/react-utilities';
import type { EventHandler } from '@fluentui/react-utilities';
import type { ForwardRefComponent } from '@fluentui/react-utilities';
import type { JSXElement } from '@fluentui/react-utilities';
import type { LabelBaseProps } from '@fluentui/react-label';
import { PositioningShorthand } from '@fluentui/react-positioning';
import * as React_2 from 'react';
import type { Slot } from '@fluentui/react-utilities';

/**
 * InfoButtons provide a way to display additional information about a form field or an area in the UI.
 */
export declare const InfoButton: ForwardRefComponent<InfoButtonProps>;

/**
 * InfoButton Props
 */
export declare type InfoButtonProps = Omit<ComponentProps<Partial<InfoButtonSlots>>, 'disabled' | 'popover'> & {
    /**
     * The Popover element that wraps the info and root slots. Use this slot to pass props to the Popover.
     */
    popover?: InfoButtonSlots['popover'];
};

export declare type InfoButtonSlots = {
    root: NonNullable<Slot<'button'>>;
    /**
     * The Popover element that wraps the info and root slots. Use this slot to pass props to the Popover.
     */
    popover: NonNullable<Slot<Partial<Omit<PopoverProps, 'openOnHover'>>>>;
    /**
     * The information to be displayed in the PopoverSurface when the button is pressed.
     */
    info: NonNullable<Slot<typeof PopoverSurface>>;
};

/**
 * State used in rendering InfoButton
 */
export declare type InfoButtonState = ComponentState<InfoButtonSlots> & {
    root: {
        'data-open'?: string;
    };
};

/**
 * InfoLabel component
 */
export declare const InfoLabel: ForwardRefComponent<InfoLabelProps>;

/**
 * InfoLabel Props
 */
export declare type InfoLabelProps = ComponentProps<Partial<InfoLabelSlots>, 'label'> & {
    /**
     * The content of the InfoButton's popover.
     */
    info?: InfoButtonProps['info'];
};

export declare type InfoLabelSlots = {
    root: NonNullable<Slot<'span'>>;
    /**
     * The Label component.
     *
     * It is not typically necessary to use this prop. The label text is the child of the `<InfoLabel>`, and other props
     * such as `size` and `required` should be set directly on the `InfoLabel`.
     *
     * This is the PRIMARY slot: all native properties specified directly on `<InfoLabel>` will be applied to this slot,
     * except `className` and `style`, which remain on the root slot.
     */
    label: NonNullable<Slot<typeof Label>>;
    /**
     * The InfoButton component.
     *
     * It is not typically necessary to use this prop. The content can be set using the `info` prop of the InfoLabel.
     */
    infoButton: Slot<typeof InfoButton>;
};

/**
 * State used in rendering InfoLabel
 */
export declare type InfoLabelState = ComponentState<InfoLabelSlots>;

/**
 * A label component that associates text with form elements.
 */
declare const Label: ForwardRefComponent<LabelProps>;

/**
 * Label component props
 */
declare type LabelProps = LabelBaseProps;

/**
 * Data attached to open/close events. Uses the canonical `EventData` shape so
 * consumers can discriminate on `type` or use the handler directly via
 * `EventHandler<OnOpenChangeData>`.
 */
declare type OnOpenChangeData = EventData<string, React_2.SyntheticEvent | Event> & {
    open: boolean;
};

/**
 * Popover Props
 */
declare type PopoverProps = {
    /**
     * Can contain two children including `PopoverTrigger` and `PopoverSurface`.
     * Alternatively can only contain `PopoverSurface` if using a custom `target`.
     */
    children: [JSXElement, JSXElement] | JSXElement;
    /** Controlled open state. */
    open?: boolean;
    /**
     * Default open state for uncontrolled mode.
     * @default false
     */
    defaultOpen?: boolean;
    /** Callback when the open state changes. */
    onOpenChange?: EventHandler<OnOpenChangeData>;
    /**
     * Open on hover.
     * @default false
     */
    openOnHover?: boolean;
    /**
     * Open on context menu (right-click).
     * @default false
     */
    openOnContext?: boolean;
    /**
     * Delay in ms before closing on mouse leave.
     * @default 500
     */
    mouseLeaveDelay?: number;
    /**
     * Positioning configuration. Accepts either a full `PositioningProps`
     * object or a shorthand string such as `'below'` / `'above-end'`.
     *
     * See the {@link https://react.fluentui.dev/?path=/docs/headless-concepts-positioning--docs Positioning concept}
     * for the full list of options and live examples.
     */
    positioning?: PositioningShorthand;
    /**
     * Display an arrow pointing to the target.
     * @default false
     */
    withArrow?: boolean;
    /**
     * Optional id for the popover surface. When provided, this id is applied to
     * the `PopoverSurface` element and referenced by `PopoverTrigger`
     * (`aria-details`). If omitted, a generated id is used.
     */
    id?: string;
    /**
     * When true, opens the popover as a modal via `HTMLDialogElement.showModal()`.
     * Focus is trapped inside the surface, the rest of the page is inert, and
     * focus is restored to the trigger when the popover closes — all spec-mandated
     * by the native dialog element.
     *
     * When false (default), the popover is non-modal: opens via `showPopover()`,
     * the browser handles light dismiss (Escape, click-outside, popover-stack
     * peer dismissal), and no focus trap or autofocus is applied unless a child
     * has the HTML `autofocus` attribute.
     *
     * @default false
     */
    trapFocus?: boolean;
};

/**
 * Headless PopoverSurface component.
 *
 * Renders the popover content area as a native `<dialog popover="auto">` so
 * a single element supports both non-modal (`showPopover()`) and modal
 * (`showModal()`) show modes; the choice is driven by the parent
 * `Popover`'s `trapFocus` prop.
 */
declare const PopoverSurface: ForwardRefComponent<PopoverSurfaceProps>;

declare type PopoverSurfaceProps = ComponentProps<PopoverSurfaceSlots>;

/**
 * PopoverSurface Slots.
 *
 * The root renders as a native `<dialog popover="auto">` so a single element
 * supports both show modes: `showPopover()` for non-modal (default) and
 * `showModal()` for the modal/focus-trap path.
 */
declare type PopoverSurfaceSlots = {
    root: Slot<'dialog'>;
};

/**
 * Render the final JSX of InfoButton
 */
export declare const renderInfoButton: (state: InfoButtonState) => JSXElement;

/**
 * Render the final JSX of InfoLabel
 */
export declare const renderInfoLabel: (state: InfoLabelState) => JSXElement;

/**
 * Create the state required to render InfoButton.
 *
 * @param props - props from this instance of InfoButton
 * @param ref - reference to root HTMLButtonElement of InfoButton
 */
export declare const useInfoButton: (props: InfoButtonProps, ref: React_2.Ref<HTMLButtonElement>) => InfoButtonState;

/**
 * Create the state required to render InfoLabel.
 *
 * The returned state can be modified with hooks such as useInfoLabel,
 * before being passed to renderInfoLabel.
 *
 * @param props - props from this instance of InfoLabel
 * @param ref - reference to label element of InfoLabel
 */
export declare const useInfoLabel: (props: InfoLabelProps, ref: React_2.Ref<HTMLLabelElement>) => InfoLabelState;

export { }