@coinbase/cds-web 8.13.1 → 8.13.5

package/dts/dates/DatePicker.d.ts

@@ -4,105 +4,152 @@ import { type PopoverProps } from '../overlays/popover/PopoverProps';
 import { type CalendarProps } from './Calendar';
 import { type DateInputProps } from './DateInput';
 export type DatePickerProps = {
-    /** Control the date value of the DatePicker. */
-    date: Date | null;
-    /** Callback function fired when the date changes, e.g. when a valid date is selected or unselected. */
-    onChangeDate: (selectedDate: Date | null) => void;
-    /** Control the error value of the DatePicker. */
-    error: DateInputValidationError | null;
-    /** Callback function fired when validation finds an error, e.g. required input fields and impossible or disabled dates. Will always be called after `onChangeDate`. */
-    onErrorDate: (error: DateInputValidationError | null) => void;
-    /** Disables user interaction. */
-    disabled?: boolean;
-    /** Array of disabled dates, and date tuples for date ranges. Make sure to set `disabledDateError` as well. A number is created for every individual date within a tuple range, so do not abuse this with massive ranges. */
-    disabledDates?: (Date | [Date, Date])[];
-    /** Minimum date allowed to be selected, inclusive. Dates before the `minDate` are disabled. All navigation to months before the `minDate` is disabled. */
-    minDate?: Date;
-    /** Maximum date allowed to be selected, inclusive. Dates after the `maxDate` are disabled. All navigation to months after the `maxDate` is disabled. */
-    maxDate?: Date;
-    /**
-     * Error text to display when a disabled date is selected with the DateInput, including dates before the `minDate` or after the `maxDate`. Also used as the tooltip content shown when hovering or focusing a disabled date on the Calendar.
-     * @default 'Date unavailable'
-     */
-    disabledDateError?: string;
-    /** Control the default open state of the Calendar popover. */
-    defaultOpen?: boolean;
-    /** Callback function fired when the DateInput text value changes. Prefer to use `onChangeDate` instead. Will always be called before `onChangeDate`. This prop should only be used for edge cases, such as custom error handling.  */
-    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    /** Callback function fired when the Calendar popover is opened.  */
-    onOpen?: () => void;
-    /** Callback function fired when the Calendar popover is closed. Will always be called after `onCancel`, `onConfirm`, and `onChangeDate`.  */
-    onClose?: () => void;
-    /** Callback function fired when the user selects a date using the Calendar popover. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
-    onConfirm?: () => void;
-    /** Callback function fired when the user closes the Calendar popover without selecting a date. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
-    onCancel?: () => void;
-    /**
-     * If `true`, the focus trap will restore focus to the previously focused element when it unmounts.
-     *
-     * WARNING: If you disable this, you need to ensure that focus is restored properly so it doesn't end up on the body
-     * @default true
-     */
-    restoreFocusOnUnmount?: boolean;
-    /**
-     * Accessibility label describing the calendar IconButton, which opens the calendar when pressed.
-     * @default 'Open calendar' / 'Close calendar'
-     */
-    calendarIconButtonAccessibilityLabel?: string;
-    calendarStyle?: React.CSSProperties;
-    calendarClassName?: string;
-    dateInputStyle?: React.CSSProperties;
-    dateInputClassName?: string;
-} & Omit<DateInputProps, 'date' | 'separator' | 'onChangeDate' | 'disabledDates' | 'minDate' | 'maxDate' | 'disabledDateError' | 'className' | 'style'> & Pick<CalendarProps, 'seedDate' | 'highlightedDates' | 'nextArrowAccessibilityLabel' | 'previousArrowAccessibilityLabel' | 'className' | 'style'> & Pick<PopoverProps, 'showOverlay'>;
-export declare const DatePicker: React.MemoExoticComponent<React.ForwardRefExoticComponent<{
-    /** Control the date value of the DatePicker. */
-    date: Date | null;
-    /** Callback function fired when the date changes, e.g. when a valid date is selected or unselected. */
-    onChangeDate: (selectedDate: Date | null) => void;
-    /** Control the error value of the DatePicker. */
-    error: DateInputValidationError | null;
-    /** Callback function fired when validation finds an error, e.g. required input fields and impossible or disabled dates. Will always be called after `onChangeDate`. */
-    onErrorDate: (error: DateInputValidationError | null) => void;
-    /** Disables user interaction. */
-    disabled?: boolean;
-    /** Array of disabled dates, and date tuples for date ranges. Make sure to set `disabledDateError` as well. A number is created for every individual date within a tuple range, so do not abuse this with massive ranges. */
-    disabledDates?: (Date | [Date, Date])[];
-    /** Minimum date allowed to be selected, inclusive. Dates before the `minDate` are disabled. All navigation to months before the `minDate` is disabled. */
-    minDate?: Date;
-    /** Maximum date allowed to be selected, inclusive. Dates after the `maxDate` are disabled. All navigation to months after the `maxDate` is disabled. */
-    maxDate?: Date;
-    /**
-     * Error text to display when a disabled date is selected with the DateInput, including dates before the `minDate` or after the `maxDate`. Also used as the tooltip content shown when hovering or focusing a disabled date on the Calendar.
-     * @default 'Date unavailable'
-     */
-    disabledDateError?: string;
-    /** Control the default open state of the Calendar popover. */
-    defaultOpen?: boolean;
-    /** Callback function fired when the DateInput text value changes. Prefer to use `onChangeDate` instead. Will always be called before `onChangeDate`. This prop should only be used for edge cases, such as custom error handling.  */
-    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    /** Callback function fired when the Calendar popover is opened.  */
-    onOpen?: () => void;
-    /** Callback function fired when the Calendar popover is closed. Will always be called after `onCancel`, `onConfirm`, and `onChangeDate`.  */
-    onClose?: () => void;
-    /** Callback function fired when the user selects a date using the Calendar popover. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
-    onConfirm?: () => void;
-    /** Callback function fired when the user closes the Calendar popover without selecting a date. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
-    onCancel?: () => void;
-    /**
-     * If `true`, the focus trap will restore focus to the previously focused element when it unmounts.
-     *
-     * WARNING: If you disable this, you need to ensure that focus is restored properly so it doesn't end up on the body
-     * @default true
-     */
-    restoreFocusOnUnmount?: boolean;
-    /**
-     * Accessibility label describing the calendar IconButton, which opens the calendar when pressed.
-     * @default 'Open calendar' / 'Close calendar'
-     */
-    calendarIconButtonAccessibilityLabel?: string;
-    calendarStyle?: React.CSSProperties;
-    calendarClassName?: string;
-    dateInputStyle?: React.CSSProperties;
-    dateInputClassName?: string;
-} & Omit<DateInputProps, "style" | "className" | "separator" | "date" | "disabledDates" | "minDate" | "maxDate" | "disabledDateError" | "onChangeDate"> & Pick<CalendarProps, "style" | "className" | "previousArrowAccessibilityLabel" | "nextArrowAccessibilityLabel" | "seedDate" | "highlightedDates"> & Pick<PopoverProps, "showOverlay"> & React.RefAttributes<HTMLDivElement>>>;
-//# sourceMappingURL=DatePicker.d.ts.map
+  /** Control the date value of the DatePicker. */
+  date: Date | null;
+  /** Callback function fired when the date changes, e.g. when a valid date is selected or unselected. */
+  onChangeDate: (selectedDate: Date | null) => void;
+  /** Control the error value of the DatePicker. */
+  error: DateInputValidationError | null;
+  /** Callback function fired when validation finds an error, e.g. required input fields and impossible or disabled dates. Will always be called after `onChangeDate`. */
+  onErrorDate: (error: DateInputValidationError | null) => void;
+  /** Disables user interaction. */
+  disabled?: boolean;
+  /** Array of disabled dates, and date tuples for date ranges. Make sure to set `disabledDateError` as well. A number is created for every individual date within a tuple range, so do not abuse this with massive ranges. */
+  disabledDates?: (Date | [Date, Date])[];
+  /** Minimum date allowed to be selected, inclusive. Dates before the `minDate` are disabled. All navigation to months before the `minDate` is disabled. */
+  minDate?: Date;
+  /** Maximum date allowed to be selected, inclusive. Dates after the `maxDate` are disabled. All navigation to months after the `maxDate` is disabled. */
+  maxDate?: Date;
+  /**
+   * Error text to display when a disabled date is selected with the DateInput, including dates before the `minDate` or after the `maxDate`. Also used as the tooltip content shown when hovering or focusing a disabled date on the Calendar.
+   * @default 'Date unavailable'
+   */
+  disabledDateError?: string;
+  /** Control the default open state of the Calendar popover. */
+  defaultOpen?: boolean;
+  /** Callback function fired when the DateInput text value changes. Prefer to use `onChangeDate` instead. Will always be called before `onChangeDate`. This prop should only be used for edge cases, such as custom error handling.  */
+  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+  /** Callback function fired when the Calendar popover is opened.  */
+  onOpen?: () => void;
+  /** Callback function fired when the Calendar popover is closed. Will always be called after `onCancel`, `onConfirm`, and `onChangeDate`.  */
+  onClose?: () => void;
+  /** Callback function fired when the user selects a date using the Calendar popover. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
+  onConfirm?: () => void;
+  /** Callback function fired when the user closes the Calendar popover without selecting a date. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
+  onCancel?: () => void;
+  /**
+   * If `true`, the focus trap will restore focus to the previously focused element when it unmounts.
+   *
+   * WARNING: If you disable this, you need to ensure that focus is restored properly so it doesn't end up on the body
+   * @default true
+   */
+  restoreFocusOnUnmount?: boolean;
+  /**
+   * Accessibility label describing the calendar IconButton, which opens the calendar when pressed.
+   * @default 'Open calendar' / 'Close calendar'
+   */
+  calendarIconButtonAccessibilityLabel?: string;
+  calendarStyle?: React.CSSProperties;
+  calendarClassName?: string;
+  dateInputStyle?: React.CSSProperties;
+  dateInputClassName?: string;
+} & Omit<
+  DateInputProps,
+  | 'date'
+  | 'separator'
+  | 'onChangeDate'
+  | 'disabledDates'
+  | 'minDate'
+  | 'maxDate'
+  | 'disabledDateError'
+  | 'className'
+  | 'style'
+> &
+  Pick<
+    CalendarProps,
+    | 'seedDate'
+    | 'highlightedDates'
+    | 'nextArrowAccessibilityLabel'
+    | 'previousArrowAccessibilityLabel'
+    | 'className'
+    | 'style'
+  > &
+  Pick<PopoverProps, 'showOverlay'>;
+export declare const DatePicker: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    {
+      /** Control the date value of the DatePicker. */
+      date: Date | null;
+      /** Callback function fired when the date changes, e.g. when a valid date is selected or unselected. */
+      onChangeDate: (selectedDate: Date | null) => void;
+      /** Control the error value of the DatePicker. */
+      error: DateInputValidationError | null;
+      /** Callback function fired when validation finds an error, e.g. required input fields and impossible or disabled dates. Will always be called after `onChangeDate`. */
+      onErrorDate: (error: DateInputValidationError | null) => void;
+      /** Disables user interaction. */
+      disabled?: boolean;
+      /** Array of disabled dates, and date tuples for date ranges. Make sure to set `disabledDateError` as well. A number is created for every individual date within a tuple range, so do not abuse this with massive ranges. */
+      disabledDates?: (Date | [Date, Date])[];
+      /** Minimum date allowed to be selected, inclusive. Dates before the `minDate` are disabled. All navigation to months before the `minDate` is disabled. */
+      minDate?: Date;
+      /** Maximum date allowed to be selected, inclusive. Dates after the `maxDate` are disabled. All navigation to months after the `maxDate` is disabled. */
+      maxDate?: Date;
+      /**
+       * Error text to display when a disabled date is selected with the DateInput, including dates before the `minDate` or after the `maxDate`. Also used as the tooltip content shown when hovering or focusing a disabled date on the Calendar.
+       * @default 'Date unavailable'
+       */
+      disabledDateError?: string;
+      /** Control the default open state of the Calendar popover. */
+      defaultOpen?: boolean;
+      /** Callback function fired when the DateInput text value changes. Prefer to use `onChangeDate` instead. Will always be called before `onChangeDate`. This prop should only be used for edge cases, such as custom error handling.  */
+      onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+      /** Callback function fired when the Calendar popover is opened.  */
+      onOpen?: () => void;
+      /** Callback function fired when the Calendar popover is closed. Will always be called after `onCancel`, `onConfirm`, and `onChangeDate`.  */
+      onClose?: () => void;
+      /** Callback function fired when the user selects a date using the Calendar popover. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
+      onConfirm?: () => void;
+      /** Callback function fired when the user closes the Calendar popover without selecting a date. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
+      onCancel?: () => void;
+      /**
+       * If `true`, the focus trap will restore focus to the previously focused element when it unmounts.
+       *
+       * WARNING: If you disable this, you need to ensure that focus is restored properly so it doesn't end up on the body
+       * @default true
+       */
+      restoreFocusOnUnmount?: boolean;
+      /**
+       * Accessibility label describing the calendar IconButton, which opens the calendar when pressed.
+       * @default 'Open calendar' / 'Close calendar'
+       */
+      calendarIconButtonAccessibilityLabel?: string;
+      calendarStyle?: React.CSSProperties;
+      calendarClassName?: string;
+      dateInputStyle?: React.CSSProperties;
+      dateInputClassName?: string;
+    } & Omit<
+      DateInputProps,
+      | 'style'
+      | 'className'
+      | 'separator'
+      | 'date'
+      | 'disabledDates'
+      | 'minDate'
+      | 'maxDate'
+      | 'disabledDateError'
+      | 'onChangeDate'
+    > &
+      Pick<
+        CalendarProps,
+        | 'style'
+        | 'className'
+        | 'previousArrowAccessibilityLabel'
+        | 'nextArrowAccessibilityLabel'
+        | 'seedDate'
+        | 'highlightedDates'
+      > &
+      Pick<PopoverProps, 'showOverlay'> &
+      React.RefAttributes<HTMLDivElement>
+  >
+>;
+//# sourceMappingURL=DatePicker.d.ts.map

