import { HTMLMotionProps } from 'motion/react';
import { M as MD3ColorStyle, b as MD3Size, a as MD3Shape } from './md3-BQhRygSi.js';
import * as React$1 from 'react';
import * as react_jsx_runtime from 'react/jsx-runtime';

type MotionButtonProps$3 = Omit<HTMLMotionProps<"button">, "children" | "color">;
interface BaseButtonProps extends MotionButtonProps$3 {
    /**
     * The visual style of the button.
     * Maps to MD3 emphasis levels.
     * @default "filled"
     */
    colorStyle?: MD3ColorStyle;
    /**
     * @deprecated `selectedColorStyle` is no longer used. Color styles are now automatically
     * resolved based on the `colorStyle` and `selected` state per MD3 specs.
     * If provided, it will be ignored.
     */
    selectedColorStyle?: MD3ColorStyle;
    /**
     * The size variant of the button.
     * @default "sm"
     */
    size?: MD3Size;
    /**
     * Shape of the button container.
     * MD3 Expressive morphs the shape slightly on press based on the chosen shape variant.
     * @default "round"
     */
    shape?: MD3Shape;
    /**
     * Override the default border width for outlined buttons.
     * By default, this is derived from the size token (e.g., 1dp for sm, 3dp for xl).
     */
    outlineWidth?: number;
    /**
     * An optional icon to display alongside the label.
     */
    icon?: React.ReactNode;
    /**
     * An optional icon to display when the button is in a selected toggle state (`variant="toggle"` and `selected={true}`).
     */
    selectedIcon?: React.ReactNode;
    /**
     * Position of the icon relative to the label.
     * @default "leading"
     */
    iconPosition?: "leading" | "trailing";
    /**
     * The loading state of the button. Replaces the icon (or is prepended) with a spinner.
     * Disables the button visually and functionally.
     * @default false
     */
    loading?: boolean;
    /**
     * The visual variant of the loading spinner.
     * @default "loading-indicator"
     */
    loadingVariant?: "loading-indicator" | "circular";
    /**
     * Replaces the wrapping `<button>` with the child element, passing all props and styles to it.
     * Useful for rendering as an `<a>` tag or a React Router `<Link>`.
     * @default false
     */
    asChild?: boolean;
    /**
     * Whether the button should stretch to fill the width of its container.
     * @default false
     */
    fullWidth?: boolean;
    /**
     * Explicitly sets the trailing icon layout mode.
     * Mostly used internally by ButtonGroup to align dropdown carets.
     * @internal
     */
    hasTrailingIcon?: boolean;
    /**
     * A specific string key identifying the button in a ButtonGroup context.
     */
    value?: string;
    children: React.ReactNode;
}
type ButtonProps = BaseButtonProps & ({
    variant?: "default";
    selected?: never;
} | {
    variant: "toggle";
    selected: boolean;
});

declare const Button: React$1.NamedExoticComponent<(Omit<BaseButtonProps & {
    variant?: "default";
    selected?: never;
}, "ref"> | Omit<BaseButtonProps & {
    variant: "toggle";
    selected: boolean;
}, "ref">) & React$1.RefAttributes<HTMLButtonElement>>;

