import { ComponentPropsWithRef } from 'react';
type Layout = 'vertical' | 'horizontal';
export type Size = number | 'small' | 'medium' | 'large' | 'xsmall';
export type SpinnerProps = ComponentPropsWithRef<'span'> & {
    /** Required for accessibility. Adds a `title` to the SVG. */
    accessibilityLabel: string;
    /** Add margin with spacing design tokens `(e.g., ccMargin="xl auto m")` */
    ccMargin?: string;
    'data-testid'?: string;
    isCentered?: boolean;
    label?: string;
    layout?: Layout;
    meterColor?: string;
    size?: Size;
    trackColor?: string;
    /**
     * @deprecated Use `data-testid` instead.
     */
    testId?: string;
};
type LayoutProps = {
    $isCentered?: boolean;
    $layout?: Layout;
    $ccMargin?: SpinnerProps['ccMargin'];
};
declare const Layout: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, keyof LayoutProps> & LayoutProps, never> & Partial<Pick<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, keyof LayoutProps> & LayoutProps, never>>> & string;
/** Use Spinner when something's happening and the user needs to wait. Versatile and customizable.  */
export declare const Spinner: ({ accessibilityLabel, ccMargin, "data-testid": dataTestId, isCentered, label, layout, meterColor, size, trackColor, testId, ...props }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;
export default Spinner;