package/dts/dates/__figma__/DatePicker.figma.d.ts

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

package/dts/defaultFontStyles.d.ts

@@ -1,2 +1,2 @@
 import './styles/defaultFont';
-//# sourceMappingURL=defaultFontStyles.d.ts.map
+//# sourceMappingURL=defaultFontStyles.d.ts.map

package/dts/dots/DotCount.d.ts

@@ -1,6 +1,16 @@
 import React from 'react';
-import type { DotCountPinPlacement, DotCountVariants, DotOverlap, SharedAccessibilityProps, SharedProps } from '@coinbase/cds-common/types';
-export type DotCountBaseProps = SharedProps & Pick<SharedAccessibilityProps, 'accessibilityLabel' | 'accessibilityLabelledBy' | 'accessibilityHint'> & {
+import type {
+  DotCountPinPlacement,
+  DotCountVariants,
+  DotOverlap,
+  SharedAccessibilityProps,
+  SharedProps,
+} from '@coinbase/cds-common/types';
+export type DotCountBaseProps = SharedProps &
+  Pick<
+    SharedAccessibilityProps,
+    'accessibilityLabel' | 'accessibilityLabelledBy' | 'accessibilityHint'
+  > & {
     /**
      * The number value to be shown in the dot. If count is <= 0, dot will not show up.
      *  */
@@ -21,50 +31,66 @@ export type DotCountBaseProps = SharedProps & Pick<SharedAccessibilityProps, 'ac
     children?: React.ReactNode;
     /** Indicates what shape Dot is overlapping */
     overlap?: DotOverlap;
-};
+  };
 export type DotCountProps = DotCountBaseProps & {
+  /**
+   * Custom class name for the root element.
+   */
+  className?: string;
+  /**
+   * Custom styles for the root element.
+   */
+  style?: React.CSSProperties;
+  /**
+   * Custom class names for the component.
+   */
+  classNames?: {
     /**
      * Custom class name for the root element.
      */
-    className?: string;
+    root?: string;
+    /**
+     * Custom class name for the container element.
+     */
+    container?: string;
+    /**
+     * Custom class name for the text element.
+     */
+    text?: string;
+  };
+  /**
+   * Custom styles for the component.
+   */
+  styles?: {
     /**
      * Custom styles for the root element.
      */
-    style?: React.CSSProperties;
+    root?: React.CSSProperties;
     /**
-     * Custom class names for the component.
+     * Custom styles for the container element.
      */
-    classNames?: {
-        /**
-         * Custom class name for the root element.
-         */
-        root?: string;
-        /**
-         * Custom class name for the container element.
-         */
-        container?: string;
-        /**
-         * Custom class name for the text element.
-         */
-        text?: string;
-    };
+    container?: React.CSSProperties;
     /**
-     * Custom styles for the component.
+     * Custom styles for the text element.
      */
-    styles?: {
-        /**
-         * Custom styles for the root element.
-         */
-        root?: React.CSSProperties;
-        /**
-         * Custom styles for the container element.
-         */
-        container?: React.CSSProperties;
-        /**
-         * Custom styles for the text element.
-         */
-        text?: React.CSSProperties;
-    };
+    text?: React.CSSProperties;
+  };
 };
