@coinbase/cds-mobile 8.13.1 → 8.13.5

package/dts/system/Interactable.d.ts

@@ -3,67 +3,67 @@ import { type Animated, type StyleProp, type ViewProps, type ViewStyle } from 'r
 import type { ElevationLevels, ThemeVars } from '@coinbase/cds-common';
 import { type BoxBaseProps } from '../layout/Box';
 export type InteractableBaseProps = Omit<BoxBaseProps, 'animated'> & {
-    /** Apply animated styles to the outer container. */
-    style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>[];
-    /** Background color of the overlay (element being interacted with). */
-    background?: ThemeVars.Color;
-    /** Set element to block and expand to 100% width. */
-    block?: boolean;
-    /** Is the element currently disabled. */
-    disabled?: boolean;
-    /** Is the element elevated. */
-    elevation?: ElevationLevels;
-    /**
-     * Is the element currenty loading.
-     * When set to true, will disable element from press and keyboard events
-     */
-    loading?: boolean;
-    /** Is the element being pressed. Primarily a mobile feature, but can be used on the web. */
-    pressed?: boolean;
-    /**
-     * Mark the background and border as transparent until the element is interacted with (hovered, pressed, etc).
-     * Must be used in conjunction with the "pressed" prop
-     * */
-    transparentWhileInactive?: boolean;
-    /**
-     * Mark the background and border as transparent even while element is interacted with (elevation underlay issue).
-     * Must be used in conjunction with the "pressed" prop
-     * */
-    transparentWhilePressed?: boolean;
-    /**
-     * Custom color overrides for different interaction states.
-     * Base colors (background, borderColor) are used directly, while interaction
-     * state colors (pressed, disabled) are used as alternative base colors
-     * for blending calculations with blend strength and color scheme considerations.
-     *
-     * @example
-     * ```tsx
-     * <Interactable
-     *   blendStyles={{
-     *     background: '#ffffff',
-     *     pressedBackground: '#e0e0e0',
-     *     borderColor: '#cccccc'
-     *   }}
-     * />
-     * ```
-     */
-    blendStyles?: {
-        background?: string;
-        pressedBackground?: string;
-        disabledBackground?: string;
-        borderColor?: string;
-        pressedBorderColor?: string;
-        disabledBorderColor?: string;
-    };
-    /** Apply animated styles to the inner container. */
-    contentStyle?: StyleProp<ViewStyle>;
-    /** Apply styles to the outer container. */
-    wrapperStyles?: {
-        base?: StyleProp<ViewStyle>;
-        pressed?: StyleProp<ViewStyle>;
-        disabled?: StyleProp<ViewStyle>;
-    };
+  /** Apply animated styles to the outer container. */
+  style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>[];
+  /** Background color of the overlay (element being interacted with). */
+  background?: ThemeVars.Color;
+  /** Set element to block and expand to 100% width. */
+  block?: boolean;
+  /** Is the element currently disabled. */
+  disabled?: boolean;
+  /** Is the element elevated. */
+  elevation?: ElevationLevels;
+  /**
+   * Is the element currenty loading.
+   * When set to true, will disable element from press and keyboard events
+   */
+  loading?: boolean;
+  /** Is the element being pressed. Primarily a mobile feature, but can be used on the web. */
+  pressed?: boolean;
+  /**
+   * Mark the background and border as transparent until the element is interacted with (hovered, pressed, etc).
+   * Must be used in conjunction with the "pressed" prop
+   * */
+  transparentWhileInactive?: boolean;
+  /**
+   * Mark the background and border as transparent even while element is interacted with (elevation underlay issue).
+   * Must be used in conjunction with the "pressed" prop
+   * */
+  transparentWhilePressed?: boolean;
+  /**
+   * Custom color overrides for different interaction states.
+   * Base colors (background, borderColor) are used directly, while interaction
+   * state colors (pressed, disabled) are used as alternative base colors
+   * for blending calculations with blend strength and color scheme considerations.
+   *
+   * @example
+   * ```tsx
+   * <Interactable
+   *   blendStyles={{
+   *     background: '#ffffff',
+   *     pressedBackground: '#e0e0e0',
+   *     borderColor: '#cccccc'
+   *   }}
+   * />
+   * ```
+   */
+  blendStyles?: {
+    background?: string;
+    pressedBackground?: string;
+    disabledBackground?: string;
+    borderColor?: string;
+    pressedBorderColor?: string;
+    disabledBorderColor?: string;
+  };
+  /** Apply animated styles to the inner container. */
+  contentStyle?: StyleProp<ViewStyle>;
+  /** Apply styles to the outer container. */
+  wrapperStyles?: {
+    base?: StyleProp<ViewStyle>;
+    pressed?: StyleProp<ViewStyle>;
+    disabled?: StyleProp<ViewStyle>;
+  };
 };
 export type InteractableProps = InteractableBaseProps & Omit<ViewProps, 'style'>;
 export declare const Interactable: React.NamedExoticComponent<InteractableProps>;
