Merge branch 'icons' into 'main'

computools-anastasiia-nahaiska · computools-anastasiia-nahaiska · commit 4591ed287a29 · 2025-01-13T11:22:02.000Z
Icons

See merge request react-native/react-native-material-components!24
diff --git a/src/components/icons/ person-icon/PersonIcon.component.tsx b/src/components/icons/ person-icon/PersonIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const PersonIcon = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}: IconProps) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/ person-icon/path.json b/src/components/icons/ person-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M12 12c-1.1 0-2.042-0.392-2.825-1.175s-1.175-1.725-1.175-2.825c0-1.1 0.392-2.042 1.175-2.825s1.725-1.175 2.825-1.175c1.1 0 2.042 0.392 2.825 1.175s1.175 1.725 1.175 2.825c0 1.1-0.392 2.042-1.175 2.825s-1.725 1.175-2.825 1.175zM4 20v-2.8c0-0.567 0.146-1.087 0.438-1.563s0.679-0.837 1.163-1.087c1.033-0.517 2.083-0.904 3.15-1.163s2.15-0.387 3.25-0.387c1.1 0 2.183 0.129 3.25 0.387s2.117 0.646 3.15 1.163c0.483 0.25 0.871 0.612 1.163 1.087s0.438 0.996 0.438 1.563v2.8h-16zM6 18h12v-0.8c0-0.183-0.046-0.35-0.138-0.5s-0.213-0.267-0.363-0.35c-0.9-0.45-1.808-0.787-2.725-1.012s-1.842-0.338-2.775-0.338c-0.933 0-1.858 0.112-2.775 0.338s-1.825 0.563-2.725 1.012c-0.15 0.083-0.271 0.2-0.363 0.35s-0.138 0.317-0.138 0.5v0.8zM12 10c0.55 0 1.021-0.196 1.413-0.588s0.588-0.863 0.588-1.413c0-0.55-0.196-1.021-0.588-1.413s-0.862-0.588-1.413-0.588c-0.55 0-1.021 0.196-1.413 0.588s-0.588 0.863-0.588 1.413c0 0.55 0.196 1.021 0.588 1.413s0.863 0.588 1.413 0.588z"
+}
diff --git a/src/components/icons/arrow-forward-icon copy/ArrowForwardIcon.component.tsx b/src/components/icons/arrow-forward-icon copy/ArrowForwardIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const ArrowForwardIcon = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}: IconProps) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/arrow-forward-icon copy/path.json b/src/components/icons/arrow-forward-icon copy/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M16.175 13h-12.175v-2h12.175l-5.6-5.6 1.425-1.4 8 8-8 8-1.425-1.4 5.6-5.6z"
+}
diff --git a/src/components/icons/download-icon/DownloadIcon.component.tsx b/src/components/icons/download-icon/DownloadIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const DownloadIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/download-icon/path.json b/src/components/icons/download-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M12 16l-5-5 1.4-1.45 2.6 2.6v-8.15h2v8.15l2.6-2.6 1.4 1.45-5 5zM6 20c-0.55 0-1.021-0.196-1.413-0.588s-0.588-0.862-0.588-1.413v-3h2v3h12v-3h2v3c0 0.55-0.196 1.021-0.588 1.413s-0.863 0.588-1.413 0.588h-12z"
+}
diff --git a/src/components/icons/favorite-filled-icon/FavoriteFilledIcon.component.tsx b/src/components/icons/favorite-filled-icon/FavoriteFilledIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const FavoriteFilledIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/favorite-filled-icon/path.json b/src/components/icons/favorite-filled-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M12 21l-1.45-1.3q-2.525-2.275-4.175-3.925t-2.625-2.963-1.362-2.412-0.387-2.25q0-2.35 1.575-3.925t3.925-1.575q1.3 0 2.475 0.55t2.025 1.55q0.85-1 2.025-1.55t2.475-0.55q2.35 0 3.925 1.575t1.575 3.925q0 1.15-0.387 2.25t-1.362 2.412-2.625 2.963-4.175 3.925l-1.45 1.3z"
+}
diff --git a/src/components/icons/favorite-icon/FavoriteIcon.component.tsx b/src/components/icons/favorite-icon/FavoriteIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const FavoriteIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/favorite-icon/path.json b/src/components/icons/favorite-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M12 21l-1.45-1.3c-1.683-1.517-3.075-2.825-4.175-3.925s-1.975-2.083-2.625-2.95c-0.65-0.883-1.108-1.692-1.375-2.425-0.25-0.733-0.375-1.483-0.375-2.25 0-1.567 0.525-2.875 1.575-3.925s2.358-1.575 3.925-1.575c0.867 0 1.692 0.183 2.475 0.55s1.458 0.883 2.025 1.55c0.567-0.667 1.242-1.183 2.025-1.55s1.608-0.55 2.475-0.55c1.567 0 2.875 0.525 3.925 1.575s1.575 2.358 1.575 3.925c0 0.767-0.133 1.517-0.4 2.25-0.25 0.733-0.7 1.542-1.35 2.425-0.65 0.867-1.525 1.85-2.625 2.95s-2.492 2.408-4.175 3.925l-1.45 1.3zM12 18.3c1.6-1.433 2.917-2.658 3.95-3.675 1.033-1.033 1.85-1.925 2.45-2.675 0.6-0.767 1.017-1.442 1.25-2.025 0.233-0.6 0.35-1.192 0.35-1.775 0-1-0.333-1.833-1-2.5s-1.5-1-2.5-1c-0.783 0-1.508 0.225-2.175 0.675-0.667 0.433-1.125 0.992-1.375 1.675h-1.9c-0.25-0.683-0.708-1.242-1.375-1.675-0.667-0.45-1.392-0.675-2.175-0.675-1 0-1.833 0.333-2.5 1s-1 1.5-1 2.5c0 0.583 0.117 1.175 0.35 1.775 0.233 0.583 0.65 1.258 1.25 2.025 0.6 0.75 1.417 1.642 2.45 2.675 1.033 1.017 2.35 2.242 3.95 3.675z"
+}
diff --git a/src/components/icons/index.tsx b/src/components/icons/index.tsx
@@ -1,25 +1,43 @@
+export {StarIcon} from './star-icon/StarIcon.component';
+export {MailIcon} from './mail-icon/MailIcon.component';
+export {SendIcon} from './send-icon/SendIcon.component';
+export {ListIcon} from './list-icon/ListIcon.component';
+export {MenuIcon} from './menu-icon/MenuIcon.component';
 export {DoneIcon} from './done-icon/DoneIcon.component';
 export {EditIcon} from './edit-icon/EditIcon.component';
 export {PlusIcon} from './plus-icon/PlusIcon.component';