declare const BUTTON_SIZE_TOKENS: {
    readonly xs: {
        readonly height: "2rem";
        readonly leadingSpace: "1rem";
        readonly trailingSpace: "1rem";
        readonly iconSize: "1.25rem";
        readonly iconLabelSpace: "0.5rem";
        readonly outlineWidth: 1;
        readonly squareShapeRadius: 12;
        readonly pressedShapeRadius: 8;
        readonly roundShapeRadius: 9999;
    };
    readonly sm: {
        readonly height: "2.5rem";
        readonly leadingSpace: "1rem";
        readonly trailingSpace: "1rem";
        readonly iconSize: "1.25rem";
        readonly iconLabelSpace: "0.5rem";
        readonly outlineWidth: 1;
        readonly squareShapeRadius: 12;
        readonly pressedShapeRadius: 8;
        readonly roundShapeRadius: 9999;
    };
    readonly md: {
        readonly height: "3.5rem";
        readonly leadingSpace: "1.5rem";
        readonly trailingSpace: "1.5rem";
        readonly iconSize: "1.5rem";
        readonly iconLabelSpace: "0.5rem";
        readonly outlineWidth: 1;
        readonly squareShapeRadius: 16;
        readonly pressedShapeRadius: 12;
        readonly roundShapeRadius: 9999;
    };
    readonly lg: {
        readonly height: "6rem";
        readonly leadingSpace: "3rem";
        readonly trailingSpace: "3rem";
        readonly iconSize: "2rem";
        readonly iconLabelSpace: "0.75rem";
        readonly outlineWidth: 2;
        readonly squareShapeRadius: 28;
        readonly pressedShapeRadius: 16;
        readonly roundShapeRadius: 9999;
    };
    readonly xl: {
        readonly height: "8.5rem";
        readonly leadingSpace: "4rem";
        readonly trailingSpace: "4rem";
        readonly iconSize: "2.5rem";
        readonly iconLabelSpace: "1rem";
        readonly outlineWidth: 3;
        readonly squareShapeRadius: 28;
        readonly pressedShapeRadius: 16;
        readonly roundShapeRadius: 9999;
    };
};
declare const BUTTON_COLOR_TOKENS: {
    readonly elevated: {
        readonly default: "bg-m3-surface-container-low text-m3-primary shadow-md";
        readonly selected: "bg-m3-primary text-m3-on-primary shadow-md";
        readonly unselected: "bg-m3-surface-container-low text-m3-primary shadow-md";
    };
    readonly filled: {
        readonly default: "bg-m3-primary text-m3-on-primary";
        readonly selected: "bg-m3-primary text-m3-on-primary";
        readonly unselected: "bg-m3-surface-container text-m3-on-surface-variant";
    };
    readonly tonal: {
        readonly default: "bg-m3-secondary-container text-m3-on-secondary-container";
        readonly selected: "bg-m3-secondary text-m3-on-secondary";
        readonly unselected: "bg-m3-secondary-container text-m3-on-secondary-container";
    };
    readonly outlined: {
        readonly default: "bg-transparent text-m3-on-surface-variant border-m3-outline-variant";
        readonly selected: "bg-m3-inverse-surface text-m3-inverse-on-surface border-transparent";
        readonly unselected: "bg-transparent text-m3-on-surface-variant border-m3-outline-variant";
    };
    readonly text: {
        readonly default: "bg-transparent text-m3-primary";
        readonly selected: "bg-transparent text-m3-primary";
        readonly unselected: "bg-transparent text-m3-primary";
    };
    /**
     * High-chroma tertiary tone. Use for hero CTAs and expressive moments where
     * a distinct accent beyond primary is needed (e.g., hero chip, highlight fab).
     */
    readonly tertiary: {
        readonly default: "bg-m3-tertiary text-m3-on-tertiary";
        readonly selected: "bg-m3-tertiary text-m3-on-tertiary";
        readonly unselected: "bg-m3-tertiary-container text-m3-on-tertiary-container";
    };
    /**
     * Brand-stable primary fixed. Hue stays consistent across light and dark modes.
     * Ideal for badges, pill chips, and elements that must carry the brand color
     * regardless of the active theme.
     */
    readonly "primary-fixed": {
        readonly default: "bg-m3-primary-fixed text-m3-on-primary-fixed";
        readonly selected: "bg-m3-primary-fixed text-m3-on-primary-fixed";
        readonly unselected: "bg-m3-primary-fixed text-m3-on-primary-fixed-variant";
    };
    /**
     * Brand-stable tertiary fixed. Use for special-state indicators, achievement
     * badges, or accent pills that need a fixed tertiary hue across themes.
     */
    readonly "tertiary-fixed": {
        readonly default: "bg-m3-tertiary-fixed text-m3-on-tertiary-fixed";
        readonly selected: "bg-m3-tertiary-fixed text-m3-on-tertiary-fixed";
        readonly unselected: "bg-m3-tertiary-fixed text-m3-on-tertiary-fixed-variant";
    };
};

