@coinbase/cds-mobile 8.58.0 → 8.59.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 +6 -0
- package/dts/controls/Checkbox.d.ts +6 -1
- package/dts/controls/Checkbox.d.ts.map +1 -1
- package/dts/controls/CheckboxCell.d.ts +1 -1
- package/dts/controls/CheckboxCell.d.ts.map +1 -1
- package/dts/controls/Control.d.ts +11 -0
- package/dts/controls/Control.d.ts.map +1 -1
- package/dts/controls/Radio.d.ts +11 -1
- package/dts/controls/Radio.d.ts.map +1 -1
- package/dts/controls/RadioCell.d.ts +1 -1
- package/dts/controls/RadioCell.d.ts.map +1 -1
- package/dts/controls/Switch.d.ts +1 -1
- package/dts/controls/Switch.d.ts.map +1 -1
- package/esm/controls/Checkbox.js +3 -2
- package/esm/controls/CheckboxCell.js +3 -1
- package/esm/controls/Control.js +7 -3
- package/esm/controls/Radio.js +7 -3
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -8,6 +8,12 @@ All notable changes to this project will be documented in this file.
|
|
|
8
8
|
|
|
9
9
|
<!-- template-start -->
|
|
10
10
|
|
|
11
|
+
## 8.59.0 (3/27/2026 PST)
|
|
12
|
+
|
|
13
|
+
#### 🚀 Updates
|
|
14
|
+
|
|
15
|
+
- Support controlSize on Checkbox and Radio. [[#546](https://github.com/coinbase/cds/pull/546)]
|
|
16
|
+
|
|
11
17
|
## 8.58.0 (3/25/2026 PST)
|
|
12
18
|
|
|
13
19
|
#### 🚀 Updates
|
|
@@ -4,7 +4,7 @@ import type { ThemeVars } from '@coinbase/cds-common';
|
|
|
4
4
|
import { type ControlBaseProps } from './Control';
|
|
5
5
|
export type CheckboxBaseProps<CheckboxValue extends string> = Omit<
|
|
6
6
|
ControlBaseProps<CheckboxValue>,
|
|
7
|
-
'controlColor'
|
|
7
|
+
'controlColor' | 'controlSize' | 'dotSize'
|
|
8
8
|
> & {
|
|
9
9
|
/**
|
|
10
10
|
* Sets the checked/active color of the checkbox.
|
|
@@ -16,6 +16,11 @@ export type CheckboxBaseProps<CheckboxValue extends string> = Omit<
|
|
|
16
16
|
* @default 100
|
|
17
17
|
*/
|
|
18
18
|
borderWidth?: ThemeVars.BorderWidth;
|
|
19
|
+
/**
|
|
20
|
+
* Sets the outer checkbox control size in pixels.
|
|
21
|
+
* @default theme.controlSize.checkboxSize
|
|
22
|
+
*/
|
|
23
|
+
controlSize?: number;
|
|
19
24
|
};
|
|
20
25
|
export type CheckboxProps<CheckboxValue extends string> = CheckboxBaseProps<CheckboxValue>;
|
|
21
26
|
declare const CheckboxWithRef: <CheckboxValue extends string>(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../src/controls/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAMtD,OAAO,EAAW,KAAK,gBAAgB,EAAyB,MAAM,WAAW,CAAC;AAElF,MAAM,MAAM,iBAAiB,CAAC,aAAa,SAAS,MAAM,IAAI,IAAI,CAChE,gBAAgB,CAAC,aAAa,CAAC,EAC/B,cAAc,
|
|
1
|
+
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../src/controls/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAMtD,OAAO,EAAW,KAAK,gBAAgB,EAAyB,MAAM,WAAW,CAAC;AAElF,MAAM,MAAM,iBAAiB,CAAC,aAAa,SAAS,MAAM,IAAI,IAAI,CAChE,gBAAgB,CAAC,aAAa,CAAC,EAC/B,cAAc,GAAG,aAAa,GAAG,SAAS,CAC3C,GAAG;IACF;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC/B;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IACpC;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,aAAa,SAAS,MAAM,IAAI,iBAAiB,CAAC,aAAa,CAAC,CAAC;AAwE3F,QAAA,MAAM,eAAe,EAiCf,CAAC,aAAa,SAAS,MAAM,EACjC,KAAK,EAAE,aAAa,CAAC,aAAa,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAA;CAAE,KAC5D,KAAK,CAAC,YAAY,CAAC;AAGxB,eAAO,MAAM,QAAQ,EAA4B,OAAO,eAAe,GACrE,KAAK,CAAC,mBAAmB,CAAC,OAAO,eAAe,CAAC,CAAC"}
|
|
@@ -10,7 +10,7 @@ export type CheckboxCellBaseProps<CheckboxValue extends string> = {
|
|
|
10
10
|
rowGap?: ThemeVars.Space;
|
|
11
11
|
pressedBorderColor?: ThemeVars.Color;
|
|
12
12
|
pressedBorderWidth?: ThemeVars.BorderWidth;
|
|
13
|
-
} & Omit<ControlBaseProps<CheckboxValue>, 'style' | 'children' | 'title'> &
|
|
13
|
+
} & Omit<ControlBaseProps<CheckboxValue>, 'style' | 'children' | 'title' | 'dotSize'> &
|
|
14
14
|
Omit<PressableBaseProps, 'children' | 'noScaleOnPress'>;
|
|
15
15
|
export type CheckboxCellProps<CheckboxValue extends string> =
|
|
16
16
|
CheckboxCellBaseProps<CheckboxValue> & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxCell.d.ts","sourceRoot":"","sources":["../../src/controls/CheckboxCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAMjE,OAAO,EAAa,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAIzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,qBAAqB,CAAC,aAAa,SAAS,MAAM,IAAI;IAChE,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC5B,MAAM,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACzB,kBAAkB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACrC,kBAAkB,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;CAC5C,GAAG,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,OAAO,CAAC,
|
|
1
|
+
{"version":3,"file":"CheckboxCell.d.ts","sourceRoot":"","sources":["../../src/controls/CheckboxCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAMjE,OAAO,EAAa,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAIzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,qBAAqB,CAAC,aAAa,SAAS,MAAM,IAAI;IAChE,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC5B,MAAM,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACzB,kBAAkB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACrC,kBAAkB,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;CAC5C,GAAG,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,SAAS,CAAC,GACnF,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,gBAAgB,CAAC,CAAC;AAE1D,MAAM,MAAM,iBAAiB,CAAC,aAAa,SAAS,MAAM,IACxD,qBAAqB,CAAC,aAAa,CAAC,GAAG;IACrC,MAAM,CAAC,EAAE;QACP,mBAAmB;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,uCAAuC;QACvC,iBAAiB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACzC,gCAAgC;QAChC,gBAAgB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACxC,yBAAyB;QACzB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC7B,+BAA+B;QAC/B,WAAW,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KACpC,CAAC;CACH,CAAC;AAEJ,QAAA,MAAM,mBAAmB,EA2MnB,CAAC,aAAa,SAAS,MAAM,EACjC,KAAK,EAAE,iBAAiB,CAAC,aAAa,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAA;CAAE,KACzE,KAAK,CAAC,YAAY,CAAC;AAExB,eAAO,MAAM,YAAY,EAAgC,OAAO,mBAAmB,GACjF,KAAK,CAAC,mBAAmB,CAAC,OAAO,mBAAmB,CAAC,CAAC"}
|
|
@@ -16,6 +16,8 @@ export type ControlIconProps = SharedProps & {
|
|
|
16
16
|
borderRadius?: ThemeVars.BorderRadius;
|
|
17
17
|
borderWidth?: ThemeVars.BorderWidth;
|
|
18
18
|
elevation?: ElevationLevels;
|
|
19
|
+
controlSize?: number;
|
|
20
|
+
dotSize?: number;
|
|
19
21
|
animatedScaleValue: Animated.Value;
|
|
20
22
|
animatedOpacityValue: Animated.Value;
|
|
21
23
|
accessible?: boolean;
|
|
@@ -52,6 +54,15 @@ export type ControlBaseProps<ControlValue extends string> = Omit<
|
|
|
52
54
|
controlColor?: ThemeVars.Color;
|
|
53
55
|
/** Sets the elevation/drop shadow of the control. */
|
|
54
56
|
elevation?: ElevationLevels;
|
|
57
|
+
/**
|
|
58
|
+
* Sets the control size in pixels.
|
|
59
|
+
*/
|
|
60
|
+
controlSize?: number;
|
|
61
|
+
/**
|
|
62
|
+
* Sets the inner dot size in pixels.
|
|
63
|
+
* @default 2/3 of controlSize
|
|
64
|
+
*/
|
|
65
|
+
dotSize?: number;
|
|
55
66
|
style?: ViewStyle;
|
|
56
67
|
};
|
|
57
68
|
export type ControlProps<ControlValue extends string> = Omit<
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Control.d.ts","sourceRoot":"","sources":["../../src/controls/Control.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoE,MAAM,OAAO,CAAC;AACzF,OAAO,EAAoC,IAAI,EAAE,MAAM,cAAc,CAAC;AACtE,OAAO,KAAK,EAEV,QAAQ,EACR,cAAc,EAEd,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACzE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAQjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAC;AACvD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAMpD,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG;IAC3C,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC/B,UAAU,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC7B,WAAW,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC9B,YAAY,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC;IACtC,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IACpC,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,kBAAkB,EAAE,QAAQ,CAAC,KAAK,CAAC;IACnC,oBAAoB,EAAE,QAAQ,CAAC,KAAK,CAAC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,YAAY,SAAS,MAAM,IAAI,IAAI,CAC9D,cAAc,EACd,UAAU,GAAG,UAAU,GAAG,OAAO,CAClC,GACC,OAAO,CACL,IAAI,CACF,qBAAqB,EACrB,YAAY,GAAG,aAAa,GAAG,cAAc,GAAG,aAAa,GAAG,OAAO,CACxE,CACF,GAAG;IACF,oCAAoC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,sCAAsC;IACtC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uDAAuD;IACvD,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,kDAAkD;IAClD,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qHAAqH;IACrH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,GAAG,SAAS,EAAE,OAAO,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACxE;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC/B,qDAAqD;IACrD,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC;AAEJ,MAAM,MAAM,YAAY,CAAC,YAAY,SAAS,MAAM,IAAI,IAAI,CAC1D,gBAAgB,CAAC,YAAY,CAAC,EAC9B,UAAU,CACX,GAAG;IACF,4BAA4B;IAC5B,QAAQ,EAAE,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC,CAAC;IACzE,gEAAgE;IAChE,KAAK,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IAC9B,iEAAiE;IACjE,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACrC,CAAC;AAEF,QAAA,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"Control.d.ts","sourceRoot":"","sources":["../../src/controls/Control.tsx"],"names":[],"mappings":"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"}
|
package/dts/controls/Radio.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ import type { ThemeVars } from '@coinbase/cds-common';
|
|
|
4
4
|
import { type ControlBaseProps } from './Control';
|
|
5
5
|
export type RadioBaseProps<RadioValue extends string> = Omit<
|
|
6
6
|
ControlBaseProps<RadioValue>,
|
|
7
|
-
'controlColor'
|
|
7
|
+
'controlColor' | 'controlSize' | 'dotSize'
|
|
8
8
|
> & {
|
|
9
9
|
/**
|
|
10
10
|
* Sets the checked/active color of the radio.
|
|
@@ -16,6 +16,16 @@ export type RadioBaseProps<RadioValue extends string> = Omit<
|
|
|
16
16
|
* @default 100
|
|
17
17
|
*/
|
|
18
18
|
borderWidth?: ThemeVars.BorderWidth;
|
|
19
|
+
/**
|
|
20
|
+
* Sets the outer radio control size in pixels.
|
|
21
|
+
* @default theme.controlSize.radioSize
|
|
22
|
+
*/
|
|
23
|
+
controlSize?: number;
|
|
24
|
+
/**
|
|
25
|
+
* Sets the inner dot size in pixels.
|
|
26
|
+
* @default 2/3 of controlSize
|
|
27
|
+
*/
|
|
28
|
+
dotSize?: number;
|
|
19
29
|
};
|
|
20
30
|
export type RadioProps<RadioValue extends string> = RadioBaseProps<RadioValue>;
|
|
21
31
|
declare const RadioWithRef: <RadioValue extends string>(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/controls/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,EAAyC,KAAK,IAAI,EAAE,MAAM,cAAc,CAAC;AAEhF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAMtD,OAAO,EAAW,KAAK,gBAAgB,EAAyB,MAAM,WAAW,CAAC;AASlF,MAAM,MAAM,cAAc,CAAC,UAAU,SAAS,MAAM,IAAI,IAAI,CAC1D,gBAAgB,CAAC,UAAU,CAAC,EAC5B,cAAc,
|
|
1
|
+
{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/controls/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,EAAyC,KAAK,IAAI,EAAE,MAAM,cAAc,CAAC;AAEhF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAMtD,OAAO,EAAW,KAAK,gBAAgB,EAAyB,MAAM,WAAW,CAAC;AASlF,MAAM,MAAM,cAAc,CAAC,UAAU,SAAS,MAAM,IAAI,IAAI,CAC1D,gBAAgB,CAAC,UAAU,CAAC,EAC5B,cAAc,GAAG,aAAa,GAAG,SAAS,CAC3C,GAAG;IACF;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC/B;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IACpC;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,UAAU,SAAS,MAAM,IAAI,cAAc,CAAC,UAAU,CAAC,CAAC;AAkE/E,QAAA,MAAM,YAAY,EAsBZ,CAAC,UAAU,SAAS,MAAM,EAC9B,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAA;CAAE,KACtD,KAAK,CAAC,YAAY,CAAC;AAGxB,eAAO,MAAM,KAAK,EAAyB,OAAO,YAAY,GAC5D,KAAK,CAAC,mBAAmB,CAAC,OAAO,YAAY,CAAC,CAAC"}
|
|
@@ -10,7 +10,7 @@ export type RadioCellBaseProps<RadioValue extends string> = {
|
|
|
10
10
|
rowGap?: ThemeVars.Space;
|
|
11
11
|
pressedBorderColor?: ThemeVars.Color;
|
|
12
12
|
pressedBorderWidth?: ThemeVars.BorderWidth;
|
|
13
|
-
} & Omit<ControlBaseProps<RadioValue>, 'style' | 'children' | 'title'> &
|
|
13
|
+
} & Omit<ControlBaseProps<RadioValue>, 'style' | 'children' | 'title' | 'controlSize' | 'dotSize'> &
|
|
14
14
|
Omit<PressableProps, 'children' | 'noScaleOnPress'>;
|
|
15
15
|
export type RadioCellProps<RadioValue extends string> = RadioCellBaseProps<RadioValue> & {
|
|
16
16
|
styles?: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioCell.d.ts","sourceRoot":"","sources":["../../src/controls/RadioCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAMjE,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAGrE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAGlD,MAAM,MAAM,kBAAkB,CAAC,UAAU,SAAS,MAAM,IAAI;IAC1D,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC5B,MAAM,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACzB,kBAAkB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACrC,kBAAkB,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;CAC5C,GAAG,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,OAAO,CAAC,
|
|
1
|
+
{"version":3,"file":"RadioCell.d.ts","sourceRoot":"","sources":["../../src/controls/RadioCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAMjE,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAGrE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAGlD,MAAM,MAAM,kBAAkB,CAAC,UAAU,SAAS,MAAM,IAAI;IAC1D,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC5B,MAAM,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACzB,kBAAkB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACrC,kBAAkB,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;CAC5C,GAAG,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,aAAa,GAAG,SAAS,CAAC,GAChG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,gBAAgB,CAAC,CAAC;AAEtD,MAAM,MAAM,cAAc,CAAC,UAAU,SAAS,MAAM,IAAI,kBAAkB,CAAC,UAAU,CAAC,GAAG;IACvF,MAAM,CAAC,EAAE;QACP,mBAAmB;QACnB,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,oCAAoC;QACpC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACtC,gCAAgC;QAChC,gBAAgB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QACxC,yBAAyB;QACzB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC7B,+BAA+B;QAC/B,WAAW,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KACpC,CAAC;CACH,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAwMhB,CAAC,UAAU,SAAS,MAAM,EAC9B,KAAK,EAAE,cAAc,CAAC,UAAU,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAA;CAAE,KACnE,KAAK,CAAC,YAAY,CAAC;AAExB,eAAO,MAAM,SAAS,EAA6B,OAAO,gBAAgB,GACxE,KAAK,CAAC,mBAAmB,CAAC,OAAO,gBAAgB,CAAC,CAAC"}
|
package/dts/controls/Switch.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import { type View } from 'react-native';
|
|
|
3
3
|
import { type ControlBaseProps } from './Control';
|
|
4
4
|
export type SwitchBaseProps<SwitchValue extends string> = Omit<
|
|
5
5
|
ControlBaseProps<SwitchValue>,
|
|
6
|
-
'style'
|
|
6
|
+
'style' | 'controlSize' | 'dotSize'
|
|
7
7
|
>;
|
|
8
8
|
export type SwitchProps<SwitchValue extends string> = SwitchBaseProps<SwitchValue>;
|
|
9
9
|
export declare const Switch: React.MemoExoticComponent<
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/controls/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AACzD,OAAO,EAAc,KAAK,IAAI,EAAE,MAAM,cAAc,CAAC;AAMrD,OAAO,EAAW,KAAK,gBAAgB,EAAyB,MAAM,WAAW,CAAC;AAElF,MAAM,MAAM,eAAe,CAAC,WAAW,SAAS,MAAM,IAAI,IAAI,CAC5D,gBAAgB,CAAC,WAAW,CAAC,EAC7B,OAAO,
|
|
1
|
+
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/controls/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AACzD,OAAO,EAAc,KAAK,IAAI,EAAE,MAAM,cAAc,CAAC;AAMrD,OAAO,EAAW,KAAK,gBAAgB,EAAyB,MAAM,WAAW,CAAC;AAElF,MAAM,MAAM,eAAe,CAAC,WAAW,SAAS,MAAM,IAAI,IAAI,CAC5D,gBAAgB,CAAC,WAAW,CAAC,EAC7B,OAAO,GAAG,aAAa,GAAG,SAAS,CACpC,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,WAAW,SAAS,MAAM,IAAI,eAAe,CAAC,WAAW,CAAC,CAAC;AA+GnF,eAAO,MAAM,MAAM,6GAAsB,CAAC"}
|
package/esm/controls/Checkbox.js
CHANGED
|
@@ -22,11 +22,12 @@ const CheckboxIcon = /*#__PURE__*/memo(_ref => {
|
|
|
22
22
|
elevation,
|
|
23
23
|
animatedScaleValue,
|
|
24
24
|
animatedOpacityValue,
|
|
25
|
-
testID
|
|
25
|
+
testID,
|
|
26
|
+
controlSize
|
|
26
27
|
} = _ref;
|
|
27
28
|
const filled = checked || indeterminate;
|
|
28
29
|
const theme = useTheme();
|
|
29
|
-
const checkboxSize = theme.controlSize.checkboxSize;
|
|
30
|
+
const checkboxSize = controlSize != null ? controlSize : theme.controlSize.checkboxSize;
|
|
30
31
|
const iconPadding = checkboxSize / 5;
|
|
31
32
|
const iconSize = checkboxSize - iconPadding;
|
|
32
33
|
const animatedStyle = useMemo(() => ({
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const _excluded = ["title", "description", "checked", "onChange", "disabled", "columnGap", "rowGap", "padding", "borderWidth", "borderRadius", "background", "borderColor", "controlColor", "accessibilityLabel", "accessibilityHint", "testID", "value", "width", "style", "contentStyle", "wrapperStyles", "onPressIn", "onPressOut", "pressedBorderColor", "pressedBorderWidth", "indeterminate", "readOnly", "styles"];
|
|
1
|
+
const _excluded = ["title", "description", "checked", "onChange", "disabled", "columnGap", "rowGap", "padding", "borderWidth", "borderRadius", "background", "borderColor", "controlColor", "controlSize", "accessibilityLabel", "accessibilityHint", "testID", "value", "width", "style", "contentStyle", "wrapperStyles", "onPressIn", "onPressOut", "pressedBorderColor", "pressedBorderWidth", "indeterminate", "readOnly", "styles"];
|
|
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, memo, useCallback, useMemo, useState } from 'react';
|
|
@@ -26,6 +26,7 @@ const CheckboxCellWithRef = /*#__PURE__*/forwardRef(function CheckboxCell(_ref,
|
|
|
26
26
|
background = 'bg',
|
|
27
27
|
borderColor = 'bgLine',
|
|
28
28
|
controlColor,
|
|
29
|
+
controlSize,
|
|
29
30
|
accessibilityLabel,
|
|
30
31
|
accessibilityHint,
|
|
31
32
|
testID,
|
|
@@ -157,6 +158,7 @@ const CheckboxCellWithRef = /*#__PURE__*/forwardRef(function CheckboxCell(_ref,
|
|
|
157
158
|
accessible: false,
|
|
158
159
|
checked: !!checked,
|
|
159
160
|
controlColor: controlColor,
|
|
161
|
+
controlSize: controlSize,
|
|
160
162
|
disabled: disabled,
|
|
161
163
|
indeterminate: indeterminate,
|
|
162
164
|
pointerEvents: "none",
|
package/esm/controls/Control.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const _excluded = ["testID", "label", "checked", "indeterminate", "disabled", "readOnly", "onChange", "hitSlop", "value", "controlColor", "elevation", "accessibilityRole", "accessibilityLabel", "accessibilityHint", "children", "shouldUseSwitchTransition", "accessible", "style", "color", "background", "borderColor", "borderRadius", "borderWidth"];
|
|
1
|
+
const _excluded = ["testID", "label", "checked", "indeterminate", "disabled", "readOnly", "onChange", "hitSlop", "value", "controlColor", "elevation", "accessibilityRole", "accessibilityLabel", "accessibilityHint", "children", "shouldUseSwitchTransition", "accessible", "style", "color", "background", "borderColor", "borderRadius", "borderWidth", "controlSize", "dotSize"];
|
|
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, memo, useCallback, useEffect, useMemo, useRef } from 'react';
|
|
@@ -34,7 +34,9 @@ const ControlWithRef = /*#__PURE__*/forwardRef(function ControlWithRef(_ref, ref
|
|
|
34
34
|
background,
|
|
35
35
|
borderColor,
|
|
36
36
|
borderRadius,
|
|
37
|
-
borderWidth
|
|
37
|
+
borderWidth,
|
|
38
|
+
controlSize,
|
|
39
|
+
dotSize
|
|
38
40
|
} = _ref,
|
|
39
41
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
40
42
|
const theme = useTheme();
|
|
@@ -115,7 +117,9 @@ const ControlWithRef = /*#__PURE__*/forwardRef(function ControlWithRef(_ref, ref
|
|
|
115
117
|
borderWidth: borderWidth,
|
|
116
118
|
checked: checked,
|
|
117
119
|
controlColor: controlColor,
|
|
120
|
+
controlSize: controlSize,
|
|
118
121
|
disabled: pressDisabled,
|
|
122
|
+
dotSize: dotSize,
|
|
119
123
|
elevation: elevation,
|
|
120
124
|
indeterminate: indeterminate,
|
|
121
125
|
pressed: pressed,
|
|
@@ -137,7 +141,7 @@ const ControlWithRef = /*#__PURE__*/forwardRef(function ControlWithRef(_ref, ref
|
|
|
137
141
|
children: label
|
|
138
142
|
})]
|
|
139
143
|
});
|
|
140
|
-
}, [ControlIcon, animatedOpacityValue, animatedScaleValue, background, borderColor, borderRadius, borderWidth, checked, controlColor, disabled, elevation, getLabelStyle, iconWrapperStyles, indeterminate, label, pressDisabled, readOnly, testID]);
|
|
144
|
+
}, [ControlIcon, animatedOpacityValue, animatedScaleValue, background, borderColor, borderRadius, borderWidth, checked, controlColor, controlSize, disabled, dotSize, elevation, getLabelStyle, iconWrapperStyles, indeterminate, label, pressDisabled, readOnly, testID]);
|
|
141
145
|
return /*#__PURE__*/_jsx(Pressable, _extends({
|
|
142
146
|
ref: ref,
|
|
143
147
|
accessible: accessible
|
package/esm/controls/Radio.js
CHANGED
|
@@ -18,7 +18,8 @@ const styles = StyleSheet.create({
|
|
|
18
18
|
const DotSvg = _ref => {
|
|
19
19
|
let {
|
|
20
20
|
color = 'black',
|
|
21
|
-
width = 20
|
|
21
|
+
width = 20,
|
|
22
|
+
dotSize = 2 * width / 3
|
|
22
23
|
} = _ref;
|
|
23
24
|
return /*#__PURE__*/_jsx(Svg, {
|
|
24
25
|
fill: "none",
|
|
@@ -29,7 +30,7 @@ const DotSvg = _ref => {
|
|
|
29
30
|
cx: "50%",
|
|
30
31
|
cy: "50%",
|
|
31
32
|
fill: color,
|
|
32
|
-
r:
|
|
33
|
+
r: dotSize / 2
|
|
33
34
|
})
|
|
34
35
|
});
|
|
35
36
|
};
|
|
@@ -45,11 +46,13 @@ const RadioIcon = _ref2 => {
|
|
|
45
46
|
animatedScaleValue,
|
|
46
47
|
animatedOpacityValue,
|
|
47
48
|
controlColor = 'bgPrimary',
|
|
49
|
+
controlSize,
|
|
50
|
+
dotSize,
|
|
48
51
|
borderColor = checked ? controlColor : 'bgLineHeavy',
|
|
49
52
|
testID
|
|
50
53
|
} = _ref2;
|
|
51
54
|
const theme = useTheme();
|
|
52
|
-
const radioSize = theme.controlSize.radioSize;
|
|
55
|
+
const radioSize = controlSize != null ? controlSize : theme.controlSize.radioSize;
|
|
53
56
|
return /*#__PURE__*/_jsx(Interactable, {
|
|
54
57
|
background: background,
|
|
55
58
|
borderColor: borderColor,
|
|
@@ -74,6 +77,7 @@ const RadioIcon = _ref2 => {
|
|
|
74
77
|
testID: "radio-icon",
|
|
75
78
|
children: /*#__PURE__*/_jsx(DotSvg, {
|
|
76
79
|
color: theme.color[controlColor],
|
|
80
|
+
dotSize: dotSize,
|
|
77
81
|
width: radioSize
|
|
78
82
|
})
|
|
79
83
|
})
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coinbase/cds-mobile",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.59.0",
|
|
4
4
|
"description": "Coinbase Design System - Mobile",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -197,9 +197,9 @@
|
|
|
197
197
|
"react-native-svg": "^14.1.0"
|
|
198
198
|
},
|
|
199
199
|
"dependencies": {
|
|
200
|
-
"@coinbase/cds-common": "^8.
|
|
200
|
+
"@coinbase/cds-common": "^8.59.0",
|
|
201
201
|
"@coinbase/cds-icons": "^5.13.0",
|
|
202
|
-
"@coinbase/cds-illustrations": "^4.
|
|
202
|
+
"@coinbase/cds-illustrations": "^4.36.0",
|
|
203
203
|
"@coinbase/cds-lottie-files": "^3.3.4",
|
|
204
204
|
"@coinbase/cds-utils": "^2.3.5",
|
|
205
205
|
"@floating-ui/react-native": "^0.10.5",
|