-export declare const DotCount: React.MemoExoticComponent<({ children, pin, variant, count, max, testID, accessibilityLabel, overlap, className, classNames, style, styles, ...props }: DotCountProps) => import("react/jsx-runtime").JSX.Element>;
-//# sourceMappingURL=DotCount.d.ts.map
+export declare const DotCount: React.MemoExoticComponent<
+  ({
+    children,
+    pin,
+    variant,
+    count,
+    max,
+    testID,
+    accessibilityLabel,
+    overlap,
+    className,
+    classNames,
+    style,
+    styles,
+    ...props
+  }: DotCountProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=DotCount.d.ts.map

package/dts/dots/DotStatusColor.d.ts

@@ -1,6 +1,17 @@
 import React from 'react';
-import type { DotOverlap, DotSize, DotVariant, PinPlacement, SharedAccessibilityProps, SharedProps } from '@coinbase/cds-common/types';
-export type DotStatusColorBaseProps = SharedProps & Pick<SharedAccessibilityProps, 'accessibilityLabel' | 'accessibilityLabelledBy' | 'accessibilityHint'> & {
+import type {
+  DotOverlap,
+  DotSize,
+  DotVariant,
+  PinPlacement,
+  SharedAccessibilityProps,
+  SharedProps,
+} from '@coinbase/cds-common/types';
+export type DotStatusColorBaseProps = SharedProps &
+  Pick<
+    SharedAccessibilityProps,
+    'accessibilityLabel' | 'accessibilityLabelledBy' | 'accessibilityHint'
+  > & {
     /** Position of dot relative to its parent */
     pin?: PinPlacement;
     /** Background color of dot */
@@ -11,7 +22,18 @@ export type DotStatusColorBaseProps = SharedProps & Pick<SharedAccessibilityProp
     size?: DotSize;
     /** Indicates what shape Dot is overlapping */
     overlap?: DotOverlap;
-};
+  };
 export type DotStatusColorProps = DotStatusColorBaseProps;
-export declare const DotStatusColor: React.MemoExoticComponent<({ variant, pin, size, overlap, children, testID, accessibilityLabel, ...props }: DotStatusColorProps) => import("react/jsx-runtime").JSX.Element>;
-//# sourceMappingURL=DotStatusColor.d.ts.map
+export declare const DotStatusColor: React.MemoExoticComponent<
+  ({
+    variant,
+    pin,
+    size,
+    overlap,
+    children,
+    testID,
+    accessibilityLabel,
+    ...props
+  }: DotStatusColorProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=DotStatusColor.d.ts.map

package/dts/dots/DotSymbol.d.ts

@@ -1,8 +1,19 @@
 import React from 'react';
-import type { DotOverlap, DotSize, IconName, PinPlacement, SharedAccessibilityProps, SharedProps } from '@coinbase/cds-common/types';
+import type {
+  DotOverlap,
+  DotSize,
+  IconName,
+  PinPlacement,
+  SharedAccessibilityProps,
+  SharedProps,
+} from '@coinbase/cds-common/types';
 import { type IconProps } from '../icons/Icon';
 import { type BoxBaseProps } from '../layout/Box';
-export type DotSymbolBaseProps = SharedProps & Pick<SharedAccessibilityProps, 'accessibilityLabel' | 'accessibilityLabelledBy' | 'accessibilityHint'> & {
+export type DotSymbolBaseProps = SharedProps &
+  Pick<
+    SharedAccessibilityProps,
+    'accessibilityLabel' | 'accessibilityLabelledBy' | 'accessibilityHint'
+  > & {
     /** Icon name to add to the dot. */
     iconName?: IconName;
     /** Size of the dot */
@@ -29,7 +40,30 @@ export type DotSymbolBaseProps = SharedProps & Pick<SharedAccessibilityProps, 'a
     iconClassName?: string;
     imageStyle?: React.CSSProperties;
     imageClassName?: string;
-};
+  };
 export type DotSymbolProps = DotSymbolBaseProps;
-export declare const DotSymbol: React.MemoExoticComponent<({ children, symbol, pin, source, iconName, size, active, testID, overlap, color, background, borderColor, style, className, iconStyle, iconClassName, imageStyle, imageClassName, accessibilityLabel, ...props }: DotSymbolProps) => import("react/jsx-runtime").JSX.Element>;
-//# sourceMappingURL=DotSymbol.d.ts.map
+export declare const DotSymbol: React.MemoExoticComponent<
+  ({
+    children,
+    symbol,
+    pin,
+    source,
+    iconName,
+    size,
+    active,
+    testID,
+    overlap,
+    color,
+    background,
+    borderColor,
+    style,
+    className,
+    iconStyle,
+    iconClassName,
+    imageStyle,
+    imageClassName,
+    accessibilityLabel,
+    ...props
+  }: DotSymbolProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=DotSymbol.d.ts.map

package/dts/dots/__figma__/DotCount.figma.d.ts

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

package/dts/dots/__figma__/DotStatusColor.figma.d.ts

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

package/dts/dots/__figma__/DotSymbol.figma.d.ts

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

package/dts/dots/dotStyles.d.ts

@@ -1,15 +1,20 @@
 import type { DotOverlap } from '@coinbase/cds-common/types/DotBaseProps';
 import type { PinPlacement } from '@coinbase/cds-common/types/Placement';
-export declare const getTransform: (pin?: PinPlacement, overlap?: DotOverlap) => {
-    readonly position?: undefined;
-    readonly transform?: undefined;
-    readonly translateX?: undefined;
-    readonly translateY?: undefined;
-} | {
-    readonly [x: string]: 0 | "absolute" | `translate(${number}%, ${number}%)` | `${number}%`;
-    readonly position: "absolute";
-    readonly transform: `translate(${number}%, ${number}%)`;
-    readonly translateX: `${number}%`;
-    readonly translateY: `${number}%`;
-};
-//# sourceMappingURL=dotStyles.d.ts.map
+export declare const getTransform: (
+  pin?: PinPlacement,
+  overlap?: DotOverlap,
+) =>
+  | {
+      readonly position?: undefined;
+      readonly transform?: undefined;
+      readonly translateX?: undefined;
+      readonly translateY?: undefined;
+    }
+  | {
+      readonly [x: string]: 0 | 'absolute' | `translate(${number}%, ${number}%)` | `${number}%`;
+      readonly position: 'absolute';
+      readonly transform: `translate(${number}%, ${number}%)`;
+      readonly translateX: `${number}%`;
+      readonly translateY: `${number}%`;
+    };
+//# sourceMappingURL=dotStyles.d.ts.map

package/dts/dots/index.d.ts

@@ -1,4 +1,4 @@
 export * from './DotCount';
 export * from './DotStatusColor';
 export * from './DotSymbol';
-//# sourceMappingURL=index.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/dts/dropdown/Dropdown.d.ts

@@ -1,20 +1,40 @@
 import React from 'react';
 import type { DropdownRef } from './DropdownProps';
 export declare const DROPDOWN_MAX_HEIGHT = 300;
-export declare const Dropdown: React.MemoExoticComponent<React.ForwardRefExoticComponent<{
-    enableMobileModal?: boolean;
-    disableCloseOnOptionChange?: boolean;
-    value?: string;
-    width?: React.CSSProperties["width"];
-    minWidth?: React.CSSProperties["minWidth"];
-    maxWidth?: React.CSSProperties["maxWidth"];
-    maxHeight?: React.CSSProperties["maxHeight"];
-    onOpenMenu?: () => void;
-    onCloseMenu?: () => void;
-    onBlur?: () => void;
-    disablePortal?: boolean;
-    onChange?: ((newValue: string) => void) | React.Dispatch<React.SetStateAction<string>>;
-    disabled?: boolean;
-    restoreFocusOnUnmount?: boolean;
-} & Pick<import("../overlays").PopoverProps, "children" | "content" | "block" | "disableTypeFocus" | "respectNegativeTabIndex" | "controlledElementAccessibilityProps" | "showOverlay" | "contentPosition"> & import("@coinbase/cds-common").SharedProps & Pick<import("@coinbase/cds-common").SharedAccessibilityProps, "accessibilityLabel" | "accessibilityLabelledBy" | "accessibilityHint"> & React.RefAttributes<DropdownRef>>>;
-//# sourceMappingURL=Dropdown.d.ts.map
+export declare const Dropdown: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    {
+      enableMobileModal?: boolean;
+      disableCloseOnOptionChange?: boolean;
+      value?: string;
+      width?: React.CSSProperties['width'];
+      minWidth?: React.CSSProperties['minWidth'];
+      maxWidth?: React.CSSProperties['maxWidth'];
+      maxHeight?: React.CSSProperties['maxHeight'];
+      onOpenMenu?: () => void;
+      onCloseMenu?: () => void;
+      onBlur?: () => void;
+      disablePortal?: boolean;
+      onChange?: ((newValue: string) => void) | React.Dispatch<React.SetStateAction<string>>;
+      disabled?: boolean;
+      restoreFocusOnUnmount?: boolean;
+    } & Pick<
+      import('../overlays').PopoverProps,
+      | 'children'
+      | 'content'
+      | 'block'
+      | 'disableTypeFocus'
+      | 'respectNegativeTabIndex'
+      | 'controlledElementAccessibilityProps'
+      | 'showOverlay'
+      | 'contentPosition'
+    > &
+      import('@coinbase/cds-common').SharedProps &
+      Pick<
+        import('@coinbase/cds-common').SharedAccessibilityProps,
+        'accessibilityLabel' | 'accessibilityLabelledBy' | 'accessibilityHint'
+      > &
+      React.RefAttributes<DropdownRef>
+  >
+>;
+//# sourceMappingURL=Dropdown.d.ts.map

package/dts/dropdown/DropdownContent.d.ts

@@ -3,11 +3,16 @@ import type { DimensionValue } from '@coinbase/cds-common/types';
 import type { Placement } from '@popperjs/core';
 import type { DropdownProps } from './DropdownProps';
 export type DropdownContentProps = {
-    height?: DimensionValue;
-    placement?: Placement;
+  height?: DimensionValue;
+  placement?: Placement;
 } & Pick<DropdownProps, 'width' | 'maxHeight' | 'maxWidth' | 'minWidth' | 'children'>;
-export declare const DropdownContent: React.MemoExoticComponent<React.ForwardRefExoticComponent<{
-    height?: DimensionValue;
-    placement?: Placement;
-} & Pick<DropdownProps, "width" | "children" | "minWidth" | "maxWidth" | "maxHeight"> & React.RefAttributes<HTMLDivElement>>>;
-//# sourceMappingURL=DropdownContent.d.ts.map
+export declare const DropdownContent: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    {
+      height?: DimensionValue;
+      placement?: Placement;
+    } & Pick<DropdownProps, 'width' | 'children' | 'minWidth' | 'maxWidth' | 'maxHeight'> &
+      React.RefAttributes<HTMLDivElement>
+  >
+>;
+//# sourceMappingURL=DropdownContent.d.ts.map