@nuskin/foundation-ui-components 1.33.0-1253-feature.3 → 2.0.0

package/src/common/icon/icons/AlertErrorIcon.tsx

@@ -1,48 +0,0 @@
-import { ReactElement } from 'react';
-
-/* eslint-disable max-len */
-import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
-
-/**
- *
- * @param props { fill: color to be filled for icon, color: color of the tick icon}
- * @returns ErrorIcon, can be used in Input field, when input field is in error state
- */
-const AlertErrorIcon = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon
-            width="20"
-            height="20"
-            viewBox="0 0 20 20"
-            data-testid="alertError"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            {...props}
-        >
-            <g id="icon/alert/WarningFill-red" transform="translate(1.000000, 1.000000)">
-                <g id="Error2" transform="translate(0.000000, 1.200000)">
-                    <path
-                        d="M17.9465423,14.8670135 L9.44311247,0.246687943 C9.35049358,0.100809118 9.18936767,0.012383152 9.01617259,0.012383152 C8.84297751,0.012383152 8.68185161,
-                        0.100809118 8.58923271,0.246687943 L0.0706452929,14.8670135 C-0.0142965839,15.0216954 -0.0118890438,15.2093943 0.0769925071,15.3618609 C0.165874058,
-                        15.5143276 0.328282319,15.6093523 0.505163987,15.6123832 L17.5120236,15.6123832 C17.6889052,15.6093523 17.8513135,15.5143276 17.940195,15.3618609 C18.0290766,
-                        15.2093943 18.0314841,15.0216954 17.9465423,14.8670135 Z"
-                        id="Shape"
-                        fill={props.color}
-                        fillRule="nonzero"
-                    ></path>
-                    <path
-                        d="M8.19,12.84 C8.16437588,12.6281014 8.2368299,12.4160897 8.38677958,12.2641927 C8.53672927,12.1122956 8.74778837,12.0371121 8.96,12.06 C9.16715704,
-                    12.0467652 9.37034806,12.1211477 9.52,12.265 C9.65709398,12.4241339 9.72701115,12.6303 9.715,12.84 C9.72048715,13.0522748 9.64341383,13.2584012 9.5,
-                    13.415 C9.35312473,13.5641498 9.1489517,13.6425377 8.94,13.63 C8.72997224,13.6424095 8.52401376,13.5683367 8.37,13.425 C8.23531653,13.2613056 8.17063593,
-                    13.0510936 8.19,12.84 Z M9.415,11.195 L8.5,11.195 L8.25,5.96 L9.675,5.96 L9.415,11.195 Z"
-                        id="Shape"
-                        fill={'#FFFFFF'}
-                        fillRule="nonzero"
-                    ></path>
-                </g>
-            </g>
-        </SvgIcon>
-    );
-};
-
-export default AlertErrorIcon;

package/src/common/icon/icons/ArrowDown.tsx

@@ -1,23 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const ArrowDown = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" data-testid="arrowDown" {...props}>
-            <path
-                fillRule="evenodd"
-                clipRule="evenodd"
-                d="M12.7071 16.2071C12.3166 16.5976 11.6834 16.5976 11.2929 16.2071L4.29289 9.20711C3.90237 8.81658 3.90237 8.18342 4.29289 7.79289C4.68342 7.40237 5.31658 7.40237 5.70711 7.79289L12 14.0858L18.2929 7.79289C18.6834 7.40237 19.3166 7.40237 19.7071 7.79289C20.0976 8.18342 20.0976 8.81658 19.7071 9.20711L12.7071 16.2071Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default ArrowDown;

package/src/common/icon/icons/ArrowLeft.tsx

@@ -1,38 +0,0 @@
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const ArrowLeft = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon
-            data-testid="arrowLeft"
-            viewBox="0 0 24 24"
-            preserveAspectRatio="xMidYMid meet"
-            focusable="false"
-            style={{ pointerEvents: 'none', display: 'block' }}
-            {...props}
-        >
-            <g
-                id="icon-narrow-angle-left-24"
-                stroke={props.color}
-                strokeWidth="1"
-                fill="none"
-                fillRule="evenodd"
-                strokeLinecap="round"
-                strokeLinejoin="round"
-            >
-                <g transform="translate(-196, -226)" stroke={props.color}>
-                    <polyline
-                        // eslint-disable-next-line max-len
-                        transform="translate(209.000000, 237.500000) scale(-1.2, 1.2) rotate(90.000000) translate(-209.000000, -237.500000)"
-                        points="200 242 209 233 218 242"
-                    ></polyline>
-                </g>
-            </g>
-        </SvgIcon>
-    );
-};
-export default ArrowLeft;