-//# sourceMappingURL=Interactable.d.ts.map
+//# sourceMappingURL=Interactable.d.ts.map

package/dts/system/Pressable.d.ts

@@ -1,10 +1,21 @@
 import React from 'react';
-import { type AccessibilityProps, type GestureResponderEvent, type PressableProps as NativePressableProps, type View } from 'react-native';
+import {
+  type AccessibilityProps,
+  type GestureResponderEvent,
+  type PressableProps as NativePressableProps,
+  type View,
+} from 'react-native';
 import type { ComponentEventHandlerProps } from '@coinbase/cds-common';
 import { type InteractableBaseProps } from './Interactable';
 export type HapticFeedbackType = 'light' | 'normal' | 'heavy' | 'none';
-export type LinkableProps = Pick<NativePressableProps, 'onPress' | 'accessibilityLabel' | 'accessibilityHint'>;
-export type PressableBaseProps = AccessibilityProps & ComponentEventHandlerProps & Pick<NativePressableProps, 'style' | 'onPress' | 'hitSlop'> & Omit<InteractableBaseProps, 'style' | 'pressed'> & {
+export type LinkableProps = Pick<
+  NativePressableProps,
+  'onPress' | 'accessibilityLabel' | 'accessibilityHint'
+>;
+export type PressableBaseProps = AccessibilityProps &
+  ComponentEventHandlerProps &
+  Pick<NativePressableProps, 'style' | 'onPress' | 'hitSlop'> &
+  Omit<InteractableBaseProps, 'style' | 'pressed'> & {
     /** Dont scale element on press. */
     noScaleOnPress?: boolean;
     /** Callback fired before `onPress` when button is pressed. */
@@ -33,36 +44,44 @@ export type PressableBaseProps = AccessibilityProps & ComponentEventHandlerProps
      * the accidental "double-tap".
      */
     disableDebounce?: boolean;
-};
+  };
 export type PressableProps = PressableBaseProps & NativePressableProps;
-export declare const Pressable: React.MemoExoticComponent<React.ForwardRefExoticComponent<AccessibilityProps & ComponentEventHandlerProps & Pick<NativePressableProps, "style" | "hitSlop" | "onPress"> & Omit<InteractableBaseProps, "style" | "pressed"> & {
-    /** Dont scale element on press. */
-    noScaleOnPress?: boolean;
-    /** Callback fired before `onPress` when button is pressed. */
-    onPressIn?: (event: GestureResponderEvent) => void;
-    /** Callback fired before `onPress` when button is released. */
-    onPressOut?: (event: GestureResponderEvent) => void;
-    /**
-     * Haptic feedback to trigger when being pressed.
-     * @default none
-     */
-    feedback?: HapticFeedbackType;
-    /** Is the element currenty loading. */
-    loading?: boolean;
-    /**
-     * The amount of time to wait (in milliseconds) before invoking the debounced function.
-     * This prop is used in conjunction with the `disableDebounce` prop.
-     * The debounce function is configured to be invoked as soon as it's called, but subsequent calls
-     * within the `debounceTime` period will be ignored.
-     * @default 500
-     */
-    debounceTime?: number;
-    /**
-     * React Native is historically trash at debouncing touch events. This can cause a lot of
-     * unwanted behavior such as double navigations where we push a screen onto the stack 2 times.
-     * Debouncing the event 500 miliseconds, but taking the leading event prevents this effect and
-     * the accidental "double-tap".
-     */
-    disableDebounce?: boolean;
-} & NativePressableProps & React.RefAttributes<View>>>;
-//# sourceMappingURL=Pressable.d.ts.map
+export declare const Pressable: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    AccessibilityProps &
+      ComponentEventHandlerProps &
+      Pick<NativePressableProps, 'style' | 'hitSlop' | 'onPress'> &
+      Omit<InteractableBaseProps, 'style' | 'pressed'> & {
+        /** Dont scale element on press. */
+        noScaleOnPress?: boolean;
+        /** Callback fired before `onPress` when button is pressed. */
+        onPressIn?: (event: GestureResponderEvent) => void;
+        /** Callback fired before `onPress` when button is released. */
+        onPressOut?: (event: GestureResponderEvent) => void;
+        /**
+         * Haptic feedback to trigger when being pressed.
+         * @default none
+         */
+        feedback?: HapticFeedbackType;
+        /** Is the element currenty loading. */
+        loading?: boolean;
+        /**
+         * The amount of time to wait (in milliseconds) before invoking the debounced function.
+         * This prop is used in conjunction with the `disableDebounce` prop.
+         * The debounce function is configured to be invoked as soon as it's called, but subsequent calls
+         * within the `debounceTime` period will be ignored.
+         * @default 500
+         */
+        debounceTime?: number;
+        /**
+         * React Native is historically trash at debouncing touch events. This can cause a lot of
+         * unwanted behavior such as double navigations where we push a screen onto the stack 2 times.
+         * Debouncing the event 500 miliseconds, but taking the leading event prevents this effect and
+         * the accidental "double-tap".
+         */
+        disableDebounce?: boolean;
+      } & NativePressableProps &
+      React.RefAttributes<View>
+  >
+>;
+//# sourceMappingURL=Pressable.d.ts.map

