import React from 'react';
import { type StyleProp, View, type ViewStyle } from 'react-native';
import { type SharedValue } from 'react-native-reanimated';
import type { ButtonVariant } from '@coinbase/cds-common/types/ButtonBaseProps';
import type { PressableProps } from '../system/Pressable';
export declare const slideButtonTestID = 'slide-button';
export declare const DEFAULT_COMPACT_HEIGHT = 40;
export declare const DEFAULT_REGULAR_HEIGHT = 56;
export type SlideButtonBackgroundProps = Pick<
  SlideButtonBaseProps,
  | 'borderBottomLeftRadius'
  | 'borderBottomRightRadius'
  | 'borderRadius'
  | 'borderTopLeftRadius'
  | 'borderTopRightRadius'
  | 'checked'
  | 'compact'
  | 'disabled'
  | 'uncheckedLabel'
  | 'variant'
> & {
  progress: SharedValue<number>;
  style?: StyleProp<ViewStyle>;
};
export type SlideButtonHandleProps = PressableProps &
  Pick<
    SlideButtonBaseProps,
    | 'checked'
    | 'checkedLabel'
    | 'compact'
    | 'disabled'
    | 'startUncheckedNode'
    | 'endCheckedNode'
    | 'variant'
  > & {
    progress: SharedValue<number>;
    style?: StyleProp<ViewStyle>;
  };
export type SlideButtonHandleComponent = React.FC<SlideButtonHandleProps>;
export type SlideButtonBackgroundComponent = React.FC<SlideButtonBackgroundProps>;
export type SlideButtonBaseProps = Omit<PressableProps, 'loading'> & {
  /**
   * Control whether the button is in a checked state.
   */
  checked: boolean;
  /**
   * Callback function fired when slide button state changes.
   * Will always be called after `onSlideComplete` and before `onSlideEnd`.
   */
  onChange?: (checked: boolean) => void;
  /**
   * Label or content shown when button is in unchecked state.
   */
  uncheckedLabel?: React.ReactNode;
  /**
   * Label or content shown when button is in checked state.
   */
  checkedLabel?: React.ReactNode;
  /**
   * Callback function fired when the slide gesture begins.
   */
  onSlideStart?: () => void;
  /**
   * Callback function fired when the slide gesture is cancelled.
   * This occurs when a user slides less than the threshold required to complete the action.
   * Will always be called before `onSlideEnd`.
   */
  onSlideCancel?: () => void;
  /**
   * Callback function fired when the slide gesture ends.
   * Will always be called last in the slide sequence.
   */
  onSlideEnd?: () => void;
  /**
   * Callback function fired when the slide gesture ends successfully.
   * This is called when the user has slid past the threshold to complete the action.
   * Will always be called before `onSlideEnd` and after `onChange`.
   */
  onSlideComplete?: () => void;
  /**
   * Disables user interaction with the slide button.
   * When true, prevents gesture events from firing.
   */
  disabled?: boolean;
  /**
   * Reduces the height, borderRadius and inner padding within the button.
   */
  compact?: boolean;
  /**
   * Height of the entire button component (background and handle).
   * If you pass a custom SlideButtonBackgroundComponent or SlideButtonHandleComponent,
   * this property will be applied to both.
   *
   * @default 40px for compact variant, 56px for regular variant
   */
  height?: number;
  /**
   * Toggle design and visual variants of the slide button.
   * @default 'primary'
   */
  variant?: Extract<ButtonVariant, 'primary' | 'positive' | 'negative'>;
  /**
   * Custom component to render as the sliding handle.
   * @default DefaultSlideButtonHandle
   */
  SlideButtonHandleComponent?: SlideButtonHandleComponent;
  /**
   * Custom component to render as the container behind the sliding handle.
   * @default DefaultSlideButtonBackground
   */
  SlideButtonBackgroundComponent?: SlideButtonBackgroundComponent;
  /**
   * Threshold (as a percentage from 0 to 1) at which a slide gesture will complete.
   * A value of 0.7 means the user must slide 70% of the way across to trigger completion.
   * @default 0.7
   */
  checkThreshold?: number;
  /**
   * If true, the slide button will automatically complete the slide when the threshold is met.
   * If false, the user must release to complete the action.
   */
  autoCompleteSlideOnThresholdMet?: boolean;
  /** Custom styles for individual elements of the SlideButton component */
  styles?: {
    /** Container element */
    container?: StyleProp<ViewStyle>;
    /** Background element */
    background?: StyleProp<ViewStyle>;
    /** Handle element */
    handle?: StyleProp<ViewStyle>;
  };
  /**
   * Custom start node to render for the unchecked state of
   * the handle, to replace the default arrow icon.
   */
  startUncheckedNode?: React.ReactNode;
  /**
   * Custom end node to render for the checked state of
   * the handle, to replace the default loading indicator.
   */
  endCheckedNode?: React.ReactNode;
};
export type SlideButtonProps = SlideButtonBaseProps;
export declare const SlideButton: React.MemoExoticComponent<
  ({
    ref,
    ..._props
  }: SlideButtonProps & {
    ref?: React.Ref<View>;
  }) => import('react/jsx-runtime').JSX.Element
>;
//# sourceMappingURL=SlideButton.d.ts.map