+export {ShareIcon} from './share-icon/ShareIcon.component';
 export {PhotoIcon} from './photo-icon/PhotoIcon.component';
 export {TodayIcon} from './today-icon/TodayIcon.component';
 export {CloseIcon} from './close-icon/CloseIcon.component';
 export {ErrorIcon} from './error-icon/ErrorIcon.component';
+export {UploadIcon} from './upload-icon/UploadIcon.component';
 export {DeleteIcon} from './delete-icon/DeleteIcon.component';
 export {SearchIcon} from './search-icon/SearchIcon.component';
+export {PersonIcon} from './ person-icon/PersonIcon.component';
 export {CommuteIcon} from './commute-icon/CommuteIcon.component';
 export {VideoCamIcon} from './videocam-icon/CloseIcon.component';
+export {SettingsIcon} from './settings-icon/SettingsIcon.component';
+export {FavoriteIcon} from './favorite-icon/FavoriteIcon.component';
+export {DownloadIcon} from './download-icon/DownloadIcon.component';
 export {LocationIcon} from './location-icon/LocationIcon.component';
 export {MoreVertIcon} from './more-vert-icon/MoreVertIcon.component';
 export {MusicNoteIcon} from './music-note-icon/MusicNoteIcon.component';
 export {ArrowBackIcon} from './arrow-back-icon/ArrowBackIcon.component';