package/dts/system/PressableOpacity.d.ts

@@ -1,6 +1,12 @@
 import type { PressableProps } from './Pressable';
 /** @deprecated This component will be removed in a future version. Use `<Pressable background="transparent">` instead. */
-export type PressableOpacityProps = Omit<PressableProps, 'background' | 'borderColor' | 'borderRadius' | 'borderWidth' | 'transparentWhileInactive'>;
+export type PressableOpacityProps = Omit<
+  PressableProps,
+  'background' | 'borderColor' | 'borderRadius' | 'borderWidth' | 'transparentWhileInactive'
+>;
 /** @deprecated This component will be removed in a future version. Use `<Pressable background="transparent">` instead. */
-export declare const PressableOpacity: ({ children, ...props }: PressableOpacityProps) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=PressableOpacity.d.ts.map
+export declare const PressableOpacity: ({
+  children,
+  ...props
+}: PressableOpacityProps) => import('react/jsx-runtime').JSX.Element;
+//# sourceMappingURL=PressableOpacity.d.ts.map

package/dts/system/StatusBar.d.ts

@@ -2,13 +2,26 @@ import React from 'react';
 import type { StatusBarProps as RNStatusBarProps } from 'react-native';
 import type { Theme } from '../core/theme';
 export type StatusBarProps = RNStatusBarProps & {
-    theme?: Theme;
+  theme?: Theme;
 };
 /**
  * If bar-style is 'dark-content' that means app has a light background with dark text and icons.
  * If bar-style is 'light-content' that means app has a dark background with light text and icons.
  */
-export declare const useStatusBarStyle: ({ theme }?: StatusBarProps | undefined) => "light-content" | "dark-content";
+export declare const useStatusBarStyle: ({
+  theme,
+}?: StatusBarProps | undefined) => 'light-content' | 'dark-content';
 export declare const useStatusBarUpdater: ({ theme }?: StatusBarProps | undefined) => () => void;
