Skip to content

Commit e34c3e4

Browse files
lukewalczaklukewalczak
authored
refactor: replace MaterialCommunityIcon in favor of internal Icon (#3699)
1 parent 5c31ef9 commit e34c3e4

File tree

11 files changed

+46
-43
lines changed

11 files changed

+46
-43
lines changed

‎src/components/Appbar/AppbarBackIcon.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import * as React from 'react';
22
import { Platform, I18nManager, View, Image, StyleSheet } from 'react-native';
33

4-
import MaterialCommunityIcon from '../MaterialCommunityIcon';
4+
import Icon from '../Icon';
55

66
const AppbarBackIcon = ({ size, color }: { size: number; color: string }) => {
77
const iosIconSize = size - 3;
@@ -27,8 +27,8 @@ const AppbarBackIcon = ({ size, color }: { size: number; color: string }) => {
2727
/>
2828
</View>
2929
) : (
30-
<MaterialCommunityIcon
31-
name="arrow-left"
30+
<Icon
31+
source="arrow-left"
3232
color={color}
3333
size={size}
3434
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}

‎src/components/Checkbox/CheckboxAndroid.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88

99
import { useInternalTheme } from '../../core/theming';
1010
import type { $RemoveChildren, ThemeProp } from '../../types';
11-
import MaterialCommunityIcon from '../MaterialCommunityIcon';
11+
import Icon from '../Icon';
1212
import TouchableRipple from '../TouchableRipple/TouchableRipple';
1313
import { getAndroidSelectionControlColor } from './utils';
1414

@@ -143,9 +143,9 @@ const CheckboxAndroid = ({
143143
theme={theme}
144144
>
145145
<Animated.View style={{ transform: [{ scale: scaleAnim }] }}>
146-
<MaterialCommunityIcon
146+
<Icon
147147
allowFontScaling={false}
148-
name={icon}
148+
source={icon}
149149
size={24}
150150
color={selectionControlColor}
151151
direction="ltr"

‎src/components/Checkbox/CheckboxIOS.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { GestureResponderEvent, StyleSheet, View } from 'react-native';
33

44
import { useInternalTheme } from '../../core/theming';
55
import type { $RemoveChildren, ThemeProp } from '../../types';
6-
import MaterialCommunityIcon from '../MaterialCommunityIcon';
6+
import Icon from '../Icon';
77
import TouchableRipple from '../TouchableRipple/TouchableRipple';
88
import { getSelectionControlIOSColor } from './utils';
99

@@ -86,9 +86,9 @@ const CheckboxIOS = ({
8686
theme={theme}
8787
>
8888
<View style={{ opacity }}>
89-
<MaterialCommunityIcon
89+
<Icon
9090
allowFontScaling={false}
91-
name={icon}
91+
source={icon}
9292
size={24}
9393
color={checkedColor}
9494
direction="ltr"

‎src/components/Chip/Chip.tsx

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@ import { white } from '../../styles/themes/v2/colors';
1717
import type { EllipsizeProp, ThemeProp } from '../../types';
1818
import type { IconSource } from '../Icon';
1919
import Icon from '../Icon';
20-
import MaterialCommunityIcon from '../MaterialCommunityIcon';
2120
import Surface from '../Surface';
2221
import TouchableRipple from '../TouchableRipple/TouchableRipple';
2322
import Text from '../Typography/Text';
@@ -323,8 +322,8 @@ const Chip = ({
323322
theme={theme}
324323
/>
325324
) : (
326-
<MaterialCommunityIcon
327-
name="check"
325+
<Icon
326+
source="check"
328327
color={avatar ? white : iconColor}
329328
size={18}
330329
direction="ltr"
@@ -365,8 +364,8 @@ const Chip = ({
365364
{closeIcon ? (
366365
<Icon source={closeIcon} color={iconColor} size={iconSize} />
367366
) : (
368-
<MaterialCommunityIcon
369-
name={isV3 ? 'close' : 'close-circle'}
367+
<Icon
368+
source={isV3 ? 'close' : 'close-circle'}
370369
size={iconSize}
371370
color={iconColor}
372371
direction="ltr"

‎src/components/DataTable/DataTablePagination.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@ import type { ThemeProp } from 'src/types';
1212

1313
import { useInternalTheme } from '../../core/theming';
1414
import Button from '../Button/Button';
15+
import Icon from '../Icon';
1516
import IconButton from '../IconButton/IconButton';
16-
import MaterialCommunityIcon from '../MaterialCommunityIcon';
1717
import Menu from '../Menu/Menu';
1818
import Text from '../Typography/Text';
1919

@@ -101,8 +101,8 @@ const PaginationControls = ({
101101
{showFastPaginationControls ? (
102102
<IconButton
103103
icon={({ size, color }) => (
104-
<MaterialCommunityIcon
105-
name="page-first"
104+
<Icon
105+
source="page-first"
106106
color={color}
107107
size={size}
108108
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}
@@ -117,8 +117,8 @@ const PaginationControls = ({
117117
) : null}
118118
<IconButton
119119
icon={({ size, color }) => (
120-
<MaterialCommunityIcon
121-
name="chevron-left"
120+
<Icon
121+
source="chevron-left"
122122
color={color}
123123
size={size}
124124
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}
@@ -132,8 +132,8 @@ const PaginationControls = ({
132132
/>
133133
<IconButton
134134
icon={({ size, color }) => (
135-
<MaterialCommunityIcon
136-
name="chevron-right"
135+
<Icon
136+
source="chevron-right"
137137
color={color}
138138
size={size}
139139
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}
@@ -148,8 +148,8 @@ const PaginationControls = ({
148148
{showFastPaginationControls ? (
149149
<IconButton
150150
icon={({ size, color }) => (
151-
<MaterialCommunityIcon
152-
name="page-last"
151+
<Icon
152+
source="page-last"
153153
color={color}
154154
size={size}
155155
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}

‎src/components/DataTable/DataTableTitle.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import color from 'color';
1515

1616
import { useInternalTheme } from '../../core/theming';
1717
import type { ThemeProp } from '../../types';
18-
import MaterialCommunityIcon from '../MaterialCommunityIcon';
18+
import Icon from '../Icon';
1919
import Text from '../Typography/Text';
2020

2121
export type Props = React.ComponentPropsWithRef<
@@ -120,8 +120,8 @@ const DataTableTitle = ({
120120

121121
const icon = sortDirection ? (
122122
<Animated.View style={[styles.icon, { transform: [{ rotate: spin }] }]}>
123-
<MaterialCommunityIcon
124-
name="arrow-up"
123+
<Icon
124+
source="arrow-up"
125125
size={16}
126126
color={textColor}
127127
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}

‎src/components/Icon.tsx

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,9 @@ type IconProps = {
2424
};
2525

2626
type Props = IconProps & {
27-
color?: string;
2827
source: any;
28+
color?: string;
29+
direction?: 'rtl' | 'ltr' | 'auto';
2930
/**
3031
* @optional
3132
*/
@@ -72,17 +73,20 @@ const Icon = ({
7273
color,
7374
size,
7475
theme: themeOverrides,
76+
direction: customDirection,
7577
...rest
7678
}: Props) => {
7779
const theme = useInternalTheme(themeOverrides);
7880
const direction =
79-
typeof source === 'object' && source.direction && source.source
81+
customDirection ||
82+
(typeof source === 'object' && source.direction && source.source
8083
? source.direction === 'auto'
8184
? I18nManager.getConstants().isRTL
8285
? 'rtl'
8386
: 'ltr'
8487
: source.direction
85-
: null;
88+
: null);
89+
8690
const s =
8791
typeof source === 'object' && source.direction && source.source
8892
? source.source

‎src/components/List/ListAccordion.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212

1313
import { useInternalTheme } from '../../core/theming';
1414
import type { ThemeProp } from '../../types';
15-
import MaterialCommunityIcon from '../MaterialCommunityIcon';
15+
import Icon from '../Icon';
1616
import TouchableRipple from '../TouchableRipple/TouchableRipple';
1717
import Text from '../Typography/Text';
1818
import { ListAccordionGroupContext } from './ListAccordionGroup';
@@ -262,8 +262,8 @@ const ListAccordion = ({
262262
isExpanded: isExpanded,
263263
})
264264
) : (
265-
<MaterialCommunityIcon
266-
name={isExpanded ? 'chevron-up' : 'chevron-down'}
265+
<Icon
266+
source={isExpanded ? 'chevron-up' : 'chevron-down'}
267267
color={theme.isV3 ? descriptionColor : titleColor}
268268
size={24}
269269
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}

‎src/components/RadioButton/RadioButtonIOS.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { GestureResponderEvent, StyleSheet, View } from 'react-native';
44
import { useInternalTheme } from '../../core/theming';
55
import type { $RemoveChildren, InternalTheme } from '../../types';
66
import { getSelectionControlIOSColor } from '../Checkbox/utils';
7-
import MaterialCommunityIcon from '../MaterialCommunityIcon';
7+
import Icon from '../Icon';
88
import TouchableRipple from '../TouchableRipple/TouchableRipple';
99
import { RadioButtonContext, RadioButtonContextType } from './RadioButtonGroup';
1010
import { handlePress, isChecked } from './utils';
@@ -109,9 +109,9 @@ const RadioButtonIOS = ({
109109
theme={theme}
110110
>
111111
<View style={{ opacity }}>
112-
<MaterialCommunityIcon
112+
<Icon
113113
allowFontScaling={false}
114-
name="check"
114+
source="check"
115115
size={24}
116116
color={checkedColor}
117117
direction="ltr"

‎src/components/Searchbar.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,8 @@ import type { ThemeProp } from '../types';
2020
import { forwardRef } from '../utils/forwardRef';
2121
import ActivityIndicator from './ActivityIndicator';
2222
import type { IconSource } from './Icon';
23+
import Icon from './Icon';
2324
import IconButton from './IconButton/IconButton';
24-
import MaterialCommunityIcon from './MaterialCommunityIcon';
2525
import Surface from './Surface';
2626

2727
export type Props = React.ComponentPropsWithRef<typeof TextInput> & {
@@ -203,8 +203,8 @@ const Searchbar = forwardRef<TextInputHandles, Props>(
203203
icon={
204204
icon ||
205205
(({ size, color }) => (
206-
<MaterialCommunityIcon
207-
name="magnify"
206+
<Icon
207+
source="magnify"
208208
color={color}
209209
size={size}
210210
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}
@@ -261,8 +261,8 @@ const Searchbar = forwardRef<TextInputHandles, Props>(
261261
icon={
262262
clearIcon ||
263263
(({ size, color }) => (
264-
<MaterialCommunityIcon
265-
name="close"
264+
<Icon
265+
source="close"
266266
color={color}
267267
size={size}
268268
direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}

0 commit comments

Comments
 (0)