Skip to content

Commit c652748

Browse files
M-i-k-e-lM-i-k-e-l
authored
Merge branch 'master' into v8
2 parents 4a3f9b8 + c2725c9 commit c652748

File tree

7 files changed

+48
-39
lines changed

7 files changed

+48
-39
lines changed

‎.nvmrc‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
20
1+
22.13.1

‎demo/src/screens/__tests__/__snapshots__/TextFieldScreen.spec.js.snap‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -728,7 +728,7 @@ exports[`TextField Screen renders screen 1`] = `
728728
},
729729
undefined,
730730
{
731-
"color": "#FC3D2F",
731+
"color": "#D52712",
732732
},
733733
undefined,
734734
undefined,
@@ -1269,7 +1269,7 @@ exports[`TextField Screen renders screen 1`] = `
12691269
},
12701270
undefined,
12711271
{
1272-
"color": "#FC3D2F",
1272+
"color": "#D52712",
12731273
},
12741274
undefined,
12751275
undefined,
@@ -1635,7 +1635,7 @@ exports[`TextField Screen renders screen 1`] = `
16351635
},
16361636
undefined,
16371637
{
1638-
"color": "#FC3D2F",
1638+
"color": "#D52712",
16391639
},
16401640
undefined,
16411641
undefined,
@@ -1866,7 +1866,7 @@ exports[`TextField Screen renders screen 1`] = `
18661866
},
18671867
undefined,
18681868
{
1869-
"color": "#FC3D2F",
1869+
"color": "#D52712",
18701870
},
18711871
undefined,
18721872
undefined,
@@ -2231,7 +2231,7 @@ exports[`TextField Screen renders screen 1`] = `
22312231
},
22322232
undefined,
22332233
{
2234-
"color": "#FC3D2F",
2234+
"color": "#D52712",
22352235
},
22362236
undefined,
22372237
undefined,
@@ -3126,7 +3126,7 @@ exports[`TextField Screen renders screen 1`] = `
31263126
},
31273127
undefined,
31283128
{
3129-
"color": "#FC3D2F",
3129+
"color": "#D52712",
31303130
},
31313131
undefined,
31323132
undefined,
@@ -4023,7 +4023,7 @@ exports[`TextField Screen renders screen 1`] = `
40234023
},
40244024
undefined,
40254025
{
4026-
"color": "#FC3D2F",
4026+
"color": "#D52712",
40274027
},
40284028
undefined,
40294029
undefined,
@@ -4726,7 +4726,7 @@ exports[`TextField Screen renders screen 1`] = `
47264726
},
47274727
undefined,
47284728
{
4729-
"color": "#FC3D2F",
4729+
"color": "#D52712",
47304730
},
47314731
undefined,
47324732
undefined,
@@ -4986,7 +4986,7 @@ exports[`TextField Screen renders screen 1`] = `
49864986
},
49874987
undefined,
49884988
{
4989-
"color": "#FC3D2F",
4989+
"color": "#D52712",
49904990
},
49914991
undefined,
49924992
undefined,
@@ -5276,7 +5276,7 @@ exports[`TextField Screen renders screen 1`] = `
52765276
},
52775277
undefined,
52785278
{
5279-
"color": "#FC3D2F",
5279+
"color": "#D52712",
52805280
},
52815281
undefined,
52825282
undefined,
@@ -6017,7 +6017,7 @@ exports[`TextField Screen renders screen 1`] = `
60176017
},
60186018
undefined,
60196019
{
6020-
"color": "#FC3D2F",
6020+
"color": "#D52712",
60216021
},
60226022
undefined,
60236023
undefined,
@@ -6318,7 +6318,7 @@ exports[`TextField Screen renders screen 1`] = `
63186318
},
63196319
undefined,
63206320
{
6321-
"color": "#FC3D2F",
6321+
"color": "#D52712",
63226322
},
63236323
undefined,
63246324
undefined,
@@ -6647,7 +6647,7 @@ exports[`TextField Screen renders screen 1`] = `
66476647
},
66486648
undefined,
66496649
{
6650-
"color": "#FC3D2F",
6650+
"color": "#D52712",
66516651
},
66526652
undefined,
66536653
undefined,
@@ -7023,7 +7023,7 @@ exports[`TextField Screen renders screen 1`] = `
70237023
},
70247024
undefined,
70257025
{
7026-
"color": "#FC3D2F",
7026+
"color": "#D52712",
70277027
},
70287028
undefined,
70297029
undefined,
@@ -7299,7 +7299,7 @@ exports[`TextField Screen renders screen 1`] = `
72997299
},
73007300
undefined,
73017301
{
7302-
"color": "#FC3D2F",
7302+
"color": "#D52712",
73037303
},
73047304
undefined,
73057305
undefined,
@@ -7554,7 +7554,7 @@ exports[`TextField Screen renders screen 1`] = `
75547554
},
75557555
undefined,
75567556
{
7557-
"color": "#FC3D2F",
7557+
"color": "#D52712",
75587558
},
75597559
undefined,
75607560
undefined,
@@ -7844,7 +7844,7 @@ exports[`TextField Screen renders screen 1`] = `
78447844
},
78457845
undefined,
78467846
{
7847-
"color": "#FC3D2F",
7847+
"color": "#D52712",
78487848
},
78497849
undefined,
78507850
undefined,

‎src/components/checkbox/index.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import {
1010
ImageStyle
1111
} from 'react-native';
1212
import {Colors, Spacings} from '../../style';
13+
import {StyleUtils} from '../../utils';
1314
//@ts-ignore
1415
import Assets from '../../assets';
1516
import {asBaseComponent} from '../../commons/new';
@@ -251,9 +252,7 @@ class Checkbox extends Component<CheckboxProps, CheckboxState> {
251252
};
252253
};
253254

254-
getAccessibleHitSlop(size: number) {
255-
return Math.max(0, (48 - size) / 2);
256-
}
255+
257256

258257
renderCheckbox() {
259258
const {selectedIcon, label, testID, style, containerStyle, indeterminate, ...others} = this.props;
@@ -267,7 +266,7 @@ class Checkbox extends Component<CheckboxProps, CheckboxState> {
267266
{...others}
268267
style={[this.getBorderStyle(), style, !label && containerStyle]}
269268
onPress={this.onPress}
270-
hitSlop={this.getAccessibleHitSlop(this.props.size || DEFAULT_SIZE)}
269+
hitSlop={StyleUtils.getAccessibleHitSlop(this.props.size || DEFAULT_SIZE)}
271270
>
272271
{
273272
<Animated.View

‎src/components/pageControl/index.tsx‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import React, {PureComponent} from 'react';
33
import {StyleSheet, LayoutAnimation, StyleProp, ViewStyle} from 'react-native';
44
import {asBaseComponent} from '../../commons/new';
55
import {Colors} from '../../style';
6+
import {StyleUtils} from '../../utils';
67
import TouchableOpacity, {TouchableOpacityProps} from '../touchableOpacity';
78
import View from '../view';
89

@@ -114,14 +115,12 @@ class PageControl extends PureComponent<PageControlProps, State> {
114115

115116
if (Array.isArray(props.size)) {
116117
if (props.size[0] >= props.size[1] || props.size[1] >= props.size[2]) {
117-
console.warn(
118-
'It is recommended that largeSize > mediumSize > smallSize, currently: smallSize=',
118+
console.warn('It is recommended that largeSize > mediumSize > smallSize, currently: smallSize=',
119119
props.size[0],
120120
'mediumSize=',
121121
props.size[1],
122122
'largeSize=',
123-
props.size[2]
124-
);
123+
props.size[2]);
125124
}
126125
}
127126
}
@@ -190,6 +189,8 @@ class PageControl extends PureComponent<PageControlProps, State> {
190189

191190
renderIndicator(index: number, size: number, enlargeActive?: boolean) {
192191
const {currentPage, color, inactiveColor, onPagePress, spacing = PageControl.DEFAULT_SPACING} = this.props;
192+
const hitSlopValue = StyleUtils.getAccessibleHitSlop(size);
193+
193194
return (
194195
<TouchableOpacity
195196
customValue={index}
@@ -201,6 +202,10 @@ class PageControl extends PureComponent<PageControlProps, State> {
201202
getColorStyle(index === currentPage, color, inactiveColor),
202203
getSizeStyle(size, index, currentPage, enlargeActive)
203204
]}
205+
hitSlop={{
206+
top: hitSlopValue,
207+
bottom: hitSlopValue
208+
}}
204209
/>
205210
);
206211
}

‎src/components/radioButton/index.tsx‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import {
1010
ViewStyle
1111
} from 'react-native';
1212
import {Colors} from '../../style';
13+
import {StyleUtils} from '../../utils';
1314
import {asBaseComponent, forwardRef, BaseComponentInjectedProps, ForwardRefInjectedProps} from '../../commons/new';
1415
import TouchableOpacity from '../touchableOpacity';
1516
import View, {ViewProps} from '../view';
@@ -257,18 +258,12 @@ class RadioButton extends PureComponent<Props, RadioButtonState> {
257258
);
258259
}
259260

260-
getAccessibleHitSlop(size: number) {
261-
const verticalPadding = Math.max(0, (48 - size) / 2);
262-
263-
return {
264-
top: verticalPadding,
265-
bottom: verticalPadding
266-
};
267-
}
261+
268262

269263
render() {
270264
const {onPress, onValueChange, containerStyle, contentOnLeft, ...others} = this.props;
271265
const Container = onPress || onValueChange ? TouchableOpacity : View;
266+
const hitSlopValue = StyleUtils.getAccessibleHitSlop(this.props.size || DEFAULT_SIZE);
272267

273268
return (
274269
// @ts-ignore
@@ -280,7 +275,10 @@ class RadioButton extends PureComponent<Props, RadioButtonState> {
280275
style={containerStyle}
281276
onPress={this.onPress}
282277
{...this.getAccessibilityProps()}
283-
hitSlop={this.getAccessibleHitSlop(this.props.size || DEFAULT_SIZE)}
278+
hitSlop={{
279+
top: hitSlopValue,
280+
bottom: hitSlopValue
281+
}}
284282
>
285283
{!contentOnLeft && this.renderButton()}
286284
{this.props.iconOnRight ? this.renderLabel() : this.renderIcon()}

‎src/style/designTokens.ts‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,8 @@ export default {
2222
$backgroundWarningLight: colorsPalette.yellow70,
2323
$backgroundMajorLight: colorsPalette.orange80,
2424
$backgroundMajorHeavy: colorsPalette.orange30,
25-
$backgroundDangerHeavy: colorsPalette.red30,
25+
//backgroundDangerHeavy should be changed to backgroundDanger
26+
$backgroundDangerHeavy: colorsPalette.red10,
2627
$backgroundDangerLight: colorsPalette.red80,
2728
$backgroundDisabled: colorsPalette.grey50,
2829
$backgroundDark: colorsPalette.grey10,
@@ -43,7 +44,8 @@ export default {
4344
$textSuccessLight: colorsPalette.green30,
4445
$textMajor: colorsPalette.orange10,
4546
$textDanger: colorsPalette.red10,
46-
$textDangerLight: colorsPalette.red30,
47+
//textDangerLight should be deprecated
48+
$textDangerLight: colorsPalette.red10,
4749

4850
// ICON
4951
$iconDefault: colorsPalette.grey10,
@@ -57,7 +59,8 @@ export default {
5759
$iconSuccessLight: colorsPalette.green30,
5860
$iconMajor: colorsPalette.orange10,
5961
$iconDanger: colorsPalette.red10,
60-
$iconDangerLight: colorsPalette.red30,
62+
//iconDangerLight should be deprecated
63+
$iconDangerLight: colorsPalette.red10,
6164
$iconDisabled: colorsPalette.grey50,
6265

6366
// OUTLINE
@@ -70,7 +73,7 @@ export default {
7073
$outlinePrimaryMedium: colorsPalette.blue70,
7174
$outlineGeneral: colorsPalette.blue30,
7275
$outlineWarning: colorsPalette.yellow30,
73-
$outlineDanger: colorsPalette.red30,
76+
$outlineDanger: colorsPalette.red10,
7477
$outlineInverted: colorsPalette.white,
7578

7679
// BLACK AND WHITE

‎src/utils/styleUtils.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,3 +9,7 @@ export function unpackStyle(style?: StyleProp<ViewStyle>, options: UnpackStyleOp
99
return JSON.parse(JSON.stringify(options.flatten ? StyleSheet.flatten(style) : style));
1010
}
1111
}
12+
13+
export function getAccessibleHitSlop(size: number) {
14+
return Math.max(0, (48 - size) / 2);
15+
}

0 commit comments

Comments
 (0)