Skip to content

Commit 1e80353

Browse files
szuperazszuperaz
committed
fix: mirror icons in RTL mode
1 parent 90e1610 commit 1e80353

18 files changed

Lines changed: 268 additions & 192 deletions

File tree

‎examples/SampleApp/src/icons/ChatsTab.tsx‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
2-
import Svg, { Path } from 'react-native-svg';
2+
import { I18nManager } from 'react-native';
3+
import Svg, { G, Path } from 'react-native-svg';
34

45
import { IconProps } from '../utils/base';
56
import { useLegacyColors } from '../theme/useLegacyColors';
@@ -8,12 +9,14 @@ export const ChatsTab: React.FC<IconProps> = ({ active, height = 24, width = 24
89
const { black, grey } = useLegacyColors();
910
return (
1011
<Svg fill='none' height={height} viewBox={`0 0 ${height} ${width}`} width={width}>
11-
<Path
12-
clipRule='evenodd'
13-
d='M12 5C7.46774 5 4 8.24148 4 12C4 15.7585 7.46774 19 12 19C12.6209 19 13.224 18.9381 13.8023 18.8215C13.9231 18.7971 14.0473 18.7953 14.1687 18.8161L19.4315 19.717L18.3869 17.0167C18.258 16.6833 18.3168 16.3064 18.5412 16.0282C19.4673 14.8799 20 13.4904 20 12C20 8.24148 16.5323 5 12 5ZM2 12C2 6.92196 6.59113 3 12 3C17.4089 3 22 6.92196 22 12C22 13.7774 21.4276 15.4282 20.4527 16.8133L21.9327 20.6392C22.0625 20.9749 22.0019 21.3545 21.774 21.6332C21.5461 21.9118 21.1861 22.0464 20.8313 21.9857L14.0104 20.8181C13.3601 20.9375 12.6877 21 12 21C6.59113 21 2 17.078 2 12Z'
14-
fill={active ? black : grey}
15-
fillRule='evenodd'
16-
/>
12+
<G transform={I18nManager.isRTL ? `matrix(-1 0 0 1 ${height} 0)` : undefined}>
13+
<Path
14+
clipRule='evenodd'
15+
d='M12 5C7.46774 5 4 8.24148 4 12C4 15.7585 7.46774 19 12 19C12.6209 19 13.224 18.9381 13.8023 18.8215C13.9231 18.7971 14.0473 18.7953 14.1687 18.8161L19.4315 19.717L18.3869 17.0167C18.258 16.6833 18.3168 16.3064 18.5412 16.0282C19.4673 14.8799 20 13.4904 20 12C20 8.24148 16.5323 5 12 5ZM2 12C2 6.92196 6.59113 3 12 3C17.4089 3 22 6.92196 22 12C22 13.7774 21.4276 15.4282 20.4527 16.8133L21.9327 20.6392C22.0625 20.9749 22.0019 21.3545 21.774 21.6332C21.5461 21.9118 21.1861 22.0464 20.8313 21.9857L14.0104 20.8181C13.3601 20.9375 12.6877 21 12 21C6.59113 21 2 17.078 2 12Z'
16+
fill={active ? black : grey}
17+
fillRule='evenodd'
18+
/>
19+
</G>
1720
</Svg>
1821
);
1922
};

‎examples/SampleApp/src/icons/Mute.tsx‎

Lines changed: 23 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,43 @@
11
import React from 'react';
2-
import Svg, { Path, Mask } from 'react-native-svg';
2+
import { I18nManager } from 'react-native';
3+
import Svg, { G, Path, Mask } from 'react-native-svg';
34

45
import { IconProps } from '../utils/base';
56

67
export const Mute: React.FC<IconProps> = ({ height = 20, width = 20, ...rest }) => {
78
return (
89
<Svg fill='none' height={height} viewBox={`0 0 20 20`} width={width}>
9-
<Mask id='path-1-inside-1_13026_9690' fill='white'>
10+
<G transform={I18nManager.isRTL ? 'matrix(-1 0 0 1 20 0)' : undefined}>
11+
<Mask id='path-1-inside-1_13026_9690' fill='white'>
12+
<Path
13+
fillRule='evenodd'
14+
clipRule='evenodd'
15+
d='M14.1667 4.94798V3.52008C14.1667 2.67101 13.2054 2.17862 12.5163 2.67473L8.40442 5.63533C8.22712 5.76297 8.01421 5.83164 7.79576 5.83164H6.45833C5.19268 5.83164 4.16666 6.85766 4.16666 8.12331V11.8733C4.16666 12.7069 4.61171 13.4365 5.27714 13.8375L2.68306 16.4316C2.43898 16.6757 2.43898 17.0714 2.68306 17.3155C2.92713 17.5595 3.32286 17.5595 3.56694 17.3155L17.3169 3.56548C17.561 3.3214 17.561 2.92567 17.3169 2.68159C17.0728 2.43752 16.6772 2.43752 16.4331 2.68159L14.1667 4.94798ZM6.22574 12.889C5.76241 12.7832 5.41666 12.3686 5.41666 11.8733V8.12331C5.41666 7.54802 5.88303 7.08164 6.45833 7.08164H7.79576C8.27634 7.08164 8.74475 6.93055 9.13475 6.64974L12.9167 3.92679V6.19798L6.22574 12.889Z'
16+
{...rest}
17+
/>
18+
<Path
19+
d='M12.9167 16.0699L9.23183 13.4168L8.33391 14.3147C8.35791 14.3293 8.3815 14.3448 8.40441 14.3613L12.5163 17.3219C13.2054 17.818 14.1667 17.3256 14.1667 16.4765V8.48195L12.9167 9.73195V16.0699Z'
20+
{...rest}
21+
/>
22+
</Mask>
1023
<Path
1124
fillRule='evenodd'
1225
clipRule='evenodd'
1326
d='M14.1667 4.94798V3.52008C14.1667 2.67101 13.2054 2.17862 12.5163 2.67473L8.40442 5.63533C8.22712 5.76297 8.01421 5.83164 7.79576 5.83164H6.45833C5.19268 5.83164 4.16666 6.85766 4.16666 8.12331V11.8733C4.16666 12.7069 4.61171 13.4365 5.27714 13.8375L2.68306 16.4316C2.43898 16.6757 2.43898 17.0714 2.68306 17.3155C2.92713 17.5595 3.32286 17.5595 3.56694 17.3155L17.3169 3.56548C17.561 3.3214 17.561 2.92567 17.3169 2.68159C17.0728 2.43752 16.6772 2.43752 16.4331 2.68159L14.1667 4.94798ZM6.22574 12.889C5.76241 12.7832 5.41666 12.3686 5.41666 11.8733V8.12331C5.41666 7.54802 5.88303 7.08164 6.45833 7.08164H7.79576C8.27634 7.08164 8.74475 6.93055 9.13475 6.64974L12.9167 3.92679V6.19798L6.22574 12.889Z'
27+
fill='black'
1428
{...rest}
1529
/>
1630
<Path
1731
d='M12.9167 16.0699L9.23183 13.4168L8.33391 14.3147C8.35791 14.3293 8.3815 14.3448 8.40441 14.3613L12.5163 17.3219C13.2054 17.818 14.1667 17.3256 14.1667 16.4765V8.48195L12.9167 9.73195V16.0699Z'
32+
fill='black'
1833
{...rest}
1934
/>
20-
</Mask>
21-
<Path
22-
fillRule='evenodd'
23-
clipRule='evenodd'
24-
d='M14.1667 4.94798V3.52008C14.1667 2.67101 13.2054 2.17862 12.5163 2.67473L8.40442 5.63533C8.22712 5.76297 8.01421 5.83164 7.79576 5.83164H6.45833C5.19268 5.83164 4.16666 6.85766 4.16666 8.12331V11.8733C4.16666 12.7069 4.61171 13.4365 5.27714 13.8375L2.68306 16.4316C2.43898 16.6757 2.43898 17.0714 2.68306 17.3155C2.92713 17.5595 3.32286 17.5595 3.56694 17.3155L17.3169 3.56548C17.561 3.3214 17.561 2.92567 17.3169 2.68159C17.0728 2.43752 16.6772 2.43752 16.4331 2.68159L14.1667 4.94798ZM6.22574 12.889C5.76241 12.7832 5.41666 12.3686 5.41666 11.8733V8.12331C5.41666 7.54802 5.88303 7.08164 6.45833 7.08164H7.79576C8.27634 7.08164 8.74475 6.93055 9.13475 6.64974L12.9167 3.92679V6.19798L6.22574 12.889Z'
25-
fill='black'
26-
{...rest}
27-
/>
28-
<Path
29-
d='M12.9167 16.0699L9.23183 13.4168L8.33391 14.3147C8.35791 14.3293 8.3815 14.3448 8.40441 14.3613L12.5163 17.3219C13.2054 17.818 14.1667 17.3256 14.1667 16.4765V8.48195L12.9167 9.73195V16.0699Z'
30-
fill='black'
31-
{...rest}
32-
/>
33-
<Path
34-
d='M14.1667 4.94798H12.6667V8.56928L15.2273 6.00865L14.1667 4.94798ZM12.5163 2.67473L11.6399 1.4574L11.6399 1.45743L12.5163 2.67473ZM8.40442 5.63533L9.28083 6.85265L9.28088 6.85262L8.40442 5.63533ZM5.27714 13.8375L6.3378 14.8982L7.69345 13.5425L6.05147 12.5529L5.27714 13.8375ZM2.68306 16.4316L1.6224 15.371L1.62238 15.371L2.68306 16.4316ZM3.56694 17.3155L2.50628 16.2548L2.50626 16.2548L3.56694 17.3155ZM17.3169 3.56548L16.2563 2.5048L16.2563 2.50482L17.3169 3.56548ZM16.4331 2.68159L15.3724 1.62091L15.3724 1.62093L16.4331 2.68159ZM6.22574 12.889L5.89197 14.3513L6.7002 14.5358L7.2864 13.9496L6.22574 12.889ZM9.13475 6.64974L8.2583 5.43244L8.25827 5.43245L9.13475 6.64974ZM12.9167 3.92679H14.4167V0.99846L12.0402 2.70949L12.9167 3.92679ZM12.9167 6.19798L13.9773 7.25864L14.4167 6.8193V6.19798H12.9167ZM12.9167 16.0699L12.0402 17.2872L14.4167 18.9982V16.0699H12.9167ZM9.23183 13.4168L10.1083 12.1995L9.07313 11.4542L8.17117 12.3561L9.23183 13.4168ZM8.33391 14.3147L7.27325 13.254L5.9226 14.6047L7.55498 15.5966L8.33391 14.3147ZM8.40441 14.3613L9.28087 13.144H9.28087L8.40441 14.3613ZM12.5163 17.3219L13.3928 16.1046L13.3928 16.1046L12.5163 17.3219ZM14.1667 8.48195H15.6667V4.86063L13.106 7.42129L14.1667 8.48195ZM12.9167 9.73195L11.856 8.67129L11.4167 9.11063V9.73195H12.9167ZM14.1667 4.94798H15.6667V3.52008H14.1667H12.6667V4.94798H14.1667ZM14.1667 3.52008H15.6667C15.6667 1.44832 13.3212 0.24697 11.6399 1.4574L12.5163 2.67473L13.3928 3.89205C13.0897 4.11027 12.6667 3.8937 12.6667 3.52008H14.1667ZM12.5163 2.67473L11.6399 1.45743L7.52795 4.41803L8.40442 5.63533L9.28088 6.85262L13.3928 3.89202L12.5163 2.67473ZM8.40442 5.63533L7.528 4.418C7.60596 4.36187 7.69963 4.33164 7.79576 4.33164V5.83164V7.33164C8.32878 7.33164 8.84828 7.16407 9.28083 6.85265L8.40442 5.63533ZM7.79576 5.83164V4.33164H6.45833V5.83164V7.33164H7.79576V5.83164ZM6.45833 5.83164V4.33164C4.36425 4.33164 2.66666 6.02923 2.66666 8.12331H4.16666H5.66666C5.66666 7.68609 6.02111 7.33164 6.45833 7.33164V5.83164ZM4.16666 8.12331H2.66666V11.8733H4.16666H5.66666V8.12331H4.16666ZM4.16666 11.8733H2.66666C2.66666 13.2543 3.40584 14.461 4.50281 15.1222L5.27714 13.8375L6.05147 12.5529C5.81757 12.4119 5.66666 12.1595 5.66666 11.8733H4.16666ZM5.27714 13.8375L4.21648 12.7769L1.6224 15.371L2.68306 16.4316L3.74372 17.4923L6.3378 14.8982L5.27714 13.8375ZM2.68306 16.4316L1.62238 15.371C0.792541 16.2008 0.792541 17.5462 1.62238 18.3761L2.68306 17.3155L3.74373 16.2548C4.08542 16.5965 4.08542 17.1506 3.74373 17.4923L2.68306 16.4316ZM2.68306 17.3155L1.62238 18.3761C2.45224 19.206 3.79775 19.206 4.62762 18.3761L3.56694 17.3155L2.50626 16.2548C2.84798 15.9131 3.40202 15.9131 3.74373 16.2548L2.68306 17.3155ZM3.56694 17.3155L4.6276 18.3761L18.3776 4.62614L17.3169 3.56548L16.2563 2.50482L2.50628 16.2548L3.56694 17.3155ZM17.3169 3.56548L18.3776 4.62615C19.2075 3.79629 19.2075 2.45078 18.3776 1.62091L17.3169 2.68159L16.2563 3.74227C15.9145 3.40056 15.9145 2.84651 16.2563 2.5048L17.3169 3.56548ZM17.3169 2.68159L18.3776 1.62091C17.5477 0.791077 16.2023 0.791077 15.3724 1.62091L16.4331 2.68159L17.4937 3.74227C17.152 4.08396 16.598 4.08396 16.2563 3.74227L17.3169 2.68159ZM16.4331 2.68159L15.3724 1.62093L13.106 3.88732L14.1667 4.94798L15.2273 6.00865L17.4937 3.74226L16.4331 2.68159ZM6.22574 12.889L6.55951 11.4266C6.76332 11.4731 6.91666 11.6534 6.91666 11.8733H5.41666H3.91666C3.91666 13.0839 4.76149 14.0933 5.89197 14.3513L6.22574 12.889ZM5.41666 11.8733H6.91666V8.12331H5.41666H3.91666V11.8733H5.41666ZM5.41666 8.12331H6.91666C6.91666 8.37644 6.71147 8.58164 6.45833 8.58164V7.08164V5.58164C5.0546 5.58164 3.91666 6.7196 3.91666 8.12331H5.41666ZM6.45833 7.08164V8.58164H7.79576V7.08164V5.58164H6.45833V7.08164ZM7.79576 7.08164V8.58164C8.59092 8.58164 9.36594 8.33165 10.0112 7.86703L9.13475 6.64974L8.25827 5.43245C8.12355 5.52945 7.96176 5.58164 7.79576 5.58164V7.08164ZM9.13475 6.64974L10.0112 7.86705L13.7931 5.1441L12.9167 3.92679L12.0402 2.70949L8.2583 5.43244L9.13475 6.64974ZM12.9167 3.92679H11.4167V6.19798H12.9167H14.4167V3.92679H12.9167ZM12.9167 6.19798L11.856 5.13733L5.16508 11.8283L6.22574 12.889L7.2864 13.9496L13.9773 7.25864L12.9167 6.19798ZM12.9167 16.0699L13.7931 14.8526L10.1083 12.1995L9.23183 13.4168L8.35537 14.6341L12.0402 17.2872L12.9167 16.0699ZM9.23183 13.4168L8.17117 12.3561L7.27325 13.254L8.33391 14.3147L9.39457 15.3754L10.2925 14.4774L9.23183 13.4168ZM8.33391 14.3147L7.55498 15.5966C7.54867 15.5928 7.53944 15.5869 7.52796 15.5786L8.40441 14.3613L9.28087 13.144C9.22355 13.1027 9.16716 13.0658 9.11285 13.0328L8.33391 14.3147ZM8.40441 14.3613L7.52796 15.5786L11.6399 18.5392L12.5163 17.3219L13.3928 16.1046L9.28087 13.144L8.40441 14.3613ZM12.5163 17.3219L11.6398 18.5391C13.3212 19.7498 15.6667 18.5482 15.6667 16.4765H14.1667H12.6667C12.6667 16.103 13.0896 15.8863 13.3928 16.1046L12.5163 17.3219ZM14.1667 16.4765H15.6667V8.48195H14.1667H12.6667V16.4765H14.1667ZM14.1667 8.48195L13.106 7.42129L11.856 8.67129L12.9167 9.73195L13.9773 10.7926L15.2273 9.54261L14.1667 8.48195ZM12.9167 9.73195H11.4167V16.0699H12.9167H14.4167V9.73195H12.9167Z'
35-
mask='url(#path-1-inside-1_13026_9690)'
36-
{...rest}
37-
/>
35+
<Path
36+
d='M14.1667 4.94798H12.6667V8.56928L15.2273 6.00865L14.1667 4.94798ZM12.5163 2.67473L11.6399 1.4574L11.6399 1.45743L12.5163 2.67473ZM8.40442 5.63533L9.28083 6.85265L9.28088 6.85262L8.40442 5.63533ZM5.27714 13.8375L6.3378 14.8982L7.69345 13.5425L6.05147 12.5529L5.27714 13.8375ZM2.68306 16.4316L1.6224 15.371L1.62238 15.371L2.68306 16.4316ZM3.56694 17.3155L2.50628 16.2548L2.50626 16.2548L3.56694 17.3155ZM17.3169 3.56548L16.2563 2.5048L16.2563 2.50482L17.3169 3.56548ZM16.4331 2.68159L15.3724 1.62091L15.3724 1.62093L16.4331 2.68159ZM6.22574 12.889L5.89197 14.3513L6.7002 14.5358L7.2864 13.9496L6.22574 12.889ZM9.13475 6.64974L8.2583 5.43244L8.25827 5.43245L9.13475 6.64974ZM12.9167 3.92679H14.4167V0.99846L12.0402 2.70949L12.9167 3.92679ZM12.9167 6.19798L13.9773 7.25864L14.4167 6.8193V6.19798H12.9167ZM12.9167 16.0699L12.0402 17.2872L14.4167 18.9982V16.0699H12.9167ZM9.23183 13.4168L10.1083 12.1995L9.07313 11.4542L8.17117 12.3561L9.23183 13.4168ZM8.33391 14.3147L7.27325 13.254L5.9226 14.6047L7.55498 15.5966L8.33391 14.3147ZM8.40441 14.3613L9.28087 13.144H9.28087L8.40441 14.3613ZM12.5163 17.3219L13.3928 16.1046L13.3928 16.1046L12.5163 17.3219ZM14.1667 8.48195H15.6667V4.86063L13.106 7.42129L14.1667 8.48195ZM12.9167 9.73195L11.856 8.67129L11.4167 9.11063V9.73195H12.9167ZM14.1667 4.94798H15.6667V3.52008H14.1667H12.6667V4.94798H14.1667ZM14.1667 3.52008H15.6667C15.6667 1.44832 13.3212 0.24697 11.6399 1.4574L12.5163 2.67473L13.3928 3.89205C13.0897 4.11027 12.6667 3.8937 12.6667 3.52008H14.1667ZM12.5163 2.67473L11.6399 1.45743L7.52795 4.41803L8.40442 5.63533L9.28088 6.85262L13.3928 3.89202L12.5163 2.67473ZM8.40442 5.63533L7.528 4.418C7.60596 4.36187 7.69963 4.33164 7.79576 4.33164V5.83164V7.33164C8.32878 7.33164 8.84828 7.16407 9.28083 6.85265L8.40442 5.63533ZM7.79576 5.83164V4.33164H6.45833V5.83164V7.33164H7.79576V5.83164ZM6.45833 5.83164V4.33164C4.36425 4.33164 2.66666 6.02923 2.66666 8.12331H4.16666H5.66666C5.66666 7.68609 6.02111 7.33164 6.45833 7.33164V5.83164ZM4.16666 8.12331H2.66666V11.8733H4.16666H5.66666V8.12331H4.16666ZM4.16666 11.8733H2.66666C2.66666 13.2543 3.40584 14.461 4.50281 15.1222L5.27714 13.8375L6.05147 12.5529C5.81757 12.4119 5.66666 12.1595 5.66666 11.8733H4.16666ZM5.27714 13.8375L4.21648 12.7769L1.6224 15.371L2.68306 16.4316L3.74372 17.4923L6.3378 14.8982L5.27714 13.8375ZM2.68306 16.4316L1.62238 15.371C0.792541 16.2008 0.792541 17.5462 1.62238 18.3761L2.68306 17.3155L3.74373 16.2548C4.08542 16.5965 4.08542 17.1506 3.74373 17.4923L2.68306 16.4316ZM2.68306 17.3155L1.62238 18.3761C2.45224 19.206 3.79775 19.206 4.62762 18.3761L3.56694 17.3155L2.50626 16.2548C2.84798 15.9131 3.40202 15.9131 3.74373 16.2548L2.68306 17.3155ZM3.56694 17.3155L4.6276 18.3761L18.3776 4.62614L17.3169 3.56548L16.2563 2.50482L2.50628 16.2548L3.56694 17.3155ZM17.3169 3.56548L18.3776 4.62615C19.2075 3.79629 19.2075 2.45078 18.3776 1.62091L17.3169 2.68159L16.2563 3.74227C15.9145 3.40056 15.9145 2.84651 16.2563 2.5048L17.3169 3.56548ZM17.3169 2.68159L18.3776 1.62091C17.5477 0.791077 16.2023 0.791077 15.3724 1.62091L16.4331 2.68159L17.4937 3.74227C17.152 4.08396 16.598 4.08396 16.2563 3.74227L17.3169 2.68159ZM16.4331 2.68159L15.3724 1.62093L13.106 3.88732L14.1667 4.94798L15.2273 6.00865L17.4937 3.74226L16.4331 2.68159ZM6.22574 12.889L6.55951 11.4266C6.76332 11.4731 6.91666 11.6534 6.91666 11.8733H5.41666H3.91666C3.91666 13.0839 4.76149 14.0933 5.89197 14.3513L6.22574 12.889ZM5.41666 11.8733H6.91666V8.12331H5.41666H3.91666V11.8733H5.41666ZM5.41666 8.12331H6.91666C6.91666 8.37644 6.71147 8.58164 6.45833 8.58164V7.08164V5.58164C5.0546 5.58164 3.91666 6.7196 3.91666 8.12331H5.41666ZM6.45833 7.08164V8.58164H7.79576V7.08164V5.58164H6.45833V7.08164ZM7.79576 7.08164V8.58164C8.59092 8.58164 9.36594 8.33165 10.0112 7.86703L9.13475 6.64974L8.25827 5.43245C8.12355 5.52945 7.96176 5.58164 7.79576 5.58164V7.08164ZM9.13475 6.64974L10.0112 7.86705L13.7931 5.1441L12.9167 3.92679L12.0402 2.70949L8.2583 5.43244L9.13475 6.64974ZM12.9167 3.92679H11.4167V6.19798H12.9167H14.4167V3.92679H12.9167ZM12.9167 6.19798L11.856 5.13733L5.16508 11.8283L6.22574 12.889L7.2864 13.9496L13.9773 7.25864L12.9167 6.19798ZM12.9167 16.0699L13.7931 14.8526L10.1083 12.1995L9.23183 13.4168L8.35537 14.6341L12.0402 17.2872L12.9167 16.0699ZM9.23183 13.4168L8.17117 12.3561L7.27325 13.254L8.33391 14.3147L9.39457 15.3754L10.2925 14.4774L9.23183 13.4168ZM8.33391 14.3147L7.55498 15.5966C7.54867 15.5928 7.53944 15.5869 7.52796 15.5786L8.40441 14.3613L9.28087 13.144C9.22355 13.1027 9.16716 13.0658 9.11285 13.0328L8.33391 14.3147ZM8.40441 14.3613L7.52796 15.5786L11.6399 18.5392L12.5163 17.3219L13.3928 16.1046L9.28087 13.144L8.40441 14.3613ZM12.5163 17.3219L11.6398 18.5391C13.3212 19.7498 15.6667 18.5482 15.6667 16.4765H14.1667H12.6667C12.6667 16.103 13.0896 15.8863 13.3928 16.1046L12.5163 17.3219ZM14.1667 16.4765H15.6667V8.48195H14.1667H12.6667V16.4765H14.1667ZM14.1667 8.48195L13.106 7.42129L11.856 8.67129L12.9167 9.73195L13.9773 10.7926L15.2273 9.54261L14.1667 8.48195ZM12.9167 9.73195H11.4167V16.0699H12.9167H14.4167V9.73195H12.9167Z'
37+
mask='url(#path-1-inside-1_13026_9690)'
38+
{...rest}
39+
/>
40+
</G>
3841
</Svg>
3942
);
4043
};

‎examples/SampleApp/src/icons/RightArrow.tsx‎

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import React from 'react';
2+
import { I18nManager } from 'react-native';
23
import { G, Path, Svg } from 'react-native-svg';
34

45
import { IconProps } from '../utils/base';
@@ -17,14 +18,16 @@ export const RightArrow = ({
1718

1819
return (
1920
<Svg fill='none' height={height ?? size} viewBox='0 0 20 20' width={width ?? size} {...rest}>
20-
<G transform='matrix(-1 0 0 1 20 0)'>
21-
<Path
22-
d='M16.875 10H3.125M3.125 10L8.75 4.375M3.125 10L8.75 15.625'
23-
stroke={color}
24-
strokeLinecap='round'
25-
strokeLinejoin='round'
26-
strokeWidth={1.5}
27-
/>
21+
<G transform={I18nManager.isRTL ? 'matrix(-1 0 0 1 20 0)' : undefined}>
22+
<G transform='matrix(-1 0 0 1 20 0)'>
23+
<Path
24+
d='M16.875 10H3.125M3.125 10L8.75 4.375M3.125 10L8.75 15.625'
25+
stroke={color}
26+
strokeLinecap='round'
27+
strokeLinejoin='round'
28+
strokeWidth={1.5}
29+
/>
30+
</G>
2831
</G>
2932
</Svg>
3033
);

‎examples/SampleApp/src/icons/Search.tsx‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,29 @@
11
import React from 'react';
2+
import { I18nManager } from 'react-native';
23
import Svg, { G, Path } from 'react-native-svg';
34

45
import { IconProps } from '../utils/base';
56
import { useLegacyColors } from '../theme/useLegacyColors';
67

78
export const Search: React.FC<IconProps> = ({ fill, height = 24, scale = 1, width = 24 }) => {
89
const { black } = useLegacyColors();
10+
const vbWidth = height * scale;
911
return (
1012
<Svg
1113
fill='none'
1214
height={height * scale}
1315
viewBox={`0 0 ${height * scale} ${width * scale}`}
1416
width={width * scale}
1517
>
16-
<G scale={scale}>
17-
<Path
18-
clipRule='evenodd'
19-
d='M11 2c4.968 0 9 4.032 9 9s-4.032 9-9 9-9-4.032-9-9 4.032-9 9-9zm0 16c3.867 0 7-3.133 7-7 0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7zm11.314 2.899l-2.829-2.828-1.414 1.414 2.828 2.829 1.415-1.415z'
20-
fill={fill || black}
21-
fillRule='evenodd'
22-
/>
18+
<G transform={I18nManager.isRTL ? `matrix(-1 0 0 1 ${vbWidth} 0)` : undefined}>
19+
<G scale={scale}>
20+
<Path
21+
clipRule='evenodd'
22+
d='M11 2c4.968 0 9 4.032 9 9s-4.032 9-9 9-9-4.032-9-9 4.032-9 9-9zm0 16c3.867 0 7-3.133 7-7 0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7zm11.314 2.899l-2.829-2.828-1.414 1.414 2.828 2.829 1.415-1.415z'
23+
fill={fill || black}
24+
fillRule='evenodd'
25+
/>
26+
</G>
2327
</G>
2428
</Svg>
2529
);

0 commit comments

Comments
 (0)