@coinbase/cds-mobile 8.13.1 → 8.13.2

package/dts/animation/createLottie.d.ts

@@ -5,28 +5,31 @@ import type LottieView from 'lottie-react-native';
 import type { LottieProps } from './types';
 type ProgressListenerCallback = (frame: number) => void;
 type ProgressTimingConfig = {
-    startFrame?: number;
-    endFrame?: number;
+  startFrame?: number;
+  endFrame?: number;
 };
 export type LottieProgress = {
-    value: Animated.Value;
-    timing: (config?: ProgressTimingConfig) => {
-        start: (cb?: () => void) => void;
-    };
-    play: (cb?: () => void) => void;
-    pause: () => void;
-    reset: () => void;
-    addListener: (callback: ProgressListenerCallback) => void;
-    removeListener: () => void;
+  value: Animated.Value;
+  timing: (config?: ProgressTimingConfig) => {
+    start: (cb?: () => void) => void;
+  };
+  play: (cb?: () => void) => void;
+  pause: () => void;
+  reset: () => void;
+  addListener: (callback: ProgressListenerCallback) => void;
+  removeListener: () => void;
 };
 export type LottiePlayerMobile<Source extends LottieSource = LottieSource> = {
-    lottieRef: React.Ref<LottieView>;
-    progress: LottieProgress;
-    Lottie: {
-        (props: Omit<LottieProps, 'source'>): JSX.Element;
-        displayName: 'Lottie';
-    };
+  lottieRef: React.Ref<LottieView>;
+  progress: LottieProgress;
+  Lottie: {
+    (props: Omit<LottieProps, 'source'>): JSX.Element;
+    displayName: 'Lottie';
+  };
 } & LottiePlayer<Source>;
-export declare const createLottie: <Source extends LottieSource>(source: Source, progressOverride?: Animated.Value) => LottiePlayerMobile<Source>;
+export declare const createLottie: <Source extends LottieSource>(
+  source: Source,
+  progressOverride?: Animated.Value,
+) => LottiePlayerMobile<Source>;
 export {};
-//# sourceMappingURL=createLottie.d.ts.map
+//# sourceMappingURL=createLottie.d.ts.map

package/dts/animation/createLottie.e2e.d.ts

