@coinbase/cds-web 0.0.0 → 8.13.2

package/CHANGELOG.md

@@ -0,0 +1,45 @@
+# @coinbase/cds-web
+
+> [NPM registry](https://www.npmjs.com/package/@coinbase/cds-web)
+
+All notable changes to this project will be documented in this file.
+
+`@coinbase/cds-web` adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+<!-- template-start -->
+
+## 8.13.2 (10/1/2025 PST)
+
+#### 🐞 Fixes
+
+- Update links for new repo. [[#42](https://github.com/coinbase/cds/pull/42)]
+
+#### 📘 Misc
+
+- Update Code Connect for Button, IconButton, TabbedChips, MultiContentModule.
+
+## 8.13.1 (9/26/2025 PST)
+
+#### 🐞 Fixes
+
+- Update ARIA attributes for TabbedChips. [[#27](https://github.com/coinbase/cds/pull/27)]
+
+## 8.13.0 (9/25/2025 PST)
+
+#### 🚀 Updates
+
+- Added RollingNumber component.
+
+## 8.12.2 (9/25/2025 PST)
+
+#### 🐞 Fixes
+
+- Fix Dropdown heading covered by overlay issue when mobile modal is enabled.
+
+## 8.12.1 ((9/24/2025, 09:42 AM PST))
+
+This is an artificial version bump with no new change.
+
+## 8.12.0 (9/18/2025 PST)
+
+- Prepare for open source release.

package/README.md

@@ -0,0 +1 @@
+# @coinbase/cds-web

package/dts/AccessibilityAnnouncer/AccessibilityAnnouncer.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import type { SharedProps } from '@coinbase/cds-common/types/SharedProps';
+export type AccessibilityAnnouncerProps = Omit<
+  {
+    /** The aria-live attribute
+     * @default polite
+     */
+    politeness?: React.AriaAttributes['aria-live'];
+    /** The message to announce */
+    message?: string | null;
+  },
+  'children'
+> &
+  SharedProps;
+export declare const AccessibilityAnnouncer: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    Omit<
+      {
+        /** The aria-live attribute
+         * @default polite
+         */
+        politeness?: React.AriaAttributes['aria-live'];
+        /** The message to announce */
+        message?: string | null;
+      },
+      'children'
+    > &
+      SharedProps &
+      React.RefAttributes<HTMLParagraphElement>
+  >
+>;
+//# sourceMappingURL=AccessibilityAnnouncer.d.ts.map

package/dts/AccessibilityAnnouncer/AccessibilityAnnouncer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccessibilityAnnouncer.d.ts","sourceRoot":"","sources":["../../src/AccessibilityAnnouncer/AccessibilityAnnouncer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwD,MAAM,OAAO,CAAC;AAE7E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAG1E,MAAM,MAAM,2BAA2B,GAAG,IAAI,CAC5C;IACE;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC;IAC/C,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB,EACD,UAAU,CACX,GACC,WAAW,CAAC;AAoBd,eAAO,MAAM,sBAAsB;IA7B/B;;OAEG;iBACU,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9C,8BAA8B;cACpB,MAAM,GAAG,IAAI;0EAmE1B,CAAC"}

package/dts/accordion/Accordion.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { type AccordionProviderProps } from '@coinbase/cds-common/accordion/AccordionProvider';
+import type { SharedProps } from '@coinbase/cds-common/types';
+export type AccordionBaseProps = SharedProps & AccordionProviderProps;
+export type AccordionProps = AccordionBaseProps & {
+  style?: React.CSSProperties;
+};
+export declare const Accordion: ({
+  activeKey,
+  children,
+  defaultActiveKey,
+  onChange,
+  setActiveKey,
+  testID,
+  style,
+}: AccordionProps) => import('react/jsx-runtime').JSX.Element;
+//# sourceMappingURL=Accordion.d.ts.map

package/dts/accordion/Accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../src/accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,kDAAkD,CAAC;AAC1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAM9D,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG,sBAAsB,CAAC;AAEtE,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAAG;IAAE,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAAE,CAAC;AAElF,eAAO,MAAM,SAAS,GAAI,mFAQvB,cAAc,4CAgBhB,CAAC"}

package/dts/accordion/AccordionHeader.d.ts

@@ -0,0 +1,69 @@
+import React from 'react';
+import type { SharedProps } from '@coinbase/cds-common/types';
+import type { CollapsibleBaseProps } from '../collapsible';
+export type AccordionMediaBaseProps = {
+  media?: React.ReactNode;
+};
+export type AccordionTitleBaseProps = {
+  /**
+   * Title of the accordion item
+   */
+  title: string;
+  /**
+   * Subtitle of the accordion item
+   */
+  subtitle?: string;
+};
+export type AccordionIconBaseProps = Pick<CollapsibleBaseProps, 'collapsed'>;
+export type AccordionHeaderBaseProps = SharedProps &
+  AccordionMediaBaseProps &
+  AccordionTitleBaseProps &
+  AccordionIconBaseProps & {
+    /**
+     * Callback function fired when the accordion item is clicked
+     */
+    onClick?: (key: string) => void;
+    /**
+     * Key of the accordion item.
+     * This should be unique inside the same Accordion
+     * unless you want multiple items to be controlled at the same time.
+     */
+    itemKey: string;
+  };
+type AccordionMediaProps = AccordionMediaBaseProps;
+export declare const AccordionMedia: React.MemoExoticComponent<
+  ({ media }: AccordionMediaProps) => import('react/jsx-runtime').JSX.Element
+>;
+type AccordionTitleProps = AccordionTitleBaseProps;
+export declare const AccordionTitle: React.MemoExoticComponent<
+  ({ title, subtitle }: AccordionTitleProps) => import('react/jsx-runtime').JSX.Element
+>;
+type AccordionIconProps = AccordionIconBaseProps;
+export declare const AccordionIcon: React.MemoExoticComponent<
+  ({ collapsed }: AccordionIconProps) => import('react/jsx-runtime').JSX.Element
+>;
+/**
+ * Renders a Pressable element to use as the header to an AccordionItem.
+ * Composes an Accordion Media, Title, and Icon.
+ */
+export declare const AccordionHeader: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    SharedProps &
+      AccordionMediaBaseProps &
+      AccordionTitleBaseProps &
+      AccordionIconBaseProps & {
+        /**
+         * Callback function fired when the accordion item is clicked
+         */
+        onClick?: (key: string) => void;
+        /**
+         * Key of the accordion item.
+         * This should be unique inside the same Accordion
+         * unless you want multiple items to be controlled at the same time.
+         */
+        itemKey: string;
+      } & React.RefAttributes<HTMLButtonElement>
+  >
+>;
+export {};
+//# sourceMappingURL=AccordionHeader.d.ts.map

package/dts/accordion/AccordionHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionHeader.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAO7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAG9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAS3D,MAAM,MAAM,uBAAuB,GAAG;IAEpC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CAAC,oBAAoB,EAAE,WAAW,CAAC,CAAC;AAE7E,MAAM,MAAM,wBAAwB,GAAG,WAAW,GAChD,uBAAuB,GACvB,uBAAuB,GACvB,sBAAsB,GAAG;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAoBJ,KAAK,mBAAmB,GAAG,uBAAuB,CAAC;AAEnD,eAAO,MAAM,cAAc,wCAAoB,mBAAmB,6CAIhE,CAAC;AAEH,KAAK,mBAAmB,GAAG,uBAAuB,CAAC;AAEnD,eAAO,MAAM,cAAc,kDAA8B,mBAAmB,6CAoB1E,CAAC;AAEH,KAAK,kBAAkB,GAAG,sBAAsB,CAAC;AAEjD,eAAO,MAAM,aAAa,4CAAwB,kBAAkB,6CAMlE,CAAC;AAIH;;;GAGG;AACH,eAAO,MAAM,eAAe;IA9ExB;;OAEG;cACO,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI;IAC/B;;;;OAIG;aACM,MAAM;4CAiHlB,CAAC"}

package/dts/accordion/AccordionItem.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { type AccordionHeaderBaseProps } from './AccordionHeader';
+import { type AccordionPanelBaseProps } from './AccordionPanel';
+export type AccordionItemBaseProps = Omit<AccordionHeaderBaseProps, 'collapsed'> &
+  Pick<AccordionPanelBaseProps, 'maxHeight' | 'children'> & {
+    headerRef?: React.RefObject<HTMLButtonElement>;
+    panelRef?: React.RefObject<HTMLDivElement>;
+    style?: React.CSSProperties;
+  };
+export type AccordionItemProps = AccordionItemBaseProps;
+/**
+ * A component that represents a single item within an Accordion.
+ * It composes together an AccordionHeader and a collapsible AccordionPanel.
+ * Accepts a unique `itemKey` prop to uniquely identify one item from another within the same Accordion.
+ */
+export declare const AccordionItem: React.MemoExoticComponent<
+  ({
+    itemKey,
+    title,
+    subtitle,
+    children,
+    onClick,
+    media,
+    testID,
+    headerRef,
+    panelRef,
+    maxHeight,
+    style,
+  }: AccordionItemProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=AccordionItem.d.ts.map

package/dts/accordion/AccordionItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAMpC,OAAO,EAAmB,KAAK,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AACnF,OAAO,EAAkB,KAAK,uBAAuB,EAAE,MAAM,kBAAkB,CAAC;AAEhF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CAAC,wBAAwB,EAAE,WAAW,CAAC,GAC9E,IAAI,CAAC,uBAAuB,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACxD,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC/C,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC3C,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEJ,MAAM,MAAM,kBAAkB,GAAG,sBAAsB,CAAC;AAExD;;;;GAIG;AACH,eAAO,MAAM,aAAa,qIAarB,kBAAkB,6CA4BtB,CAAC"}

package/dts/accordion/AccordionPanel.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import type { SharedProps } from '@coinbase/cds-common/types';
+import { type CollapsibleBaseProps } from '../collapsible';
+export type AccordionPanelBaseProps = SharedProps &
+  Pick<CollapsibleBaseProps, 'collapsed' | 'children'> & {
+    /**
+     * Key of the accordion item.
+     * This should be unique inside the same Accordion
+     * unless you want multiple items to be controlled at the same time.
+     */
+    itemKey: string;
+    maxHeight?: CollapsibleBaseProps['maxHeight'];
+  };
+export type AccordionPanelProps = AccordionPanelBaseProps;
+/**
+ * Renders a collapsible element to use as the primary content container for an AccordionItem.
+ * Accepts a unique `itemKey` prop to uniquely identify one panel from another.
+ */
+export declare const AccordionPanel: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    SharedProps &
+      Pick<CollapsibleBaseProps, 'children' | 'collapsed'> & {
+        /**
+         * Key of the accordion item.
+         * This should be unique inside the same Accordion
+         * unless you want multiple items to be controlled at the same time.
+         */
+        itemKey: string;
+        maxHeight?: CollapsibleBaseProps['maxHeight'];
+      } & React.RefAttributes<HTMLDivElement>
+  >
+>;
+//# sourceMappingURL=AccordionPanel.d.ts.map

package/dts/accordion/AccordionPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionPanel.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAGhD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAE9D,OAAO,EAAe,KAAK,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAIxE,MAAM,MAAM,uBAAuB,GAAG,WAAW,GAC/C,IAAI,CAAC,oBAAoB,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACrD;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,oBAAoB,CAAC,WAAW,CAAC,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,CAAC;AAE1D;;;GAGG;AACH,eAAO,MAAM,cAAc;IAfvB;;;;OAIG;aACM,MAAM;gBACH,oBAAoB,CAAC,WAAW,CAAC;yCAsChD,CAAC"}

package/dts/accordion/__figma__/Accordion.figma.d.ts

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

package/dts/accordion/__figma__/Accordion.figma.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.figma.d.ts","sourceRoot":"","sources":["../../../src/accordion/__figma__/Accordion.figma.tsx"],"names":[],"mappings":""}

package/dts/accordion/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Accordion';
+export * from './AccordionItem';
+//# sourceMappingURL=index.d.ts.map

package/dts/accordion/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/accordion/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC"}

package/dts/accordion/utils.d.ts

@@ -0,0 +1,3 @@
+export declare const getAccordionHeaderId: (itemKey: string) => string;
+export declare const getAccordionPanelId: (itemKey: string) => string;
+//# sourceMappingURL=utils.d.ts.map

package/dts/accordion/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/accordion/utils.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,oBAAoB,GAAI,SAAS,MAAM,WAAuC,CAAC;AAC5F,eAAO,MAAM,mBAAmB,GAAI,SAAS,MAAM,WAAsC,CAAC"}

package/dts/animation/Lottie.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import type { LottiePlayer } from '@coinbase/cds-common/types/LottiePlayer';
+import type { LottieSource } from '@coinbase/cds-common/types/LottieSource';
+export declare const Lottie: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<
+    Omit<
+      import('../layout').BoxBaseProps,
+      'justifyContent' | 'alignContent' | 'flexDirection' | 'flexWrap'
+    > & {
+      autoplay?: boolean;
+      loop?: boolean;
+      onAnimationFinish?: () => void;
+      resizeMode?: 'cover' | 'contain' | 'center';
+      source: LottieSource<string>;
+      handlers?: import('./types').LottieEventHandlersMap;
+      filterSize?: import('lottie-web').SVGRendererConfig['filterSize'];
+    } & React.RefAttributes<LottiePlayer<LottieSource<any>>>
+  >
+>;
+//# sourceMappingURL=Lottie.d.ts.map

package/dts/animation/Lottie.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Lottie.d.ts","sourceRoot":"","sources":["../../src/animation/Lottie.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAElF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAC5E,OAAO,KAAK,EAAsB,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAsLhG,eAAO,MAAM,MAAM;;;;;;;;0DAyElB,CAAC"}

package/dts/animation/LottieStatusAnimation.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { LottieStatusAnimationProps } from '@coinbase/cds-common/types/LottieStatusAnimationProps';
+export declare const LottieStatusAnimation: React.MemoExoticComponent<
+  ({
+    status,
+    onFinish,
+    testID,
+    ...otherProps
+  }: LottieStatusAnimationProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=LottieStatusAnimation.d.ts.map

package/dts/animation/LottieStatusAnimation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LottieStatusAnimation.d.ts","sourceRoot":"","sources":["../../src/animation/LottieStatusAnimation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8C,MAAM,OAAO,CAAC;AAGnE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,uDAAuD,CAAC;AAQxG,eAAO,MAAM,qBAAqB,0EAC0B,0BAA0B,6CA2BrF,CAAC"}

package/dts/animation/NewAnimatePresence.d.ts

@@ -0,0 +1,7 @@
+import { type AnimatePresenceProps } from 'framer-motion';
+type NewAnimatePresenceProps = {
+  children: React.ReactNode;
+} & Omit<AnimatePresenceProps, 'children'>;
+export declare const NewAnimatePresence: React.FC<NewAnimatePresenceProps>;
+export {};
+//# sourceMappingURL=NewAnimatePresence.d.ts.map

package/dts/animation/NewAnimatePresence.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NewAnimatePresence.d.ts","sourceRoot":"","sources":["../../src/animation/NewAnimatePresence.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAG3E,KAAK,uBAAuB,GAAG;IAC7B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,GAAG,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC;AAE3C,eAAO,MAAM,kBAAkB,EAAsB,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAAC,CAAC"}

package/dts/animation/convertMotionConfig.d.ts

@@ -0,0 +1,33 @@
+import type {
+  MotionBaseSpec as DefaultMotionSpec,
+  MotionCurve,
+} from '@coinbase/cds-common/types/Motion';
+export declare const webCurves: {
+  global: string;
+  enterExpressive: string;
+  enterFunctional: string;
+  exitExpressive: string;
+  exitFunctional: string;
+  linear: string;
+};
+export type MotionBaseSpec = {
+  toValue: number | string;
+  fromValue?: number | string;
+} & Omit<DefaultMotionSpec, 'toValue' | 'fromValue' | 'property'> &
+  Pick<EffectTiming, 'fill'>;
+export type MotionConfigOutput = {
+  easing: string;
+  duration?: number;
+} & EffectTiming &
+  Pick<MotionBaseSpec, 'toValue' | 'fromValue' | 'fill'>;
+export declare function cubicBezier(easing: MotionCurve): string;
+export declare const convertMotionConfig: ({
+  toValue,
+  fromValue,
+  delay,
+  easing,
+  duration,
+  oneOffDuration,
+  fill,
+}: MotionBaseSpec) => MotionConfigOutput;
+//# sourceMappingURL=convertMotionConfig.d.ts.map

package/dts/animation/convertMotionConfig.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"convertMotionConfig.d.ts","sourceRoot":"","sources":["../../src/animation/convertMotionConfig.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,cAAc,IAAI,iBAAiB,EACnC,WAAW,EACZ,MAAM,mCAAmC,CAAC;AAE3C,eAAO,MAAM,SAAS;;;;;;;CAOrB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC7B,GAAG,IAAI,CAAC,iBAAiB,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC,GAC/D,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC;AAE7B,MAAM,MAAM,kBAAkB,GAAG;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,YAAY,GACnF,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,WAAW,GAAG,MAAM,CAAC,CAAC;AAEzD,wBAAgB,WAAW,CAAC,MAAM,EAAE,WAAW,UAE9C;AAED,eAAO,MAAM,mBAAmB,GAAI,wEAYjC,cAAc,KAAG,kBASnB,CAAC"}

package/dts/animation/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Lottie';
+export * from './LottieStatusAnimation';
+//# sourceMappingURL=index.d.ts.map

package/dts/animation/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/animation/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,yBAAyB,CAAC"}

package/dts/animation/types.d.ts

@@ -0,0 +1,55 @@
+import type { LottieSource } from '@coinbase/cds-common/types/LottieSource';
+import type { AnimationEventName, AnimationItem, SVGRendererConfig } from 'lottie-web';
+import type { BoxBaseProps } from '../layout';
+export type LottieEventHandlersMap = {
+  [key in LottieListener['name']]?: LottieListener['handler'];
+};
+export type LottieListener = {
+  name: AnimationEventName;
+  handler: () => void;
+};
+export type LottieBaseProps<T extends string, Source extends LottieSource<T>> = 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 web, you can import the animation from index since this webpack can handle treeshaking, `import { tradeStatus } from @coinbase/cds-lottie-files`
+   */
+  source: Source;
+  handlers?: LottieEventHandlersMap;
+  /**
+   * In order to render drop shadows, the filter size needs to be set to increase the render surface of the element.
+   * You can set the x, y, width and height of filters manually.
+   */
+  filterSize?: SVGRendererConfig['filterSize'];
+};
+export type LottieProps<T extends string, Source extends LottieSource<T>> = LottieBaseProps<
+  T,
+  Source
+>;
+export type LottieAnimationRef = React.MutableRefObject<AnimationItem | undefined>;
+//# sourceMappingURL=types.d.ts.map

package/dts/animation/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/animation/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAC5E,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAEvF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAE9C,MAAM,MAAM,sBAAsB,GAAG;KAClC,GAAG,IAAI,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC;CAC5D,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,EAAE,kBAAkB,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,SAAS,YAAY,CAAC,CAAC,CAAC,IAAI,IAAI,CAClF,YAAY,EACZ,cAAc,GAAG,gBAAgB,GAAG,UAAU,GAAG,eAAe,CACjE,GAAG;IACF;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC5C;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,sBAAsB,CAAC;IAClC;;;OAGG;IACH,UAAU,CAAC,EAAE,iBAAiB,CAAC,YAAY,CAAC,CAAC;CAC9C,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,SAAS,YAAY,CAAC,CAAC,CAAC,IAAI,eAAe,CACzF,CAAC,EACD,MAAM,CACP,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,gBAAgB,CAAC,aAAa,GAAG,SAAS,CAAC,CAAC"}

package/dts/animation/useLottieHandlers.d.ts

@@ -0,0 +1,3 @@
+import type { LottieEventHandlersMap, LottieListener } from './types';
+export declare const useLottieHandlers: (handlers?: LottieEventHandlersMap) => LottieListener[];
+//# sourceMappingURL=useLottieHandlers.d.ts.map

package/dts/animation/useLottieHandlers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLottieHandlers.d.ts","sourceRoot":"","sources":["../../src/animation/useLottieHandlers.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAItE,eAAO,MAAM,iBAAiB,GAAI,WAAW,sBAAsB,qBAUlE,CAAC"}

package/dts/animation/useLottieListeners.d.ts

@@ -0,0 +1,6 @@
+import type { LottieAnimationRef, LottieListener } from './types';
+export declare const useLottieListeners: (
+  animationRef: LottieAnimationRef,
+  listeners?: LottieListener[],
+) => void;
+//# sourceMappingURL=useLottieListeners.d.ts.map

package/dts/animation/useLottieListeners.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLottieListeners.d.ts","sourceRoot":"","sources":["../../src/animation/useLottieListeners.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAElE,eAAO,MAAM,kBAAkB,GAC7B,cAAc,kBAAkB,EAChC,YAAW,cAAc,EAAO,SAqBjC,CAAC"}

package/dts/animation/useLottieLoader.d.ts

@@ -0,0 +1,15 @@
+import type { LottieSource } from '@coinbase/cds-common';
+import type { AnyObject } from '@coinbase/cds-utils';
+import type { LottieAnimationRef, LottieProps } from './types';
+export declare const useLottieLoader: <Marker extends string, Source extends LottieSource<Marker>>({
+  source,
+  loop,
+  autoplay,
+  resizeMode,
+  filterSize,
+}: LottieProps<Marker, Source>) => {
+  containerRef: import('react').RefObject<HTMLDivElement>;
+  animationRef: LottieAnimationRef;
+  loadAnimation: (forcedConfigs?: AnyObject) => void;
+};
+//# sourceMappingURL=useLottieLoader.d.ts.map

package/dts/animation/useLottieLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLottieLoader.d.ts","sourceRoot":"","sources":["../../src/animation/useLottieLoader.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAMrD,OAAO,KAAK,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE/D,eAAO,MAAM,eAAe,GAAI,MAAM,SAAS,MAAM,EAAE,MAAM,SAAS,YAAY,CAAC,MAAM,CAAC,EAAE,qDAMzF,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC;;;oCAmBV,SAAS;CAkE5B,CAAC"}

package/dts/banner/Banner.d.ts

@@ -0,0 +1,63 @@
+import React from 'react';
+import type { ThemeVars } from '@coinbase/cds-common/core/theme';
+import type {
+  BannerStyleVariant,
+  BannerVariant,
+  IconName,
+  SharedProps,
+} from '@coinbase/cds-common/types';
+import { type HStackDefaultElement, type HStackProps } from '../layout';
+import type { ResponsiveProps, StaticStyleProps } from '../styles/styleProps';
+export declare const contentResponsiveConfig: ResponsiveProps<StaticStyleProps>['flexDirection'];
+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;
+};
+export type BannerProps = BannerBaseProps &
+  Omit<HStackProps<HStackDefaultElement>, 'children' | 'title'>;
+export declare const Banner: React.MemoExoticComponent<
+  React.ForwardRefExoticComponent<Omit<BannerProps, 'ref'> & React.RefAttributes<HTMLDivElement>>
+>;
+//# sourceMappingURL=Banner.d.ts.map

package/dts/banner/Banner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/banner/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAGjE,OAAO,KAAK,EACV,kBAAkB,EAClB,aAAa,EACb,QAAQ,EACR,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAOpC,OAAO,EAAe,KAAK,oBAAoB,EAAE,KAAK,WAAW,EAAU,MAAM,WAAW,CAAC;AAC7F,OAAO,KAAK,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAc9E,eAAO,MAAM,uBAAuB,EAAE,eAAe,CAAC,gBAAgB,CAAC,CAAC,eAAe,CAI7E,CAAC;AAiBX,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG;IAC1C,2GAA2G;IAC3G,OAAO,EAAE,aAAa,CAAC;IACvB,6CAA6C;IAC7C,SAAS,EAAE,QAAQ,CAAC;IACpB,uCAAuC;IACvC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,4HAA4H;IAC5H,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,2HAA2H;IAC3H,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,wBAAwB;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;SAGK;IACL,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,gFAAgF;IAChF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gCAAgC;IAChC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;SAGK;IACL,YAAY,CAAC,EAAE,kBAAkB,CAAC;IAClC,uDAAuD;IACvD,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,yDAAyD;IACzD,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;SAGK;IACL,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;SAGK;IACL,YAAY,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,eAAe,GACvC,IAAI,CAAC,WAAW,CAAC,oBAAoB,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAEhE,eAAO,MAAM,MAAM,4HAgOlB,CAAC"}

package/dts/buttons/AvatarButton.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import type { Polymorphic } from '../core/polymorphism';
+import { type AvatarBaseProps } from '../media';
+import { type PressableBaseProps } from '../system';
+import type { ButtonBaseProps } from './Button';
+export declare const avatarButtonDefaultElement = 'button';
+export type AvatarButtonDefaultElement = typeof avatarButtonDefaultElement;
+export type AvatarButtonBaseProps = Polymorphic.ExtendableProps<
+  Omit<PressableBaseProps, 'children'>,
+  Pick<ButtonBaseProps, 'compact'> &
+    Pick<
+      AvatarBaseProps,
+      'alt' | 'src' | 'colorScheme' | 'shape' | 'borderColor' | 'name' | 'selected'
+    >
+>;
+export type AvatarButtonProps<AsComponent extends React.ElementType> = Polymorphic.Props<
+  AsComponent,
+  AvatarButtonBaseProps
+>;
+type AvatarButtonComponent = (<AsComponent extends React.ElementType = AvatarButtonDefaultElement>(
+  props: AvatarButtonProps<AsComponent>,
+) => Polymorphic.ReactReturn) &
+  Polymorphic.ReactNamed;
+export declare const AvatarButton: AvatarButtonComponent;
+export {};
+//# sourceMappingURL=AvatarButton.d.ts.map

package/dts/buttons/AvatarButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarButton.d.ts","sourceRoot":"","sources":["../../src/buttons/AvatarButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAIzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,EAAU,KAAK,eAAe,EAAE,MAAM,UAAU,CAAC;AACxD,OAAO,EAAa,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAE/D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAEhD,eAAO,MAAM,0BAA0B,WAAW,CAAC;AAEnD,MAAM,MAAM,0BAA0B,GAAG,OAAO,0BAA0B,CAAC;AAE3E,MAAM,MAAM,qBAAqB,GAAG,WAAW,CAAC,eAAe,CAC7D,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,EACpC,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC,GAC9B,IAAI,CACF,eAAe,EACf,KAAK,GAAG,KAAK,GAAG,aAAa,GAAG,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,UAAU,CAC9E,CACJ,CAAC;AAEF,MAAM,MAAM,iBAAiB,CAAC,WAAW,SAAS,KAAK,CAAC,WAAW,IAAI,WAAW,CAAC,KAAK,CACtF,WAAW,EACX,qBAAqB,CACtB,CAAC;AAEF,KAAK,qBAAqB,GAAG,CAAC,CAAC,WAAW,SAAS,KAAK,CAAC,WAAW,GAAG,0BAA0B,EAC/F,KAAK,EAAE,iBAAiB,CAAC,WAAW,CAAC,KAClC,WAAW,CAAC,WAAW,CAAC,GAC3B,WAAW,CAAC,UAAU,CAAC;AAWzB,eAAO,MAAM,YAAY,EAAE,qBAiD1B,CAAC"}