Skip to content

Commit fde7ba7

Browse files
PeterTorkiPeterTorki
committed
feat(ListIcon): add iconSize prop to allow custom sizing
1 parent 4efbbaf commit fde7ba7

File tree

6 files changed

+30
-30
lines changed

6 files changed

+30
-30
lines changed

‎example/src/Examples/ListAccordionExample.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,14 +15,14 @@ const ListAccordionExample = () => {
1515
<ScreenWrapper>
1616
<List.Section title="Expandable list item">
1717
<List.Accordion
18-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
18+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
1919
title="Expandable list item"
2020
>
2121
<List.Item title="List item 1" />
2222
<List.Item title="List item 2" />
2323
</List.Accordion>
2424
<List.Accordion
25-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
25+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
2626
title="Start expanded"
2727
expanded={expanded}
2828
onPress={_handlePress}
@@ -43,15 +43,15 @@ const ListAccordionExample = () => {
4343
<Divider />
4444
<List.Section title="Expandable list with icons">
4545
<List.Accordion
46-
left={(props) => <List.Icon size={32} {...props} icon="star" />}
46+
left={(props) => <List.Icon iconSize={32} {...props} icon="star" />}
4747
title="Accordion item 1"
4848
>
4949
<List.Item
50-
left={(props) => <List.Icon size={32} {...props} icon="thumb-up" />}
50+
left={(props) => <List.Icon iconSize={32} {...props} icon="thumb-up" />}
5151
title="List item 1"
5252
/>
5353
<List.Item
54-
left={(props) => <List.Icon size={32} {...props} icon="thumb-down" />}
54+
left={(props) => <List.Icon iconSize={32} {...props} icon="thumb-down" />}
5555
title="List item 2"
5656
/>
5757
</List.Accordion>

‎example/src/Examples/ListAccordionGroupExample.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -19,22 +19,22 @@ const ListAccordionGroupExample = () => {
1919
<List.AccordionGroup>
2020
<List.Section title="Uncontrolled Accordion Group example">
2121
<List.Accordion
22-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
22+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
2323
title="Expandable list item"
2424
id="1"
2525
>
2626
<List.Item title="List item 1" />
2727
<List.Item title="List item 2" />
2828
</List.Accordion>
2929
<List.Accordion
30-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
30+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
3131
title="Expandable list item 2"
3232
id="2"
3333
>
3434
<List.Item title="List item 1" />
3535
</List.Accordion>
3636
<List.Accordion
37-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
37+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
3838
title="Expandable list item 2"
3939
id="3"
4040
>
@@ -48,22 +48,22 @@ const ListAccordionGroupExample = () => {
4848
>
4949
<List.Section title="Controlled Accordion Group example">
5050
<List.Accordion
51-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
51+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
5252
title="Expandable list item"
5353
id="1"
5454
>
5555
<List.Item title="List item 1" />
5656
<List.Item title="List item 2" />
5757
</List.Accordion>
5858
<List.Accordion
59-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
59+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
6060
title="Expandable list item 2"
6161
id="2"
6262
>
6363
<List.Item title="List item 1" />
6464
</List.Accordion>
6565
<List.Accordion
66-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
66+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
6767
title="Expandable list item 2"
6868
id="3"
6969
>

‎example/src/Examples/ListItemExample.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -39,34 +39,34 @@ const ListItemExample = () => {
3939
<List.Section title="With icon">
4040
<List.Item
4141
title="Headline"
42-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
42+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
4343
/>
4444
<List.Item
4545
title="Headline"
4646
description="Supporting text"
47-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
47+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
4848
/>
4949
<List.Item
5050
title="Headline"
5151
description="Supporting text that is long enough to fill up multiple lines in the item"
52-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
52+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
5353
/>
5454
<Divider />
5555
<List.Item
5656
title="Headline"
57-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
57+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
5858
right={() => <CenteredCheckbox />}
5959
/>
6060
<List.Item
6161
title="Headline"
6262
description="Supporting text"
63-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
63+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
6464
right={() => <CenteredCheckbox />}
6565
/>
6666
<List.Item
6767
title="Headline"
6868
description="Supporting text that is long enough to fill up multiple lines in the item"
69-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
69+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
7070
right={() => <Checkbox status="checked" />}
7171
/>
7272
<Divider />
@@ -276,19 +276,19 @@ const ListItemExample = () => {
276276
<Divider />
277277
<List.Item
278278
title="Headline"
279-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
279+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
280280
right={() => <Switch disabled style={styles.centered} />}
281281
/>
282282
<List.Item
283283
title="Headline"
284284
description="Supporting text"
285-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
285+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
286286
right={() => <Switch disabled style={styles.centered} />}
287287
/>
288288
<List.Item
289289
title="Headline"
290290
description="Supporting text that is long enough to fill up multiple lines in the item"
291-
left={(props) => <List.Icon size={32} {...props} icon="account-outline" />}
291+
left={(props) => <List.Icon iconSize={32} {...props} icon="account-outline" />}
292292
right={() => <Switch disabled />}
293293
/>
294294
<Divider />

‎example/src/Examples/ListSectionExample.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,17 +10,17 @@ const ListSectionExample = () => {
1010
<List.Section>
1111
<List.Subheader>Single line</List.Subheader>
1212
<List.Item
13-
left={(props) => <List.Icon size={32} {...props} icon="calendar" />}
13+
left={(props) => <List.Icon iconSize={32} {...props} icon="calendar" />}
1414
title="List item 1"
1515
/>
1616
<List.Item
17-
left={(props) => <List.Icon size={32} {...props} icon="wallet-giftcard" />}
17+
left={(props) => <List.Icon iconSize={32} {...props} icon="wallet-giftcard" />}
1818
title="List item 2"
1919
/>
2020
<List.Item
2121
title="List item 3"
22-
left={(props) => <List.Icon size={32} {...props} icon="folder" />}
23-
right={(props) => <List.Icon size={32} {...props} icon="equal" />}
22+
left={(props) => <List.Icon iconSize={32} {...props} icon="folder" />}
23+
right={(props) => <List.Icon iconSize={32} {...props} icon="equal" />}
2424
/>
2525
</List.Section>
2626
<Divider />
@@ -45,7 +45,7 @@ const ListSectionExample = () => {
4545
accessibilityIgnoresInvertColors
4646
/>
4747
)}
48-
right={(props) => <List.Icon size={32} {...props} icon="information" />}
48+
right={(props) => <List.Icon iconSize={32} {...props} icon="information" />}
4949
title="List item 2"
5050
description="Describes item 2"
5151
/>
@@ -72,7 +72,7 @@ const ListSectionExample = () => {
7272
accessibilityIgnoresInvertColors
7373
/>
7474
)}
75-
right={(props) => <List.Icon size={32} {...props} icon="star-outline" />}
75+
right={(props) => <List.Icon iconSize={32} {...props} icon="star-outline" />}
7676
title="List item 2"
7777
description="Describes item 2. Example of a very very long description."
7878
/>
@@ -88,7 +88,7 @@ const ListSectionExample = () => {
8888
accessibilityIgnoresInvertColors
8989
/>
9090
)}
91-
right={(props) => <List.Icon size={32} {...props} icon="star-outline" />}
91+
right={(props) => <List.Icon iconSize={32} {...props} icon="star-outline" />}
9292
title={({ ellipsizeMode, color: titleColor, fontSize }) => (
9393
<View style={[styles.container, styles.row, styles.customTitle]}>
9494
<Text

‎example/src/Examples/SegmentedButtonsExample.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,15 +28,15 @@ const SegmentedButtonExample = ({ navigation }: Props) => {
2828
title="Single select"
2929
description="Go to the example"
3030
onPress={() => navigation.navigate('segmentedButtonRealCase')}
31-
right={(props) => <List.Icon size={32} {...props} icon="arrow-right" />}
31+
right={(props) => <List.Icon iconSize={32} {...props} icon="arrow-right" />}
3232
/>
3333
<List.Item
3434
title="Multiselect select"
3535
description="Go to the example"
3636
onPress={() =>
3737
navigation.navigate('segmentedButtonMultiselectRealCase')
3838
}
39-
right={(props) => <List.Icon size={32} {...props} icon="arrow-right" />}
39+
right={(props) => <List.Icon iconSize={32} {...props} icon="arrow-right" />}
4040
/>
4141
</List.Section>
4242
<SegmentedButtonDefault />

‎example/src/Examples/ThemeExample.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const ThemeExample = ({ navigation }: Props) => {
2424
title="Themed Sport App"
2525
description="Go to the example"
2626
onPress={() => navigation.navigate('teamsList')}
27-
right={(props) => <List.Icon size={32} {...props} icon="arrow-right" />}
27+
right={(props) => <List.Icon iconSize={32} {...props} icon="arrow-right" />}
2828
/>
2929
</List.Section>
3030
</ScreenWrapper>

0 commit comments

Comments
 (0)