type DistributeMode = "fixed" | "dynamic" | "mixed";
interface ButtonDistributeProps extends React$1.HTMLAttributes<HTMLFieldSetElement> {
    /**
     * Distribution mode:
     * - `fixed`: Buttons maintain fixed base size, morph and compress neighbors on press/interaction.
     * - `dynamic`: Group fills 100% container width, expanding active button and shrinking neighbors proportionally.
     * - `mixed`: Leading/trailing buttons remain fixed size, center button(s) flex: 1.
     * @default "dynamic"
     */
    mode?: DistributeMode;
    /**
     * Custom weight ratios for children in `dynamic` mode (e.g. `[1, 2, 1]` for Prev:Play:Next).
     * If omitted, defaults to `[1, 2, 1]` for 3 children, or equal weights `[1, 1, ..., 1]`.
     */
    weights?: number[];
    /**
     * Expansion factor added to active item weight in `dynamic` mode.
     * @default 0.3
     */
    expandRatio?: number;
    /**
     * Controls whether hover state triggers button expansion in `dynamic` mode.
     * Focus and Active/Press always trigger expansion regardless of this prop.
     * @default false
     */
    expandOnHover?: boolean;
    /**
     * Fixed size (width in px or CSS string) for leading/trailing buttons in `mixed` mode,
     * or base size override in `fixed` mode.
     * @default 48
     */
    fixedSize?: number | string;
    /**
     * Explicit fixed size for leading button in `mixed` mode. Overrides `fixedSize` if set.
     */
    leadingSize?: number | string;
    /**
     * Explicit fixed size for trailing button in `mixed` mode. Overrides `fixedSize` if set.
     */
    trailingSize?: number | string;
    /**
     * Gap spacing between buttons in group.
     * @default "0.5rem" (8px)
     */
    gap?: string | number;
    /**
     * Applied size token to all child buttons in group if not specified on child.
     * @default "sm"
     */
    size?: MD3Size;
    /**
     * Custom CSS class applied to button wrappers inside the group.
     */
    itemClassName?: string;
    /**
     * Child button elements (Button, IconButton, etc.).
     */
    children: React$1.ReactNode;
}

/**
 * @file button-distribute.tsx
 *
 * MD3 Expressive ButtonDistribute component.
 * Flexible Button Group with Expressive Motion & Size Distribution (Fixed, Dynamic, Mixed).
 */

declare const ButtonDistribute: React$1.ForwardRefExoticComponent<ButtonDistributeProps & React$1.RefAttributes<HTMLFieldSetElement>>;

type ButtonGroupVariant = "standard" | "connected";
type ButtonGroupOrientation = "horizontal" | "vertical";
/**
 * Props for ButtonGroup component.
 */
interface ButtonGroupProps extends React$1.FieldsetHTMLAttributes<HTMLFieldSetElement> {
    /**
     * Display variant of the button group:
     * - `standard`: Independent buttons with gap spacing.
     * - `connected`: Connected buttons sharing borders (Segmented Button).
     * @default "standard"
     */
    variant?: ButtonGroupVariant;
    /**
     * Layout orientation of buttons in group.
     * @default "horizontal"
     */
    orientation?: ButtonGroupOrientation;
    /**
     * When `true`, expands `standard` group to stretch full width of container.
     * @default false
     */
    fullWidth?: boolean;
    /**
     * Applies unified `size` to all child buttons in group (overrides individual button sizes).
     */
    size?: MD3Size;
    /**
     * Automatically displays Check icon when a child button has `selected={true}`.
     * @default false
     */
    showCheck?: boolean;
    /**
     * Controls icon display behavior.
     * - `selected`: Display icon only on selected item.
     * - `all`: Display on all items.
     * - `none`: Hide all icons.
     */
    iconBehavior?: "selected" | "all" | "none";
    /**
     * Controls label display behavior.
     * - `selected`: Display label only on selected item.
     * - `all`: Display on all items.
     * - `none`: Hide all labels.
     */
    labelBehavior?: "selected" | "all" | "none";
    /**
     * Custom CSS class applied to individual child buttons in group.
     * Useful for customizing padding, min-width, or other layout properties.
     */
    itemClassName?: string;
}

declare const ButtonGroup: React$1.NamedExoticComponent<ButtonGroupProps & React$1.RefAttributes<HTMLFieldSetElement>>;

/**
 * @file extended-fab.tsx
 * MD3 Expressive Extended Floating Action Button.
 * @see https://m3.material.io/components/extended-fab/specs
 */