+export {StarFilledIcon} from './star-filled-icon/StarFilledIcon.component';
+export {MailFilledIcon} from './mail-filled-icon/MailFilledIcon.component';
 export {AttachFileIcon} from './attach-file-icon/AttachFileIcon.component';
 export {CheckSmallIcon} from './check-small-icon/CheckSmallIcon.component';
+export {NavigateNextIcon} from './navigate-next-icon/NavigateNextIcon.component';
 export {FileDownloadIcon} from './file-download-icon/FileDownloadIcon.component';
 export {NotificationsIcon} from './notifications-icon/NotificationsIcon.component';
 export {CommuteFilledIcon} from './commute-filled-icon/CommuteFilledIcon.component';
+export {ArrowForwardIcon} from './arrow-forward-icon copy/ArrowForwardIcon.component';
+export {FavoriteFilledIcon} from './favorite-filled-icon/FavoriteFilledIcon.component';
+export {SettingsFilledIcon} from './settings-filled-icon/SettingsFilledIcon.component';
 export {BookmarkFilledIcon} from './bookmark-filled-icon/BookmarkFilledIcon.component';
 export {BookmarkBorderIcon} from './bookmark-border-icon/BookmarkBorderIcon.component';
 export {LocationFilledIcon} from './location-filled-icon/LocationFilledIcon.component';
+export {NavigateBeforeIcon} from './navigate-before-icon/NavigateBeforeIcon.component';
 export {NotificationsFilledIcon} from './notifications-filled-icon/NotificationsFilledIcon.component';
 export {AccountCircleFilledIcon} from './account-circle-filled-icon/AccountCircleFilledIcon.component';
