@coinbase/cds-mobile 8.60.0 → 8.61.0

package/CHANGELOG.md

@@ -8,6 +8,20 @@ All notable changes to this project will be documented in this file.
 
 <!-- template-start -->
 
+## 8.61.0 (3/30/2026 PST)
+
+#### 🚀 Updates
+
+- Feat: support Button and IconButton size customization. [[#565](https://github.com/coinbase/cds/pull/565)]
+
+#### 📘 Misc
+
+- Deprecate Card and its sub-components. [[#562](https://github.com/coinbase/cds/pull/562)]
+
+#### 📘 Misc
+
+- Chore: deprecate CardGroup. [[#560](https://github.com/coinbase/cds/pull/560)]
+
 ## 8.60.0 (3/29/2026 PST)
 
 #### 🚀 Updates

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

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/buttons/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiE,MAAM,OAAO,CAAC;AACtF,OAAO,EAIL,KAAK,IAAI,EACV,MAAM,cAAc,CAAC;AAGtB,OAAO,KAAK,EACV,aAAa,EACb,QAAQ,EACR,wBAAwB,EACxB,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAMpC,OAAO,EAAa,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAMzE,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;CAejB,CAAC;AAEH,MAAM,MAAM,eAAe,GAAG,WAAW,GACvC,IAAI,CAAC,wBAAwB,EAAE,oBAAoB,CAAC,GACpD,kBAAkB,GAAG;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wDAAwD;IACxD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,2EAA2E;IAC3E,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,0DAA0D;IAC1D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4CAA4C;IAC5C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,yBAAyB;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,iDAAiD;IACjD,SAAS,CAAC,EAAE,QAAQ,CAAC;IACrB,uCAAuC;IACvC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uBAAuB;IACvB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,QAAQ,CAAC;IACnB,qCAAqC;IACrC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IACxB,kDAAkD;IAClD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEJ,MAAM,MAAM,WAAW,GAAG,eAAe,CAAC;AAE1C,eAAO,MAAM,MAAM;;;;;;;;;IAnDf;;;OAGG;cACO,aAAa;IACvB,mCAAmC;eACxB,OAAO;IAClB,wDAAwD;cAC9C,OAAO;IACjB;;OAEG;yBACkB,MAAM;IAC3B,2EAA2E;kBAC7D,OAAO;IACrB,0DAA0D;YAClD,OAAO;IACf,yDAAyD;cAC/C,OAAO;IACjB,4CAA4C;cAClC,KAAK,CAAC,SAAS;IACzB,yBAAyB;YACjB,KAAK,CAAC,SAAS;IACvB,iDAAiD;gBACrC,QAAQ;IACpB,uCAAuC;sBACrB,OAAO;IACzB,uBAAuB;UACjB,KAAK,CAAC,SAAS;IACrB,+CAA+C;cACrC,QAAQ;IAClB,qCAAqC;oBACrB,OAAO;IACvB;;;OAGG;YACK,OAAO,GAAG,KAAK;IACvB,kDAAkD;WAC3C,MAAM;IACb,oCAAoC;qBACnB,OAAO;IACxB;;;OAGG;oBACa,MAAM;+BAsKzB,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/buttons/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiE,MAAM,OAAO,CAAC;AACtF,OAAO,EAIL,KAAK,IAAI,EACV,MAAM,cAAc,CAAC;AAGtB,OAAO,KAAK,EACV,aAAa,EACb,QAAQ,EACR,wBAAwB,EACxB,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAMpC,OAAO,EAAa,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAMzE,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;CAejB,CAAC;AAEH,MAAM,MAAM,eAAe,GAAG,WAAW,GACvC,IAAI,CAAC,wBAAwB,EAAE,oBAAoB,CAAC,GACpD,kBAAkB,GAAG;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wDAAwD;IACxD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,2EAA2E;IAC3E,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,0DAA0D;IAC1D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4CAA4C;IAC5C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,yBAAyB;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,iDAAiD;IACjD,SAAS,CAAC,EAAE,QAAQ,CAAC;IACrB,uCAAuC;IACvC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uBAAuB;IACvB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,QAAQ,CAAC;IACnB,qCAAqC;IACrC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IACxB,kDAAkD;IAClD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEJ,MAAM,MAAM,WAAW,GAAG,eAAe,CAAC;AAE1C,eAAO,MAAM,MAAM;;;;;;;;;IAnDf;;;OAGG;cACO,aAAa;IACvB,mCAAmC;eACxB,OAAO;IAClB,wDAAwD;cAC9C,OAAO;IACjB;;OAEG;yBACkB,MAAM;IAC3B,2EAA2E;kBAC7D,OAAO;IACrB,0DAA0D;YAClD,OAAO;IACf,yDAAyD;cAC/C,OAAO;IACjB,4CAA4C;cAClC,KAAK,CAAC,SAAS;IACzB,yBAAyB;YACjB,KAAK,CAAC,SAAS;IACvB,iDAAiD;gBACrC,QAAQ;IACpB,uCAAuC;sBACrB,OAAO;IACzB,uBAAuB;UACjB,KAAK,CAAC,SAAS;IACrB,+CAA+C;cACrC,QAAQ;IAClB,qCAAqC;oBACrB,OAAO;IACvB;;;OAGG;YACK,OAAO,GAAG,KAAK;IACvB,kDAAkD;WAC3C,MAAM;IACb,oCAAoC;qBACnB,OAAO;IACxB;;;OAGG;oBACa,MAAM;+BAkLzB,CAAC"}

package/dts/cards/Card.d.ts

@@ -17,5 +17,9 @@ export type CardBaseProps = Pick<
     pressableProps?: Omit<PressableProps, 'onPress'>;
   };
 export type CardProps = CardBaseProps & BoxProps;
+/**
+ * @deprecated Use ContentCard instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export declare const Card: React.NamedExoticComponent<CardProps>;
 //# sourceMappingURL=Card.d.ts.map

package/dts/cards/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/cards/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAE7C,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAIrE,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAG5D,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAErE,MAAM,MAAM,aAAa,GAAG,IAAI,CAC9B,wBAAwB,EACxB,oBAAoB,GAAG,yBAAyB,GAAG,mBAAmB,CACvE,GACC,IAAI,CAAC,cAAc,EAAE,gBAAgB,GAAG,SAAS,CAAC,GAClD,YAAY,GAAG;IACb,8FAA8F;IAC9F,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;OAGG;IACH,cAAc,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;CAClD,CAAC;AAEJ,MAAM,MAAM,SAAS,GAAG,aAAa,GAAG,QAAQ,CAAC;AAkCjD,eAAO,MAAM,IAAI,uCAsFf,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/cards/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAE7C,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAIrE,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAG5D,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAErE,MAAM,MAAM,aAAa,GAAG,IAAI,CAC9B,wBAAwB,EACxB,oBAAoB,GAAG,yBAAyB,GAAG,mBAAmB,CACvE,GACC,IAAI,CAAC,cAAc,EAAE,gBAAgB,GAAG,SAAS,CAAC,GAClD,YAAY,GAAG;IACb,8FAA8F;IAC9F,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;OAGG;IACH,cAAc,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;CAClD,CAAC;AAEJ,MAAM,MAAM,SAAS,GAAG,aAAa,GAAG,QAAQ,CAAC;AAkCjD;;;GAGG;AACH,eAAO,MAAM,IAAI,uCAsFf,CAAC"}

package/dts/cards/CardBody.d.ts

@@ -52,5 +52,9 @@ export type CardBodyBaseProps = Pick<
     action?: React.ReactNode;
   };
 export type CardBodyProps = CardBodyBaseProps & BoxProps;
+/**
+ * @deprecated Use ContentCardBody instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export declare const CardBody: React.NamedExoticComponent<CardBodyProps>;
 //# sourceMappingURL=CardBody.d.ts.map

package/dts/cards/CardBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardBody.d.ts","sourceRoot":"","sources":["../../src/cards/CardBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAC3E,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAGjF,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAO5D,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,OAAO,GAAG,KAAK,CAAC;AAE3D,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,wBAAwB,EACxB,oBAAoB,GAAG,yBAAyB,GAAG,mBAAmB,CACvE,GACC,YAAY,GAAG;IACb,aAAa,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IAC1C,2FAA2F;IAC3F,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,uFAAuF;IACvF,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sDAAsD;IACtD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,mEAAmE;IACnE,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,kEAAkE;IAClE,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,0FAA0F;IAC1F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEJ,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAAG,QAAQ,CAAC;AA8BzD,eAAO,MAAM,QAAQ,2CA0InB,CAAC"}
+{"version":3,"file":"CardBody.d.ts","sourceRoot":"","sources":["../../src/cards/CardBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAC3E,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAGjF,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAO5D,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,OAAO,GAAG,KAAK,CAAC;AAE3D,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,wBAAwB,EACxB,oBAAoB,GAAG,yBAAyB,GAAG,mBAAmB,CACvE,GACC,YAAY,GAAG;IACb,aAAa,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IAC1C,2FAA2F;IAC3F,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,uFAAuF;IACvF,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sDAAsD;IACtD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,mEAAmE;IACnE,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,kEAAkE;IAClE,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,0FAA0F;IAC1F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEJ,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAAG,QAAQ,CAAC;AA8BzD;;;GAGG;AACH,eAAO,MAAM,QAAQ,2CA0InB,CAAC"}

package/dts/cards/CardFooter.d.ts

@@ -10,5 +10,9 @@ export type CardFooterBaseProps = Pick<
     children: React.ReactNode;
   };
 export type CardFooterProps = CardFooterBaseProps & Omit<BoxProps, 'children'>;
+/**
+ * @deprecated Use ContentCardFooter instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export declare const CardFooter: React.NamedExoticComponent<CardFooterProps>;
 //# sourceMappingURL=CardFooter.d.ts.map

package/dts/cards/CardFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardFooter.d.ts","sourceRoot":"","sources":["../../src/cards/CardFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAE3E,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAGxD,MAAM,MAAM,mBAAmB,GAAG,IAAI,CACpC,wBAAwB,EACxB,oBAAoB,GAAG,yBAAyB,GAAG,mBAAmB,CACvE,GACC,IAAI,CAAC,YAAY,EAAE,UAAU,CAAC,GAAG;IAC/B,uDAAuD;IACvD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEJ,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;AAE/E,eAAO,MAAM,UAAU,6CAYrB,CAAC"}
+{"version":3,"file":"CardFooter.d.ts","sourceRoot":"","sources":["../../src/cards/CardFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAE3E,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAGxD,MAAM,MAAM,mBAAmB,GAAG,IAAI,CACpC,wBAAwB,EACxB,oBAAoB,GAAG,yBAAyB,GAAG,mBAAmB,CACvE,GACC,IAAI,CAAC,YAAY,EAAE,UAAU,CAAC,GAAG;IAC/B,uDAAuD;IACvD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEJ,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;AAE/E;;;GAGG;AACH,eAAO,MAAM,UAAU,6CAYrB,CAAC"}

package/dts/cards/CardGroup.d.ts

@@ -1,9 +1,21 @@
 import React from 'react';
 import type { View } from 'react-native';
 import type { GroupProps, RenderGroupItem } from '../layout/Group';
+/**
+ * @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export type CardGroupBaseProps = GroupProps;
+/**
+ * @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export type CardGroupProps = CardGroupBaseProps;
 export type CardGroupRenderItem = RenderGroupItem;
+/**
+ * @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export declare const CardGroup: React.MemoExoticComponent<
   React.ForwardRefExoticComponent<
     import('../styles/styleProps').StyleProps & {

package/dts/cards/CardGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardGroup.d.ts","sourceRoot":"","sources":["../../src/cards/CardGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAIzC,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAGnE,MAAM,MAAM,kBAAkB,GAAG,UAAU,CAAC;AAC5C,MAAM,MAAM,cAAc,GAAG,kBAAkB,CAAC;AAChD,MAAM,MAAM,mBAAmB,GAAG,eAAe,CAAC;AAElD,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BA2BrB,CAAC"}
+{"version":3,"file":"CardGroup.d.ts","sourceRoot":"","sources":["../../src/cards/CardGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAIzC,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAGnE;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,UAAU,CAAC;AAC5C;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,kBAAkB,CAAC;AAChD,MAAM,MAAM,mBAAmB,GAAG,eAAe,CAAC;AAElD;;;GAGG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BA2BrB,CAAC"}

package/dts/cards/CardHeader.d.ts

@@ -1,6 +1,14 @@
 import React from 'react';
 import type { CardHeaderProps as CardHeaderBaseProps } from '@coinbase/cds-common/types';
+/**
+ * @deprecated Use ContentCardHeaderProps instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export type CardHeaderProps = CardHeaderBaseProps;
+/**
+ * @deprecated Use ContentCardHeader instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export declare const CardHeader: React.MemoExoticComponent<
   ({
     avatar,

package/dts/cards/CardHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../src/cards/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EAAE,eAAe,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAMzF,MAAM,MAAM,eAAe,GAAG,mBAAmB,CAAC;AAElD,eAAO,MAAM,UAAU,gFAC+B,eAAe,6CAoBpE,CAAC"}
+{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../src/cards/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EAAE,eAAe,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAMzF;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,mBAAmB,CAAC;AAElD;;;GAGG;AACH,eAAO,MAAM,UAAU,gFAC+B,eAAe,6CAoBpE,CAAC"}

package/dts/cards/CardMedia.d.ts

@@ -1,4 +1,12 @@
 import type { CardMediaProps as CommonCardMediaProps } from '@coinbase/cds-common/types';
+/**
+ * @deprecated Use SpotSquare when `type` is "spotSquare", Pictogram when `type` is "pictogram", or RemoteImage when `type` is "image". This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export type CardMediaProps = CommonCardMediaProps;
+/**
+ * @deprecated Use SpotSquare when `type` is "spotSquare", Pictogram when `type` is "pictogram", or RemoteImage when `type` is "image". This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export declare const CardMedia: import('react').NamedExoticComponent<CommonCardMediaProps>;
 //# sourceMappingURL=CardMedia.d.ts.map

package/dts/cards/CardMedia.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardMedia.d.ts","sourceRoot":"","sources":["../../src/cards/CardMedia.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAGV,cAAc,IAAI,oBAAoB,EACvC,MAAM,4BAA4B,CAAC;AAKpC,MAAM,MAAM,cAAc,GAAG,oBAAoB,CAAC;AAclD,eAAO,MAAM,SAAS,4DAiCpB,CAAC"}
+{"version":3,"file":"CardMedia.d.ts","sourceRoot":"","sources":["../../src/cards/CardMedia.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAGV,cAAc,IAAI,oBAAoB,EACvC,MAAM,4BAA4B,CAAC;AAKpC;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,oBAAoB,CAAC;AAclD;;;GAGG;AACH,eAAO,MAAM,SAAS,4DAiCpB,CAAC"}

package/esm/buttons/Button.js

@@ -1,4 +1,4 @@
-const _excluded = ["variant", "loading", "progressCircleSize", "transparent", "block", "compact", "children", "start", "startIcon", "startIconActive", "end", "endIcon", "endIconActive", "flush", "noScaleOnPress", "numberOfLines", "font", "fontFamily", "fontSize", "fontWeight", "lineHeight", "background", "color", "style", "wrapperStyles", "feedback", "borderColor", "borderWidth", "borderRadius", "accessibilityLabel", "accessibilityHint"];
+const _excluded = ["variant", "loading", "progressCircleSize", "transparent", "block", "compact", "children", "start", "startIcon", "startIconActive", "end", "endIcon", "endIconActive", "flush", "noScaleOnPress", "numberOfLines", "font", "fontFamily", "fontSize", "fontWeight", "lineHeight", "background", "color", "style", "wrapperStyles", "feedback", "borderColor", "borderWidth", "borderRadius", "height", "accessibilityLabel", "accessibilityHint", "padding", "paddingStart", "paddingEnd", "paddingTop", "paddingBottom", "paddingX", "paddingY"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 import React, { forwardRef, isValidElement, memo, useCallback, useMemo } from 'react';
@@ -61,8 +61,16 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
       borderColor,
       borderWidth = 100,
       borderRadius = compact ? 700 : 900,
+      height = interactableHeight[compact ? 'compact' : 'regular'],
       accessibilityLabel,
-      accessibilityHint
+      accessibilityHint,
+      padding,
+      paddingStart,
+      paddingEnd,
+      paddingTop,
+      paddingBottom,
+      paddingX: paddingXProp,
+      paddingY: paddingYProp
     } = _ref,
     props = _objectWithoutPropertiesLoose(_ref, _excluded);
   const theme = useTheme();
@@ -75,7 +83,6 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
   const borderColorValue = borderColor != null ? borderColor : variantStyle.borderColor;
   const sizingStyle = block ? styles.block : styles.inline;
   const justifyContent = flush ? 'flex-start' : hasIcon ? 'space-between' : 'center';
-  const minHeight = interactableHeight[compact ? 'compact' : 'regular'];
   const {
     paddingX,
     paddingY,
@@ -110,6 +117,7 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
     borderRadius: borderRadius,
     borderWidth: borderWidth,
     feedback: feedback,
+    height: height,
     loading: loading,
     marginEnd: marginEnd,
     marginStart: marginStart,
@@ -122,9 +130,14 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
       alignItems: "center",
       flexWrap: "nowrap",
       justifyContent: justifyContent,
-      minHeight: minHeight,
-      paddingX: paddingX,
-      paddingY: paddingY,
+      minHeight: height,
+      padding: padding,
+      paddingBottom: paddingBottom,
+      paddingEnd: paddingEnd,
+      paddingStart: paddingStart,
+      paddingTop: paddingTop,
+      paddingX: paddingXProp != null ? paddingXProp : paddingX,
+      paddingY: paddingYProp != null ? paddingYProp : paddingY,
       style: sizingStyle,
       children: loading ? /*#__PURE__*/_jsx(ProgressCircle, {
         indeterminate: true,

package/esm/buttons/IconButton.js

@@ -1,4 +1,4 @@
-const _excluded = ["name", "active", "variant", "transparent", "compact", "background", "color", "borderColor", "iconSize", "borderWidth", "borderRadius", "feedback", "flush", "loading", "progressCircleSize", "style", "accessibilityHint", "accessibilityLabel"];
+const _excluded = ["name", "active", "variant", "transparent", "compact", "background", "color", "borderColor", "iconSize", "borderWidth", "borderRadius", "height", "width", "feedback", "flush", "loading", "progressCircleSize", "style", "accessibilityHint", "accessibilityLabel"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 import { forwardRef, memo, useCallback, useMemo } from 'react';
@@ -24,6 +24,8 @@ export const IconButton = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Ico
       iconSize = compact ? 's' : 'm',
       borderWidth = 100,
       borderRadius = 1000,
+      height = interactableHeight[compact ? 'compact' : 'regular'],
+      width = interactableHeight[compact ? 'compact' : 'regular'],
       feedback = compact ? 'light' : 'normal',
       flush,
       loading,
@@ -40,7 +42,6 @@ export const IconButton = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Ico
   const colorValue = color != null ? color : variantStyle.color;
   const backgroundValue = background != null ? background : variantStyle.background;
   const borderColorValue = borderColor != null ? borderColor : variantStyle.borderColor;
-  const minHeight = interactableHeight[compact ? 'compact' : 'regular'];
   const {
     marginStart,
     marginEnd
@@ -49,12 +50,12 @@ export const IconButton = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Ico
     flush
   });
   const sizingStyle = useMemo(() => ({
-    height: minHeight,
-    width: minHeight,
+    height: height,
+    width: width,
     alignItems: 'center',
     flexDirection: 'column',
     justifyContent: 'center'
-  }), [minHeight]);
+  }), [height, width]);
   const pressableStyle = useCallback(state => [sizingStyle, typeof style === 'function' ? style(state) : style], [sizingStyle, style]);
   return /*#__PURE__*/_jsx(Pressable, _extends({
     ref: ref,
@@ -73,9 +74,9 @@ export const IconButton = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Ico
   }, props, {
     children: loading ? /*#__PURE__*/_jsx(Box, {
       alignItems: "center",
-      height: minHeight,
+      height: height,
       justifyContent: "center",
-      width: minHeight,
+      width: width,
       children: /*#__PURE__*/_jsx(ProgressCircle, {
         indeterminate: true,
         color: colorValue,

package/esm/buttons/__stories__/Button.stories.js

@@ -222,6 +222,38 @@ const ButtonScreen = () => {
         },
         children: "Hello world"
       })
+    }), /*#__PURE__*/_jsxs(Example, {
+      inline: true,
+      title: "Small",
+      children: [/*#__PURE__*/_jsxs(HStack, {
+        gap: 2,
+        children: [/*#__PURE__*/_jsx(Button, {
+          height: 32,
+          paddingY: 0,
+          children: "I am a button"
+        }), /*#__PURE__*/_jsx(Button, {
+          loading: true,
+          height: 32,
+          paddingY: 0,
+          children: "I am a button"
+        })]
+      }), /*#__PURE__*/_jsxs(HStack, {
+        gap: 2,
+        children: [/*#__PURE__*/_jsx(Button, {
+          compact: true,
+          height: 24,
+          paddingY: 0,
+          progressCircleSize: 16,
+          children: "I am a button"
+        }), /*#__PURE__*/_jsx(Button, {
+          compact: true,
+          loading: true,
+          height: 24,
+          paddingY: 0,
+          progressCircleSize: 16,
+          children: "I am a button"
+        })]
+      })]
     })]
   });
 };

package/esm/buttons/__stories__/IconButton.stories.js

@@ -322,6 +322,38 @@ const IconButtonScreen = () => {
           }), variant.title]
         }, index);
       })