package/src/common/icon/icons/ArrowRight.tsx

@@ -1,39 +0,0 @@
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-export const ArrowRight = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon
-            {...props}
-            data-testid="arrowRight"
-            viewBox="0 0 24 24"
-            preserveAspectRatio="xMidYMid meet"
-            focusable="false"
-            style={{ pointerEvents: 'none', display: 'block' }}
-        >
-            <g
-                id="icon-narrow-angle-right-24"
-                stroke="none"
-                strokeWidth="1"
-                fill="none"
-                fillRule="evenodd"
-                strokeLinecap="round"
-                strokeLinejoin="round"
-            >
-                <g transform="translate(-196, -226)" stroke={props.color}>
-                    <polyline
-                        // eslint-disable-next-line max-len
-                        transform="translate(209.000000, 237.500000) scale(-1.2, 1.2) rotate(-90.000000) translate(-209.000000, -237.500000)"
-                        points="200 242 209 233 218 242"
-                    ></polyline>
-                </g>
-            </g>
-        </SvgIcon>
-    );
-};
-
-export default ArrowRight;

package/src/common/icon/icons/ArrowUp.tsx

@@ -1,20 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-const ArrowUp = (props: SvgIconProps): ReactElement => {
-    return (
-        <SvgIcon viewBox="0 0 24 24" data-testid="arrowUp" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-            <path
-                fillRule="evenodd"
-                clipRule="evenodd"
-                d="M11.2929 7.79289C11.6834 7.40237 12.3166 7.40237 12.7071 7.79289L19.7071 14.7929C20.0976 15.1834 20.0976 15.8166 19.7071 16.2071C19.3166 16.5976 18.6834 16.5976 18.2929 16.2071L12 9.91421L5.70711 16.2071C5.31658 16.5976 4.68342 16.5976 4.29289 16.2071C3.90237 15.8166 3.90237 15.1834 4.29289 14.7929L11.2929 7.79289Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default ArrowUp;

package/src/common/icon/icons/Cart.tsx

@@ -1,23 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const Cart = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" data-testid="cart" {...props}>
-            <path
-                fillRule="evenodd"
-                clipRule="evenodd"
-                d="M0 3.79999C0 3.2477 0.447715 2.79999 1 2.79999H3.19159C4.13466 2.79999 4.94959 3.45879 5.14719 4.38093L5.237 4.80005H21C21.3079 4.80005 21.5987 4.94192 21.7882 5.18464C21.9777 5.42735 22.0448 5.74384 21.9701 6.04258L20.5382 11.7702C20.0931 13.5509 18.4931 14.8 16.6577 14.8H7.3798L7.59407 15.8H19C19.5523 15.8 20 16.2478 20 16.8C20 17.3523 19.5523 17.8 19 17.8H18H7.5H6.78564C6.3141 17.8 5.90664 17.4706 5.80784 17.0096L3.45079 6.00958L3.19159 4.79999H1C0.447715 4.79999 0 4.35227 0 3.79999ZM7.5 17.8C6.39543 17.8 5.5 18.6955 5.5 19.8C5.5 20.9046 6.39543 21.8 7.5 21.8C8.60457 21.8 9.5 20.9046 9.5 19.8C9.5 18.6955 8.60457 17.8 7.5 17.8ZM18 17.8C16.8954 17.8 16 18.6955 16 19.8C16 20.9046 16.8954 21.8 18 21.8C19.1046 21.8 20 20.9046 20 19.8C20 18.6955 19.1046 17.8 18 17.8ZM6.95124 12.8H16.6577C17.5754 12.8 18.3754 12.1755 18.598 11.2851L19.7192 6.80005H5.66557L6.95124 12.8Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default Cart;

package/src/common/icon/icons/CartBadge.tsx

@@ -1,47 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const CartBadge = (props: SvgIconProps) :ReactElement=> {
-    return (
-        <SvgIcon
-            viewBox="0 0 30 30"
-            preserveAspectRatio="xMidYMid meet"
-            focusable="false"
-            data-testid="cartBadge"
-            {...props}
-        >
-            <g
-                id="cart-icon-badge"
-                fill="none"
-                strokeWidth="1"
-                stroke="none"
-                fillRule="evenodd"
-                width="30px"
-                height="30px"
-            >
-                <g id="Group" transform="translate(0.000000, 0.500000)" stroke={props.color}>
-                    <circle id="Oval" cx="11" cy="21.5" r="1.5"></circle>
-                    <circle id="Oval" cx="23" cy="21.5" r="1.5"></circle>
-                    <polyline
-                        id="Shape"
-                        strokeLinecap="round"
-                        points="0 -5.24580379e-15 3.5 -5.41233725e-15 9.5 18 23.5 18"
-                    ></polyline>
-                    <path
-                        d="M8.5,14 L21.6400424,14 C22.9848342,14 24.1653247,13.1050925 24.5285445,11.8102811 L27,3"
-                        id="Shape"
-                        strokeLinecap="round"
-                    ></path>
-                </g>
-            </g>
-        </SvgIcon>
-    );
-};
-
-export default CartBadge;

package/src/common/icon/icons/Check.tsx

@@ -1,30 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const Check = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon
-            viewBox="0 0 21 20"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            preserveAspectRatio="xMidYMid meet"
-            data-testid="check"
-            {...props}
-        >
-            <path
-                fillRule="evenodd"
-                clipRule="evenodd"
-                d="M20.0625 3.57806C20.3879 3.9035 20.3879 4.43114 20.0625 4.75657L8.39582 16.4232C8.23944 16.5796 8.02731 16.6674 7.80616 16.6673C7.585 16.6672 7.37296 16.5792 7.21673 16.4227L1.22007 10.4143C0.894947 10.0886 0.89546 9.56094 1.22121 9.23582C1.54697 8.9107 2.0746 8.91122 2.39972 9.23697L7.80714 14.6549L18.884 3.57806C19.2094 3.25263 19.737 3.25263 20.0625 3.57806Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default Check;

package/src/common/icon/icons/CheckShield.tsx

@@ -1,24 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-const CheckShield = (props: SvgIconProps): ReactElement => {
-    return (
-        <SvgIcon
-            viewBox="0 0 24 24"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            {...props}
-            data-testid="checkShield"
-        >
-            <path
-                d="M20.3941 1H2.7631C2.29568 1.00061 1.84758 1.18656 1.51707 1.51707C1.18656 1.84759 1.00061 2.29568 1 2.7631V9.22751C1 19.0855 9.35492 22.3543 11.0311 22.9096C11.3861 23.0301 11.7711 23.0301 12.1261 22.9096C13.8014 22.3543 22.1572 19.0864 22.1572 9.22751V2.7631C22.1566 2.29568 21.9706 1.84758 21.6401 1.51707C21.3096 1.18656 20.8615 1.00061 20.3941 1ZM17.0358 8.69031L10.5705 14.8612C10.4064 15.0176 10.1885 15.1048 9.96185 15.1048C9.7352 15.1048 9.51725 15.0176 9.3532 14.8612L6.12142 11.7757C6.03753 11.6958 5.97021 11.6002 5.9233 11.4943C5.87639 11.3883 5.85082 11.2742 5.84805 11.1584C5.84528 11.0425 5.86536 10.9273 5.90715 10.8193C5.94893 10.7112 6.01161 10.6124 6.09158 10.5286C6.17156 10.4448 6.26726 10.3776 6.37324 10.3308C6.47921 10.2839 6.59338 10.2585 6.7092 10.2558C6.82502 10.2531 6.94023 10.2733 7.04825 10.3152C7.15627 10.3571 7.25497 10.4199 7.33872 10.4999L9.96185 13.0042L15.8185 7.41448C15.9022 7.33443 16.0009 7.27167 16.1089 7.22978C16.217 7.1879 16.3322 7.16772 16.448 7.17038C16.5638 7.17305 16.678 7.19852 16.7839 7.24533C16.8899 7.29214 16.9856 7.35938 17.0656 7.4432C17.1456 7.52702 17.2083 7.62578 17.25 7.73384C17.2918 7.84189 17.3119 7.95712 17.3091 8.07294C17.3064 8.18876 17.2808 8.3029 17.2339 8.40883C17.187 8.51477 17.1197 8.61042 17.0358 8.69031H17.0358Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default CheckShield;

package/src/common/icon/icons/CheckVerified.tsx

@@ -1,27 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const CheckVerified = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon
-            viewBox="0 0 24 24"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            {...props}
-            data-testid="checkVerified"
-        >
-            <path
-                d="M22.4852 9.30165C22.0811 8.8802 21.6632 8.44451 21.5053 8.06271C21.3601 7.71198 21.3514 7.13107 21.3429 6.5692C21.3271 5.52361 21.3092 4.33855 20.4853 3.51468C19.6614 2.69081 18.4764 2.67292 17.4308 2.65712C16.8689 2.64865 16.288 2.63986 15.9373 2.49473C15.5556 2.33684 15.1198 1.91895 14.6983 1.51475C13.9581 0.804722 13.1188 0 12 0C10.8812 0 10.042 0.804722 9.30165 1.51475C8.8802 1.91895 8.44451 2.33684 8.06271 2.49473C7.71198 2.63986 7.13107 2.64865 6.5692 2.65712C5.52361 2.67292 4.33855 2.69081 3.51468 3.51468C2.69081 4.33855 2.67292 5.52361 2.65712 6.5692C2.64865 7.13107 2.63986 7.71198 2.49473 8.06271C2.33684 8.44441 1.91895 8.8802 1.51475 9.30165C0.804722 10.0419 0 10.8812 0 12C0 13.1188 0.804722 13.958 1.51475 14.6983C1.91895 15.1198 2.33684 15.5555 2.49473 15.9373C2.63986 16.288 2.64865 16.8689 2.65712 17.4308C2.67292 18.4764 2.69081 19.6614 3.51468 20.4853C4.33855 21.3092 5.52361 21.3271 6.5692 21.3429C7.13107 21.3514 7.71198 21.3601 8.06271 21.5053C8.44441 21.6632 8.8802 22.0811 9.30165 22.4852C10.0419 23.1953 10.8812 24 12 24C13.1188 24 13.958 23.1953 14.6983 22.4852C15.1198 22.0811 15.5555 21.6632 15.9373 21.5053C16.288 21.3601 16.8689 21.3514 17.4308 21.3429C18.4764 21.3271 19.6614 21.3092 20.4853 20.4853C21.3092 19.6614 21.3271 18.4764 21.3429 17.4308C21.3514 16.8689 21.3601 16.288 21.5053 15.9373C21.6632 15.5556 22.0811 15.1198 22.4852 14.6983C23.1953 13.9581 24 13.1188 24 12C24 10.8812 23.1953 10.042 22.4852 9.30165ZM17.3061 10.0486L11.0203 16.0486C10.8609 16.2008 10.6489 16.2857 10.4285 16.2857C10.2081 16.2857 9.99618 16.2008 9.83674 16.0486L6.69392 13.0486C6.61244 12.9709 6.54708 12.8779 6.50155 12.7749C6.45603 12.672 6.43123 12.561 6.42859 12.4485C6.42595 12.3359 6.4455 12.224 6.48614 12.119C6.52678 12.014 6.58771 11.918 6.66544 11.8366C6.74318 11.7551 6.83619 11.6898 6.93918 11.6443C7.04217 11.5988 7.15311 11.5741 7.26567 11.5715C7.37823 11.5688 7.49019 11.5884 7.59517 11.6291C7.70016 11.6698 7.79609 11.7308 7.87751 11.8085L10.4285 14.2436L16.1225 8.80852C16.2039 8.73076 16.2998 8.6698 16.4048 8.62912C16.5098 8.58844 16.6218 8.56885 16.7343 8.57145C16.8469 8.57405 16.9578 8.59881 17.0608 8.64429C17.1638 8.68978 17.2568 8.75511 17.3346 8.83656C17.4123 8.918 17.4732 9.01397 17.5139 9.11896C17.5545 9.22396 17.5741 9.33593 17.5714 9.44849C17.5688 9.56104 17.544 9.67198 17.4984 9.77495C17.4529 9.87792 17.3876 9.97091 17.3061 10.0486Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default CheckVerified;

package/src/common/icon/icons/ChevronRight.tsx

@@ -1,31 +0,0 @@
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-export const ChevronRight = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon
-            {...props}
-            data-testid="chevronRight"
-            viewBox="0 0 18 18"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-        >
-            <g id="arrow-right">
-                <path
-                    id="icon"
-                    fillRule="evenodd"
-                    clipRule="evenodd"
-                    // eslint-disable-next-line max-len
-                    d="M12.1553 8.46967C12.4482 8.76256 12.4482 9.23744 12.1553 9.53033L6.90533 14.7803C6.61244 15.0732 6.13756 15.0732 5.84467 14.7803C5.55178 14.4874 5.55178 14.0126 5.84467 13.7197L10.5643 9L5.84467 4.28033C5.55178 3.98744 5.55178 3.51256 5.84467 3.21967C6.13756 2.92678 6.61244 2.92678 6.90533 3.21967L12.1553 8.46967Z"
-                    fill={props.color}
-                />
-            </g>
-        </SvgIcon>
-    );
-};
-
-export default ChevronRight;

package/src/common/icon/icons/CloseIcon.tsx

@@ -1,27 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const CloseIcon = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon
-            viewBox="0 0 12 12"
-            preserveAspectRatio="xMidYMid meet"
-            xmlns="http://www.w3.org/2000/svg"
-            xmlnsXlink="http://www.w3.org/1999/xlink"
-            {...props}
-            data-testid="close"
-        >
-            <g fill="none" stroke={props.color} strokeWidth="1">
-                <path strokeLinecap="round" d="M 0 0 L 12 12 M 0 12 L 12 0" />
-            </g>
-        </SvgIcon>
-    );
-};
-
-export default CloseIcon;