diff --git a/src/components/icons/list-icon/ListIcon.component.tsx b/src/components/icons/list-icon/ListIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const ListIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/list-icon/path.json b/src/components/icons/list-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M7 9v-2h14v2h-14zM7 13v-2h14v2h-14zM7 17v-2h14v2h-14zM4 9c-0.283 0-0.521-0.096-0.712-0.288s-0.288-0.429-0.288-0.713c0-0.283 0.096-0.521 0.288-0.712s0.429-0.288 0.712-0.288c0.283 0 0.521 0.096 0.713 0.288s0.288 0.429 0.288 0.712c0 0.283-0.096 0.521-0.288 0.713s-0.429 0.288-0.713 0.288zM4 13c-0.283 0-0.521-0.096-0.712-0.288s-0.288-0.429-0.288-0.712c0-0.283 0.096-0.521 0.288-0.712s0.429-0.288 0.712-0.288c0.283 0 0.521 0.096 0.713 0.288s0.288 0.429 0.288 0.712c0 0.283-0.096 0.521-0.288 0.712s-0.429 0.288-0.713 0.288zM4 17c-0.283 0-0.521-0.096-0.712-0.288s-0.288-0.429-0.288-0.713c0-0.283 0.096-0.521 0.288-0.713s0.429-0.288 0.712-0.288c0.283 0 0.521 0.096 0.713 0.288s0.288 0.429 0.288 0.713c0 0.283-0.096 0.521-0.288 0.713s-0.429 0.288-0.713 0.288z"
+}
diff --git a/src/components/icons/mail-filled-icon/MailFilledIcon.component.tsx b/src/components/icons/mail-filled-icon/MailFilledIcon.component.tsx
@@ -0,0 +1,13 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+export const MailFilledIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/mail-filled-icon/path.json b/src/components/icons/mail-filled-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M4 20c-0.55 0-1.025-0.192-1.425-0.575-0.383-0.4-0.575-0.875-0.575-1.425v-12c0-0.55 0.192-1.017 0.575-1.4 0.4-0.4 0.875-0.6 1.425-0.6h16c0.55 0 1.017 0.2 1.4 0.6 0.4 0.383 0.6 0.85 0.6 1.4v12c0 0.55-0.2 1.025-0.6 1.425-0.383 0.383-0.85 0.575-1.4 0.575h-16zM12 13l8-5v-2l-8 5-8-5v2l8 5z"
+}
diff --git a/src/components/icons/mail-icon/MailIcon.component.tsx b/src/components/icons/mail-icon/MailIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const MailIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/mail-icon/path.json b/src/components/icons/mail-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M4 20c-0.55 0-1.021-0.196-1.413-0.588s-0.588-0.862-0.588-1.413v-12c0-0.55 0.196-1.021 0.588-1.413s0.862-0.588 1.413-0.588h16c0.55 0 1.021 0.196 1.413 0.588s0.588 0.863 0.588 1.413v12c0 0.55-0.196 1.021-0.588 1.413s-0.863 0.588-1.413 0.588h-16zM12 13l-8-5v10h16v-10l-8 5zM12 11l8-5h-16l8 5zM4 8v-0z"
+}
diff --git a/src/components/icons/menu-icon/MenuIcon.component.tsx b/src/components/icons/menu-icon/MenuIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const MenuIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/menu-icon/path.json b/src/components/icons/menu-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M3 18v-2h18v2h-18zM3 13v-2h18v2h-18zM3 8v-2h18v2h-18z"
+}
diff --git a/src/components/icons/navigate-before-icon/NavigateBeforeIcon.component.tsx b/src/components/icons/navigate-before-icon/NavigateBeforeIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const NavigateBeforeIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/navigate-before-icon/path.json b/src/components/icons/navigate-before-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M14 18l-6-6 6-6 1.4 1.4-4.6 4.6 4.6 4.6-1.4 1.4z"
+}
diff --git a/src/components/icons/navigate-next-icon/NavigateNextIcon.component.tsx b/src/components/icons/navigate-next-icon/NavigateNextIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const NavigateNextIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/navigate-next-icon/path.json b/src/components/icons/navigate-next-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M12.6 12l-4.6-4.6 1.4-1.4 6 6-6 6-1.4-1.4 4.6-4.6z"
+}
diff --git a/src/components/icons/send-icon/SendIcon.component.tsx b/src/components/icons/send-icon/SendIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const SendIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/send-icon/path.json b/src/components/icons/send-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M3 20v-16l19 8-19 8zM5 17l11.85-5-11.85-5v3.5l6 1.5-6 1.5v3.5zM5 17v0z"
+}
diff --git a/src/components/icons/settings-filled-icon/SettingsFilledIcon.component.tsx b/src/components/icons/settings-filled-icon/SettingsFilledIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const SettingsFilledIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/settings-filled-icon/path.json b/src/components/icons/settings-filled-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M9.25 22l-0.4-3.2c-0.217-0.083-0.421-0.183-0.612-0.3s-0.379-0.242-0.562-0.375l-2.975 1.25-2.75-4.75 2.575-1.95c-0.017-0.117-0.025-0.229-0.025-0.338v-0.675c0-0.108 0.008-0.221 0.025-0.338l-2.575-1.95 2.75-4.75 2.975 1.25c0.183-0.133 0.375-0.258 0.575-0.375s0.4-0.217 0.6-0.3l0.4-3.2h5.5l0.4 3.2c0.217 0.083 0.421 0.183 0.612 0.3s0.379 0.242 0.562 0.375l2.975-1.25 2.75 4.75-2.575 1.95c0.017 0.117 0.025 0.229 0.025 0.338v0.675c0 0.108-0.017 0.221-0.050 0.338l2.575 1.95-2.75 4.75-2.95-1.25c-0.183 0.133-0.375 0.258-0.575 0.375s-0.4 0.217-0.6 0.3l-0.4 3.2h-5.5zM12.050 15.5c0.967 0 1.792-0.342 2.475-1.025s1.025-1.508 1.025-2.475c0-0.967-0.342-1.792-1.025-2.475s-1.508-1.025-2.475-1.025c-0.983 0-1.812 0.342-2.487 1.025s-1.013 1.508-1.013 2.475 0.338 1.792 1.013 2.475c0.675 0.683 1.504 1.025 2.487 1.025z"
+}
diff --git a/src/components/icons/settings-icon/SettingsIcon.component.tsx b/src/components/icons/settings-icon/SettingsIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const SettingsIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/settings-icon/path.json b/src/components/icons/settings-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M9.25 22l-0.4-3.2c-0.217-0.083-0.421-0.183-0.612-0.3s-0.379-0.242-0.562-0.375l-2.975 1.25-2.75-4.75 2.575-1.95c-0.017-0.117-0.025-0.229-0.025-0.338v-0.675c0-0.108 0.008-0.221 0.025-0.338l-2.575-1.95 2.75-4.75 2.975 1.25c0.183-0.133 0.375-0.258 0.575-0.375s0.4-0.217 0.6-0.3l0.4-3.2h5.5l0.4 3.2c0.217 0.083 0.421 0.183 0.612 0.3s0.379 0.242 0.562 0.375l2.975-1.25 2.75 4.75-2.575 1.95c0.017 0.117 0.025 0.229 0.025 0.338v0.675c0 0.108-0.017 0.221-0.050 0.338l2.575 1.95-2.75 4.75-2.95-1.25c-0.183 0.133-0.375 0.258-0.575 0.375s-0.4 0.217-0.6 0.3l-0.4 3.2h-5.5zM11 20h1.975l0.35-2.65c0.517-0.133 0.996-0.329 1.437-0.588s0.846-0.571 1.212-0.938l2.475 1.025 0.975-1.7-2.15-1.625c0.083-0.233 0.142-0.479 0.175-0.738s0.050-0.521 0.050-0.787c0-0.267-0.017-0.529-0.050-0.788s-0.092-0.504-0.175-0.738l2.15-1.625-0.975-1.7-2.475 1.050c-0.367-0.383-0.771-0.704-1.212-0.963s-0.921-0.454-1.437-0.588l-0.325-2.65h-1.975l-0.35 2.65c-0.517 0.133-0.996 0.329-1.437 0.588s-0.846 0.571-1.212 0.938l-2.475-1.025-0.975 1.7 2.15 1.6c-0.083 0.25-0.142 0.5-0.175 0.75s-0.050 0.517-0.050 0.8c0 0.267 0.017 0.525 0.050 0.775s0.092 0.5 0.175 0.75l-2.15 1.625 0.975 1.7 2.475-1.050c0.367 0.383 0.771 0.704 1.212 0.963s0.921 0.454 1.437 0.588l0.325 2.65zM12.050 15.5c0.967 0 1.792-0.342 2.475-1.025s1.025-1.508 1.025-2.475c0-0.967-0.342-1.792-1.025-2.475s-1.508-1.025-2.475-1.025c-0.983 0-1.812 0.342-2.487 1.025s-1.013 1.508-1.013 2.475 0.338 1.792 1.013 2.475c0.675 0.683 1.504 1.025 2.487 1.025z"
+}
diff --git a/src/components/icons/share-icon/ShareIcon.component.tsx b/src/components/icons/share-icon/ShareIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const ShareIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/share-icon/path.json b/src/components/icons/share-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M18 22c-0.833 0-1.542-0.292-2.125-0.875s-0.875-1.292-0.875-2.125c0-0.117 0.008-0.237 0.025-0.363s0.042-0.237 0.075-0.338l-7.050-4.1c-0.283 0.25-0.6 0.446-0.95 0.588s-0.717 0.213-1.1 0.213c-0.833 0-1.542-0.292-2.125-0.875s-0.875-1.292-0.875-2.125c0-0.833 0.292-1.542 0.875-2.125s1.292-0.875 2.125-0.875c0.383 0 0.75 0.071 1.1 0.213s0.667 0.338 0.95 0.588l7.050-4.1c-0.033-0.1-0.058-0.213-0.075-0.338s-0.025-0.246-0.025-0.363c0-0.833 0.292-1.542 0.875-2.125s1.292-0.875 2.125-0.875c0.833 0 1.542 0.292 2.125 0.875s0.875 1.292 0.875 2.125c0 0.833-0.292 1.542-0.875 2.125s-1.292 0.875-2.125 0.875c-0.383 0-0.75-0.071-1.1-0.213s-0.667-0.337-0.95-0.588l-7.050 4.1c0.033 0.1 0.058 0.213 0.075 0.337s0.025 0.246 0.025 0.363c0 0.117-0.008 0.237-0.025 0.363s-0.042 0.237-0.075 0.337l7.050 4.1c0.283-0.25 0.6-0.446 0.95-0.588s0.717-0.213 1.1-0.213c0.833 0 1.542 0.292 2.125 0.875s0.875 1.292 0.875 2.125c0 0.833-0.292 1.542-0.875 2.125s-1.292 0.875-2.125 0.875zM18 6c0.283 0 0.521-0.096 0.712-0.288s0.288-0.429 0.288-0.713c0-0.283-0.096-0.521-0.288-0.713s-0.429-0.288-0.712-0.288c-0.283 0-0.521 0.096-0.712 0.288s-0.288 0.429-0.288 0.713c0 0.283 0.096 0.521 0.288 0.713s0.429 0.288 0.712 0.288zM6 13c0.283 0 0.521-0.096 0.712-0.288s0.288-0.429 0.288-0.712c0-0.283-0.096-0.521-0.288-0.712s-0.429-0.288-0.713-0.288c-0.283 0-0.521 0.096-0.712 0.288s-0.288 0.429-0.288 0.712c0 0.283 0.096 0.521 0.288 0.712s0.429 0.288 0.712 0.288zM18 20c0.283 0 0.521-0.096 0.712-0.288s0.288-0.429 0.288-0.713c0-0.283-0.096-0.521-0.288-0.712s-0.429-0.288-0.712-0.288c-0.283 0-0.521 0.096-0.712 0.288s-0.288 0.429-0.288 0.712c0 0.283 0.096 0.521 0.288 0.713s0.429 0.288 0.712 0.288z"
+}
diff --git a/src/components/icons/star-filled-icon/StarFilledIcon.component.tsx b/src/components/icons/star-filled-icon/StarFilledIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const StarFilledIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/star-filled-icon/path.json b/src/components/icons/star-filled-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M5.825 22l1.625-7.025-5.45-4.725 7.2-0.625 2.8-6.625 2.8 6.625 7.2 0.625-5.45 4.725 1.625 7.025-6.175-3.725-6.175 3.725z"
+}
diff --git a/src/components/icons/star-icon/StarIcon.component.tsx b/src/components/icons/star-icon/StarIcon.component.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import Svg, {Path} from 'react-native-svg';
+
+import {path} from './path.json';
+import type {IconProps} from '../icon-props';
+
+const DEFAULT_SIZE = 24;
+const DEFAULT_COLOR = '#000';
+
+export const StarIcon: React.FC<IconProps> = ({color = DEFAULT_COLOR, size = DEFAULT_SIZE, ...props}) => (
+  <Svg viewBox="0 0 24 24" width={size} height={size} fill={'none'} {...props}>
+    <Path fill={color} d={path} />
+  </Svg>
+);
diff --git a/src/components/icons/star-icon/path.json b/src/components/icons/star-icon/path.json
@@ -0,0 +1,3 @@
+{
+  "path": "M8.85 17.825l3.15-1.9 3.15 1.925-0.825-3.6 2.775-2.4-3.65-0.325-1.45-3.4-1.45 3.375-3.65 0.325 2.775 2.425-0.825 3.575zM5.825 22l1.625-7.025-5.45-4.725 7.2-0.625 2.8-6.625 2.8 6.625 7.2 0.625-5.45 4.725 1.625 7.025-6.175-3.725-6.175 3.725z"
+}
diff --git a/src/components/icons/upload-icon/UploadIcon.component.tsx b/src/components/icons/upload-icon/UploadIcon.component.tsx
diff --git a/src/components/icons/upload-icon/path.json b/src/components/icons/upload-icon/path.json

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	+ "path": "M12 12c-1.1 0-2.042-0.392-2.825-1.175s-1.175-1.725-1.175-2.825c0-1.1 0.392-2.042 1.175-2.825s1.725-1.175 2.825-1.175c1.1 0 2.042 0.392 2.825 1.175s1.175 1.725 1.175 2.825c0 1.1-0.392 2.042-1.175 2.825s-1.725 1.175-2.825 1.175zM4 20v-2.8c0-0.567 0.146-1.087 0.438-1.563s0.679-0.837 1.163-1.087c1.033-0.517 2.083-0.904 3.15-1.163s2.15-0.387 3.25-0.387c1.1 0 2.183 0.129 3.25 0.387s2.117 0.646 3.15 1.163c0.483 0.25 0.871 0.612 1.163 1.087s0.438 0.996 0.438 1.563v2.8h-16zM6 18h12v-0.8c0-0.183-0.046-0.35-0.138-0.5s-0.213-0.267-0.363-0.35c-0.9-0.45-1.808-0.787-2.725-1.012s-1.842-0.338-2.775-0.338c-0.933 0-1.858 0.112-2.775 0.338s-1.825 0.563-2.725 1.012c-0.15 0.083-0.271 0.2-0.363 0.35s-0.138 0.317-0.138 0.5v0.8zM12 10c0.55 0 1.021-0.196 1.413-0.588s0.588-0.863 0.588-1.413c0-0.55-0.196-1.021-0.588-1.413s-0.862-0.588-1.413-0.588c-0.55 0-1.021 0.196-1.413 0.588s-0.588 0.863-0.588 1.413c0 0.55 0.196 1.021 0.588 1.413s0.863 0.588 1.413 0.588z"
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "path": "M16.175 13h-12.175v-2h12.175l-5.6-5.6 1.425-1.4 8 8-8 8-1.425-1.4 5.6-5.6z"`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "path": "M12 16l-5-5 1.4-1.45 2.6 2.6v-8.15h2v8.15l2.6-2.6 1.4 1.45-5 5zM6 20c-0.55 0-1.021-0.196-1.413-0.588s-0.588-0.862-0.588-1.413v-3h2v3h12v-3h2v3c0 0.55-0.196 1.021-0.588 1.413s-0.863 0.588-1.413 0.588h-12z"`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "path": "M12 21l-1.45-1.3q-2.525-2.275-4.175-3.925t-2.625-2.963-1.362-2.412-0.387-2.25q0-2.35 1.575-3.925t3.925-1.575q1.3 0 2.475 0.55t2.025 1.55q0.85-1 2.025-1.55t2.475-0.55q2.35 0 3.925 1.575t1.575 3.925q0 1.15-0.387 2.25t-1.362 2.412-2.625 2.963-4.175 3.925l-1.45 1.3z"`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	+ "path": "M12 21l-1.45-1.3c-1.683-1.517-3.075-2.825-4.175-3.925s-1.975-2.083-2.625-2.95c-0.65-0.883-1.108-1.692-1.375-2.425-0.25-0.733-0.375-1.483-0.375-2.25 0-1.567 0.525-2.875 1.575-3.925s2.358-1.575 3.925-1.575c0.867 0 1.692 0.183 2.475 0.55s1.458 0.883 2.025 1.55c0.567-0.667 1.242-1.183 2.025-1.55s1.608-0.55 2.475-0.55c1.567 0 2.875 0.525 3.925 1.575s1.575 2.358 1.575 3.925c0 0.767-0.133 1.517-0.4 2.25-0.25 0.733-0.7 1.542-1.35 2.425-0.65 0.867-1.525 1.85-2.625 2.95s-2.492 2.408-4.175 3.925l-1.45 1.3zM12 18.3c1.6-1.433 2.917-2.658 3.95-3.675 1.033-1.033 1.85-1.925 2.45-2.675 0.6-0.767 1.017-1.442 1.25-2.025 0.233-0.6 0.35-1.192 0.35-1.775 0-1-0.333-1.833-1-2.5s-1.5-1-2.5-1c-0.783 0-1.508 0.225-2.175 0.675-0.667 0.433-1.125 0.992-1.375 1.675h-1.9c-0.25-0.683-0.708-1.242-1.375-1.675-0.667-0.45-1.392-0.675-2.175-0.675-1 0-1.833 0.333-2.5 1s-1 1.5-1 2.5c0 0.583 0.117 1.175 0.35 1.775 0.233 0.583 0.65 1.258 1.25 2.025 0.6 0.75 1.417 1.642 2.45 2.675 1.033 1.017 2.35 2.242 3.95 3.675z"
	`3`	`+}`