Skip to content

Commit 20ee507

Browse files
ethansharethanshar
committed
Allow icon custom style override defaults (#3176)
* Allow icon custom style override defaults * Update snapshot tests
1 parent fc80eb7 commit 20ee507

File tree

3 files changed

+64
-64
lines changed

3 files changed

+64
-64
lines changed

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

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1908,14 +1908,14 @@ exports[`TextField Screen renders screen 1`] = `
19081908
}
19091909
style={
19101910
[
1911-
undefined,
19121911
undefined,
19131912
{
19141913
"height": 16,
19151914
"width": 16,
19161915
},
19171916
undefined,
19181917
false,
1918+
undefined,
19191919
]
19201920
}
19211921
/>
@@ -2763,6 +2763,12 @@ exports[`TextField Screen renders screen 1`] = `
27632763
}
27642764
style={
27652765
[
2766+
undefined,
2767+
undefined,
2768+
undefined,
2769+
{
2770+
"tintColor": "#5A48F5",
2771+
},
27662772
[
27672773
{
27682774
"tintColor": "#5A48F5",
@@ -2771,12 +2777,6 @@ exports[`TextField Screen renders screen 1`] = `
27712777
"tintColor": "#A6ACB1",
27722778
},
27732779
],
2774-
undefined,
2775-
undefined,
2776-
undefined,
2777-
{
2778-
"tintColor": "#5A48F5",
2779-
},
27802780
]
27812781
}
27822782
testID="undefined.clearButton.icon"
@@ -2796,8 +2796,8 @@ exports[`TextField Screen renders screen 1`] = `
27962796
undefined,
27972797
undefined,
27982798
undefined,
2799-
undefined,
28002799
false,
2800+
undefined,
28012801
]
28022802
}
28032803
/>
@@ -3432,18 +3432,18 @@ exports[`TextField Screen renders screen 1`] = `
34323432
}
34333433
style={
34343434
[
3435-
[
3436-
{
3437-
"tintColor": "#20303C",
3438-
},
3439-
undefined,
3440-
],
34413435
undefined,
34423436
undefined,
34433437
undefined,
34443438
{
34453439
"tintColor": "#20303C",
34463440
},
3441+
[
3442+
{
3443+
"tintColor": "#20303C",
3444+
},
3445+
undefined,
3446+
],
34473447
]
34483448
}
34493449
testID="undefined.icon"
@@ -5399,7 +5399,6 @@ exports[`TextField Screen renders screen 1`] = `
53995399
}
54005400
style={
54015401
[
5402-
undefined,
54035402
{
54045403
"marginLeft": 4,
54055404
},
@@ -5409,6 +5408,7 @@ exports[`TextField Screen renders screen 1`] = `
54095408
},
54105409
undefined,
54115410
false,
5411+
undefined,
54125412
]
54135413
}
54145414
/>

‎src/components/button/__tests__/__snapshots__/index.spec.js.snap

Lines changed: 48 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1124,19 +1124,19 @@ exports[`Button container size should have no padding of button is an icon butto
11241124
source={14}
11251125
style={
11261126
[
1127+
undefined,
1128+
undefined,
1129+
undefined,
1130+
{
1131+
"tintColor": "#FFFFFF",
1132+
},
11271133
[
11281134
{
11291135
"marginRight": 8,
11301136
"tintColor": "#FFFFFF",
11311137
},
11321138
undefined,
11331139
],
1134-
undefined,
1135-
undefined,
1136-
undefined,
1137-
{
1138-
"tintColor": "#FFFFFF",
1139-
},
11401140
]
11411141
}
11421142
testID="undefined.icon"
@@ -2250,18 +2250,18 @@ exports[`Button icon should apply color on icon 1`] = `
22502250
source={12}
22512251
style={
22522252
[
2253-
[
2254-
{
2255-
"tintColor": "green",
2256-
},
2257-
undefined,
2258-
],
22592253
undefined,
22602254
undefined,
22612255
undefined,
22622256
{
22632257
"tintColor": "green",
22642258
},
2259+
[
2260+
{
2261+
"tintColor": "green",
2262+
},
2263+
undefined,
2264+
],
22652265
]
22662266
}
22672267
testID="undefined.icon"
@@ -2320,18 +2320,18 @@ exports[`Button icon should apply color on icon 2`] = `
23202320
source={12}
23212321
style={
23222322
[
2323-
[
2324-
{
2325-
"tintColor": "#FC3D2F",
2326-
},
2327-
undefined,
2328-
],
23292323
undefined,
23302324
undefined,
23312325
undefined,
23322326
{
23332327
"tintColor": "#FC3D2F",
23342328
},
2329+
[
2330+
{
2331+
"tintColor": "#FC3D2F",
2332+
},
2333+
undefined,
2334+
],
23352335
]
23362336
}
23372337
testID="undefined.icon"
@@ -2390,6 +2390,12 @@ exports[`Button icon should include custom iconStyle provided as a prop 1`] = `
23902390
source={12}
23912391
style={
23922392
[
2393+
undefined,
2394+
undefined,
2395+
undefined,
2396+
{
2397+
"tintColor": "#FFFFFF",
2398+
},
23932399
[
23942400
{
23952401
"tintColor": "#FFFFFF",
@@ -2399,12 +2405,6 @@ exports[`Button icon should include custom iconStyle provided as a prop 1`] = `
23992405
"tintColor": "red",
24002406
},
24012407
],
2402-
undefined,
2403-
undefined,
2404-
undefined,
2405-
{
2406-
"tintColor": "#FFFFFF",
2407-
},
24082408
]
24092409
}
24102410
testID="undefined.icon"
@@ -2465,18 +2465,18 @@ exports[`Button icon should return icon style according to different variations
24652465
source={12}
24662466
style={
24672467
[
2468-
[
2469-
{
2470-
"tintColor": "#5A48F5",
2471-
},
2472-
undefined,
2473-
],
24742468
undefined,
24752469
undefined,
24762470
undefined,
24772471
{
24782472
"tintColor": "#5A48F5",
24792473
},
2474+
[
2475+
{
2476+
"tintColor": "#5A48F5",
2477+
},
2478+
undefined,
2479+
],
24802480
]
24812481
}
24822482
testID="undefined.icon"
@@ -2535,18 +2535,18 @@ exports[`Button icon should return icon style according to different variations
25352535
source={12}
25362536
style={
25372537
[
2538-
[
2539-
{
2540-
"tintColor": "#5A48F5",
2541-
},
2542-
undefined,
2543-
],
25442538
undefined,
25452539
undefined,
25462540
undefined,
25472541
{
25482542
"tintColor": "#5A48F5",
25492543
},
2544+
[
2545+
{
2546+
"tintColor": "#5A48F5",
2547+
},
2548+
undefined,
2549+
],
25502550
]
25512551
}
25522552
testID="undefined.icon"
@@ -2605,18 +2605,18 @@ exports[`Button icon should return icon style according to different variations
26052605
source={12}
26062606
style={
26072607
[
2608-
[
2609-
{
2610-
"tintColor": "#FFFFFF",
2611-
},
2612-
undefined,
2613-
],
26142608
undefined,
26152609
undefined,
26162610
undefined,
26172611
{
26182612
"tintColor": "#FFFFFF",
26192613
},
2614+
[
2615+
{
2616+
"tintColor": "#FFFFFF",
2617+
},
2618+
undefined,
2619+
],
26202620
]
26212621
}
26222622
testID="undefined.icon"
@@ -3849,18 +3849,18 @@ exports[`Button labelColor should return undefined color if this is an icon butt
38493849
source={12}
38503850
style={
38513851
[
3852-
[
3853-
{
3854-
"tintColor": "#FFFFFF",
3855-
},
3856-
undefined,
3857-
],
38583852
undefined,
38593853
undefined,
38603854
undefined,
38613855
{
38623856
"tintColor": "#FFFFFF",
38633857
},
3858+
[
3859+
{
3860+
"tintColor": "#FFFFFF",
3861+
},
3862+
undefined,
3863+
],
38643864
]
38653865
}
38663866
testID="undefined.icon"

‎src/components/icon/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ const Icon = forwardRef((props: Props, ref: any) => {
9494
{...others}
9595
ref={ref}
9696
source={iconSource}
97-
style={[style, margins, iconSize, shouldFlipRTL && styles.rtlFlipped, !!tintColor && {tintColor}]}
97+
style={[margins, iconSize, shouldFlipRTL && styles.rtlFlipped, !!tintColor && {tintColor}, style]}
9898
/>
9999
);
100100

0 commit comments

Comments
 (0)