package/src/common/icon/icons/ErrorIcon.tsx

@@ -1,30 +0,0 @@
-import { ReactElement } from 'react';
-
-/* eslint-disable max-len */
-import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
-
-/**
- * pass colorOverride = '#C81D1D'
- * @param props { color: color to be filled for icon}
- * @returns ErrorIcon, can be used in Input field, when input field is in error state
- */
-const ErrorIcon = (props: SvgIconProps):ReactElement => {
-    return (
-        <SvgIcon
-            width="20"
-            height="20"
-            viewBox="0 0 20 20"
-            data-testid="error"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            {...props}
-        >
-            <path
-                d="M17.07 2.92999C15.4338 1.29429 13.2811 0.276523 10.9786 0.0501185C8.67611 -0.176286 6.36637 0.402675 4.44291 1.68835C2.51945 2.97403 1.1013 4.88687 0.430089 7.10094C-0.241121 9.31502 -0.123857 11.6933 0.761901 13.8306C1.64766 15.9679 3.24711 17.732 5.28771 18.8222C7.32831 19.9125 9.68381 20.2614 11.9528 19.8096C14.2219 19.3578 16.2641 18.1332 17.7314 16.3445C19.1988 14.5557 20.0005 12.3136 20 9.99999C19.9994 7.34804 18.9455 4.80491 17.07 2.92999ZM9 5.37999C9 5.11477 9.10536 4.86041 9.29289 4.67288C9.48043 4.48534 9.73478 4.37999 10 4.37999C10.2652 4.37999 10.5196 4.48534 10.7071 4.67288C10.8946 4.86041 11 5.11477 11 5.37999V10.6C11 10.8652 10.8946 11.1196 10.7071 11.3071C10.5196 11.4946 10.2652 11.6 10 11.6C9.73478 11.6 9.48043 11.4946 9.29289 11.3071C9.10536 11.1196 9 10.8652 9 10.6V5.37999ZM10 15.51C9.74684 15.51 9.49936 15.4349 9.28887 15.2943C9.07837 15.1536 8.91431 14.9537 8.81743 14.7198C8.72055 14.4859 8.6952 14.2286 8.74459 13.9803C8.79398 13.732 8.91589 13.5039 9.0949 13.3249C9.27391 13.1459 9.50199 13.024 9.75028 12.9746C9.99858 12.9252 10.2559 12.9505 10.4898 13.0474C10.7237 13.1443 10.9236 13.3084 11.0643 13.5189C11.2049 13.7294 11.28 13.9768 11.28 14.23C11.28 14.5695 11.1451 14.895 10.9051 15.1351C10.665 15.3751 10.3395 15.51 10 15.51Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default ErrorIcon;

package/src/common/icon/icons/HamburgerIcon.tsx

@@ -1,35 +0,0 @@
-import { ReactElement } from 'react';
-
-/* eslint-disable max-len */
-import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
-
-/**
- *
- * @param props {stroke}
- */
-const HamburgerIcon = (props: SvgIconProps): ReactElement => {
-    return (
-        <SvgIcon viewBox="0 0 24 18" {...props} data-testid="hamburgerIcon" xmlns="http://www.w3.org/2000/svg">
-            <path
-                stroke={props.color}
-                fillRule="evenodd"
-                clipRule="evenodd"
-                d="M0 1C0 0.447715 0.447715 0 1 0H19C19.5523 0 20 0.447715 20 1C20 1.55228 19.5523 2 19 2H1C0.447715 2 0 1.55228 0 1Z"
-            />
-            <path
-                stroke={props.color}
-                fillRule="evenodd"
-                clipRule="evenodd"
-                d="M0 9C0 8.44772 0.447715 8 1 8H19C19.5523 8 20 8.44772 20 9C20 9.55228 19.5523 10 19 10H1C0.447715 10 0 9.55228 0 9Z"
-            />
-            <path
-                stroke={props.color}
-                fillRule="evenodd"
-                clipRule="evenodd"
-                d="M0 17C0 16.4477 0.447715 16 1 16H19C19.5523 16 20 16.4477 20 17C20 17.5523 19.5523 18 19 18H1C0.447715 18 0 17.5523 0 17Z"
-            />
-        </SvgIcon>
-    );
-};
-
-export default HamburgerIcon;

package/src/common/icon/icons/InfoFilled.tsx

@@ -1,21 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const InfoFilled = (props: SvgIconProps): ReactElement => {
-    return (
-        <SvgIcon viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props} data-testid="infoFilled">
-            <path
-                d="M12 0C9.62663 0 7.30655 0.703788 5.33316 2.02236C3.35977 3.34094 1.8217 5.21508 0.913451 7.4078C0.00519941 9.60051 -0.232441 12.0133 0.230582 14.3411C0.693605 16.6689 1.83649 18.807 3.51472 20.4853C5.19295 22.1635 7.33115 23.3064 9.65892 23.7694C11.9867 24.2324 14.3995 23.9948 16.5922 23.0865C18.7849 22.1783 20.6591 20.6402 21.9776 18.6668C23.2962 16.6934 24 14.3734 24 12C23.9963 8.81853 22.7309 5.76842 20.4812 3.51878C18.2316 1.26914 15.1815 0.00367709 12 0ZM11.9999 5.53846C12.2737 5.53846 12.5414 5.61967 12.7691 5.77181C12.9968 5.92395 13.1743 6.1402 13.2791 6.39321C13.3839 6.64621 13.4113 6.92461 13.3579 7.1932C13.3045 7.46179 13.1726 7.7085 12.979 7.90215C12.7853 8.09579 12.5386 8.22766 12.27 8.28109C12.0014 8.33451 11.723 8.30709 11.47 8.20229C11.217 8.0975 11.0008 7.92002 10.8486 7.69233C10.6965 7.46463 10.6153 7.19693 10.6153 6.92308C10.6153 6.74125 10.6511 6.56119 10.7207 6.39321C10.7903 6.22522 10.8922 6.07258 11.0208 5.944C11.1494 5.81543 11.302 5.71344 11.47 5.64386C11.638 5.57427 11.8181 5.53846 11.9999 5.53846H11.9999ZM12.9231 18.4615H12C11.8788 18.4616 11.7587 18.4378 11.6467 18.3914C11.5347 18.345 11.4329 18.2771 11.3471 18.1913C11.2614 18.1056 11.1934 18.0038 11.147 17.8918C11.1007 17.7798 11.0769 17.6597 11.0769 17.5385V12C10.8321 12 10.5973 11.9027 10.4242 11.7296C10.2511 11.5565 10.1538 11.3217 10.1538 11.0769C10.1538 10.8321 10.2511 10.5973 10.4242 10.4242C10.5973 10.2511 10.8321 10.1538 11.0769 10.1538H12C12.1212 10.1538 12.2413 10.1776 12.3533 10.224C12.4654 10.2703 12.5671 10.3383 12.6529 10.4241C12.7386 10.5098 12.8066 10.6116 12.853 10.7236C12.8993 10.8356 12.9232 10.9557 12.9231 11.0769V16.6154C13.1679 16.6154 13.4027 16.7126 13.5758 16.8857C13.7489 17.0589 13.8462 17.2936 13.8462 17.5385C13.8462 17.7833 13.7489 18.0181 13.5758 18.1912C13.4027 18.3643 13.1679 18.4615 12.9231 18.4615Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default InfoFilled;

package/src/common/icon/icons/InfoOutlined.tsx

@@ -1,42 +0,0 @@
-/* eslint-disable max-len */
-
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const InfoOutlined = (props: SvgIconProps): ReactElement => {
-    return (
-        <SvgIcon
-            viewBox="0 0 24 24"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            {...props}
-            data-testid="infoOutlined"
-        >
-            <g clipPath="url(#clip0_12033_52181)">
-                <path
-                    d="M12 2C14.67 2 17.18 3.04 19.07 4.93C20.96 6.82 22 9.33 22 12C22 13.98 21.42 15.91 20.31 17.56C19.21 19.21 17.66 20.48 15.82 21.24C14.6 21.75 13.31 22 11.99 22C11.34 22 10.68 21.94 10.04 21.81C8.09001 21.42 6.32001 20.48 4.92001 19.07C3.52001 17.67 2.57001 15.9 2.18001 13.95C1.79001 12 1.99001 10.01 2.75001 8.17C3.51001 6.34 4.78001 4.78 6.43001 3.68C8.08001 2.58 10 2 11.98 1.99L12 2ZM11.98 -0.0100002C9.61001 -0.0100002 7.29001 0.69 5.31001 2.01C3.36001 3.34 1.82001 5.22 0.910006 7.41C5.48363e-06 9.6 -0.229994 12.01 0.230006 14.34C0.690006 16.67 1.84001 18.81 3.51001 20.48C5.19001 22.16 7.33001 23.3 9.65001 23.76C10.42 23.91 11.21 23.99 11.99 23.99C13.56 23.99 15.12 23.68 16.58 23.08C18.77 22.17 20.65 20.63 21.97 18.66C23.29 16.69 23.99 14.37 23.99 11.99C23.99 8.81 22.72 5.76 20.47 3.51C18.23 1.27 15.18 -2.29105e-07 12 -2.29105e-07L11.98 -0.0100002Z"
-                    fill={props.color}
-                />
-                <path
-                    d="M12 5.54C12.27 5.54 12.54 5.62 12.77 5.77C13 5.92 13.18 6.14 13.28 6.39C13.38 6.64 13.41 6.92 13.36 7.19C13.31 7.46 13.17 7.71 12.98 7.9C12.79 8.09 12.54 8.23 12.27 8.28C12 8.33 11.72 8.31 11.47 8.2C11.22 8.1 11 7.92 10.85 7.69C10.7 7.46 10.62 7.19 10.62 6.92C10.62 6.74 10.66 6.56 10.73 6.39C10.8 6.22 10.9 6.07 11.03 5.94C11.16 5.81 11.31 5.71 11.48 5.64C11.65 5.57 11.83 5.53 12.01 5.53L12 5.54Z"
-                    fill={props.color}
-                />
-                <path
-                    d="M12.92 18.46H12C11.88 18.46 11.76 18.44 11.65 18.39C11.54 18.34 11.44 18.28 11.35 18.19C11.26 18.1 11.2 18 11.15 17.89C11.1 17.78 11.08 17.66 11.08 17.54V12C10.84 12 10.6 11.9 10.43 11.73C10.26 11.56 10.16 11.32 10.16 11.08C10.16 10.84 10.26 10.6 10.43 10.43C10.6 10.26 10.84 10.16 11.08 10.16H12C12.12 10.16 12.24 10.18 12.35 10.23C12.46 10.28 12.56 10.34 12.65 10.43C12.74 10.52 12.8 10.62 12.85 10.73C12.9 10.84 12.92 10.96 12.92 11.08V16.62C13.16 16.62 13.4 16.72 13.57 16.89C13.74 17.06 13.84 17.3 13.84 17.54C13.84 17.78 13.74 18.02 13.57 18.19C13.4 18.36 13.16 18.46 12.92 18.46Z"
-                    fill={props.color}
-                />
-            </g>
-            <defs>
-                <clipPath id="clip0_12033_52181">
-                    <rect width="24" height="24" fill="white" />
-                </clipPath>
-            </defs>
-        </SvgIcon>
-    );
-};
-
-export default InfoOutlined;

package/src/common/icon/icons/RoundedClose.tsx

@@ -1,31 +0,0 @@
-import { ReactElement } from 'react';
-
-/* figma link:
-   https://www.figma.com/file/PYBXZQL5mleej9AlspDSuI/Equinox-Designs?type=design&node-id=82-1276&mode=design&t=k8Kqtpp3QmkKcOlT-4
-*/
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const RoundedClose = (props: SvgIconProps): ReactElement => {
-    return (
-        <SvgIcon
-            width="25"
-            height="25"
-            viewBox="0 0 25 25"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            {...props}
-            data-testid="roundedClose"
-        >
-            <rect x="0.734863" y="0.730225" width="24" height="24" rx="12" fill={props.color} />
-            <path
-                d="M13.7942 12.7302L16.9911 9.53333C17.2817 9.2427 17.2817 8.76458 16.9911 8.47395C16.7005 8.18333 16.2224 8.18333 15.9317 8.47395L12.7349 11.6708L9.53799 8.47395C9.24736 8.18333 8.76924 8.18333 8.47861 8.47395C8.3333 8.61926 8.2583 8.81145 8.2583 9.00364C8.2583 9.19583 8.3333 9.38801 8.47861 9.53333L11.6755 12.7302L8.47861 15.9271C8.3333 16.0724 8.2583 16.2646 8.2583 16.4568C8.2583 16.6489 8.3333 16.8411 8.47861 16.9864C8.76924 17.2771 9.24736 17.2771 9.53799 16.9864L12.7349 13.7896L15.9317 16.9864C16.2224 17.2771 16.7005 17.2771 16.9911 16.9864C17.2817 16.6958 17.2817 16.2177 16.9911 15.9271L13.7942 12.7302Z"
-                fill="#292929"
-            />
-        </SvgIcon>
-    );
-};
-
-export default RoundedClose;

package/src/common/icon/icons/SearchIcon.tsx

@@ -1,32 +0,0 @@
-import { ReactElement } from 'react';
-
-/* eslint-disable max-len */
-import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon';
-
-/**
- * pass colorOverride = '#5F5F5F'
- * @param props {fill: color to be filled for icon, color: color of the tick icon}
- * @returns SearchIcon, can be used in Input field, when input field is in success state
- */
-const SearchIcon = (props: SvgIconProps): ReactElement=> {
-    return (
-        <SvgIcon
-            width="24"
-            height="24"
-            viewBox="0 0 24 24"
-            data-testid="search"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            {...props}
-        >
-            <path
-                fillRule="evenodd"
-                clipRule="evenodd"
-                d="M0 9.98777C0 4.47167 4.46598 0 9.97505 0C15.4841 0 19.9501 4.47167 19.9501 9.98777C19.9501 11.7568 19.49 13.4205 18.6829 14.8629L23.2366 19.4844C24.2593 20.5223 24.2537 22.1921 23.2241 23.2231C22.1755 24.273 20.4704 24.2567 19.442 23.1869L15.0315 18.5988C13.5485 19.4736 11.8192 19.9755 9.97505 19.9755C4.46598 19.9755 0 15.5039 0 9.98777ZM16.6388 17.42L20.8646 21.8159C21.1265 22.0884 21.5608 22.0926 21.8279 21.8251C22.0902 21.5625 22.0916 21.1372 21.8311 20.8728L17.5309 16.5087C17.2531 16.8311 16.9551 17.1355 16.6388 17.42ZM9.97505 1.97696C5.55644 1.97696 1.97444 5.56352 1.97444 9.98777C1.97444 14.412 5.55644 17.9986 9.97505 17.9986C11.7025 17.9986 13.2995 17.4515 14.6063 16.5208C15.3948 15.9594 16.0773 15.2583 16.6179 14.454C17.4753 13.1784 17.9757 11.6431 17.9757 9.98777C17.9757 5.56352 14.3937 1.97696 9.97505 1.97696Z"
-                fill={props.color}
-            />
-        </SvgIcon>
-    );
-};
-
-export default SearchIcon;

package/src/common/icon/icons/SlashIcon.tsx

@@ -1,22 +0,0 @@
-import { ReactElement } from 'react';
-
-import {
-    SvgIcon,
-    SvgIconProps,
-} from '@mui/material';
-
-const SlashIcon = (props: SvgIconProps): ReactElement => {
-    return (
-        <SvgIcon viewBox="0 0 2 22" fill="none" xmlns="http://www.w3.org/2000/svg" {...props} data-testid="slash">
-            <path
-                d="M1 1L1 11L0.999999 21"
-                stroke={props.color}
-                strokeWidth="2"
-                strokeLinecap="round"
-                strokeLinejoin="round"
-            />
-        </SvgIcon>
-    );
-};
-
-export default SlashIcon;