type MotionButtonProps$2 = Omit<HTMLMotionProps<"button">, "children" | "color">;
/** Props for the `ExtendedFAB` component. */
interface ExtendedFABProps extends MotionButtonProps$2 {
    /** Required text label. Keep it short (1-2 words); it does not wrap. */
    label: string;
    /** Icon to render. Automatically replaced by a spinner when `loading={true}`. */
    icon?: React$1.ReactNode;
    /** Button size per MD3 Expressive spec. @default "sm" */
    size?: "sm" | "md" | "lg";
    /** MD3 color role for the container surface. @default "primary" */
    colorStyle?: "primary" | "secondary" | "tertiary" | "surface";
    /** Reduces shadow to the lower elevation variant. @default false */
    lowered?: boolean;
    /** Replaces the icon with a spinner and blocks interaction. @default false */
    loading?: boolean;
    /** Spinner style shown while loading. @default "loading-indicator" */
    loadingVariant?: "loading-indicator" | "circular";
    /** Mounts/unmounts with an entrance/exit animation. @default true */
    visible?: boolean;
    /** Collapses to icon-only when the user scrolls down. @default false */
    collapseOnScroll?: boolean;
    /** Minimum scroll delta (px) required to trigger collapse/expand. @default 50 */
    scrollThreshold?: number;
    /** Controlled collapsed state. Overrides internal scroll-driven state when provided. */
    collapsed?: boolean;
    /** Callback fired when the internal collapsed state changes. */
    onCollapsedChange?: (collapsed: boolean) => void;
    /** Layout ID for Framer Motion Container Transform transitions. */
    layoutId?: string;
    /**
     * Change the component to the underlying child element and merge props/behavior.
     * Useful when wrapping in Next.js `<Link>` or custom anchor tags.
     * @default false
     */
    asChild?: boolean;
    children?: React$1.ReactNode;
}
declare const ExtendedFAB: React$1.NamedExoticComponent<Omit<ExtendedFABProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;

type MotionButtonProps$1 = Omit<HTMLMotionProps<"button">, "children" | "color">;
/**
 * Props for `FAB` Floating Action Button component.
 *
 * @remarks
 * - Ensure icon-only FABs specify `aria-label` for accessibility.
 * - In extended mode (`extended={true}`), text passed to `children` acts as the label, so `aria-label` may be omitted if children is string.
 * - `lowered` prop reduces the container shadow to MD3 "lowered" FAB specification;
 *   useful when placed on surface containers like Bottom App Bars for visual balance.
 *
 * @see https://m3.material.io/components/floating-action-button/overview
 */
interface FABProps extends MotionButtonProps$1 {
    /**
     * Icon element to render — typically an Icon component.
     * Swapped for loading spinner when `loading={true}`.
     */
    icon: React$1.ReactNode;
    /**
     * FAB size variant according to MD3 specification.
     * - `sm`: Small (40dp) — Recommended for tight layouts / inside content.
     * - `md`: Regular (56dp) — Standard primary action.
     * - `lg`: Large (96dp) — High-emphasis action.
     * - `xl`: Extra-large (136dp) — Spotlight action element.
     * @default "md"
     */
    size?: "sm" | "md" | "lg" | "xl";
    /**
     * MD3 color role container style.
     * @default "primary"
     */
    colorStyle?: "primary" | "secondary" | "tertiary" | "surface";
    /**
     * When `true`, expands FAB to display label text alongside icon.
     * Width automatically expands to fit `children`.
     * @default false
     */
    extended?: boolean;
    /**
     * Label content rendered when `extended={true}`.
     * Plain string recommended.
     */
    children?: React$1.ReactNode;
    /**
     * When `true`, reduces container shadow to lowered elevation.
     * @default false
     */
    lowered?: boolean;
    /**
     * When `true`, displays loading spinner and disables click interactions.
     * @default false
     */
    loading?: boolean;
    /**
     * Loading spinner variant.
     * @default "loading-indicator"
     */
    loadingVariant?: "loading-indicator" | "circular";
    /**
     * Controls FAB visibility in layout using scale motion animation.
     * @default true
     */
    visible?: boolean;
    /**
     * Change the component to the underlying child element and merge props/behavior.
     * Useful when wrapping in Next.js `<Link>` or custom anchor tags.
     * @default false
     */
    asChild?: boolean;
}
/**
 * Props for `FABPosition` layout wrapper component.
 * Position absolute wrapper to anchor FAB to a screen corner.
 *
 * @see {@link FABPosition}
 */
