@coinbase/cds-mobile 9.24.0 → 9.26.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 +12 -0
- package/dts/banner/Banner.d.ts +10 -0
- package/dts/banner/Banner.d.ts.map +1 -1
- package/dts/controls/Control.d.ts +3 -4
- package/dts/controls/Control.d.ts.map +1 -1
- package/esm/banner/Banner.js +3 -2
- package/esm/controls/Control.js +17 -7
- package/esm/system/__stories__/componentConfigStickerSheet/customComponentConfig.js +1 -0
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
## 9.26.0 (2026-09-02)
|
|
2
|
+
|
|
3
|
+
### 🚀 Features
|
|
4
|
+
|
|
5
|
+
- feat: support control font customization
|
|
6
|
+
|
|
7
|
+
## 9.25.0 (2026-09-02)
|
|
8
|
+
|
|
9
|
+
### 🚀 Features
|
|
10
|
+
|
|
11
|
+
- Add new prop (startIconColor) to Banner to support customizing the color of the icon from its default variant-based color.
|
|
12
|
+
|
|
1
13
|
## 9.24.0 (2026-08-31)
|
|
2
14
|
|
|
3
15
|
### 🚀 Features
|
package/dts/banner/Banner.d.ts
CHANGED
|
@@ -12,6 +12,11 @@ export type BannerBaseProps = SharedProps & {
|
|
|
12
12
|
startIcon: IconName;
|
|
13
13
|
/** Whether the start icon is active */
|
|
14
14
|
startIconActive?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* Color of the start icon.
|
|
17
|
+
* @default based on the banner variant
|
|
18
|
+
*/
|
|
19
|
+
startIconColor?: ThemeVars.Color;
|
|
15
20
|
/** Provide a CDS Link component to be used as a primary action. It will inherit colors depending on the provided variant */
|
|
16
21
|
primaryAction?: React.ReactNode;
|
|
17
22
|
/** Provide a CDS Link component to be used as a secondary action. It will inherit colors depending on the provided tone */
|
|
@@ -105,6 +110,11 @@ export declare const Banner: React.NamedExoticComponent<
|
|
|
105
110
|
startIcon: IconName;
|
|
106
111
|
/** Whether the start icon is active */
|
|
107
112
|
startIconActive?: boolean;
|
|
113
|
+
/**
|
|
114
|
+
* Color of the start icon.
|
|
115
|
+
* @default based on the banner variant
|
|
116
|
+
*/
|
|
117
|
+
startIconColor?: ThemeVars.Color;
|
|
108
118
|
/** Provide a CDS Link component to be used as a primary action. It will inherit colors depending on the provided variant */
|
|
109
119
|
primaryAction?: React.ReactNode;
|
|
110
120
|
/** Provide a CDS Link component to be used as a secondary action. It will inherit colors depending on the provided tone */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/banner/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+D,MAAM,OAAO,CAAC;AACpF,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC1E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAEjE,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AACpG,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qCAAqC,CAAC;AACpE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAO1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAOpD,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG;IAC1C,2GAA2G;IAC3G,OAAO,EAAE,aAAa,CAAC;IACvB,6CAA6C;IAC7C,SAAS,EAAE,QAAQ,CAAC;IACpB,uCAAuC;IACvC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,4HAA4H;IAC5H,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,2HAA2H;IAC3H,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,wBAAwB;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;SAGK;IACL,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,gFAAgF;IAChF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gCAAgC;IAChC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;SAGK;IACL,YAAY,CAAC,EAAE,kBAAkB,CAAC;IAClC,uDAAuD;IACvD,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;SAGK;IACL,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;SAIK;IACL,YAAY,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC;CACvC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,WAAW,GAAG,eAAe,GACvC,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC,GAAG;IAC9B,oCAAoC;IACpC,MAAM,CAAC,EAAE;QACP,qFAAqF;QACrF,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,yDAAyD;QACzD,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC/B,0BAA0B;QAC1B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC7B,qEAAqE;QACrE,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B,oEAAoE;QACpE,MAAM,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC9B;;;;WAIG;QACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC7B;;;WAGG;QACH,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC/B;;;WAGG;QACH,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KAChC,CAAC;CACH,CAAC;AACJ;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,WAAW,CAAC;AAE5C,eAAO,MAAM,MAAM;
|
|
1
|
+
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/banner/Banner.tsx"],"names":[],"mappings":"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"}
|
|
@@ -4,6 +4,7 @@ import type { Animated, PressableProps, ViewStyle } from 'react-native';
|
|
|
4
4
|
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
|
|
5
5
|
import type { ElevationLevels } from '@coinbase/cds-common/types/ElevationLevels';
|
|
6
6
|
import type { SharedProps } from '@coinbase/cds-common/types/SharedProps';
|
|
7
|
+
import type { TypographyProps } from '@coinbase/cds-common/types/TextBaseProps';
|
|
7
8
|
import type { InteractableBaseProps } from '../system/Interactable';
|
|
8
9
|
import type { TextProps } from '../typography/Text';
|
|
9
10
|
export type ControlIconProps = SharedProps & {
|
|
@@ -23,10 +24,8 @@ export type ControlIconProps = SharedProps & {
|
|
|
23
24
|
animatedOpacityValue: Animated.Value;
|
|
24
25
|
accessible?: boolean;
|
|
25
26
|
};
|
|
26
|
-
export type ControlBaseProps<ControlValue extends string> =
|
|
27
|
-
PressableProps,
|
|
28
|
-
'disabled' | 'children' | 'style'
|
|
29
|
-
> &
|
|
27
|
+
export type ControlBaseProps<ControlValue extends string> = TypographyProps &
|
|
28
|
+
Omit<PressableProps, 'disabled' | 'children' | 'style'> &
|
|
30
29
|
Partial<
|
|
31
30
|
Pick<
|
|
32
31
|
InteractableBaseProps,
|
|
@@ -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;
|
|
1
|
+
{"version":3,"file":"Control.d.ts","sourceRoot":"","sources":["../../src/controls/Control.tsx"],"names":[],"mappings":"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"}
|
package/esm/banner/Banner.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const _excluded = ["ref"],
|
|
2
|
-
_excluded2 = ["variant", "startIcon", "startIconActive", "onClose", "primaryAction", "secondaryAction", "title", "children", "showDismiss", "testID", "numberOfLines", "style", "label", "styleVariant", "startIconAccessibilityLabel", "closeAccessibilityLabel", "borderRadius", "margin", "marginX", "marginY", "marginTop", "marginEnd", "marginBottom", "marginStart", "styles"];
|
|
2
|
+
_excluded2 = ["variant", "startIcon", "startIconActive", "startIconColor", "onClose", "primaryAction", "secondaryAction", "title", "children", "showDismiss", "testID", "numberOfLines", "style", "label", "styleVariant", "startIconAccessibilityLabel", "closeAccessibilityLabel", "borderRadius", "margin", "marginX", "marginY", "marginTop", "marginEnd", "marginBottom", "marginStart", "styles"];
|
|
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
5
|
import React, { isValidElement, memo, useCallback, useMemo, useState } from 'react';
|
|
@@ -37,6 +37,7 @@ export const Banner = /*#__PURE__*/memo(function Banner(_ref) {
|
|
|
37
37
|
variant,
|
|
38
38
|
startIcon,
|
|
39
39
|
startIconActive,
|
|
40
|
+
startIconColor,
|
|
40
41
|
onClose,
|
|
41
42
|
primaryAction,
|
|
42
43
|
secondaryAction,
|
|
@@ -141,7 +142,7 @@ export const Banner = /*#__PURE__*/memo(function Banner(_ref) {
|
|
|
141
142
|
style: styles == null ? void 0 : styles.start,
|
|
142
143
|
children: /*#__PURE__*/_jsx(Icon, {
|
|
143
144
|
active: startIconActive,
|
|
144
|
-
color: iconColor,
|
|
145
|
+
color: startIconColor != null ? startIconColor : iconColor,
|
|
145
146
|
name: startIcon,
|
|
146
147
|
paddingX: 0.5,
|
|
147
148
|
paddingY: 0.25,
|
package/esm/controls/Control.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const _excluded = ["ref"],
|
|
2
|
-
_excluded2 = ["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
|
+
_excluded2 = ["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", "font", "fontFamily", "fontSize", "fontWeight", "lineHeight", "textTransform"];
|
|
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
5
|
import React, { memo, useCallback, useEffect, useMemo, useRef } from 'react';
|
|
@@ -43,14 +43,19 @@ const ControlWithRef = function ControlWithRef(_ref) {
|
|
|
43
43
|
borderRadius,
|
|
44
44
|
borderWidth,
|
|
45
45
|
controlSize,
|
|
46
|
-
dotSize
|
|
46
|
+
dotSize,
|
|
47
|
+
font = 'body',
|
|
48
|
+
fontFamily = font,
|
|
49
|
+
fontSize = font,
|
|
50
|
+
fontWeight = font,
|
|
51
|
+
lineHeight = font,
|
|
52
|
+
textTransform
|
|
47
53
|
} = mergedProps,
|
|
48
54
|
props = _objectWithoutPropertiesLoose(mergedProps, _excluded2);
|
|
49
55
|
const theme = useTheme();
|
|
50
56
|
if (isDevelopment() && accessible && !label && !accessibilityLabel) {
|
|
51
57
|
console.warn("Please specify an accessibility label for the " + accessibilityRole + " control with value " + value + ".");
|
|
52
58
|
}
|
|
53
|
-
const bodyLineHeight = theme.lineHeight.body;
|
|
54
59
|
const isMounted = useRef(false);
|
|
55
60
|
const {
|
|
56
61
|
animation,
|
|
@@ -73,9 +78,9 @@ const ControlWithRef = function ControlWithRef(_ref) {
|
|
|
73
78
|
Keyboard.dismiss();
|
|
74
79
|
}, [checked, onChange, value]);
|
|
75
80
|
const iconWrapperStyles = useMemo(() => ({
|
|
76
|
-
height:
|
|
81
|
+
height: theme.lineHeight[lineHeight],
|
|
77
82
|
justifyContent: 'center'
|
|
78
|
-
}), [
|
|
83
|
+
}), [lineHeight, theme.lineHeight]);
|
|
79
84
|
const pressableStyle = useMemo(() => _extends({
|
|
80
85
|
flexDirection: I18nManager.isRTL ? 'row-reverse' : 'row',
|
|
81
86
|
alignItems: 'flex-start',
|
|
@@ -140,15 +145,20 @@ const ControlWithRef = function ControlWithRef(_ref) {
|
|
|
140
145
|
}), typeof label === 'string' ? /*#__PURE__*/_jsx(Text, {
|
|
141
146
|
animated: true,
|
|
142
147
|
disabled: disabled || readOnly,
|
|
143
|
-
font:
|
|
148
|
+
font: font,
|
|
149
|
+
fontFamily: fontFamily,
|
|
150
|
+
fontSize: fontSize,
|
|
151
|
+
fontWeight: fontWeight,
|
|
152
|
+
lineHeight: lineHeight,
|
|
144
153
|
style: getLabelStyle({
|
|
145
154
|
pressed
|
|
146
155
|
}),
|
|
147
156
|
testID: testID + "Label",
|
|
157
|
+
textTransform: textTransform,
|
|
148
158
|
children: label
|
|
149
159
|
}) : label]
|
|
150
160
|
});
|
|
151
|
-
}, [ControlIcon, animatedOpacityValue, animatedScaleValue, background, borderColor, borderRadius, borderWidth, checked, controlColor, controlSize, disabled, dotSize, elevation, getLabelStyle, iconWrapperStyles, indeterminate, label, pressDisabled, readOnly, testID]);
|
|
161
|
+
}, [ControlIcon, animatedOpacityValue, animatedScaleValue, background, borderColor, borderRadius, borderWidth, checked, controlColor, controlSize, disabled, dotSize, elevation, getLabelStyle, iconWrapperStyles, indeterminate, label, font, fontFamily, fontSize, fontWeight, lineHeight, textTransform, theme, pressDisabled, readOnly, testID]);
|
|
152
162
|
return /*#__PURE__*/_jsx(Pressable, _extends({
|
|
153
163
|
ref: ref,
|
|
154
164
|
accessible: accessible
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coinbase/cds-mobile",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.26.0",
|
|
4
4
|
"description": "Coinbase Design System - Mobile",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -218,7 +218,7 @@
|
|
|
218
218
|
"react-native-worklets": "0.5.2"
|
|
219
219
|
},
|
|
220
220
|
"dependencies": {
|
|
221
|
-
"@coinbase/cds-common": "^9.
|
|
221
|
+
"@coinbase/cds-common": "^9.26.0",
|
|
222
222
|
"@coinbase/cds-icons": "^5.22.0",
|
|
223
223
|
"@coinbase/cds-illustrations": "^4.48.0",
|
|
224
224
|
"@coinbase/cds-lottie-files": "^3.3.4",
|