+    }), /*#__PURE__*/_jsxs(Example, {
+      inline: true,
+      title: "Small",
+      children: [/*#__PURE__*/_jsx(IconButton, {
+        accessibilityLabel: accessibilityLabel,
+        height: 32,
+        name: iconName,
+        onPress: onPress,
+        width: 32
+      }), /*#__PURE__*/_jsx(IconButton, {
+        loading: true,
+        accessibilityLabel: accessibilityLabel,
+        height: 32,
+        name: iconName,
+        onPress: onPress,
+        width: 32
+      }), /*#__PURE__*/_jsx(IconButton, {
+        compact: true,
+        accessibilityLabel: accessibilityLabel,
+        height: 24,
+        name: iconName,
+        onPress: onPress,
+        width: 24
+      }), /*#__PURE__*/_jsx(IconButton, {
+        compact: true,
+        loading: true,
+        accessibilityLabel: accessibilityLabel,
+        height: 24,
+        name: iconName,
+        onPress: onPress,
+        width: 24
+      })]
     })]
   });
 };

package/esm/cards/Card.js

@@ -39,6 +39,11 @@ const getBorderRadiusPinStyle = borderRadius => ({
   },
   all: {}
 });
+
+/**
+ * @deprecated Use ContentCard instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export const Card = /*#__PURE__*/memo(function OldCard(_ref) {
   let {
       children,

package/esm/cards/CardBody.js

@@ -31,6 +31,11 @@ const CardBodyAction = /*#__PURE__*/memo(function CardBodyAction(_ref) {
     children: children
   }));
 });