interface FABPositionProps {
    /**
     * Screen corner position for FAB.
     * @default "bottom-right"
     */
    position?: "bottom-right" | "bottom-left" | "top-right" | "top-left";
    /** Child elements — typically a `<FAB>` component */
    children: React$1.ReactNode;
    /** Additional CSS class */
    className?: string;
}
/**
 * Absolute position wrapper component for `<FAB>`.
 *
 * Anchors FAB to a screen corner with responsive offset padding.
 * Requires parent element to have `position: relative`.
 *
 * @see https://m3.material.io/components/floating-action-button/guidelines
 */
declare function FABPosition({ position, children, className, }: FABPositionProps): react_jsx_runtime.JSX.Element;
/**
 * Primary Floating Action Button (FAB) component adhering to MD3 Expressive.
 *
 * Supports sizes from SM to XL, multiple color roles, extended label expansion,
 * loading states, and entrance/exit scale motion animations.
 *
 * @remarks
 * - Requires `aria-label` for icon-only FABs.
 * - When `extended={true}`, string `children` is automatically used as the accessible label.
 * - Animates scale out when `visible={false}` using fluid spring animation.
 * - Combine with `FABPosition` to anchor to screen corners.
 *
 * @example
 * ```tsx
 * // Basic small icon-only FAB
 * <FAB icon={<Icon name="search" />} aria-label="Search" size="sm" />
 *
 * // Extended FAB with label
 * const [isOpen, setOpen] = React.useState(false);
 * <FAB
 *   icon={<Icon name="edit" />}
 *   extended={isOpen}
 *   onClick={() => setOpen(!isOpen)}
 * >
 *   Compose
 * </FAB>
 *
 * // Large FAB with loading state
 * <FAB
 *   icon={<Icon name="upload" />}

 *   size="lg"
 *   loading={isUploading}
 *   colorStyle="secondary"
 *   aria-label="Upload files"
 * />
 *
 * // Fixed at bottom right
 * <FABPosition position="bottom-right">
 *   <FAB icon={<Icon name="add" />} aria-label="Add item" />
 * </FABPosition>
 * ```

 *
 * @see https://m3.material.io/components/floating-action-button/overview
 */
declare const FAB: React$1.NamedExoticComponent<Omit<FABProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;

/**
 * Data interface for each action item in FAB menu.
 *
 * If `label` is omitted, renders as an icon-only item.
 */
interface FABMenuItemData {
    /** Unique ID used for React keys and focus tracking. */
    id: string;
    /** Label displayed adjacent to icon (optional). Omit for icon-only item. */
    label?: string;
    /** Icon node — typically an SVG icon component. */
    icon: React$1.ReactNode;
    /** Callback invoked when item is activated (click, Enter, or Space). */
    onClick: () => void;
    /**
     * When `true`, visually and interactively disables the item.
     * Uses `aria-disabled` instead of HTML `disabled` to preserve focusability for accessibility.
     * @default false
     */
    disabled?: boolean;
    /** Additional CSS class names for item wrapper. */
    className?: string;
}
/**
 * Props controlling the main `FABMenu` component.
 *
 * @remarks
 * FABMenu manages menu open/close lifecycle, focus trapping, keyboard control,
 * and staggered motion transitions. `expanded` state is controlled externally.
 */
