@coinbase/cds-mobile 9.26.0 → 9.26.2
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 +17 -0
- package/dts/controls/CheckboxCell.d.ts +5 -1
- package/dts/controls/CheckboxCell.d.ts.map +1 -1
- package/dts/controls/Control.d.ts.map +1 -1
- package/dts/controls/HelperText.d.ts.map +1 -1
- package/dts/controls/RadioCell.d.ts +5 -1
- package/dts/controls/RadioCell.d.ts.map +1 -1
- package/dts/controls/TextInput.d.ts.map +1 -1
- package/esm/controls/Control.js +2 -1
- package/esm/controls/HelperText.js +37 -37
- package/esm/controls/TextInput.js +16 -2
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,20 @@
|
|
|
1
|
+
## 9.26.2 (2026-09-11)
|
|
2
|
+
|
|
3
|
+
### 🩹 Fixes
|
|
4
|
+
|
|
5
|
+
- Fix: vertically align the helper-text error icon with the text in web and mobile inputs.
|
|
6
|
+
- Fix: dismiss the Android soft keyboard when the mobile `TextInput` unmounts while focused.
|
|
7
|
+
|
|
8
|
+
### 🧱 Updated Dependencies
|
|
9
|
+
|
|
10
|
+
- Updated illustrations to 4.48.1
|
|
11
|
+
|
|
12
|
+
## 9.26.1 (2026-09-03)
|
|
13
|
+
|
|
14
|
+
### 🩹 Fixes
|
|
15
|
+
|
|
16
|
+
- fix: exclude typography props from control cells
|
|
17
|
+
|
|
1
18
|
## 9.26.0 (2026-09-02)
|
|
2
19
|
|
|
3
20
|
### 🚀 Features
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type StyleProp, type TextStyle, type View, type ViewStyle } from 'react-native';
|
|
3
3
|
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
|
|
4
|
+
import type { TypographyProps } from '@coinbase/cds-common/types/TextBaseProps';
|
|
4
5
|
import { type PressableBaseProps } from '../system/Pressable';
|
|
5
6
|
import type { ControlBaseProps } from './Control';
|
|
6
7
|
export type CheckboxCellBaseProps<CheckboxValue extends string> = {
|
|
@@ -10,7 +11,10 @@ export type CheckboxCellBaseProps<CheckboxValue extends string> = {
|
|
|
10
11
|
rowGap?: ThemeVars.Space;
|
|
11
12
|
pressedBorderColor?: ThemeVars.Color;
|
|
12
13
|
pressedBorderWidth?: ThemeVars.BorderWidth;
|
|
13
|
-
} & Omit<
|
|
14
|
+
} & Omit<
|
|
15
|
+
ControlBaseProps<CheckboxValue>,
|
|
16
|
+
'style' | 'children' | 'title' | 'dotSize' | keyof TypographyProps
|
|
17
|
+
> &
|
|
14
18
|
Omit<PressableBaseProps, 'children' | 'noScaleOnPress'>;
|
|
15
19
|
export type CheckboxCellProps<CheckboxValue extends string> =
|
|
16
20
|
CheckboxCellBaseProps<CheckboxValue> & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxCell.d.ts","sourceRoot":"","sources":["../../src/controls/CheckboxCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AACpE,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;
|
|
1
|
+
{"version":3,"file":"CheckboxCell.d.ts","sourceRoot":"","sources":["../../src/controls/CheckboxCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AACpE,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;AACjE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAShF,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,CACN,gBAAgB,CAAC,aAAa,CAAC,EAC/B,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,eAAe,CACnE,GACC,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,GAAyB,aAAa,SAAS,MAAM,EAAE,oBAG7E,iBAAiB,CAAC,aAAa,CAAC,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;CACvB,4CA0MA,CAAC;AAEF,eAAO,MAAM,YAAY,EAAgC,OAAO,mBAAmB,GACjF,KAAK,CAAC,mBAAmB,CAAC,OAAO,mBAAmB,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Control.d.ts","sourceRoot":"","sources":["../../src/controls/Control.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwD,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAoC,IAAI,EAAE,MAAM,cAAc,CAAC;AACtE,OAAO,KAAK,EAEV,QAAQ,EACR,cAAc,EAEd,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAKjE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4CAA4C,CAAC;AAClF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAKhF,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AACpE,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,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,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,eAAe,GACzE,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC,GACvD,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;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,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,GAA2B,YAAY,SAAS,MAAM,EAAE,oBAGzE,YAAY,CAAC,YAAY,CAAC,GAAG;IAC9B,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;CACvB,
|
|
1
|
+
{"version":3,"file":"Control.d.ts","sourceRoot":"","sources":["../../src/controls/Control.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HelperText.d.ts","sourceRoot":"","sources":["../../src/controls/HelperText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAKjE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAGpD,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACxB,6CAA6C;IAC7C,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,iCAAiC;IACjC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wEAAwE;IACxE,MAAM,CAAC,EAAE;QACP,wBAAwB;QACxB,IAAI,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;QAC1B,yBAAyB;QACzB,IAAI,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;KAC3B,CAAC;CACH,GAAG,SAAS,CAAC;AAEd,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"HelperText.d.ts","sourceRoot":"","sources":["../../src/controls/HelperText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAKjE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAGpD,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACxB,6CAA6C;IAC7C,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,iCAAiC;IACjC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wEAAwE;IACxE,MAAM,CAAC,EAAE;QACP,wBAAwB;QACxB,IAAI,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;QAC1B,yBAAyB;QACzB,IAAI,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;KAC3B,CAAC;CACH,GAAG,SAAS,CAAC;AAEd,eAAO,MAAM,UAAU,6CAiDrB,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type StyleProp, type TextStyle, type View, type ViewStyle } from 'react-native';
|
|
3
3
|
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
|
|
4
|
+
import type { TypographyProps } from '@coinbase/cds-common/types/TextBaseProps';
|
|
4
5
|
import { type PressableProps } from '../system/Pressable';
|
|
5
6
|
import type { ControlBaseProps } from './Control';
|
|
6
7
|
export type RadioCellBaseProps<RadioValue extends string> = {
|
|
@@ -10,7 +11,10 @@ export type RadioCellBaseProps<RadioValue extends string> = {
|
|
|
10
11
|
rowGap?: ThemeVars.Space;
|
|
11
12
|
pressedBorderColor?: ThemeVars.Color;
|
|
12
13
|
pressedBorderWidth?: ThemeVars.BorderWidth;
|
|
13
|
-
} & Omit<
|
|
14
|
+
} & Omit<
|
|
15
|
+
ControlBaseProps<RadioValue>,
|
|
16
|
+
'style' | 'children' | 'title' | 'controlSize' | 'dotSize' | keyof TypographyProps
|
|
17
|
+
> &
|
|
14
18
|
Omit<PressableProps, 'children' | 'noScaleOnPress'>;
|
|
15
19
|
export type RadioCellProps<RadioValue extends string> = RadioCellBaseProps<RadioValue> & {
|
|
16
20
|
styles?: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioCell.d.ts","sourceRoot":"","sources":["../../src/controls/RadioCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AACpE,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;
|
|
1
|
+
{"version":3,"file":"RadioCell.d.ts","sourceRoot":"","sources":["../../src/controls/RadioCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AACpE,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;AACjE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAShF,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,CACN,gBAAgB,CAAC,UAAU,CAAC,EAC5B,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,aAAa,GAAG,SAAS,GAAG,MAAM,eAAe,CACnF,GACC,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,GAAsB,UAAU,SAAS,MAAM,EAAE,oBAGpE,cAAc,CAAC,UAAU,CAAC,GAAG;IAC9B,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;CACvB,4CAuMA,CAAC;AAEF,eAAO,MAAM,SAAS,EAA6B,OAAO,gBAAgB,GACxE,KAAK,CAAC,mBAAmB,CAAC,OAAO,gBAAgB,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/controls/TextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/controls/TextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KASN,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EACV,cAAc,EACd,SAAS,IAAI,WAAW,EACxB,cAAc,IAAI,gBAAgB,EAEnC,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAGjE,OAAO,KAAK,EAAgB,gBAAgB,EAAE,MAAM,2CAA2C,CAAC;AAChG,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,qDAAqD,CAAC;AACpG,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAc/E,OAAO,EAAc,KAAK,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAGpE,MAAM,MAAM,aAAa,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAI5C,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAC1C,IAAI,CACF,wBAAwB,EACxB,oBAAoB,GAAG,yBAAyB,GAAG,mBAAmB,CACvE,GACD,IAAI,CACF,gBAAgB,EAChB,OAAO,GAAG,WAAW,GAAG,YAAY,GAAG,aAAa,GAAG,YAAY,GAAG,UAAU,CACjF,GACD,IAAI,CACF,mBAAmB,EACjB,QAAQ,GACR,SAAS,GACT,OAAO,GACP,UAAU,GACV,cAAc,GACd,kBAAkB,GAClB,oBAAoB,GACpB,iBAAiB,CACpB,GAAG;IACF;;;OAGG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAChC;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IACtB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uHAAuH;IACvH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,mHAAmH;IACnH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE;QACV,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,GAAG,CAAC,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF;;;OAGG;IACH,qCAAqC,CAAC,EAAE,MAAM,CAAC;IAC/C;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;CACrC,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,UAAU,GAAG,cAAc,GAAG,WAAW,GAAG,gBAAgB,CAAC,GAAG;IAC/F,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,GAAG,OAAO,CAAC;CACrD,CAAC;AAWJ,eAAO,MAAM,SAAS,iDAIjB,cAAc,GAAG;IAClB,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CAC9B,6CA2SF,CAAC"}
|
package/esm/controls/Control.js
CHANGED
|
@@ -141,6 +141,7 @@ const ControlWithRef = function ControlWithRef(_ref) {
|
|
|
141
141
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
142
142
|
children: [/*#__PURE__*/_jsx(View, {
|
|
143
143
|
style: iconWrapperStyles,
|
|
144
|
+
testID: testID ? testID + "IconWrapper" : undefined,
|
|
144
145
|
children: iconElement
|
|
145
146
|
}), typeof label === 'string' ? /*#__PURE__*/_jsx(Text, {
|
|
146
147
|
animated: true,
|
|
@@ -158,7 +159,7 @@ const ControlWithRef = function ControlWithRef(_ref) {
|
|
|
158
159
|
children: label
|
|
159
160
|
}) : label]
|
|
160
161
|
});
|
|
161
|
-
}, [ControlIcon, animatedOpacityValue, animatedScaleValue, background, borderColor, borderRadius, borderWidth, checked, controlColor, controlSize, disabled, dotSize, elevation, getLabelStyle, iconWrapperStyles, indeterminate, label, font, fontFamily, fontSize, fontWeight, lineHeight, textTransform,
|
|
162
|
+
}, [ControlIcon, animatedOpacityValue, animatedScaleValue, background, borderColor, borderRadius, borderWidth, checked, controlColor, controlSize, disabled, dotSize, elevation, getLabelStyle, iconWrapperStyles, indeterminate, label, font, fontFamily, fontSize, fontWeight, lineHeight, textTransform, pressDisabled, readOnly, testID]);
|
|
162
163
|
return /*#__PURE__*/_jsx(Pressable, _extends({
|
|
163
164
|
ref: ref,
|
|
164
165
|
accessible: accessible
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
const _excluded = ["color", "errorIconAccessibilityLabel", "errorIconTestID", "
|
|
1
|
+
const _excluded = ["color", "errorIconAccessibilityLabel", "errorIconTestID", "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, { memo, useMemo } from 'react';
|
|
5
|
-
import { glyphMap } from '@coinbase/cds-icons/glyphMap';
|
|
6
5
|
import { useTheme } from '../hooks/useTheme';
|
|
7
|
-
import {
|
|
6
|
+
import { Icon } from '../icons/Icon';
|
|
7
|
+
import { HStack } from '../layout/HStack';
|
|
8
8
|
import { Text } from '../typography/Text';
|
|
9
9
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
10
|
export const HelperText = /*#__PURE__*/memo(function HelperText(_ref) {
|
|
@@ -12,49 +12,49 @@ export const HelperText = /*#__PURE__*/memo(function HelperText(_ref) {
|
|
|
12
12
|
color,
|
|
13
13
|
errorIconAccessibilityLabel,
|
|
14
14
|
errorIconTestID,
|
|
15
|
-
children,
|
|
16
|
-
align,
|
|
17
|
-
dangerouslySetColor,
|
|
18
|
-
style,
|
|
19
15
|
styles
|
|
20
16
|
} = _ref,
|
|
21
17
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
22
18
|
const theme = useTheme();
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
const sourceSize = getIconSourceSize(iconSize);
|
|
26
|
-
const glyphKey = "info-" + sourceSize + "-active";
|
|
27
|
-
const glyph = glyphMap[glyphKey];
|
|
28
|
-
const iconStyle = useMemo(() => [{
|
|
29
|
-
fontFamily: 'CoinbaseIcons',
|
|
30
|
-
fontSize: iconSize,
|
|
31
|
-
height: iconSize,
|
|
32
|
-
width: iconSize,
|
|
33
|
-
letterSpacing: 4
|
|
34
|
-
}, // TODO: when we actually remove dangerouslySetColor:
|
|
19
|
+
const rootStyle = [props.style, styles == null ? void 0 : styles.root];
|
|
20
|
+
// TODO: when we actually remove dangerouslySetColor:
|
|
35
21
|
// when migrating from dangerouslySetColor to style.color,
|
|
36
22
|
// root style/className color will not automatically style the error icon like dangerouslySetColor.
|
|
37
23
|
// Consumers must set both styles.root and styles.icon (or classNames equivalents).
|
|
38
24
|
// We need to have a migrator handle this or document in future migration guide.
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
25
|
+
const iconStyle = useMemo(() => [{
|
|
26
|
+
// Sit on the first line of label2, matching nested-text alignment.
|
|
27
|
+
marginTop: (theme.lineHeight.label2 - theme.iconSize.xs) / 2
|
|
28
|
+
}, styles == null ? void 0 : styles.icon], [styles == null ? void 0 : styles.icon, theme.iconSize.xs, theme.lineHeight.label2]);
|
|
29
|
+
const justifyContent = props.align === 'end' ? 'flex-end' : props.align === 'center' ? 'center' : 'flex-start';
|
|
30
|
+
if (color === 'fgNegative') {
|
|
31
|
+
return /*#__PURE__*/_jsxs(HStack, {
|
|
32
|
+
alignItems: "flex-start",
|
|
33
|
+
gap: 0.5,
|
|
34
|
+
justifyContent: justifyContent,
|
|
35
|
+
children: [/*#__PURE__*/_jsx(Icon, {
|
|
36
|
+
active: true,
|
|
37
|
+
accessibilityLabel: errorIconAccessibilityLabel,
|
|
38
|
+
allowFontScaling: false,
|
|
39
|
+
color: "fgNegative",
|
|
40
|
+
dangerouslySetColor: typeof props.dangerouslySetColor === 'string' ? props.dangerouslySetColor : undefined,
|
|
41
|
+
name: "info",
|
|
42
|
+
size: "xs",
|
|
43
|
+
style: iconStyle,
|
|
44
|
+
testID: errorIconTestID
|
|
45
|
+
}), /*#__PURE__*/_jsx(Text, _extends({
|
|
46
|
+
color: color,
|
|
47
|
+
font: "label2"
|
|
48
|
+
}, props, {
|
|
49
|
+
flexShrink: 1,
|
|
50
|
+
style: rootStyle
|
|
51
|
+
}))]
|
|
52
|
+
});
|
|
53
|
+
}
|
|
54
|
+
return /*#__PURE__*/_jsx(Text, _extends({
|
|
42
55
|
color: color,
|
|
43
|
-
|
|
44
|
-
font: "label2",
|
|
45
|
-
style: [style, styles == null ? void 0 : styles.root]
|
|
56
|
+
font: "label2"
|
|
46
57
|
}, props, {
|
|
47
|
-
|
|
48
|
-
accessible: true,
|
|
49
|
-
accessibilityLabel: errorIconAccessibilityLabel,
|
|
50
|
-
accessibilityRole: "image",
|
|
51
|
-
align: align,
|
|
52
|
-
color: color,
|
|
53
|
-
dangerouslySetColor: dangerouslySetColor,
|
|
54
|
-
font: "label2",
|
|
55
|
-
style: iconStyle,
|
|
56
|
-
testID: errorIconTestID,
|
|
57
|
-
children: glyph
|
|
58
|
-
}), children]
|
|
58
|
+
style: rootStyle
|
|
59
59
|
}));
|
|
60
60
|
});
|
|
@@ -2,8 +2,8 @@ const _excluded = ["ref"],
|
|
|
2
2
|
_excluded2 = ["label", "labelFont", "labelColor", "helperText", "variant", "testID", "testIDMap", "start", "end", "width", "disabled", "align", "font", "compact", "size", "suffix", "accessibilityLabel", "borderRadius", "enableColorSurge", "helperTextErrorIconAccessibilityLabel", "bordered", "focusedBorderWidth", "labelVariant", "labelNode", "inputBackground"];
|
|
3
3
|
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); }
|
|
4
4
|
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; }
|
|
5
|
-
import React, { cloneElement, isValidElement, memo, useCallback, useMemo, useRef, useState } from 'react';
|
|
6
|
-
import { Pressable } from 'react-native';
|
|
5
|
+
import React, { cloneElement, isValidElement, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
6
|
+
import { Keyboard, Platform, Pressable } from 'react-native';
|
|
7
7
|
import { useInputVariant } from '@coinbase/cds-common/hooks/useInputVariant';
|
|
8
8
|
import { useMergeRefs } from '@coinbase/cds-common/hooks/useMergeRefs';
|
|
9
9
|
import { useComponentConfig } from '../hooks/useComponentConfig';
|
|
@@ -68,6 +68,20 @@ export const TextInput = /*#__PURE__*/memo(_ref => {
|
|
|
68
68
|
const focusedVariant = useInputVariant(focused, variant);
|
|
69
69
|
const internalRef = useRef(null);
|
|
70
70
|
const refs = useMergeRefs(ref, internalRef);
|
|
71
|
+
// Tracks the latest focus state for the unmount cleanup, which can't read `focused` directly
|
|
72
|
+
// without re-subscribing on every focus change.
|
|
73
|
+
const focusedRef = useRef(false);
|
|
74
|
+
focusedRef.current = focused;
|
|
75
|
+
|
|
76
|
+
// Android doesn't dismiss the keyboard when a focused TextInput unmounts (iOS does), leaving it
|
|
77
|
+
// stranded on screen. Dismiss it on unmount when this field was focused.
|
|
78
|
+
useEffect(() => {
|
|
79
|
+
return () => {
|
|
80
|
+
if (Platform.OS === 'android' && focusedRef.current) {
|
|
81
|
+
Keyboard.dismiss();
|
|
82
|
+
}
|
|
83
|
+
};
|
|
84
|
+
}, []);
|
|
71
85
|
const {
|
|
72
86
|
borderFocusedStyle,
|
|
73
87
|
borderUnfocusedStyle
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coinbase/cds-mobile",
|
|
3
|
-
"version": "9.26.
|
|
3
|
+
"version": "9.26.2",
|
|
4
4
|
"description": "Coinbase Design System - Mobile",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -218,9 +218,9 @@
|
|
|
218
218
|
"react-native-worklets": "0.5.2"
|
|
219
219
|
},
|
|
220
220
|
"dependencies": {
|
|
221
|
-
"@coinbase/cds-common": "^9.26.
|
|
222
|
-
"@coinbase/cds-icons": "^5.
|
|
223
|
-
"@coinbase/cds-illustrations": "^4.48.
|
|
221
|
+
"@coinbase/cds-common": "^9.26.2",
|
|
222
|
+
"@coinbase/cds-icons": "^5.24.0",
|
|
223
|
+
"@coinbase/cds-illustrations": "^4.48.1",
|
|
224
224
|
"@coinbase/cds-lottie-files": "^3.3.4",
|
|
225
225
|
"@coinbase/cds-utils": "^2.3.5",
|
|
226
226
|
"@floating-ui/react-native": "^0.10.5",
|