-export declare const StatusBar: React.MemoExoticComponent<({ animated, backgroundColor, barStyle, hidden, networkActivityIndicatorVisible, theme, showHideTransition, translucent, }: StatusBarProps) => import("react/jsx-runtime").JSX.Element>;
-//# sourceMappingURL=StatusBar.d.ts.map
+export declare const StatusBar: React.MemoExoticComponent<
+  ({
+    animated,
+    backgroundColor,
+    barStyle,
+    hidden,
+    networkActivityIndicatorVisible,
+    theme,
+    showHideTransition,
+    translucent,
+  }: StatusBarProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=StatusBar.d.ts.map

package/dts/system/ThemeProvider.d.ts

@@ -4,14 +4,20 @@ import type { Theme, ThemeConfig } from '../core/theme';
 export type ThemeContextValue = Theme;
 export declare const ThemeContext: React.Context<Theme | undefined>;
 export type ThemeProviderProps = {
-    theme: ThemeConfig;
-    activeColorScheme: ColorScheme;
-    children?: React.ReactNode;
+  theme: ThemeConfig;
+  activeColorScheme: ColorScheme;
+  children?: React.ReactNode;
 };
-export declare const ThemeProvider: ({ theme, activeColorScheme, children }: ThemeProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ThemeProvider: ({
+  theme,
+  activeColorScheme,
+  children,
+}: ThemeProviderProps) => import('react/jsx-runtime').JSX.Element;
 export type InvertedThemeProviderProps = {
-    children?: React.ReactNode;
+  children?: React.ReactNode;
 };
 /** Falls back to the currently active colorScheme if the inverse colors are not defined in the theme.  */
-export declare const InvertedThemeProvider: ({ children }: InvertedThemeProviderProps) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=ThemeProvider.d.ts.map
+export declare const InvertedThemeProvider: ({
+  children,
+}: InvertedThemeProviderProps) => import('react/jsx-runtime').JSX.Element;
+//# sourceMappingURL=ThemeProvider.d.ts.map

package/dts/system/__figma__/AndroidNavigationBar.figma.d.ts

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=AndroidNavigationBar.figma.d.ts.map
+//# sourceMappingURL=AndroidNavigationBar.figma.d.ts.map

package/dts/system/index.d.ts

@@ -5,4 +5,4 @@ export * from './Pressable';
 export * from './PressableOpacity';
 export * from './StatusBar';
 export * from './ThemeProvider';
-//# sourceMappingURL=index.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/dts/tabs/SegmentedTab.d.ts

@@ -1,8 +1,17 @@
 import React from 'react';
-import { type GestureResponderEvent, type PressableProps, type StyleProp, type View, type ViewStyle } from 'react-native';
+import {
+  type GestureResponderEvent,
+  type PressableProps,
+  type StyleProp,
+  type View,
+  type ViewStyle,
+} from 'react-native';
 import type { ThemeVars } from '@coinbase/cds-common/core/theme';
 import { type TabValue } from '@coinbase/cds-common/tabs/useTabs';
-export type SegmentedTabProps<T extends string = string> = {
+import { type TextBaseProps } from '../typography/Text';
+export type SegmentedTabProps<T extends string = string> = TabValue<T> &
+  Pick<TextBaseProps, 'font' | 'fontFamily' | 'fontSize' | 'fontWeight' | 'lineHeight'> &
+  Omit<PressableProps, 'children' | 'disabled' | 'onPress' | 'style'> & {
     /**
      * Text color when the SegmentedTab is active.
      * @default negativeForeground
@@ -16,10 +25,12 @@ export type SegmentedTabProps<T extends string = string> = {
     /** Callback that is fired when the SegmentedTab is pressed. */
     onPress?: (id: string, event: GestureResponderEvent) => void;
     style?: StyleProp<ViewStyle>;
-} & TabValue<T> & Omit<PressableProps, 'children' | 'disabled' | 'onPress' | 'style'>;
-type SegmentedTabFC = <T extends string = string>(props: SegmentedTabProps<T> & {
+  };
+type SegmentedTabFC = <T extends string = string>(
+  props: SegmentedTabProps<T> & {
     ref?: React.ForwardedRef<View>;
-}) => React.ReactElement;
+  },
+) => React.ReactElement;
 export declare const SegmentedTab: SegmentedTabFC;
 export {};
-//# sourceMappingURL=SegmentedTab.d.ts.map
+//# sourceMappingURL=SegmentedTab.d.ts.map

package/dts/tabs/SegmentedTab.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedTab.d.ts","sourceRoot":"","sources":["../../src/tabs/SegmentedTab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,KAAK,qBAAqB,EAE1B,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAEjE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AASlE,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI;IACzD;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACxB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,GAAG,QAAQ,CAAC,CAAC,CAAC,GACb,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;AAItE,KAAK,cAAc,GAAG,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAC9C,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAA;CAAE,KAC7D,KAAK,CAAC,YAAY,CAAC;AA0FxB,eAAO,MAAM,YAAY,EAA4B,cAAc,CAAC"}
+{"version":3,"file":"SegmentedTab.d.ts","sourceRoot":"","sources":["../../src/tabs/SegmentedTab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,KAAK,qBAAqB,EAE1B,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAEjE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAKlE,OAAO,EAAQ,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAI9D,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,QAAQ,CAAC,CAAC,CAAC,GACpE,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,YAAY,GAAG,UAAU,GAAG,YAAY,GAAG,YAAY,CAAC,GACrF,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,OAAO,CAAC,GAAG;IACpE;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACxB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC;AAIJ,KAAK,cAAc,GAAG,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAC9C,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAA;CAAE,KAC7D,KAAK,CAAC,YAAY,CAAC;AAmGxB,eAAO,MAAM,YAAY,EAA4B,cAAc,CAAC"}

package/dts/tabs/SegmentedTabs.d.ts

@@ -1,10 +1,15 @@
 import React from 'react';
 import type { View } from 'react-native';
 import { type TabsProps } from './Tabs';
-export type SegmentedTabsProps<T extends string = string> = Partial<Pick<TabsProps<T>, 'TabComponent' | 'TabsActiveIndicatorComponent'>> & Omit<TabsProps<T>, 'TabComponent' | 'TabsActiveIndicatorComponent'>;
-type SegmentedTabsFC = <T extends string = string>(props: SegmentedTabsProps<T> & {
+export type SegmentedTabsProps<T extends string = string> = Partial<
+  Pick<TabsProps<T>, 'TabComponent' | 'TabsActiveIndicatorComponent'>
+> &
+  Omit<TabsProps<T>, 'TabComponent' | 'TabsActiveIndicatorComponent'>;
+type SegmentedTabsFC = <T extends string = string>(
+  props: SegmentedTabsProps<T> & {
     ref?: React.ForwardedRef<View>;
-}) => React.ReactElement;
+  },
+) => React.ReactElement;
 export declare const SegmentedTabs: SegmentedTabsFC;
 export {};
-//# sourceMappingURL=SegmentedTabs.d.ts.map
+//# sourceMappingURL=SegmentedTabs.d.ts.map

package/dts/tabs/SegmentedTabsActiveIndicator.d.ts

@@ -1,4 +1,7 @@
 import { type TabsActiveIndicatorProps } from './Tabs';
 export type SegmentedTabsActiveIndicatorProps = TabsActiveIndicatorProps;
-export declare const SegmentedTabsActiveIndicator: ({ borderRadius, ...props }: SegmentedTabsActiveIndicatorProps) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=SegmentedTabsActiveIndicator.d.ts.map
+export declare const SegmentedTabsActiveIndicator: ({
+  borderRadius,
+  ...props
+}: SegmentedTabsActiveIndicatorProps) => import('react/jsx-runtime').JSX.Element;
+//# sourceMappingURL=SegmentedTabsActiveIndicator.d.ts.map

package/dts/tabs/TabIndicator.d.ts

@@ -3,23 +3,27 @@ import type { View } from 'react-native';
 import type { ThemeVars } from '@coinbase/cds-common/core/theme';
 import type { SharedProps } from '@coinbase/cds-common/types';
 export type TabIndicatorProps = SharedProps & {
-    /** The width of the active TabLabel. */
-    width: number;
-    /** The xPosition of the active TabLabel. */
-    x: number;
-    /** This should always match the background color of the parent container
-     * @default: 'bg'
-     */
-    background?: ThemeVars.Color;
+  /** The width of the active TabLabel. */
+  width: number;
+  /** The xPosition of the active TabLabel. */
+  x: number;
+  /** This should always match the background color of the parent container
+   * @default: 'bg'
+   */
+  background?: ThemeVars.Color;
 };
-export declare const TabIndicator: React.MemoExoticComponent<React.ForwardRefExoticComponent<SharedProps & {
-    /** The width of the active TabLabel. */
-    width: number;
-    /** The xPosition of the active TabLabel. */
-    x: number;
-    /** This should always match the background color of the parent container
-     * @default: 'bg'
-     */
-    background?: ThemeVars.Color;
-} & React.RefAttributes<View>>>;
-//# sourceMappingURL=TabIndicator.d.ts.map
+export declare const TabIndicator: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    SharedProps & {
+      /** The width of the active TabLabel. */
+      width: number;
+      /** The xPosition of the active TabLabel. */
+      x: number;
+      /** This should always match the background color of the parent container
+       * @default: 'bg'
+       */
+      background?: ThemeVars.Color;
+    } & React.RefAttributes<View>
+  >
+>;
+//# sourceMappingURL=TabIndicator.d.ts.map

package/dts/tabs/TabLabel.d.ts

@@ -2,14 +2,23 @@ import React from 'react';
 import type { SharedProps } from '@coinbase/cds-common/types';
 import type { TextProps } from '../typography/Text';
 import type { TabProps } from './TabNavigation';
-export type TabLabelBaseProps = SharedProps & Pick<TabProps, 'variant' | 'count' | 'accessibilityLabel' | 'max' | 'Component'> & {
+export type TabLabelBaseProps = SharedProps &
+  Pick<TabProps, 'variant' | 'count' | 'accessibilityLabel' | 'max' | 'Component'> & {
     /** Identify the active tab */
     active?: boolean;
     /** Display title to render as the TabLabel. */
     children: React.ReactNode;
     /** Callback to fire when pressed */
     onPress?: () => void;
-};
+  };
 export type TabLabelProps = TabLabelBaseProps & TextProps;
-export declare const TabLabel: React.MemoExoticComponent<({ active, variant, count, max, ...props }: TabLabelProps) => import("react/jsx-runtime").JSX.Element>;
-//# sourceMappingURL=TabLabel.d.ts.map
+export declare const TabLabel: React.MemoExoticComponent<
+  ({
+    active,
+    variant,
+    count,
+    max,
+    ...props
+  }: TabLabelProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=TabLabel.d.ts.map

package/dts/tabs/TabNavigation.d.ts

@@ -4,7 +4,8 @@ import type { ThemeVars } from '@coinbase/cds-common/core/theme';
 import type { SharedAccessibilityProps, SharedProps } from '@coinbase/cds-common/types';
 import type { DotCountBaseProps } from '../dots';
 import { type BoxBaseProps } from '../layout/Box';
-export type TabProps<T extends string | undefined = string> = SharedProps & Partial<Pick<DotCountBaseProps, 'max' | 'count'>> & {
+export type TabProps<T extends string | undefined = string> = SharedProps &
+  Partial<Pick<DotCountBaseProps, 'max' | 'count'>> & {
     /** The id should be a meaningful and useful identifier like "watchlist" or "forSale" */
     id: T;
     /** Define a label for this Tab */
@@ -21,17 +22,19 @@ export type TabProps<T extends string | undefined = string> = SharedProps & Part
     onPress?: (id: T) => void;
     /** Render a custom Component for the Tab */
     Component?: (props: CustomTabProps) => React.ReactNode;
-};
+  };
 export type CustomTabProps = Pick<TabProps, 'id'> & {
-    /**
-     * @default false
-     * When true, used to surface an active state for the currently selected tab
-     */
-    active?: boolean;
-    /** Define a label for this Tab */
-    label?: React.ReactNode;
+  /**
+   * @default false
+   * When true, used to surface an active state for the currently selected tab
+   */
+  active?: boolean;
+  /** Define a label for this Tab */
+  label?: React.ReactNode;
 };
-export type TabNavigationBaseProps<T extends string | undefined = string> = BoxBaseProps & Pick<SharedAccessibilityProps, 'accessibilityLabel' | 'accessibilityLabelledBy'> & Pick<TabProps, 'variant' | 'Component'> & {
+export type TabNavigationBaseProps<T extends string | undefined = string> = BoxBaseProps &
+  Pick<SharedAccessibilityProps, 'accessibilityLabel' | 'accessibilityLabelledBy'> &
+  Pick<TabProps, 'variant' | 'Component'> & {
     /** The active tabId
      *  @default tabs[0].id
      */
@@ -70,11 +73,13 @@ export type TabNavigationBaseProps<T extends string | undefined = string> = BoxB
     paddleStyle?: React.CSSProperties;
     /** @danger This should only be used for accessibility purposes, eg: aria-controls https://accessibilityresources.org/aria-controls */
     id?: string;
-};
+  };
 export type TabNavigationProps<T extends string | undefined = string> = TabNavigationBaseProps<T>;
-type TabNavigationFC = <T extends string | undefined = string>(props: TabNavigationProps<T> & {
+type TabNavigationFC = <T extends string | undefined = string>(
+  props: TabNavigationProps<T> & {
     ref?: React.ForwardedRef<View>;
-}) => React.ReactElement;
+  },
+) => React.ReactElement;
 export declare const TabNavigation: TabNavigationFC;
 export {};
-//# sourceMappingURL=TabNavigation.d.ts.map
+//# sourceMappingURL=TabNavigation.d.ts.map

package/dts/tabs/Tabs.d.ts

@@ -5,32 +5,39 @@ import { type TabsOptions, type TabValue } from '@coinbase/cds-common/tabs/useTa
 import { type Rect } from '@coinbase/cds-common/types/Rect';
 import type { BoxProps, HStackProps } from '../layout';
 export declare const tabsSpringConfig: {
-    readonly mass: 0.15;
-    readonly stiffness: 160;
-    readonly damping: 10;
-    readonly overshootClamping: true;
+  readonly mass: 0.15;
+  readonly stiffness: 160;
+  readonly damping: 10;
+  readonly overshootClamping: true;
 };
 export type TabsActiveIndicatorProps = {
-    activeTabRect: Rect;
+  activeTabRect: Rect;
 } & BoxProps;
 export type TabComponent<T extends string = string> = React.FC<TabValue<T>>;
 export type TabsActiveIndicatorComponent = React.FC<TabsActiveIndicatorProps>;
 export type TabsProps<T extends string = string> = {
-    /** The array of tabs data. Each tab may optionally define a custom Component to render. */
-    tabs: (TabValue<T> & {
-        Component?: TabComponent<T>;
-    })[];
-    /** The default Component to render each tab. */
-    TabComponent: TabComponent<T>;
-    /** The default Component to render the tabs active indicator. */
-    TabsActiveIndicatorComponent: TabsActiveIndicatorComponent;
-    /** Background color passed to the TabsActiveIndicatorComponent. */
-    activeBackground?: ThemeVars.Color;
-} & Omit<TabsOptions<T>, 'tabs'> & Omit<HStackProps, 'onChange'>;
-type TabsFC = <T extends string = string>(props: TabsProps<T> & {
+  /** The array of tabs data. Each tab may optionally define a custom Component to render. */
+  tabs: (TabValue<T> & {
+    Component?: TabComponent<T>;
+  })[];
+  /** The default Component to render each tab. */
+  TabComponent: TabComponent<T>;
+  /** The default Component to render the tabs active indicator. */
+  TabsActiveIndicatorComponent: TabsActiveIndicatorComponent;
+  /** Background color passed to the TabsActiveIndicatorComponent. */
+  activeBackground?: ThemeVars.Color;
+} & Omit<TabsOptions<T>, 'tabs'> &
+  Omit<HStackProps, 'onChange'>;
+type TabsFC = <T extends string = string>(
+  props: TabsProps<T> & {
     ref?: React.ForwardedRef<View>;
-}) => React.ReactElement;
+  },
+) => React.ReactElement;
 export declare const Tabs: TabsFC;
-export declare const TabsActiveIndicator: ({ activeTabRect, position, ...props }: TabsActiveIndicatorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TabsActiveIndicator: ({
+  activeTabRect,
+  position,
+  ...props
+}: TabsActiveIndicatorProps) => import('react/jsx-runtime').JSX.Element;
 export {};
-//# sourceMappingURL=Tabs.d.ts.map
+//# sourceMappingURL=Tabs.d.ts.map

package/dts/tabs/__figma__/SegmentedTabs.figma.d.ts

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=SegmentedTabs.figma.d.ts.map
+//# sourceMappingURL=SegmentedTabs.figma.d.ts.map

package/dts/tabs/__figma__/TabNavigation.figma.d.ts

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=TabNavigation.figma.d.ts.map
+//# sourceMappingURL=TabNavigation.figma.d.ts.map

package/dts/tabs/hooks/useDotAnimation.d.ts

@@ -1,8 +1,8 @@
 import { Animated } from 'react-native';
 export declare const useDotAnimation: () => {
-    opacity: Animated.Value;
-    width: Animated.Value;
-    animateIn: (count: number) => void;
-    animateOut: (count: number) => void;
+  opacity: Animated.Value;
+  width: Animated.Value;
+  animateIn: (count: number) => void;
+  animateOut: (count: number) => void;
 };
-//# sourceMappingURL=useDotAnimation.d.ts.map
+//# sourceMappingURL=useDotAnimation.d.ts.map