interface FABMenuProps {
    /** Whether the FAB Menu is open (expanded). */
    expanded: boolean;
    /** Callback invoked when Toggle FAB is interacted with or backdrop dismissed. */
    onToggle: (expanded: boolean) => void;
    /** List of action items (MD3 spec recommends 2–6 items). */
    items: FABMenuItemData[];
    /**
     * MD3 container color role for trigger FAB and menu items.
     * @default "primary"
     */
    colorVariant?: "primary" | "secondary" | "tertiary";
    /**
     * FAB size variant controlling container dimensions per MD3 Extended FAB specification.
     * - `"sm"` – small FAB: 56dp (replaces deprecated "baseline").
     * - `"md"` – medium FAB: 80dp.
     * - `"lg"` – large FAB: 96dp.
     * @default "sm"
     */
    size?: "sm" | "md" | "lg";
    /**
     * Menu items alignment relative to Toggle FAB.
     * - `"end"`: Items align to right edge (trailing edge, recommended for RTL).
     * - `"start"`: Items align along left edge.
     * - `"center"`: Items align vertically centered above FAB.
     * @default "end"
     */
    alignment?: "start" | "end" | "center";
    /** Custom CSS className for root component. */
    className?: string;
    /**
     * When `true`, clicking backdrop overlay closes menu.
     * @default true
     */
    closeOnBackdropClick?: boolean;
    /**
     * When `true`, focus automatically moves to the LAST item (closest above FAB) when expanded.
     * If `false`, focus moves to the FIRST item in list.

     * @default true
     */
    focusLast?: boolean;
    /** Required `aria-label` for ToggleFAB for accessibility. */
    "aria-label"?: string;
}
/**
 * Props for standalone `ToggleFAB` component.
 */
interface ToggleFABProps {
    /** Whether the button is in expanded/active state. */
    expanded: boolean;
    /** Callback fired when button toggle state changes. */
    onToggle: (expanded: boolean) => void;
    /**
     * Icon generator function receiving `progress` between `0` -> `1` (collapsed -> expanded).
     * Useful for icon morphing effects during animation (e.g., plus to close icon).
     *
     * @example
     * ```tsx
     * icon={(progress) => progress > 0.5 ? <Icon name="close" /> : <Icon name="add" />}
     * ```
     */
    icon: (progress: number) => React$1.ReactNode;
    /** MD3 container color role. @default "primary" */
    colorVariant?: "primary" | "secondary" | "tertiary";
    /** FAB size variant controlling container dimensions. @default "sm" */
    size?: "sm" | "md" | "lg";
    /** Additional CSS class name. */
    className?: string;
    /** Accessible label requirement. Required. */
    "aria-label"?: string;
    /** ID link for aria-controls attribute to reference menu. */
    "aria-controls"?: string;
    /** Component ID. */
    id?: string;
}
/**
 * Props for an individual `FABMenuItem`.
 */
interface FABMenuItemProps {
    /** Icon node to display. */
    icon: React$1.ReactNode;
    /** Descriptive label text adjacent to icon. */
    label?: string;
    /** Callback fired when item is clicked. */
    onClick: () => void;
    /** Disables interaction while keeping element focusable in tab order. @default false */
    disabled?: boolean;
    /** Container color role. @default "primary" */
    colorVariant?: "primary" | "secondary" | "tertiary";
    /** Custom CSS className. */
    className?: string;
    /** Item index used for staggered animation delay. */
    index?: number;
    /** Total items count in menu array. */
    totalItems?: number;
    /** Logic `tabIndex` value for manual keyboard navigation. */
    tabIndex?: number;
    /**
     * Change the component to the underlying child element and merge props/behavior.
     * Useful when wrapping in Next.js `<Link>` or custom anchor tags.
     * @default false
     */
    asChild?: boolean;
    children?: React$1.ReactNode;
}
/**
 * Toggle FAB button (Morphing FAB) usable as standalone or trigger for `FABMenu`.
 *
 * Container shape transitions from squircle to circle (square → circle) and shifts colors
 * when `expanded` state changes from false → true.
 *
 * @example
 * ```tsx
 * const [open, setOpen] = React.useState(false);
 * <ToggleFAB
 *   expanded={open}
 *   onToggle={setOpen}
 *   colorVariant="primary"
 *   aria-label="Toggle actions"
 *   icon={(progress) => progress > 0.5 ? <Icon name="close" /> : <Icon name="add" />}
 * />
 * ```
 */
declare const ToggleFAB: React$1.NamedExoticComponent<ToggleFABProps & React$1.RefAttributes<HTMLButtonElement>>;
/**
 * Single action item within a `FABMenu`.
 *
 * Renders a pill shape enclosing icon and optional label text.
 * When `label` is omitted, renders as a square item containing only icon.
 * Includes MD3 Ripple and 48dp touch target area per WCAG 2.5.5 touch target guidelines.
 *
 * @remarks
 * Disabled items use `aria-disabled="true"` rather than native HTML `disabled`
 * so they remain focusable in the tab sequence per MD3 specification.
 */
