import type React from 'react';
import type { CollapsibleDetail, MenuActionDetail, SpeedDialAction } from './types.js';
export interface SpeedDialRef extends HTMLElement {
    /** Opens the speed dial action menu. */
    open(): void;
    /** Closes the speed dial action menu. */
    close(): void;
    /** Toggles the speed dial action menu. */
    toggle(): void;
}
/**
 * In React, reach the imperative methods through a ref:
 * `const api = useRef<SpeedDialRef>(null)`, pass `ref={api}`, then `api.current?.open()`.
 * Available: open(), close(), toggle().
 *
 * @csspart backdrop, menu, trigger
 */
export interface SpeedDialOwnProps {
    /**
     * Unique identifier for the element.
     * @example 'example-id'
     */
    id?: string;
    /**
     * Icon name to display.
     * @example 'example'
     */
    icon?: string;
    /**
     * Accessible label for screen readers when no visible label is present.
     * @example 'example'
     */
    ariaLabel?: string;
    /**
     * Icon shown on the FAB when the speed dial is open (default: X/close).
     * @example 'example'
     */
    closeIcon?: string;
    /**
     * Visual style variant. Allowed values: `filled`, `outline`, `ghost`.
     * @example 'filled'
     */
    variant?: 'filled' | 'outline' | 'ghost';
    /**
     * Corner radius style. Allowed values: `rounded`, `pill`.
     * @example 'rounded'
     */
    shape?: 'rounded' | 'pill';
    /**
     * Component size. Allowed values: `sm`, `md`, `lg`.
     * @example 'sm'
     */
    size?: 'sm' | 'md' | 'lg';
    /**
     * Direction actions expand from the FAB trigger (up, down, left, right). Allowed values: `up`, `down`, `left`, `right`.
     * @example 'up'
     */
    direction?: 'up' | 'down' | 'left' | 'right';
    /**
     * Whether to show a backdrop overlay when the speed dial is open.
     * @defaultValue true
     * @example true
     */
    backdrop?: boolean;
    /**
     * Whether to show tooltip labels next to action items.
     * @defaultValue true
     * @example true
     */
    tooltips?: boolean;
    /**
     * Disables the component, preventing interaction.
     * @defaultValue false
     * @example true
     */
    disabled?: boolean;
    /**
     * Array of action items. Each has id, label, icon, optional disabled/href.
     * @example [{ id: 'create', label: 'Create', icon: 'plus' }]
     */
    actions?: SpeedDialAction[];
    /**
     * Fires when the user activates an action item. Detail: `MenuActionDetail`.
     * @example (event) => console.log(event.detail.id)
     */
    onAction?: (event: CustomEvent<MenuActionDetail>) => void;
    /**
     * Fires when the committed component value or state changes. Detail: `CollapsibleDetail`.
     * @example (event) => console.log(event.detail.open)
     */
    onChange?: (event: CustomEvent<CollapsibleDetail>) => void;
    /** CSS class applied to the Custom Element host.
     * @example 'my-component'
     */
    className?: string;
    /** Inline styles applied to the Custom Element host.
     * @example { marginTop: 8 }
     */
    style?: React.CSSProperties;
}
/**
 * Props for `<SpeedDial>`: the component's own API plus every standard DOM
 * attribute and native React event handler, forwarded verbatim to the
 * `<cx-speed-dial>` host — `id`, `data-*`, `aria-*`, `title`, `tabIndex`,
 * `slot`, `onMouseEnter`, and the rest. Own props always win over a
 * same-named DOM attribute.
 */
export type SpeedDialProps = SpeedDialOwnProps & Omit<React.HTMLAttributes<HTMLElement>, keyof SpeedDialOwnProps | 'children' | 'dangerouslySetInnerHTML'>;
export declare const SpeedDial: React.ForwardRefExoticComponent<SpeedDialOwnProps & Omit<React.HTMLAttributes<HTMLElement>, "children" | "dangerouslySetInnerHTML" | keyof SpeedDialOwnProps> & React.RefAttributes<SpeedDialRef>>;