@@ -1,25 +1,34 @@
 export declare const createLottie: {
+  play: () => void;
+  playMarkers: () => void;
+  pause: () => void;
+  resume: () => void;
+  reset: () => void;
+  progress: {
+    value: import('react-native').Animated.Value;
+    timing: () => {
+      start: (cb?: () => void) => void | undefined;
+    };
     play: () => void;
-    playMarkers: () => void;
     pause: () => void;
-    resume: () => void;
     reset: () => void;
-    progress: {
-        value: import("react-native").Animated.Value;
-        timing: () => {
-            start: (cb?: () => void) => void | undefined;
-        };
-        play: () => void;
-        pause: () => void;
-        reset: () => void;
-        addListener: () => void;
-        removeListener: () => void;
-    };
-    lottieRef: {
-        current: {
-            play: () => void;
-        };
+    addListener: () => void;
+    removeListener: () => void;
+  };
+  lottieRef: {
+    current: {
+      play: () => void;
     };
-    Lottie: ({ autoplay, colorFilters, loop, progress, resizeMode, source, onAnimationFinish, ...boxProps }: import("./types").LottieProps) => import("react/jsx-runtime").JSX.Element;
+  };
+  Lottie: ({
+    autoplay,
+    colorFilters,
+    loop,
+    progress,
+    resizeMode,
+    source,
+    onAnimationFinish,
+    ...boxProps
+  }: import('./types').LottieProps) => import('react/jsx-runtime').JSX.Element;
 };
-//# sourceMappingURL=createLottie.e2e.d.ts.map
+//# sourceMappingURL=createLottie.e2e.d.ts.map

package/dts/animation/index.d.ts

@@ -4,4 +4,4 @@ export * from './lottieProgresConfig';
 export * from './LottieStatusAnimation';
 export * from './types';
 export * from './useLottie';
-//# sourceMappingURL=index.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/dts/animation/lottieProgresConfig.d.ts

@@ -1,6 +1,6 @@
 export declare const lottieProgressConfig: {
-    toValue: number;
-    easing: import("react-native").EasingFunction;
-    useNativeDriver: boolean;
+  toValue: number;
+  easing: import('react-native').EasingFunction;
+  useNativeDriver: boolean;
 };
-//# sourceMappingURL=lottieProgresConfig.d.ts.map
+//# sourceMappingURL=lottieProgresConfig.d.ts.map

package/dts/animation/mocks.d.ts

@@ -1,28 +1,46 @@
 import { Animated } from 'react-native';
 import type { LottieProps } from './types';
-export declare const LottieMock: ({ autoplay, colorFilters, loop, progress, resizeMode, source, onAnimationFinish, ...boxProps }: LottieProps) => import("react/jsx-runtime").JSX.Element;
+export declare const LottieMock: ({
+  autoplay,
+  colorFilters,
+  loop,
+  progress,
+  resizeMode,
+  source,
+  onAnimationFinish,
+  ...boxProps
+}: LottieProps) => import('react/jsx-runtime').JSX.Element;
 export declare const createLottieMock: {
+  play: () => void;
+  playMarkers: () => void;
+  pause: () => void;
+  resume: () => void;
+  reset: () => void;
+  progress: {
+    value: Animated.Value;
+    timing: () => {
+      start: (cb?: () => void) => void | undefined;
+    };
     play: () => void;
-    playMarkers: () => void;
     pause: () => void;
-    resume: () => void;
     reset: () => void;
-    progress: {
-        value: Animated.Value;
-        timing: () => {
-            start: (cb?: () => void) => void | undefined;
-        };
-        play: () => void;
-        pause: () => void;
-        reset: () => void;
-        addListener: () => void;
-        removeListener: () => void;
-    };
-    lottieRef: {
-        current: {
-            play: () => void;
-        };
+    addListener: () => void;
+    removeListener: () => void;
+  };
+  lottieRef: {
+    current: {
+      play: () => void;
     };
-    Lottie: ({ autoplay, colorFilters, loop, progress, resizeMode, source, onAnimationFinish, ...boxProps }: LottieProps) => import("react/jsx-runtime").JSX.Element;
+  };
+  Lottie: ({
+    autoplay,
+    colorFilters,
+    loop,
+    progress,
+    resizeMode,
+    source,
+    onAnimationFinish,
+    ...boxProps
+  }: LottieProps) => import('react/jsx-runtime').JSX.Element;
 };
-//# sourceMappingURL=mocks.d.ts.map
+//# sourceMappingURL=mocks.d.ts.map

package/dts/animation/types.d.ts

@@ -1,51 +1,54 @@
 import type { Animated, StyleProp, ViewStyle } from 'react-native';
 import type { LottieSource } from '@coinbase/cds-common/types';
 import type { BoxBaseProps } from '../layout';
-export type LottieBaseProps<T extends LottieSource = LottieSource> = Omit<BoxBaseProps, 'alignContent' | 'justifyContent' | 'flexWrap' | 'flexDirection'> & {
-    /**
-     * A boolean flag indicating whether or not the animation should start automatically when
-     * mounted. This only affects the imperative API.
-     * @default false
-     */
-    autoplay?: boolean;
-    /**
-     * A boolean flag indicating whether or not the animation should loop.
-     * @default false
-     */
-    loop?: boolean;
-    /**
-     * A callback function which will be called when animation is finished. Note that on mobile, this
-     * callback will be called only when `loop` is set to false.
-     */
-    onAnimationFinish?: () => void;
-    /**
-     * Determines how to resize the animated view when the frame doesn't match the raw image
-     * dimensions.
-     * Refer to React Native docs [here](https://facebook.github.io/react-native/docs/image.html#resizemode)
-     * @default contain
-     */
-    resizeMode?: 'cover' | 'contain' | 'center';
-    /**
-     * The source of animation. Should be pulled from @coinbase/cds-lottie-files.
-     * For mobile, import the animation from the animations folder instead of from index so that unused animations are not included during build, `import { tradeStatus } from @coinbase/cds-lottie-files/tradeStatus`.
-     */
-    source: T;
-    /**
-     * A number between 0 and 1, or an `Animated` number between 0 and 1. This number
-     * represents the normalized progress of the animation. If you update this prop, the
-     * animation will correspondingly update to the frame at that progress value. This
-     * prop is not required if you are using the imperative API.
-     */
-    progress?: number | Animated.Value | Animated.AnimatedInterpolation<number>;
-    /**
-     * An array of layers you want to override its color filter.
-     */
-    colorFilters?: {
-        keypath: string;
-        color: string;
-    }[];
-    animated?: boolean;
-    style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
+export type LottieBaseProps<T extends LottieSource = LottieSource> = Omit<
+  BoxBaseProps,
+  'alignContent' | 'justifyContent' | 'flexWrap' | 'flexDirection'
+> & {
+  /**
+   * A boolean flag indicating whether or not the animation should start automatically when
+   * mounted. This only affects the imperative API.
+   * @default false
+   */
+  autoplay?: boolean;
+  /**
+   * A boolean flag indicating whether or not the animation should loop.
+   * @default false
+   */
+  loop?: boolean;
+  /**
+   * A callback function which will be called when animation is finished. Note that on mobile, this
+   * callback will be called only when `loop` is set to false.
+   */
+  onAnimationFinish?: () => void;
+  /**
+   * Determines how to resize the animated view when the frame doesn't match the raw image
+   * dimensions.
+   * Refer to React Native docs [here](https://facebook.github.io/react-native/docs/image.html#resizemode)
+   * @default contain
+   */
+  resizeMode?: 'cover' | 'contain' | 'center';
+  /**
+   * The source of animation. Should be pulled from @coinbase/cds-lottie-files.
+   * For mobile, import the animation from the animations folder instead of from index so that unused animations are not included during build, `import { tradeStatus } from @coinbase/cds-lottie-files/tradeStatus`.
+   */
+  source: T;
+  /**
+   * A number between 0 and 1, or an `Animated` number between 0 and 1. This number
+   * represents the normalized progress of the animation. If you update this prop, the
+   * animation will correspondingly update to the frame at that progress value. This
+   * prop is not required if you are using the imperative API.
+   */
+  progress?: number | Animated.Value | Animated.AnimatedInterpolation<number>;
+  /**
+   * An array of layers you want to override its color filter.
+   */
+  colorFilters?: {
+    keypath: string;
+    color: string;
+  }[];
+  animated?: boolean;
+  style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
 };
 export type LottieProps<T extends LottieSource = LottieSource> = LottieBaseProps<T>;
-//# sourceMappingURL=types.d.ts.map
+//# sourceMappingURL=types.d.ts.map

package/dts/animation/useLottie.d.ts

@@ -1,3 +1,6 @@
 import type { LottieSource } from '@coinbase/cds-common';
-export declare function useLottie<T extends LottieSource>(source: T, startProgressValue?: number): import("./createLottie").LottiePlayerMobile<T>;
-//# sourceMappingURL=useLottie.d.ts.map
+export declare function useLottie<T extends LottieSource>(
+  source: T,
+  startProgressValue?: number,
+): import('./createLottie').LottiePlayerMobile<T>;
+//# sourceMappingURL=useLottie.d.ts.map

package/dts/animation/useLottie.e2e.d.ts

@@ -1,25 +1,34 @@
 export declare const useLottie: () => {
+  play: () => void;
+  playMarkers: () => void;
+  pause: () => void;
+  resume: () => void;
+  reset: () => void;
+  progress: {
+    value: import('react-native').Animated.Value;
+    timing: () => {
+      start: (cb?: () => void) => void | undefined;
+    };
     play: () => void;
-    playMarkers: () => void;
     pause: () => void;
-    resume: () => void;
     reset: () => void;
-    progress: {
-        value: import("react-native").Animated.Value;
-        timing: () => {
-            start: (cb?: () => void) => void | undefined;
-        };
-        play: () => void;
-        pause: () => void;
-        reset: () => void;
-        addListener: () => void;
-        removeListener: () => void;
-    };
-    lottieRef: {
-        current: {
-            play: () => void;
-        };
+    addListener: () => void;
+    removeListener: () => void;
+  };
+  lottieRef: {
+    current: {
+      play: () => void;
     };
-    Lottie: ({ autoplay, colorFilters, loop, progress, resizeMode, source, onAnimationFinish, ...boxProps }: import("./types").LottieProps) => import("react/jsx-runtime").JSX.Element;
+  };
+  Lottie: ({
+    autoplay,
+    colorFilters,
+    loop,
+    progress,
+    resizeMode,
+    source,
+    onAnimationFinish,
+    ...boxProps
+  }: import('./types').LottieProps) => import('react/jsx-runtime').JSX.Element;
 };
-//# sourceMappingURL=useLottie.e2e.d.ts.map
+//# sourceMappingURL=useLottie.e2e.d.ts.map

package/dts/animation/useLottieColorFilters.d.ts

@@ -4,8 +4,11 @@ import type { LottieProps } from './types';
  * Override colors of Lottie layers.
  * Theme dependent layers should use PaletteAlias as layer name in After Effects i.e 'foreground' or 'primary'
  */
-export declare function useLottieColorFilters(source: LottieSource, customColorFilters?: LottieProps['colorFilters']): {
-    keypath: string;
-    color: string;
+export declare function useLottieColorFilters(
+  source: LottieSource,
+  customColorFilters?: LottieProps['colorFilters'],
+): {
+  keypath: string;
+  color: string;
 }[];
-//# sourceMappingURL=useLottieColorFilters.d.ts.map
+//# sourceMappingURL=useLottieColorFilters.d.ts.map

package/dts/animation/useRotateAnimation.d.ts

@@ -1,15 +1,19 @@
 import { Animated } from 'react-native';
 import type { MotionBaseSpec } from '@coinbase/cds-common';
 type SelectAnimation = {
-    rotateAnimation: Animated.Value;
-    animateRotateIn: Animated.CompositeAnimation;
-    animateRotateOut: Animated.CompositeAnimation;
-    rotateAnimationStyles: {
-        transform: {
-            rotate: Animated.AnimatedInterpolation<string>;
-        }[];
-    };
+  rotateAnimation: Animated.Value;
+  animateRotateIn: Animated.CompositeAnimation;
+  animateRotateOut: Animated.CompositeAnimation;
+  rotateAnimationStyles: {
+    transform: {
+      rotate: Animated.AnimatedInterpolation<string>;
+    }[];
+  };
 };
-export declare const useRotateAnimation: (animateInConfig: MotionBaseSpec, animateOutConfig: MotionBaseSpec, degree: number) => SelectAnimation;
+export declare const useRotateAnimation: (
+  animateInConfig: MotionBaseSpec,
+  animateOutConfig: MotionBaseSpec,
+  degree: number,
+) => SelectAnimation;
 export {};
-//# sourceMappingURL=useRotateAnimation.d.ts.map
+//# sourceMappingURL=useRotateAnimation.d.ts.map

package/dts/banner/Banner.d.ts

@@ -1,99 +1,109 @@
 import React from 'react';
 import type { View } from 'react-native';
 import type { ThemeVars } from '@coinbase/cds-common/core/theme';
-import type { BannerStyleVariant, BannerVariant, IconName, SharedProps } from '@coinbase/cds-common/types';
+import type {
+  BannerStyleVariant,
+  BannerVariant,
+  IconName,
+  SharedProps,
+} from '@coinbase/cds-common/types';
 import type { HStackProps } from '../layout';
 export type BannerBaseProps = SharedProps & {
-    /** Sets the variant of the banner - which is responsible for foreground and background color assignment */
-    variant: BannerVariant;
-    /** Name of icon to be shown in the banner */
-    startIcon: IconName;
-    /** Whether the start icon is active */
-    startIconActive?: boolean;
-    /** Provide a CDS Link component to be used as a primary action. It will inherit colors depending on the provided variant */
-    primaryAction?: React.ReactNode;
-    /** Provide a CDS Link component to be used as a secondary action. It will inherit colors depending on the provided tone */
-    secondaryAction?: React.ReactNode;
-    /** Title of banner. Indicates the intent of this banner */
-    title?: React.ReactNode;
-    /** Message of banner */
-    children?: React.ReactNode;
-    /**
-     * Determines whether banner can be dismissed or not. Banner is not dismisable when styleVariant is set to global.
-     * @default true
-     * */
-    showDismiss?: boolean;
-    /** A callback fired when banner is dismissed */
-    onClose?: () => void;
-    /** Indicates the max number of lines after which body text will be truncated */
-    numberOfLines?: number;
-    /** Use for supplemental data */
-    label?: React.ReactNode;
-    /**
-     * Determines the banner style and indicates the suggested positioning for the banner
-     * @default 'contextual'
-     * */
-    styleVariant?: BannerStyleVariant;
-    /** Accessibility label for start icon on the banner */
-    startIconAccessibilityLabel?: string;
-    /** Accessibility label for close button on the banner */
-    closeAccessibilityLabel?: string;
-    /**
-     * Determines whether banner has a border or not
-     * @default true
-     * */
-    bordered?: boolean;
-    /**
-     * Determines banner's border radius
-     * @default 400
-     * */
-    borderRadius?: ThemeVars.BorderRadius;
+  /** Sets the variant of the banner - which is responsible for foreground and background color assignment */
+  variant: BannerVariant;
+  /** Name of icon to be shown in the banner */
+  startIcon: IconName;
+  /** Whether the start icon is active */
+  startIconActive?: boolean;
+  /** Provide a CDS Link component to be used as a primary action. It will inherit colors depending on the provided variant */
+  primaryAction?: React.ReactNode;
+  /** Provide a CDS Link component to be used as a secondary action. It will inherit colors depending on the provided tone */
+  secondaryAction?: React.ReactNode;
+  /** Title of banner. Indicates the intent of this banner */
+  title?: React.ReactNode;
+  /** Message of banner */
+  children?: React.ReactNode;
+  /**
+   * Determines whether banner can be dismissed or not. Banner is not dismisable when styleVariant is set to global.
+   * @default true
+   * */
+  showDismiss?: boolean;
+  /** A callback fired when banner is dismissed */
+  onClose?: () => void;
+  /** Indicates the max number of lines after which body text will be truncated */
+  numberOfLines?: number;
+  /** Use for supplemental data */
+  label?: React.ReactNode;
+  /**
+   * Determines the banner style and indicates the suggested positioning for the banner
+   * @default 'contextual'
+   * */
+  styleVariant?: BannerStyleVariant;
+  /** Accessibility label for start icon on the banner */
+  startIconAccessibilityLabel?: string;
+  /** Accessibility label for close button on the banner */
+  closeAccessibilityLabel?: string;
+  /**
+   * Determines whether banner has a border or not
+   * @default true
+   * */
+  bordered?: boolean;
+  /**
+   * Determines banner's border radius
+   * @default 400
+   * */
+  borderRadius?: ThemeVars.BorderRadius;
 };
 export type MobileBannerProps = BannerBaseProps & Omit<HStackProps, 'children'>;
-export declare const Banner: React.MemoExoticComponent<React.ForwardRefExoticComponent<SharedProps & {
-    /** Sets the variant of the banner - which is responsible for foreground and background color assignment */
-    variant: BannerVariant;
-    /** Name of icon to be shown in the banner */
-    startIcon: IconName;
-    /** Whether the start icon is active */
-    startIconActive?: boolean;
-    /** Provide a CDS Link component to be used as a primary action. It will inherit colors depending on the provided variant */
-    primaryAction?: React.ReactNode;
-    /** Provide a CDS Link component to be used as a secondary action. It will inherit colors depending on the provided tone */
-    secondaryAction?: React.ReactNode;
-    /** Title of banner. Indicates the intent of this banner */
-    title?: React.ReactNode;
-    /** Message of banner */
-    children?: React.ReactNode;
-    /**
-     * Determines whether banner can be dismissed or not. Banner is not dismisable when styleVariant is set to global.
-     * @default true
-     * */
-    showDismiss?: boolean;
-    /** A callback fired when banner is dismissed */
-    onClose?: () => void;
-    /** Indicates the max number of lines after which body text will be truncated */
-    numberOfLines?: number;
-    /** Use for supplemental data */
-    label?: React.ReactNode;
-    /**
-     * Determines the banner style and indicates the suggested positioning for the banner
-     * @default 'contextual'
-     * */
-    styleVariant?: BannerStyleVariant;
-    /** Accessibility label for start icon on the banner */
-    startIconAccessibilityLabel?: string;
-    /** Accessibility label for close button on the banner */
-    closeAccessibilityLabel?: string;
-    /**
-     * Determines whether banner has a border or not
-     * @default true
-     * */
-    bordered?: boolean;
-    /**
-     * Determines banner's border radius
-     * @default 400
-     * */
-    borderRadius?: ThemeVars.BorderRadius;
-} & Omit<import("../layout").BoxProps, "children"> & React.RefAttributes<View>>>;
-//# sourceMappingURL=Banner.d.ts.map
+export declare const Banner: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    SharedProps & {
+      /** Sets the variant of the banner - which is responsible for foreground and background color assignment */
+      variant: BannerVariant;
+      /** Name of icon to be shown in the banner */
+      startIcon: IconName;
+      /** Whether the start icon is active */
+      startIconActive?: boolean;
+      /** Provide a CDS Link component to be used as a primary action. It will inherit colors depending on the provided variant */
+      primaryAction?: React.ReactNode;
+      /** Provide a CDS Link component to be used as a secondary action. It will inherit colors depending on the provided tone */
+      secondaryAction?: React.ReactNode;
+      /** Title of banner. Indicates the intent of this banner */
+      title?: React.ReactNode;
+      /** Message of banner */
+      children?: React.ReactNode;
+      /**
+       * Determines whether banner can be dismissed or not. Banner is not dismisable when styleVariant is set to global.
+       * @default true
+       * */
+      showDismiss?: boolean;
+      /** A callback fired when banner is dismissed */
+      onClose?: () => void;
+      /** Indicates the max number of lines after which body text will be truncated */
+      numberOfLines?: number;
+      /** Use for supplemental data */
+      label?: React.ReactNode;
+      /**
+       * Determines the banner style and indicates the suggested positioning for the banner
+       * @default 'contextual'
+       * */
+      styleVariant?: BannerStyleVariant;
+      /** Accessibility label for start icon on the banner */
+      startIconAccessibilityLabel?: string;
+      /** Accessibility label for close button on the banner */
+      closeAccessibilityLabel?: string;
+      /**
+       * Determines whether banner has a border or not
+       * @default true
+       * */
+      bordered?: boolean;
+      /**
+       * Determines banner's border radius
+       * @default 400
+       * */
+      borderRadius?: ThemeVars.BorderRadius;
+    } & Omit<import('../layout').BoxProps, 'children'> &
+      React.RefAttributes<View>
+  >
+>;
+//# sourceMappingURL=Banner.d.ts.map

package/dts/buttons/AvatarButton.d.ts

@@ -3,6 +3,9 @@ import type { SharedProps } from '@coinbase/cds-common/types';
 import { type AvatarBaseProps } from '../media';
 import { type PressableBaseProps } from '../system/Pressable';
 import type { ButtonBaseProps } from './Button';
-export type AvatarButtonProps = PressableBaseProps & SharedProps & Pick<ButtonBaseProps, 'accessibilityLabel' | 'compact'> & Pick<AvatarBaseProps, 'src' | 'shape' | 'colorScheme' | 'borderColor' | 'name'>;
+export type AvatarButtonProps = PressableBaseProps &
+  SharedProps &
+  Pick<ButtonBaseProps, 'accessibilityLabel' | 'compact'> &
+  Pick<AvatarBaseProps, 'src' | 'shape' | 'colorScheme' | 'borderColor' | 'name'>;
 export declare const AvatarButton: React.NamedExoticComponent<AvatarButtonProps>;
-//# sourceMappingURL=AvatarButton.d.ts.map
+//# sourceMappingURL=AvatarButton.d.ts.map