declare function FABMenuItem({ icon, label, onClick, disabled, colorVariant, className, tabIndex, asChild, children, }: FABMenuItemProps): react_jsx_runtime.JSX.Element;
/**
 * MD3 Expressive FAB Menu.
 *
 * Floating Action Button expansion menu. Toggling trigger button reveals vertically stacked action items.
 *
 * Full MD3 Accessibility implementation:
 *  - `role="menu"` assigned to container
 *  - `role="menuitem"` assigned to child action items
 *  - Focus lifecycle management: Open -> Focus first/last menu item; Close -> Restore focus to ToggleFAB
 *  - Keyboard navigation: Escape key closes menu, ArrowUp/Down navigates items, Tab moves focus.
 *
 * @example
 * ```tsx
 * const [open, setOpen] = React.useState(false);
 *
 * const items = [
 *   { id: 'share', icon: <Icon name="share" />, label: 'Share', onClick: () => console.log('Share') },
 *   { id: 'edit', icon: <Icon name="edit" />, label: 'Edit', onClick: () => console.log('Edit') },
 *   { id: 'delete', icon: <Icon name="delete" />, label: 'Delete', disabled: true, onClick: () => {} }
 * ];
 *
 * <FABMenu
 *   expanded={open}
 *   onToggle={setOpen}
 *   aria-label="Quick actions"
 *   alignment="center"
 *   colorVariant="tertiary"

 *   items={items}
 * />
 * ```
 *
 * @see https://m3.material.io/components/floating-action-button/overview
 */
declare function FABMenu({ expanded, onToggle, items, colorVariant, size, alignment, className, closeOnBackdropClick, focusLast, "aria-label": ariaLabel, }: FABMenuProps): react_jsx_runtime.JSX.Element;

type SplitButtonVariant = "filled" | "tonal" | "elevated" | "outlined";
type SplitButtonSize = "xs" | "sm" | "md" | "lg" | "xl";
interface SplitButtonSizeTokens {
    containerHeight: number;
    betweenSpace: number;
    innerCorner: {
        default: number;
        hovered: number;
        pressed: number;
    };
    outerCornerPercent: number;
    leadingPadding: {
        start: number;
        end: number;
    };
    trailingPadding: {
        start: number;
        end: number;
    };
    trailingIconSize: number;
    /** Optical centering offset in px for trailing icon when unselected (asymmetric shape).
     *  Negative = shift toward center. Applied as translateX(-Ndp) on trailing icon container.
     *  Values: xs=-1, sm=-1, md=-2, lg=-3, xl=-6.
     *  When trailing button is selected (circular), offset = 0 (centered normally). */
    opticalCenterOffset: number;
}
interface SplitButtonLayoutProps extends React.HTMLAttributes<HTMLDivElement> {
    leadingButton: React.ReactNode;
    trailingButton: React.ReactNode;
    /**
     * Visual variant for both buttons. If provided, overrides variants on sub-components.
     */
    variant?: SplitButtonVariant;
    /**
     * Size for both buttons. If provided, overrides sizes on sub-components.
     */
    size?: SplitButtonSize;
    className?: string;
    /**
     * Gap between leading and trailing button.
     * Default: 2
     */
    spacing?: number;
}
type MotionButtonProps = Omit<HTMLMotionProps<"button">, "color" | "children">;
interface SplitButtonLeadingProps extends MotionButtonProps {
    /** Visual variant matching the paired trailing button */
    variant?: SplitButtonVariant;
    /** Size of the button */
    size?: SplitButtonSize;
    /** Leading icon element */
    icon?: React.ReactNode;
    /** Children = label text */
    children?: React.ReactNode;
    disabled?: boolean;
    className?: string;
    /**
     * Change the component to the underlying child element and merge props/behavior.
     * Useful when wrapping in Next.js `<Link>` or custom anchor tags.
     * @default false
     */
    asChild?: boolean;
}
interface SplitButtonTrailingProps extends Omit<MotionButtonProps, "onChange" | "color" | "children"> {
    variant?: SplitButtonVariant;
    size?: SplitButtonSize;
    /** Checked/selected state — triggers shape morph to circle + icon rotation */
    checked: boolean;
    onCheckedChange: (checked: boolean) => void;
    /** Icon to render (default: arrow_drop_down icon) */
    icon?: React.ReactNode;
    disabled?: boolean;
    /** aria-label REQUIRED for accessibility */
    "aria-label": string;
    /** ID of controlled menu element */
    "aria-controls"?: string;
    /** Indicates the availability and type of interactive popup element (default: "menu") */
    "aria-haspopup"?: boolean | "menu" | "listbox" | "tree" | "grid" | "dialog";
    className?: string;
    /**
     * Change the component to the underlying child element and merge props/behavior.
     * Useful when wrapping in Next.js `<Link>` or custom anchor tags.
     * @default false
     */
    asChild?: boolean;
    children?: React.ReactNode;
}
interface SplitButtonTrailingUncheckableProps extends Omit<MotionButtonProps, "color" | "children"> {
    variant?: SplitButtonVariant;
    size?: SplitButtonSize;
    icon?: React.ReactNode;
    disabled?: boolean;
    "aria-label": string;
    className?: string;
    /**
     * Change the component to the underlying child element and merge props/behavior.
     * Useful when wrapping in Next.js `<Link>` or custom anchor tags.
     * @default false
     */
    asChild?: boolean;
    children?: React.ReactNode;
}

