import React from 'react';
import type { Placement } from '@coinbase/cds-common/types';
import { type ProgressBarLabel } from './getProgressBarLabelParts';
import { type ProgressBaseProps } from './ProgressBar';
export type ProgressBarFloatLabelProps = Pick<
  ProgressBarWithFloatLabelProps,
  | 'label'
  | 'progress'
  | 'disableAnimateOnMount'
  | 'disabled'
  | 'labelPlacement'
  | 'styles'
  | 'classNames'
>;
export type ProgressBarWithFloatLabelBaseProps = Pick<
  ProgressBaseProps,
  'progress' | 'disableAnimateOnMount' | 'disabled' | 'testID'
> & {
  /** Label that is floated at the end of the filled in bar. If a number is used then it will format it as a percentage. */
  label: ProgressBarLabel;
  /**
   * Position of label relative to the bar
   * @default above
   * */
  labelPlacement?: Extract<Placement, 'above' | 'below'>;
};
export type ProgressBarWithFloatLabelProps = ProgressBarWithFloatLabelBaseProps & {
  style?: React.CSSProperties;
  className?: string;
  /** Custom styles for individual elements of the ProgressBarWithFloatLabel component */
  styles?: {
    /** Root element */
    root?: React.CSSProperties;
    /** Label container element */
    labelContainer?: React.CSSProperties;
    /** Label element */
    label?: React.CSSProperties;
  };
  /** Custom class names for individual elements of the ProgressBarWithFloatLabel component */
  classNames?: {
    /** Root element */
    root?: string;
    /** Label container element */
    labelContainer?: string;
    /** Label element */
    label?: string;
  };
};
export declare const ProgressBarWithFloatLabel: React.FC<
  React.PropsWithChildren<ProgressBarWithFloatLabelProps>
>;
//# sourceMappingURL=ProgressBarWithFloatLabel.d.ts.map