@coinbase/cds-mobile 8.59.0 → 8.61.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +20 -0
- package/dts/buttons/Button.d.ts +8 -0
- package/dts/buttons/Button.d.ts.map +1 -1
- package/dts/buttons/DefaultSlideButtonHandle.d.ts.map +1 -1
- package/dts/buttons/IconButton.d.ts +12 -7
- package/dts/buttons/IconButton.d.ts.map +1 -1
- package/dts/cards/Card.d.ts +4 -0
- package/dts/cards/Card.d.ts.map +1 -1
- package/dts/cards/CardBody.d.ts +4 -0
- package/dts/cards/CardBody.d.ts.map +1 -1
- package/dts/cards/CardFooter.d.ts +4 -0
- package/dts/cards/CardFooter.d.ts.map +1 -1
- package/dts/cards/CardGroup.d.ts +12 -0
- package/dts/cards/CardGroup.d.ts.map +1 -1
- package/dts/cards/CardHeader.d.ts +8 -0
- package/dts/cards/CardHeader.d.ts.map +1 -1
- package/dts/cards/CardMedia.d.ts +8 -0
- package/dts/cards/CardMedia.d.ts.map +1 -1
- package/dts/controls/InputIconButton.d.ts +1 -1
- package/dts/loaders/Spinner.d.ts +4 -0
- package/dts/loaders/Spinner.d.ts.map +1 -1
- package/dts/visualizations/ProgressBar.d.ts +2 -2
- package/dts/visualizations/ProgressBar.d.ts.map +1 -1
- package/dts/visualizations/ProgressBarWithFloatLabel.d.ts.map +1 -1
- package/dts/visualizations/ProgressCircle.d.ts +9 -1
- package/dts/visualizations/ProgressCircle.d.ts.map +1 -1
- package/esm/alpha/select/__stories__/AlphaSelect.stories.js +13 -9
- package/esm/buttons/Button.js +28 -10
- package/esm/buttons/DefaultSlideButtonHandle.js +7 -6
- package/esm/buttons/IconButton.js +23 -12
- package/esm/buttons/__stories__/Button.stories.js +60 -0
- package/esm/buttons/__stories__/IconButton.stories.js +148 -1
- package/esm/cards/Card.js +5 -0
- package/esm/cards/CardBody.js +5 -0
- package/esm/cards/CardFooter.js +4 -0
- package/esm/cards/CardGroup.js +14 -0
- package/esm/cards/CardHeader.js +9 -0
- package/esm/cards/CardMedia.js +10 -0
- package/esm/loaders/Spinner.js +5 -0
- package/esm/overlays/__stories__/AlertBasic.stories.js +2 -2
- package/esm/overlays/__stories__/AlertLongTitle.stories.js +2 -2
- package/esm/overlays/__stories__/AlertOverModal.stories.js +2 -10
- package/esm/overlays/__stories__/AlertPortal.stories.js +2 -6
- package/esm/overlays/__stories__/AlertSingleAction.stories.js +2 -2
- package/esm/overlays/__stories__/AlertVerticalActions.stories.js +2 -2
- package/esm/overlays/__stories__/DrawerFallback.stories.js +20 -13
- package/esm/overlays/__stories__/DrawerScrollable.stories.js +8 -1
- package/esm/overlays/__stories__/Drawers.js +4 -4
- package/esm/overlays/__stories__/ModalBackButton.stories.js +2 -2
- package/esm/overlays/__stories__/ModalBasic.stories.js +2 -2
- package/esm/overlays/__stories__/ModalCustomPadding.stories.js +2 -2
- package/esm/overlays/__stories__/ModalLong.stories.js +2 -2
- package/esm/overlays/__stories__/ModalPortal.stories.js +2 -6
- package/esm/overlays/__stories__/Overlay.stories.js +2 -6
- package/esm/overlays/__stories__/TrayNavigation.stories.js +6 -2
- package/esm/overlays/__stories__/Trays.js +20 -11
- package/esm/sticky-footer/__stories__/StickyFooter.stories.js +2 -2
- package/esm/sticky-footer/__stories__/StickyFooterWithTray.stories.js +3 -3
- package/esm/visualizations/DefaultProgressCircleContent.js +1 -1
- package/esm/visualizations/ProgressBar.js +3 -3
- package/esm/visualizations/ProgressBarWithFloatLabel.js +19 -28
- package/esm/visualizations/ProgressCircle.js +80 -60
- package/esm/visualizations/__stories__/ProgressCircle.stories.js +63 -11
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -8,6 +8,26 @@ All notable changes to this project will be documented in this file.
|
|
|
8
8
|
|
|
9
9
|
<!-- template-start -->
|
|
10
10
|
|
|
11
|
+
## 8.61.0 (3/30/2026 PST)
|
|
12
|
+
|
|
13
|
+
#### 🚀 Updates
|
|
14
|
+
|
|
15
|
+
- Feat: support Button and IconButton size customization. [[#565](https://github.com/coinbase/cds/pull/565)]
|
|
16
|
+
|
|
17
|
+
#### 📘 Misc
|
|
18
|
+
|
|
19
|
+
- Deprecate Card and its sub-components. [[#562](https://github.com/coinbase/cds/pull/562)]
|
|
20
|
+
|
|
21
|
+
#### 📘 Misc
|
|
22
|
+
|
|
23
|
+
- Chore: deprecate CardGroup. [[#560](https://github.com/coinbase/cds/pull/560)]
|
|
24
|
+
|
|
25
|
+
## 8.60.0 (3/29/2026 PST)
|
|
26
|
+
|
|
27
|
+
#### 🚀 Updates
|
|
28
|
+
|
|
29
|
+
- Add indeterminate ProgressCircle. [[#501](https://github.com/coinbase/cds/pull/501)]
|
|
30
|
+
|
|
11
31
|
## 8.59.0 (3/27/2026 PST)
|
|
12
32
|
|
|
13
33
|
#### 🚀 Updates
|
package/dts/buttons/Button.d.ts
CHANGED
|
@@ -35,6 +35,10 @@ export type ButtonBaseProps = SharedProps &
|
|
|
35
35
|
disabled?: boolean;
|
|
36
36
|
/** Mark the button as loading and display a spinner. */
|
|
37
37
|
loading?: boolean;
|
|
38
|
+
/** Size of the loading progress circle in px.
|
|
39
|
+
* @default 24
|
|
40
|
+
*/
|
|
41
|
+
progressCircleSize?: number;
|
|
38
42
|
/** Mark the background and border as transparent until interacted with. */
|
|
39
43
|
transparent?: boolean;
|
|
40
44
|
/** Change to block and expand to 100% of parent width. */
|
|
@@ -96,6 +100,10 @@ export declare const Button: React.MemoExoticComponent<
|
|
|
96
100
|
disabled?: boolean;
|
|
97
101
|
/** Mark the button as loading and display a spinner. */
|
|
98
102
|
loading?: boolean;
|
|
103
|
+
/** Size of the loading progress circle in px.
|
|
104
|
+
* @default 24
|
|
105
|
+
*/
|
|
106
|
+
progressCircleSize?: number;
|
|
99
107
|
/** Mark the background and border as transparent until interacted with. */
|
|
100
108
|
transparent?: boolean;
|
|
101
109
|
/** Change to block and expand to 100% of parent width. */
|
|
@@ -1 +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;
|
|
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;+BAkLzB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultSlideButtonHandle.d.ts","sourceRoot":"","sources":["../../src/buttons/DefaultSlideButtonHandle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"DefaultSlideButtonHandle.d.ts","sourceRoot":"","sources":["../../src/buttons/DefaultSlideButtonHandle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAgBzC,OAAO,KAAK,EAAE,oBAAoB,EAA0B,MAAM,eAAe,CAAC;AAElF,eAAO,MAAM,eAAe;;;CAAgE,CAAC;AAI7F,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAAC,oBAAoB,EAAE,SAAS,GAAG,SAAS,CAAC,GAAG;IAC9F,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,iCAAiC,GAAG,CAC9C,KAAK,EAAE,6BAA6B,KACjC,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B,MAAM,MAAM,+BAA+B,GAAG,IAAI,CAAC,oBAAoB,EAAE,SAAS,GAAG,SAAS,CAAC,GAAG;IAChG,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,mCAAmC,GAAG,CAChD,KAAK,EAAE,+BAA+B,KACnC,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;CAgBjB,CAAC;AAEH,eAAO,MAAM,wBAAwB,sDACT,6BAA6B,6CAyBxD,CAAC;AAEF,eAAO,MAAM,0BAA0B,iDAChB,+BAA+B,6CAgBrD,CAAC;AAEF,eAAO,MAAM,wBAAwB;;;;;;;;;;;+BAuFpC,CAAC"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { type View } from 'react-native';
|
|
3
2
|
import type {
|
|
4
3
|
IconButtonVariant,
|
|
@@ -7,10 +6,13 @@ import type {
|
|
|
7
6
|
SharedProps,
|
|
8
7
|
} from '@coinbase/cds-common/types';
|
|
9
8
|
import { type PressableBaseProps } from '../system/Pressable';
|
|
10
|
-
import type
|
|
9
|
+
import { type ButtonBaseProps } from './Button';
|
|
11
10
|
export type IconButtonBaseProps = SharedProps &
|
|
12
11
|
Omit<PressableBaseProps, 'children'> &
|
|
13
|
-
Pick<
|
|
12
|
+
Pick<
|
|
13
|
+
ButtonBaseProps,
|
|
14
|
+
'disabled' | 'transparent' | 'compact' | 'flush' | 'loading' | 'progressCircleSize'
|
|
15
|
+
> & {
|
|
14
16
|
/** Name of the icon, as defined in Figma. */
|
|
15
17
|
name: IconName;
|
|
16
18
|
/**
|
|
@@ -27,11 +29,14 @@ export type IconButtonBaseProps = SharedProps &
|
|
|
27
29
|
variant?: IconButtonVariant;
|
|
28
30
|
};
|
|
29
31
|
export type IconButtonProps = IconButtonBaseProps;
|
|
30
|
-
export declare const IconButton:
|
|
31
|
-
|
|
32
|
+
export declare const IconButton: import('react').MemoExoticComponent<
|
|
33
|
+
import('react').ForwardRefExoticComponent<
|
|
32
34
|
SharedProps &
|
|
33
35
|
Omit<PressableBaseProps, 'children'> &
|
|
34
|
-
Pick<
|
|
36
|
+
Pick<
|
|
37
|
+
ButtonBaseProps,
|
|
38
|
+
'transparent' | 'disabled' | 'loading' | 'progressCircleSize' | 'compact' | 'flush'
|
|
39
|
+
> & {
|
|
35
40
|
/** Name of the icon, as defined in Figma. */
|
|
36
41
|
name: IconName;
|
|
37
42
|
/**
|
|
@@ -46,7 +51,7 @@ export declare const IconButton: React.MemoExoticComponent<
|
|
|
46
51
|
* @default primary
|
|
47
52
|
*/
|
|
48
53
|
variant?: IconButtonVariant;
|
|
49
|
-
} &
|
|
54
|
+
} & import('react').RefAttributes<View>
|
|
50
55
|
>
|
|
51
56
|
>;
|
|
52
57
|
//# sourceMappingURL=IconButton.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/buttons/IconButton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/buttons/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAmC,KAAK,IAAI,EAAkB,MAAM,cAAc,CAAC;AAG1F,OAAO,KAAK,EACV,iBAAiB,EACjB,QAAQ,EACR,QAAQ,EACR,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAMpC,OAAO,EAAa,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAGzE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,UAAU,CAAC;AAEhD,MAAM,MAAM,mBAAmB,GAAG,WAAW,GAC3C,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,GACpC,IAAI,CACF,eAAe,EACf,UAAU,GAAG,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,oBAAoB,CACpF,GAAG;IACF,6CAA6C;IAC7C,IAAI,EAAE,QAAQ,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,iCAAiC;IACjC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B,CAAC;AAEJ,MAAM,MAAM,eAAe,GAAG,mBAAmB,CAAC;AAElD,eAAO,MAAM,UAAU;IAlBnB,6CAA6C;UACvC,QAAQ;IACd;;;OAGG;eACQ,QAAQ;IACnB,iCAAiC;aACxB,OAAO;IAChB;;;OAGG;cACO,iBAAiB;yCAsG9B,CAAC"}
|
package/dts/cards/Card.d.ts
CHANGED
|
@@ -17,5 +17,9 @@ export type CardBaseProps = Pick<
|
|
|
17
17
|
pressableProps?: Omit<PressableProps, 'onPress'>;
|
|
18
18
|
};
|
|
19
19
|
export type CardProps = CardBaseProps & BoxProps;
|
|
20
|
+
/**
|
|
21
|
+
* @deprecated Use ContentCard instead. This will be removed in a future major release.
|
|
22
|
+
* @deprecationExpectedRemoval v10
|
|
23
|
+
*/
|
|
20
24
|
export declare const Card: React.NamedExoticComponent<CardProps>;
|
|
21
25
|
//# sourceMappingURL=Card.d.ts.map
|
package/dts/cards/Card.d.ts.map
CHANGED
|
@@ -1 +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"}
|
|
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;;;GAGG;AACH,eAAO,MAAM,IAAI,uCAsFf,CAAC"}
|
package/dts/cards/CardBody.d.ts
CHANGED
|
@@ -52,5 +52,9 @@ export type CardBodyBaseProps = Pick<
|
|
|
52
52
|
action?: React.ReactNode;
|
|
53
53
|
};
|
|
54
54
|
export type CardBodyProps = CardBodyBaseProps & BoxProps;
|
|
55
|
+
/**
|
|
56
|
+
* @deprecated Use ContentCardBody instead. This will be removed in a future major release.
|
|
57
|
+
* @deprecationExpectedRemoval v10
|
|
58
|
+
*/
|
|
55
59
|
export declare const CardBody: React.NamedExoticComponent<CardBodyProps>;
|
|
56
60
|
//# sourceMappingURL=CardBody.d.ts.map
|
|
@@ -1 +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"}
|
|
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;;;GAGG;AACH,eAAO,MAAM,QAAQ,2CA0InB,CAAC"}
|
|
@@ -10,5 +10,9 @@ export type CardFooterBaseProps = Pick<
|
|
|
10
10
|
children: React.ReactNode;
|
|
11
11
|
};
|
|
12
12
|
export type CardFooterProps = CardFooterBaseProps & Omit<BoxProps, 'children'>;
|
|
13
|
+
/**
|
|
14
|
+
* @deprecated Use ContentCardFooter instead. This will be removed in a future major release.
|
|
15
|
+
* @deprecationExpectedRemoval v10
|
|
16
|
+
*/
|
|
13
17
|
export declare const CardFooter: React.NamedExoticComponent<CardFooterProps>;
|
|
14
18
|
//# sourceMappingURL=CardFooter.d.ts.map
|
|
@@ -1 +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"}
|
|
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;;;GAGG;AACH,eAAO,MAAM,UAAU,6CAYrB,CAAC"}
|
package/dts/cards/CardGroup.d.ts
CHANGED
|
@@ -1,9 +1,21 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { View } from 'react-native';
|
|
3
3
|
import type { GroupProps, RenderGroupItem } from '../layout/Group';
|
|
4
|
+
/**
|
|
5
|
+
* @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
|
|
6
|
+
* @deprecationExpectedRemoval v10
|
|
7
|
+
*/
|
|
4
8
|
export type CardGroupBaseProps = GroupProps;
|
|
9
|
+
/**
|
|
10
|
+
* @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
|
|
11
|
+
* @deprecationExpectedRemoval v10
|
|
12
|
+
*/
|
|
5
13
|
export type CardGroupProps = CardGroupBaseProps;
|
|
6
14
|
export type CardGroupRenderItem = RenderGroupItem;
|
|
15
|
+
/**
|
|
16
|
+
* @deprecated Use `Box`, `HStack` or `VStack` instead. This will be removed in a future major release.
|
|
17
|
+
* @deprecationExpectedRemoval v10
|
|
18
|
+
*/
|
|
7
19
|
export declare const CardGroup: React.MemoExoticComponent<
|
|
8
20
|
React.ForwardRefExoticComponent<
|
|
9
21
|
import('../styles/styleProps').StyleProps & {
|
|
@@ -1 +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"}
|
|
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;;;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"}
|
|
@@ -1,6 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { CardHeaderProps as CardHeaderBaseProps } from '@coinbase/cds-common/types';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use ContentCardHeaderProps instead. This will be removed in a future major release.
|
|
5
|
+
* @deprecationExpectedRemoval v10
|
|
6
|
+
*/
|
|
3
7
|
export type CardHeaderProps = CardHeaderBaseProps;
|
|
8
|
+
/**
|
|
9
|
+
* @deprecated Use ContentCardHeader instead. This will be removed in a future major release.
|
|
10
|
+
* @deprecationExpectedRemoval v10
|
|
11
|
+
*/
|
|
4
12
|
export declare const CardHeader: React.MemoExoticComponent<
|
|
5
13
|
({
|
|
6
14
|
avatar,
|
|
@@ -1 +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"}
|
|
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;;;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
CHANGED
|
@@ -1,4 +1,12 @@
|
|
|
1
1
|
import type { CardMediaProps as CommonCardMediaProps } from '@coinbase/cds-common/types';
|
|
2
|
+
/**
|
|
3
|
+
* @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.
|
|
4
|
+
* @deprecationExpectedRemoval v10
|
|
5
|
+
*/
|
|
2
6
|
export type CardMediaProps = CommonCardMediaProps;
|
|
7
|
+
/**
|
|
8
|
+
* @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.
|
|
9
|
+
* @deprecationExpectedRemoval v10
|
|
10
|
+
*/
|
|
3
11
|
export declare const CardMedia: import('react').NamedExoticComponent<CommonCardMediaProps>;
|
|
4
12
|
//# sourceMappingURL=CardMedia.d.ts.map
|
|
@@ -1 +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"}
|
|
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;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,oBAAoB,CAAC;AAclD;;;GAGG;AACH,eAAO,MAAM,SAAS,4DAiCpB,CAAC"}
|
|
@@ -16,7 +16,7 @@ export declare const InputIconButton: React.MemoExoticComponent<
|
|
|
16
16
|
Omit<import('../system').PressableBaseProps, 'children'> &
|
|
17
17
|
Pick<
|
|
18
18
|
import('../buttons').ButtonBaseProps,
|
|
19
|
-
'transparent' | 'disabled' | 'loading' | 'compact' | 'flush'
|
|
19
|
+
'transparent' | 'disabled' | 'loading' | 'progressCircleSize' | 'compact' | 'flush'
|
|
20
20
|
> & {
|
|
21
21
|
name: import('@coinbase/cds-common').IconName;
|
|
22
22
|
iconSize?: import('@coinbase/cds-common').IconSize;
|
package/dts/loaders/Spinner.d.ts
CHANGED
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { ActivityIndicatorProps } from 'react-native';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use indeterminate ProgressCircle or ActivityIndicator component instead. This will be removed in a future major release.
|
|
5
|
+
* @deprecationExpectedRemoval v10
|
|
6
|
+
*/
|
|
3
7
|
export declare const Spinner: React.NamedExoticComponent<ActivityIndicatorProps>;
|
|
4
8
|
//# sourceMappingURL=Spinner.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/loaders/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAI3D,eAAO,MAAM,OAAO,oDAoBlB,CAAC"}
|
|
1
|
+
{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/loaders/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAI3D;;;GAGG;AACH,eAAO,MAAM,OAAO,oDAoBlB,CAAC"}
|
|
@@ -7,7 +7,7 @@ export type ProgressBaseProps = SharedProps &
|
|
|
7
7
|
Pick<HintMotionBaseProps, 'disableAnimateOnMount'> &
|
|
8
8
|
Pick<SharedAccessibilityProps, 'accessibilityLabel'> & {
|
|
9
9
|
/** Number between 0-1 representing the progress percentage */
|
|
10
|
-
progress
|
|
10
|
+
progress?: number;
|
|
11
11
|
/** Toggle used to change thickness of progress visualization
|
|
12
12
|
* @default normal
|
|
13
13
|
* */
|
|
@@ -46,7 +46,7 @@ export declare const ProgressBar: React.MemoExoticComponent<
|
|
|
46
46
|
Pick<HintMotionBaseProps, 'disableAnimateOnMount'> &
|
|
47
47
|
Pick<SharedAccessibilityProps, 'accessibilityLabel'> & {
|
|
48
48
|
/** Number between 0-1 representing the progress percentage */
|
|
49
|
-
progress
|
|
49
|
+
progress?: number;
|
|
50
50
|
/** Toggle used to change thickness of progress visualization
|
|
51
51
|
* @default normal
|
|
52
52
|
* */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../src/visualizations/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8E,MAAM,OAAO,CAAC;AACnG,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;
|
|
1
|
+
{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../src/visualizations/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8E,MAAM,OAAO,CAAC;AACnG,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,KAAK,EAAE,wBAAwB,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAMhG,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,MAAM,MAAM,iBAAiB,GAAG,WAAW,GACzC,IAAI,CAAC,mBAAmB,EAAE,uBAAuB,CAAC,GAClD,IAAI,CAAC,wBAAwB,EAAE,oBAAoB,CAAC,GAAG;IACrD,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;SAEK;IACL,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACxB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B,CAAC;AAEJ,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,GAAG;IACjD,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,yEAAyE;IACzE,MAAM,CAAC,EAAE;QACP,mBAAmB;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,4BAA4B;QAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KACjC,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,WAAW;IApCpB,8DAA8D;eACnD,MAAM;IACjB;;SAEK;aACI,MAAM;IACf;;OAEG;eACQ,OAAO;IAClB;;;OAGG;YACK,SAAS,CAAC,KAAK;IACvB;;OAEG;qBACc,MAAM,IAAI;IAC3B;;OAEG;uBACgB,MAAM,IAAI;;YAIvB,SAAS,CAAC,SAAS,CAAC;IAC5B,yEAAyE;aAChE;QACP,mBAAmB;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,4BAA4B;QAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KACjC;+BAiHF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBarWithFloatLabel.d.ts","sourceRoot":"","sources":["../../src/visualizations/ProgressBarWithFloatLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ProgressBarWithFloatLabel.d.ts","sourceRoot":"","sources":["../../src/visualizations/ProgressBarWithFloatLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AACvF,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAM5D,OAAO,EAA4B,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC7F,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAQvD,MAAM,MAAM,0BAA0B,GAAG,IAAI,CAC3C,8BAA8B,EAC9B,OAAO,GAAG,UAAU,GAAG,uBAAuB,GAAG,UAAU,GAAG,gBAAgB,GAAG,QAAQ,CAC1F,CAAC;AAuFF,MAAM,MAAM,8BAA8B,GAAG,IAAI,CAC/C,iBAAiB,EACjB,UAAU,GAAG,uBAAuB,GAAG,UAAU,GAAG,QAAQ,CAC7D,GAAG;IACF,yHAAyH;IACzH,KAAK,EAAE,gBAAgB,CAAC;IACxB;;;SAGK;IACL,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,GAAG,OAAO,CAAC,CAAC;IACvD,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,uFAAuF;IACvF,MAAM,CAAC,EAAE;QACP,mBAAmB;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,8BAA8B;QAC9B,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACtC,oBAAoB;QACpB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KAC9B,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAAK,CAAC,EAAE,CAC9C,KAAK,CAAC,iBAAiB,CAAC,8BAA8B,CAAC,CAkCxD,CAAC"}
|
|
@@ -26,6 +26,10 @@ export type ProgressCircleBaseProps = ProgressBaseProps & {
|
|
|
26
26
|
* Optional component to override the default content rendered inside the circle.
|
|
27
27
|
*/
|
|
28
28
|
contentNode?: React.ReactNode;
|
|
29
|
+
/**
|
|
30
|
+
* Toggle used to show an indeterminate progress circle.
|
|
31
|
+
*/
|
|
32
|
+
indeterminate?: boolean;
|
|
29
33
|
};
|
|
30
34
|
export type ProgressCircleProps = ProgressCircleBaseProps & {
|
|
31
35
|
style?: StyleProp<ViewStyle>;
|
|
@@ -61,7 +65,7 @@ export declare const ProgressCircle: React.MemoExoticComponent<
|
|
|
61
65
|
SharedProps &
|
|
62
66
|
Pick<import('../motion/types').HintMotionBaseProps, 'disableAnimateOnMount'> &
|
|
63
67
|
Pick<import('@coinbase/cds-common').SharedAccessibilityProps, 'accessibilityLabel'> & {
|
|
64
|
-
progress
|
|
68
|
+
progress?: number;
|
|
65
69
|
weight?: import('@coinbase/cds-common').Weight;
|
|
66
70
|
disabled?: boolean;
|
|
67
71
|
color?: ThemeVars.Color;
|
|
@@ -89,6 +93,10 @@ export declare const ProgressCircle: React.MemoExoticComponent<
|
|
|
89
93
|
* Optional component to override the default content rendered inside the circle.
|
|
90
94
|
*/
|
|
91
95
|
contentNode?: React.ReactNode;
|
|
96
|
+
/**
|
|
97
|
+
* Toggle used to show an indeterminate progress circle.
|
|
98
|
+
*/
|
|
99
|
+
indeterminate?: boolean;
|
|
92
100
|
} & {
|
|
93
101
|
style?: StyleProp<ViewStyle>;
|
|
94
102
|
/** Custom styles for individual elements of the ProgressCircle component */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressCircle.d.ts","sourceRoot":"","sources":["../../src/visualizations/ProgressCircle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAY,KAAK,SAAS,
|
|
1
|
+
{"version":3,"file":"ProgressCircle.d.ts","sourceRoot":"","sources":["../../src/visualizations/ProgressCircle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAY,KAAK,SAAS,EAAc,KAAK,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC/F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AASnE,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,WAAW,CAAC;AAG/C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAUvD,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,GAAG;IACxD;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,GAAG;IAC1D,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,4EAA4E;IAC5E,MAAM,CAAC,EAAE;QACP,mBAAmB;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,4BAA4B;QAC5B,YAAY,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACpC,kBAAkB;QAClB,GAAG,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC3B,6BAA6B;QAC7B,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACrC,yCAAyC;QACzC,QAAQ,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;QAChC,gCAAgC;QAChC,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;KAC/B,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG,IAAI,CAC3C,uBAAuB,EACvB,UAAU,GAAG,uBAAuB,GAAG,UAAU,CAClD,GACC,QAAQ,GAAG;IACT;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;CACzB,CAAC;AAoEJ,eAAO,MAAM,cAAc;;;;;;;;IA5HzB;;OAEG;kBACW,OAAO;IACrB;;;;OAIG;eACQ,OAAO;IAClB;;;;;OAKG;WACI,MAAM;IACb;;OAEG;kBACW,KAAK,CAAC,SAAS;IAC7B;;OAEG;oBACa,OAAO;;YAIf,SAAS,CAAC,SAAS,CAAC;IAC5B,4EAA4E;aACnE;QACP,mBAAmB;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,4BAA4B;QAC5B,YAAY,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACpC,kBAAkB;QAClB,GAAG,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC3B,6BAA6B;QAC7B,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACrC,yCAAyC;QACzC,QAAQ,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;QAChC,gCAAgC;QAChC,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;KAC/B;+BA2OF,CAAC"}
|
|
@@ -5,9 +5,9 @@ import { Example, ExampleScreen } from '../../../examples/ExampleScreen';
|
|
|
5
5
|
import { Icon } from '../../../icons';
|
|
6
6
|
import { HStack } from '../../../layout/HStack';
|
|
7
7
|
import { VStack } from '../../../layout/VStack';
|
|
8
|
-
import { Spinner } from '../../../loaders';
|
|
9
8
|
import { Pressable } from '../../../system';
|
|
10
9
|
import { Text } from '../../../typography/Text';
|
|
10
|
+
import { ProgressCircle } from '../../../visualizations/ProgressCircle';
|
|
11
11
|
import { Select } from '../Select';
|
|
12
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
13
|
const exampleOptions = [{
|
|
@@ -680,14 +680,16 @@ const MixedDefaultAndCustomComponentOptions = () => {
|
|
|
680
680
|
} = _ref;
|
|
681
681
|
return /*#__PURE__*/_jsxs(HStack, {
|
|
682
682
|
justifyContent: "center",
|
|
683
|
-
children: [/*#__PURE__*/_jsx(
|
|
684
|
-
|
|
683
|
+
children: [/*#__PURE__*/_jsx(ProgressCircle, {
|
|
684
|
+
indeterminate: true,
|
|
685
|
+
size: 20
|
|
685
686
|
}), /*#__PURE__*/_jsx(Button, {
|
|
686
687
|
transparent: true,
|
|
687
688
|
onPress: () => onPress == null ? void 0 : onPress(value),
|
|
688
689
|
children: value != null ? value : 'Empty value'
|
|
689
|
-
}), /*#__PURE__*/_jsx(
|
|
690
|
-
|
|
690
|
+
}), /*#__PURE__*/_jsx(ProgressCircle, {
|
|
691
|
+
indeterminate: true,
|
|
692
|
+
size: 20
|
|
691
693
|
})]
|
|
692
694
|
});
|
|
693
695
|
};
|
|
@@ -748,16 +750,18 @@ const CustomOptionComponent = () => {
|
|
|
748
750
|
} = _ref3;
|
|
749
751
|
return /*#__PURE__*/_jsxs(HStack, {
|
|
750
752
|
justifyContent: "center",
|
|
751
|
-
children: [/*#__PURE__*/_jsx(
|
|
752
|
-
|
|
753
|
+
children: [/*#__PURE__*/_jsx(ProgressCircle, {
|
|
754
|
+
indeterminate: true,
|
|
755
|
+
size: 20
|
|
753
756
|
}), /*#__PURE__*/_jsx(Button, {
|
|
754
757
|
transparent: true,
|
|
755
758
|
onPress: () => onPress == null ? void 0 : onPress(value),
|
|
756
759
|
children: /*#__PURE__*/_jsx(Text, {
|
|
757
760
|
children: value != null ? value : 'Empty value'
|
|
758
761
|
})
|
|
759
|
-
}), /*#__PURE__*/_jsx(
|
|
760
|
-
|
|
762
|
+
}), /*#__PURE__*/_jsx(ProgressCircle, {
|
|
763
|
+
indeterminate: true,
|
|
764
|
+
size: 20
|
|
761
765
|
})]
|
|
762
766
|
});
|
|
763
767
|
};
|
package/esm/buttons/Button.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
const _excluded = ["variant", "loading", "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"];
|
|
1
|
+
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"];
|
|
2
2
|
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); }
|
|
3
3
|
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; }
|
|
4
4
|
import React, { forwardRef, isValidElement, memo, useCallback, useMemo } from 'react';
|
|
5
|
-
import {
|
|
5
|
+
import { StyleSheet } from 'react-native';
|
|
6
6
|
import { transparentVariants, variants } from '@coinbase/cds-common/tokens/button';
|
|
7
7
|
import { interactableHeight } from '@coinbase/cds-common/tokens/interactableHeight';
|
|
8
8
|
import { getButtonSpacingProps } from '@coinbase/cds-common/utils/getButtonSpacingProps';
|
|
@@ -11,7 +11,9 @@ import { Icon } from '../icons/Icon';
|
|
|
11
11
|
import { HStack } from '../layout/HStack';
|
|
12
12
|
import { Pressable } from '../system/Pressable';
|
|
13
13
|
import { Text } from '../typography/Text';
|
|
14
|
+
import { ProgressCircle } from '../visualizations/ProgressCircle';
|
|
14
15
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
|
+
const defaultProgressCircleSize = 24;
|
|
15
17
|
export const styles = StyleSheet.create({
|
|
16
18
|
inline: {
|
|
17
19
|
width: 'auto',
|
|
@@ -32,6 +34,7 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
|
|
|
32
34
|
let {
|
|
33
35
|
variant = 'primary',
|
|
34
36
|
loading,
|
|
37
|
+
progressCircleSize = defaultProgressCircleSize,
|
|
35
38
|
transparent,
|
|
36
39
|
block,
|
|
37
40
|
compact,
|
|
@@ -58,8 +61,16 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
|
|
|
58
61
|
borderColor,
|
|
59
62
|
borderWidth = 100,
|
|
60
63
|
borderRadius = compact ? 700 : 900,
|
|
64
|
+
height = interactableHeight[compact ? 'compact' : 'regular'],
|
|
61
65
|
accessibilityLabel,
|
|
62
|
-
accessibilityHint
|
|
66
|
+
accessibilityHint,
|
|
67
|
+
padding,
|
|
68
|
+
paddingStart,
|
|
69
|
+
paddingEnd,
|
|
70
|
+
paddingTop,
|
|
71
|
+
paddingBottom,
|
|
72
|
+
paddingX: paddingXProp,
|
|
73
|
+
paddingY: paddingYProp
|
|
63
74
|
} = _ref,
|
|
64
75
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
65
76
|
const theme = useTheme();
|
|
@@ -72,7 +83,6 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
|
|
|
72
83
|
const borderColorValue = borderColor != null ? borderColor : variantStyle.borderColor;
|
|
73
84
|
const sizingStyle = block ? styles.block : styles.inline;
|
|
74
85
|
const justifyContent = flush ? 'flex-start' : hasIcon ? 'space-between' : 'center';
|
|
75
|
-
const minHeight = interactableHeight[compact ? 'compact' : 'regular'];
|
|
76
86
|
const {
|
|
77
87
|
paddingX,
|
|
78
88
|
paddingY,
|
|
@@ -107,6 +117,7 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
|
|
|
107
117
|
borderRadius: borderRadius,
|
|
108
118
|
borderWidth: borderWidth,
|
|
109
119
|
feedback: feedback,
|
|
120
|
+
height: height,
|
|
110
121
|
loading: loading,
|
|
111
122
|
marginEnd: marginEnd,
|
|
112
123
|
marginStart: marginStart,
|
|
@@ -119,13 +130,20 @@ export const Button = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Button(
|
|
|
119
130
|
alignItems: "center",
|
|
120
131
|
flexWrap: "nowrap",
|
|
121
132
|
justifyContent: justifyContent,
|
|
122
|
-
minHeight:
|
|
123
|
-
|
|
124
|
-
|
|
133
|
+
minHeight: height,
|
|
134
|
+
padding: padding,
|
|
135
|
+
paddingBottom: paddingBottom,
|
|
136
|
+
paddingEnd: paddingEnd,
|
|
137
|
+
paddingStart: paddingStart,
|
|
138
|
+
paddingTop: paddingTop,
|
|
139
|
+
paddingX: paddingXProp != null ? paddingXProp : paddingX,
|
|
140
|
+
paddingY: paddingYProp != null ? paddingYProp : paddingY,
|
|
125
141
|
style: sizingStyle,
|
|
126
|
-
children: loading ? /*#__PURE__*/_jsx(
|
|
127
|
-
|
|
128
|
-
|
|
142
|
+
children: loading ? /*#__PURE__*/_jsx(ProgressCircle, {
|
|
143
|
+
indeterminate: true,
|
|
144
|
+
color: colorValue,
|
|
145
|
+
size: progressCircleSize,
|
|
146
|
+
weight: "thin"
|
|
129
147
|
}) : /*#__PURE__*/_jsxs(_Fragment, {
|
|
130
148
|
children: [start != null ? start : startIcon ? /*#__PURE__*/_jsx(Icon, {
|
|
131
149
|
active: startIconActive,
|
|
@@ -5,17 +5,17 @@ import React, { forwardRef, memo, useMemo } from 'react';
|
|
|
5
5
|
import { StyleSheet } from 'react-native';
|
|
6
6
|
import { variants } from '@coinbase/cds-common/tokens/button';
|
|
7
7
|
import { animated, useChain, useSpring, useSpringRef } from '@react-spring/native';
|
|
8
|
-
import { useTheme } from '../hooks/useTheme';
|
|
9
8
|
import { Icon } from '../icons/Icon';
|
|
10
9
|
import { Box } from '../layout/Box';
|
|
11
|
-
import { Spinner } from '../loaders/Spinner';
|
|
12
10
|
import { Pressable } from '../system/Pressable';
|
|
13
11
|
import { TextHeadline } from '../typography/TextHeadline';
|
|
12
|
+
import { ProgressCircle } from '../visualizations/ProgressCircle';
|
|
14
13
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
15
14
|
export const animationConfig = {
|
|
16
15
|
tension: 300,
|
|
17
16
|
clamp: true
|
|
18
17
|
};
|
|
18
|
+
const progressCircleSize = 24;
|
|
19
19
|
export const styles = StyleSheet.create({
|
|
20
20
|
base: {
|
|
21
21
|
width: '100%',
|
|
@@ -39,7 +39,6 @@ export const SlideButtonHandleChecked = /*#__PURE__*/memo(_ref => {
|
|
|
39
39
|
end,
|
|
40
40
|
compact
|
|
41
41
|
} = _ref;
|
|
42
|
-
const theme = useTheme();
|
|
43
42
|
const handleWidth = compact ? 40 : 56;
|
|
44
43
|
return /*#__PURE__*/_jsxs(Box, {
|
|
45
44
|
alignItems: "center",
|
|
@@ -55,9 +54,11 @@ export const SlideButtonHandleChecked = /*#__PURE__*/memo(_ref => {
|
|
|
55
54
|
justifyContent: "center",
|
|
56
55
|
pin: "right",
|
|
57
56
|
width: handleWidth,
|
|
58
|
-
children: end != null ? end : /*#__PURE__*/_jsx(
|
|
59
|
-
|
|
60
|
-
|
|
57
|
+
children: end != null ? end : /*#__PURE__*/_jsx(ProgressCircle, {
|
|
58
|
+
indeterminate: true,
|
|
59
|
+
color: "fgInverse",
|
|
60
|
+
size: progressCircleSize,
|
|
61
|
+
weight: "thin"
|
|
61
62
|
})
|
|
62
63
|
})]
|
|
63
64
|
});
|