declare const SplitButtonLayout: React$1.NamedExoticComponent<SplitButtonLayoutProps & React$1.RefAttributes<HTMLDivElement>>;

declare const SplitButtonLeading: React$1.NamedExoticComponent<Omit<SplitButtonLeadingProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const FilledSplitButtonLeading: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonLeadingProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const TonalSplitButtonLeading: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonLeadingProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const ElevatedSplitButtonLeading: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonLeadingProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const OutlinedSplitButtonLeading: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonLeadingProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;

declare const SplitButtonTrailing: React$1.NamedExoticComponent<Omit<SplitButtonTrailingProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const FilledSplitButtonTrailing: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonTrailingProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const TonalSplitButtonTrailing: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonTrailingProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const ElevatedSplitButtonTrailing: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonTrailingProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const OutlinedSplitButtonTrailing: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonTrailingProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;

declare const SplitButtonTrailingUncheckable: React$1.NamedExoticComponent<Omit<SplitButtonTrailingUncheckableProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const FilledSplitButtonTrailingUncheckable: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonTrailingUncheckableProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const TonalSplitButtonTrailingUncheckable: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonTrailingUncheckableProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const ElevatedSplitButtonTrailingUncheckable: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonTrailingUncheckableProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
declare const OutlinedSplitButtonTrailingUncheckable: React$1.ForwardRefExoticComponent<Omit<Omit<SplitButtonTrailingUncheckableProps, "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;

export { OutlinedSplitButtonTrailingUncheckable as A, BUTTON_COLOR_TOKENS as B, type SplitButtonLayoutProps as C, type DistributeMode as D, ElevatedSplitButtonLeading as E, FAB as F, SplitButtonLeading as G, type SplitButtonLeadingProps as H, type SplitButtonSize as I, SplitButtonTrailing as J, type SplitButtonTrailingProps as K, SplitButtonTrailingUncheckable as L, type SplitButtonTrailingUncheckableProps as M, type SplitButtonVariant as N, OutlinedSplitButtonLeading as O, type ToggleFABProps as P, TonalSplitButtonLeading as Q, TonalSplitButtonTrailing as R, SplitButtonLayout as S, ToggleFAB as T, TonalSplitButtonTrailingUncheckable as U, type SplitButtonSizeTokens as V, BUTTON_SIZE_TOKENS as a, type BaseButtonProps as b, Button as c, ButtonDistribute as d, type ButtonDistributeProps as e, ButtonGroup as f, type ButtonGroupOrientation as g, type ButtonGroupProps as h, type ButtonGroupVariant as i, type ButtonProps as j, ElevatedSplitButtonTrailing as k, ElevatedSplitButtonTrailingUncheckable as l, ExtendedFAB as m, type ExtendedFABProps as n, FABMenu as o, FABMenuItem as p, type FABMenuItemData as q, type FABMenuItemProps as r, type FABMenuProps as s, FABPosition as t, type FABPositionProps as u, type FABProps as v, FilledSplitButtonLeading as w, FilledSplitButtonTrailing as x, FilledSplitButtonTrailingUncheckable as y, OutlinedSplitButtonTrailing as z };