+
+/**
+ * @deprecated Use ContentCardBody instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export const CardBody = /*#__PURE__*/memo(function CardBody(_ref2) {
   var _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9, _ref0, _props$maxWidth, _props$minHeight;
   let {

package/esm/cards/CardFooter.js

@@ -5,6 +5,10 @@ import React, { memo } from 'react';
 import { gutter } from '@coinbase/cds-common/tokens/sizing';
 import { HStack } from '../layout/HStack';
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @deprecated Use ContentCardFooter instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export const CardFooter = /*#__PURE__*/memo(function CardFooter(_ref) {
   let {
       children,

package/esm/cards/CardGroup.js

@@ -5,7 +5,21 @@ import React, { forwardRef, memo } from 'react';
 import { gutter } from '@coinbase/cds-common/tokens/sizing';
 import { Divider } from '../layout/Divider';
 import { Group } from '../layout/Group';
+
+/**
+ * @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
+
+/**
+ * @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export const CardGroup = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function CardGroup(_ref, ref) {
   let {
       accessibilityLabel,

package/esm/cards/CardHeader.js

@@ -2,7 +2,16 @@ import React, { memo } from 'react';
 import { HStack } from '../layout/HStack';
 import { RemoteImage } from '../media/RemoteImage';
 import { Text } from '../typography/Text';
+
+/**
+ * @deprecated Use ContentCardHeaderProps instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * @deprecated Use ContentCardHeader instead. This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export const CardHeader = /*#__PURE__*/memo(_ref => {
   let {
     avatar,

package/esm/cards/CardMedia.js

@@ -5,6 +5,11 @@ import { memo } from 'react';
 import { defaultMediaDimension, defaultMediaSize, defaultPictogramMediaDimension } from '@coinbase/cds-common/tokens/card';
 import { Pictogram, SpotSquare } from '../illustrations';
 import { getSource, RemoteImage } from '../media/RemoteImage';
+
+/**
+ * @deprecated Use SpotSquare when `type` is "spotSquare", Pictogram when `type` is "pictogram", or RemoteImage when `type` is "image". This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 import { jsx as _jsx } from "react/jsx-runtime";
 const imageProps = {
   start: {
@@ -17,6 +22,11 @@ const imageProps = {
   },
   end: defaultMediaSize
 };
+
+/**
+ * @deprecated Use SpotSquare when `type` is "spotSquare", Pictogram when `type` is "pictogram", or RemoteImage when `type` is "image". This will be removed in a future major release.
+ * @deprecationExpectedRemoval v10
+ */
 export const CardMedia = /*#__PURE__*/memo(function CardMedia(_ref) {
   var _props$alt;
   let {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cds-mobile",
-  "version": "8.60.0",
+  "version": "8.61.0",
   "description": "Coinbase Design System - Mobile",
   "repository": {
     "type": "git",
@@ -197,7 +197,7 @@
     "react-native-svg": "^14.1.0"
   },
   "dependencies": {
-    "@coinbase/cds-common": "^8.60.0",
+    "@coinbase/cds-common": "^8.61.0",
     "@coinbase/cds-icons": "^5.13.0",
     "@coinbase/cds-illustrations": "^4.36.0",
     "@coinbase/cds-lottie-files": "^3.3.4",