@xaypay/tui 0.0.119 → 0.0.121

package/src/components/file/file.module.css

@@ -1,114 +0,0 @@
-.file-form-wrap {
-    position: relative;
-}
-.file-form {
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: center;
-    background: #FBFBFB;
-    border: 2px dashed;
-    border-radius: 6px;
-    width: 100%;
-    height: 190px;
-    padding: 4px 0;
-    cursor: pointer;
-    overflow: hidden;
-}
-.file-form-wrap:before {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: rgba(60, 57, 62, 0.4);
-    z-index: 1;
-    opacity: 0;
-    transition: opacity 240ms;
-    border-radius: 6px;
-    pointer-events: none;
-}
-.file-form-wrap.active:hover:before {
-    opacity: 1;
-    pointer-events: unset;
-}
-.file-form-wrap.active:hover .delete-upload-icon {
-    opacity: 1;
-}
-.file-form-inner-upload {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: center;
-    padding-top: 48px;
-    padding-bottom: 16px;
-}
-.file-form-inner-upload > img {
-    margin-bottom: 14px;
-    display: block;
-}
-.upload-info {
-    margin-bottom: 40px;
-    max-width: 150px;
-    text-align: center;
-}
-.upload-info-txt {
-   color: #0DA574;
-}
-.file-form.default {
-    border-color: #D1D1D1;
-}
-.file-form.error {
-    border-color: #EE0000 !important;
-}
-.file-form.accept {
-    border-color: #00236A;
-}
-.delete-upload-icon {
-    position: absolute;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 26px;
-    height: 26px;
-    right: 10px;
-    top: 10px;
-    background: #ffffff;
-    border-radius: 6px;
-    z-index: 11;
-    cursor: pointer;
-    opacity: 0;
-    transition: opacity 240ms;
-}
-.delete-upload-icon > i {
-    color: #00236A;
-    font-size: 16px;
-}
-.upload-file-content {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    max-height: 190px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    overflow: hidden;
-}
-.upload-file-content > img {
-    display: block;
-    width: 27.8rem;
-    height: auto;
-    max-height: 95%;
-    object-fit: contain;
-}
-.file-form-title {
-    margin-bottom: 10px;
-    max-width: 390px;
-    word-break: break-all;
-}
-.file-form-wrap {
-    position: relative;
-    transform: translate3d(0,0,0);
-}

package/src/components/file/file.stories.js

@@ -1,20 +0,0 @@
-import React from 'react'
-import { File } from './index'
-
-export default {
-    component: File,
-    title: 'Components/File',
-}
-
-const Template = (args) => <File {...args} />
-
-export const Default = Template.bind({})
-Default.args = {
-    label: 'ssa',
-    onChange: (_) => _,
-    defaultData: {
-        url: 'https://images.pexels.com/photos/753626/pexels-photo-753626.jpeg?auto=compress&cs=tinysrgb&w=1600',
-        type: 'image/png',
-    },
-    name: 'sss',
-}

package/src/components/file/index.js

@@ -1,138 +0,0 @@
-import React, { useState } from 'react'
-import PropTypes from 'prop-types'
-import classnames from 'classnames'
-
-import PDF from './../icon/PDF'
-import SvgRequired from './../icon/Required'
-
-import styles from './file.module.css'
-
-export const File = ({
-    name,
-    label,
-    maxSize,
-    required,
-    disabled,
-    onChange,
-    defaultData,
-    errorMessage,
-    fileExtensions,
-}) => {
-    const [error, setError] = useState('')
-    const [fileName, setFileName] = useState('no selected file')
-    const [image, setImage] = useState(
-        defaultData ? (defaultData.type != 'application/pdf' ? defaultData.url : 'pdf') : null
-    )
-
-    const handleCheckFile = (e) => {
-        const file = e.target.files
-
-        if (file[0]) {
-            if (file[0].size <= maxSize * Math.pow(2, 20)) {
-                if (fileExtensions.includes(file[0].type.split('/')[1])) {
-                    if (file[0].type === 'application/pdf') {
-                        setError('')
-                        onChange({ file })
-                        setImage('pdf')
-                    } else {
-                        setError('')
-                        onChange({ file })
-                        setFileName(file[0].name)
-                        setImage(URL.createObjectURL(file[0]))
-                    }
-                } else {
-                    setImage(null)
-                    setError('ֆայլի սխալ ֆորմատ')
-                    setFileName('no selected file')
-                }
-            } else {
-                setImage(null)
-                setError('առավելագույն ծավալ')
-                setFileName('no selected file')
-            }
-        } else {
-            setImage(null)
-            setError('Ֆայլը ընտրված չէ')
-            setFileName('no selected file')
-        }
-    }
-
-    const handleRemoveFile = () => {
-        setImage(null)
-        onChange({ target: null })
-        setFileName('no selected file')
-        document.querySelector(`.${name}`).value = ''
-    }
-
-    return (
-        <>
-            <p className={`${styles['file-form-title']} ile-form-title-rem`}>
-                {label}
-                {required && (
-                    <sup>
-                        <SvgRequired />
-                    </sup>
-                )}
-            </p>
-            <div
-                className={classnames(`${styles['file-form-wrap']} file-form-wrap-rem`, image ? styles['active'] : '')}
-            >
-                <div
-                    className={`${styles['file-form']} file-form-rem ${error || errorMessage ? styles['error'] : ''}`}
-                    onClick={() => document.querySelector(`.${name}`).click()}
-                >
-                    <input
-                        hidden
-                        type="file"
-                        className={name}
-                        disabled={disabled}
-                        onChange={(e) => handleCheckFile(e)}
-                    />
-                    {image ? (
-                        <div className={`${styles['upload-file-content']} upload-file-content-rem`}>
-                            {image === 'pdf' ? <PDF /> : <img src={image} alt={fileName} />}
-                        </div>
-                    ) : (
-                        <div className={`${styles['file-form-inner-upload']} ile-form-inner-upload-rem`}>
-                            <img src="../../assets/upload.svg" alt="" />
-                            <span className={`${styles['upload-info']} upload-info-rem`}>
-                                <span className={`${styles['upload-info-txt']} upload-info-txt-rem`}>Բեռնել</span>
-                            </span>
-                            <span className={`${styles['upload-info-size']} upload-info-size-rem`}>
-                                Առավելագույնը {maxSize}ՄԲ ( {fileExtensions.toString().split(',').join(', ')} )
-                            </span>
-                        </div>
-                    )}
-                </div>
-                {!disabled && (
-                    <div
-                        className={`${styles['delete-upload-icon']} delete-upload-icon-rem`}
-                        onClick={handleRemoveFile}
-                    >
-                        <i className="icon-delete" />
-                    </div>
-                )}
-
-                {error || errorMessage ? <span style={{ color: 'red' }}>{error || errorMessage}</span> : null}
-            </div>
-        </>
-    )
-}
-
-File.propTypes = {
-    label: PropTypes.string,
-    required: PropTypes.bool,
-    disabled: PropTypes.bool,
-    onChange: PropTypes.func,
-    maxSize: PropTypes.number,
-    className: PropTypes.string,
-    errorMessage: PropTypes.string,
-    defaultData: PropTypes.object,
-    fileExtensions: PropTypes.arrayOf(PropTypes.string),
-}
-
-File.defaultProps = {
-    maxSize: 5,
-    required: false,
-    fileExtensions: ['jpg', 'jpeg', 'png', 'pdf'],
-}

package/src/components/icon/Active.js

@@ -1,20 +0,0 @@
-import * as React from 'react'
-const SvgActive = ({ title, titleId, ...props }) => (
-    <svg
-        width="32"
-        height="32"
-        viewBox="0 0 32 32"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <rect width={32} height={32} rx={6} fill="#00236A" />
-        <path
-            d="M8.5 14a2.5 2.5 0 1 1 0 5.001A2.5 2.5 0 0 1 8.5 14Zm7.5 0a2.5 2.5 0 1 1 0 5.001A2.5 2.5 0 0 1 16 14Zm7.5 0a2.5 2.5 0 1 1 0 5.001 2.5 2.5 0 0 1 0-5.001Z"
-            fill="#fff"
-        />
-    </svg>
-)
-export default SvgActive

package/src/components/icon/Arrow.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgArrow = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="15"
-        height="9"
-        viewBox="0 0 15 9"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="M7.988 8a.997.997 0 0 1-.64-.23l-5.989-5a1.002 1.002 0 0 1 .548-1.767.998.998 0 0 1 .73.227l5.35 4.48 5.351-4.32a.997.997 0 0 1 1.408.15 1 1 0 0 1-.14 1.46l-5.99 4.83a.997.997 0 0 1-.628.17Z"
-            fill={fillColor ? fillColor : '#3C393E'}
-        />
-    </svg>
-)
-export default SvgArrow

package/src/components/icon/Cancel.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgCancel = ({ title, titleId, ...props }) => (
-    <svg
-        width="16"
-        height="16"
-        viewBox="0 0 16 16"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="M8 0C3.589 0 0 3.589 0 8s3.589 8 8 8 8-3.589 8-8-3.589-8-8-8Zm2.896 10.027a.615.615 0 1 1-.87.87L8 8.87l-2.027 2.027a.615.615 0 0 1-.87-.87L7.13 8 5.103 5.973a.615.615 0 0 1 .87-.87L8 7.13l2.027-2.027a.616.616 0 0 1 .87.87L8.87 8l2.027 2.027Z"
-            fill="#E00"
-        />
-    </svg>
-)
-export default SvgCancel

package/src/components/icon/CaptchaArrowDown.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgCaptchaArrowDown = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="12"
-        height="15"
-        viewBox="0 0 12 15"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="M6 0.00146537C5.77271 0.00146539 5.55473 0.0936418 5.39402 0.257718C5.2333 0.421795 5.14301 0.64433 5.14301 0.876368L5.14301 11.013L1.46482 7.25615C1.38514 7.17481 1.29055 7.11028 1.18644 7.06626C1.08233 7.02224 0.970753 6.99958 0.85807 6.99958C0.745386 6.99958 0.633807 7.02224 0.529701 7.06626C0.425595 7.11028 0.331002 7.17481 0.251322 7.25616C0.171643 7.3375 0.108438 7.43407 0.0653156 7.54035C0.0221934 7.64663 -5.45598e-07 7.76055 -5.35541e-07 7.87559C-5.25484e-07 7.99063 0.0221934 8.10454 0.0653157 8.21082C0.108438 8.3171 0.171643 8.41367 0.251322 8.49502L5.39325 13.7444C5.47286 13.8259 5.56743 13.8905 5.67155 13.9347C5.77566 13.9788 5.88728 14.0015 6 14.0015C6.11272 14.0015 6.22434 13.9788 6.32846 13.9347C6.43257 13.8905 6.52714 13.8259 6.60675 13.7444L11.7487 8.49502C11.9096 8.33073 12 8.10792 12 7.87559C12 7.64325 11.9096 7.42044 11.7487 7.25615C11.5878 7.09187 11.3695 6.99958 11.1419 6.99958C10.9144 6.99958 10.6961 7.09187 10.5352 7.25615L6.85699 11.013L6.85699 0.876368C6.85699 0.64433 6.7667 0.421794 6.60598 0.257718C6.44526 0.0936418 6.22729 0.00146535 6 0.00146537Z"
-            fill={fillColor ? fillColor : '#00236A'}
-        />
-    </svg>
-)
-export default SvgCaptchaArrowDown

package/src/components/icon/CaptchaArrowUp.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgCaptchaArrowUp = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="12"
-        height="15"
-        viewBox="0 0 12 15"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="M6 14.9988C6.22729 14.9988 6.44527 14.9066 6.60598 14.7425C6.7667 14.5785 6.85699 14.3559 6.85699 14.1239L6.85699 3.98726L10.5352 7.74409C10.6149 7.82543 10.7095 7.88996 10.8136 7.93398C10.9177 7.97801 11.0292 8.00067 11.1419 8.00067C11.2546 8.00067 11.3662 7.97801 11.4703 7.93398C11.5744 7.88996 11.669 7.82543 11.7487 7.74409C11.8284 7.66274 11.8916 7.56617 11.9347 7.45989C11.9778 7.35361 12 7.2397 12 7.12466C12 7.00962 11.9778 6.89571 11.9347 6.78943C11.8916 6.68314 11.8284 6.58657 11.7487 6.50523L6.60675 1.25581C6.52714 1.17434 6.43257 1.1097 6.32845 1.06559C6.22434 1.02148 6.11272 0.998779 6 0.998779C5.88728 0.998779 5.77566 1.02148 5.67154 1.06559C5.56743 1.1097 5.47286 1.17434 5.39325 1.25581L0.251323 6.50523C0.0904038 6.66951 0 6.89233 0 7.12466C0 7.35699 0.0904038 7.57981 0.251323 7.74409C0.412243 7.90837 0.630497 8.00067 0.858071 8.00067C1.08565 8.00067 1.3039 7.90837 1.46482 7.74409L5.14301 3.98726L5.14301 14.1239C5.14301 14.3559 5.2333 14.5785 5.39402 14.7425C5.55473 14.9066 5.77271 14.9988 6 14.9988Z"
-            fill={fillColor ? fillColor : '#00236A'}
-        />
-    </svg>
-)
-export default SvgCaptchaArrowUp

package/src/components/icon/CheckboxChecked.js

@@ -1,21 +0,0 @@
-import * as React from 'react'
-const SvgCheckboxChecked = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="16"
-        height="16"
-        viewBox="0 0 16 16"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            fillRule="evenodd"
-            clipRule="evenodd"
-            d="M12.8 0H3.2A3.2 3.2 0 0 0 0 3.2v9.6A3.2 3.2 0 0 0 3.2 16h9.6a3.2 3.2 0 0 0 3.2-3.2V3.2A3.2 3.2 0 0 0 12.8 0ZM6.85 10.966c.068.023.14.034.218.034.078 0 .151-.011.219-.034a.515.515 0 0 0 .19-.114l5.363-4.94A.496.496 0 0 0 13 5.53a.496.496 0 0 0-.16-.382.589.589 0 0 0-.415-.148.59.59 0 0 0-.416.148l-4.94 4.55-2.085-1.92a.579.579 0 0 0-.408-.147.579.579 0 0 0-.408.148A.52.52 0 0 0 4 8.16a.476.476 0 0 0 .154.383l2.506 2.308a.515.515 0 0 0 .19.114Z"
-            fill={fillColor ? fillColor : '#00236A'}
-        />
-    </svg>
-)
-export default SvgCheckboxChecked

package/src/components/icon/CheckboxUnchecked.js

@@ -1,21 +0,0 @@
-import * as React from 'react'
-const SvgCheckboxUnchecked = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="16"
-        height="16"
-        viewBox="0 0 16 16"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            fillRule="evenodd"
-            clipRule="evenodd"
-            d="M3.2 0h9.6A3.2 3.2 0 0 1 16 3.2v9.6a3.2 3.2 0 0 1-3.2 3.2H3.2A3.2 3.2 0 0 1 0 12.8V3.2A3.2 3.2 0 0 1 3.2 0Zm0 1.6a1.6 1.6 0 0 0-1.6 1.6v9.6a1.6 1.6 0 0 0 1.6 1.6h9.6a1.6 1.6 0 0 0 1.6-1.6V3.2a1.6 1.6 0 0 0-1.6-1.6H3.2Z"
-            fill={fillColor ? fillColor : '#D1D1D1'}
-        />
-    </svg>
-)
-export default SvgCheckboxUnchecked

package/src/components/icon/Close.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgClose = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="18"
-        height="18"
-        viewBox="0 0 18 18"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="m10.47 8.95 7.29-7.29A1 1 0 0 0 16.35.25L9.06 7.54 1.77.24A1 1 0 0 0 .36 1.65l7.29 7.3-7.3 7.29a.999.999 0 1 0 1.41 1.41l7.3-7.29 7.29 7.29a1 1 0 0 0 1.41-1.41l-7.29-7.29Z"
-            fill={fillColor ? fillColor : '#3C393E'}
-        />
-    </svg>
-)
-export default SvgClose

package/src/components/icon/CloseIcon.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgCloseIcon = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="14"
-        height="14"
-        viewBox="0 0 14 14"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="m12.425.241.006-.005a.95.95 0 0 1 1.34 1.34l-.005.006-5.38 5.38 5.38 5.38.005.007a.95.95 0 0 1-1.34 1.34l-.006-.005-5.38-5.38-5.378 5.37a.951.951 0 1 1-1.34-1.341l5.377-5.37-5.38-5.388-.005-.006a.95.95 0 0 1 1.34-1.34l.006.005 5.38 5.387 5.38-5.38Z"
-            fill={fillColor ? fillColor : '#3C393E'}
-        />
-    </svg>
-)
-export default SvgCloseIcon

package/src/components/icon/CloseSlide.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgCloseSlide = ({ title, titleId, ...props }) => (
-    <svg
-        width="18"
-        height="18"
-        viewBox="0 0 18 18"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="m10.47 8.95 7.29-7.29A1 1 0 0 0 16.35.25L9.06 7.54 1.77.24A1 1 0 0 0 .36 1.65l7.29 7.3-7.3 7.29a.999.999 0 1 0 1.41 1.41l7.3-7.29 7.29 7.29a1 1 0 0 0 1.41-1.41l-7.29-7.29Z"
-            fill="#fff"
-        />
-    </svg>
-)
-export default SvgCloseSlide

package/src/components/icon/DeActive.js

@@ -1,20 +0,0 @@
-import * as React from 'react'
-const SvgDeActive = ({ title, titleId, ...props }) => (
-    <svg
-        width="32"
-        height="32"
-        viewBox="0 0 32 32"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <rect x={0.5} y={0.5} width={31} height={31} rx={5.5} fill="#FBFBFB" stroke="#EEE" />
-        <path
-            d="M8.5 14a2.5 2.5 0 1 1 0 5.001A2.5 2.5 0 0 1 8.5 14Zm7.5 0a2.5 2.5 0 1 1 0 5.001A2.5 2.5 0 0 1 16 14Zm7.5 0a2.5 2.5 0 1 1 0 5.001 2.5 2.5 0 0 1 0-5.001Z"
-            fill="#D1D1D1"
-        />
-    </svg>
-)
-export default SvgDeActive

package/src/components/icon/DeleteComponent.js

@@ -1,20 +0,0 @@
-import * as React from 'react'
-const SvgDeleteComponent = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="26"
-        height="26"
-        viewBox="0 0 26 26"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <rect x={0.5} y={0.5} width={25} height={25} rx={5.5} stroke="#D1D1D1" />
-        <path
-            d="M13 4c.822 0 1.611.296 2.206.826s.95 1.255.99 2.024l.005.15h4c.204 0 .4.073.548.205.148.13.238.31.25.501a.72.72 0 0 1-.185.525.817.817 0 0 1-.52.264l-.093.005h-.68l-.943 10.915a2.75 2.75 0 0 1-.957 1.84 3.114 3.114 0 0 1-2.034.745h-5.173c-.754 0-1.48-.266-2.034-.745a2.75 2.75 0 0 1-.957-1.84L6.478 8.5H5.8a.831.831 0 0 1-.531-.19.736.736 0 0 1-.263-.472L5 7.75c0-.184.072-.361.202-.498a.818.818 0 0 1 .504-.247L5.8 7h4c0-.796.337-1.559.938-2.121A3.312 3.312 0 0 1 13 4Zm-1.8 6.938a.623.623 0 0 0-.394.138.553.553 0 0 0-.2.348l-.006.076v6l.006.076c.02.135.09.258.2.348.11.09.25.138.394.138.145 0 .285-.049.395-.138.109-.09.18-.213.2-.348l.005-.076v-6l-.005-.076a.553.553 0 0 0-.2-.348.624.624 0 0 0-.395-.139Zm3.6 0a.623.623 0 0 0-.394.138.553.553 0 0 0-.2.348l-.005.076v6l.005.076c.02.135.091.258.2.348.11.09.25.138.394.138.145 0 .286-.049.395-.138.11-.09.18-.213.2-.348l.006-.076v-6l-.006-.076a.553.553 0 0 0-.2-.348.624.624 0 0 0-.395-.139ZM13 5.5a1.66 1.66 0 0 0-1.088.4c-.296.257-.477.61-.508.987L11.4 7h3.2l-.003-.112a1.465 1.465 0 0 0-.508-.988A1.66 1.66 0 0 0 13 5.5Z"
-            fill={fillColor ? fillColor : '#E00'}
-        />
-    </svg>
-)
-export default SvgDeleteComponent

package/src/components/icon/Done.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgDone = ({ title, titleId, ...props }) => (
-    <svg
-        width="16"
-        height="14"
-        viewBox="0 0 16 14"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="M15.072 8.307c0-.017-.004-.033-.004-.05 0-.02.004-.04.004-.06v.11Zm-.402-3.692h-4.235a.922.922 0 0 1-.656-.274.944.944 0 0 1-.272-.664v-1.8c0-.509-.204-.995-.565-1.349a1.843 1.843 0 0 0-1.35-.527.913.913 0 0 0-.62.293.934.934 0 0 0-.247.645v1.876c0 1.331-1.855 2.27-1.855 3.208v6.002a.93.93 0 0 0 .493.829l.575.31A6.89 6.89 0 0 0 9.226 14h3.59c.352 0 .69-.142.94-.394.249-.252.389-.595.389-.952v-.124a1.343 1.343 0 0 0-.155-.619c.384-.245.618-.673.619-1.134v-.358c0-.364-.146-.712-.405-.965.403-.126.714-.453.822-.865a1.25 1.25 0 0 0-.287-1.165c.34-.017.66-.166.895-.415.234-.249.365-.58.366-.924v-.124c0-.357-.14-.7-.39-.952a1.322 1.322 0 0 0-.94-.394ZM3.71 5.32v7.508c0 .13-.104.234-.232.235H.232A.233.233 0 0 1 0 12.827V5.319c0-.062.024-.122.068-.166a.23.23 0 0 1 .164-.068h3.246a.23.23 0 0 1 .164.068.236.236 0 0 1 .068.166ZM2.55 10.95a.708.708 0 0 0-.203-.498.691.691 0 0 0-.984 0 .708.708 0 0 0 0 .996.692.692 0 0 0 .984 0 .708.708 0 0 0 .204-.498Z"
-            fill="#0DA574"
-        />
-    </svg>
-)
-export default SvgDone

package/src/components/icon/Dots.js

@@ -1,19 +0,0 @@
-import * as React from 'react'
-const SvgDots = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        width="11"
-        height="3"
-        viewBox="0 0 11 3"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="M.23 1.136C.23.742.326.464.518.304c.192-.16.421-.24.688-.24.277 0 .512.08.704.24.203.16.304.438.304.832 0 .384-.101.662-.304.832-.192.17-.427.256-.704.256a1 1 0 0 1-.688-.256C.326 1.798.23 1.52.23 1.136Zm4.281 0c0-.394.096-.672.288-.832.192-.16.422-.24.688-.24.278 0 .512.08.704.24.203.16.304.438.304.832 0 .384-.101.662-.304.832-.192.17-.426.256-.704.256a1 1 0 0 1-.688-.256c-.192-.17-.288-.448-.288-.832Zm4.282 0c0-.394.096-.672.288-.832.192-.16.421-.24.688-.24.277 0 .512.08.704.24.202.16.304.438.304.832 0 .384-.102.662-.304.832-.192.17-.427.256-.704.256a1 1 0 0 1-.688-.256c-.192-.17-.288-.448-.288-.832Z"
-            fill={fillColor ? fillColor : '#3C393E'}
-        />
-    </svg>
-)
-export default SvgDots

package/src/components/icon/DownArrow.js

@@ -1,20 +0,0 @@
-import * as React from 'react'
-const SvgDownArrow = ({ title, titleId, ...props }) => (
-    <svg
-        width="21"
-        height="21"
-        viewBox="0 0 21 21"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <rect x={0.5} y={0.5} width={20} height={20} rx={0.5} fill="#fff" stroke="#EEE" />
-        <path
-            d="M10.491 13.998a.745.745 0 0 1-.502-.197L5.283 9.517a.912.912 0 0 1-.102-1.208.767.767 0 0 1 .532-.305c.208-.021.414.049.574.194l4.204 3.838 4.204-3.7a.765.765 0 0 1 .272-.157.721.721 0 0 1 .599.07c.09.054.17.127.235.215a.88.88 0 0 1 .16.303.933.933 0 0 1-.06.683.841.841 0 0 1-.21.264l-4.706 4.138a.735.735 0 0 1-.494.146Z"
-            fill="#3C393E"
-        />
-    </svg>
-)
-export default SvgDownArrow

package/src/components/icon/HeartFilled.js

@@ -1,25 +0,0 @@
-import * as React from 'react'
-
-const SvgHeartFilled = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        width="1em"
-        height="1em"
-        viewBox="0 0 511.626 511.627"
-        style={{
-            enableBackground: 'new 0 0 511.626 511.627',
-        }}
-        xmlSpace="preserve"
-        role="img"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="M475.366 71.951c-24.175-23.606-57.575-35.404-100.215-35.404-11.8 0-23.843 2.046-36.117 6.136-12.279 4.093-23.702 9.615-34.256 16.562-10.568 6.945-19.65 13.467-27.269 19.556a263.828 263.828 0 0 0-21.696 19.414 264.184 264.184 0 0 0-21.698-19.414c-7.616-6.089-16.702-12.607-27.268-19.556-10.564-6.95-21.985-12.468-34.261-16.562-12.275-4.089-24.316-6.136-36.116-6.136-42.637 0-76.039 11.801-100.211 35.404C12.087 95.552 0 128.288 0 170.162c0 12.753 2.24 25.889 6.711 39.398 4.471 13.514 9.566 25.031 15.275 34.546 5.708 9.514 12.181 18.796 19.414 27.837 7.233 9.042 12.519 15.27 15.846 18.699 3.33 3.422 5.948 5.899 7.851 7.419L243.25 469.937c3.427 3.429 7.614 5.144 12.562 5.144s9.138-1.715 12.563-5.137l177.87-171.307c43.588-43.583 65.38-86.41 65.38-128.475.001-41.874-12.088-74.61-36.259-98.211z"
-            fill={fillColor ? fillColor : 'currentColor'}
-        />
-    </svg>
-)
-
-export default SvgHeartFilled

package/src/components/icon/HeartOutline.js

@@ -1,25 +0,0 @@
-import * as React from 'react'
-
-const SvgHeartOutline = ({ title, titleId, fillColor, ...props }) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 471.701 471.701"
-        style={{
-            enableBackground: 'new 0 0 471.701 471.701',
-        }}
-        xmlSpace="preserve"
-        width="1em"
-        height="1em"
-        role="img"
-        aria-labelledby={titleId}
-        {...props}
-    >
-        {title ? <title id={titleId}>{title}</title> : null}
-        <path
-            d="M433.601 67.001c-24.7-24.7-57.4-38.2-92.3-38.2s-67.7 13.6-92.4 38.3l-12.9 12.9-13.1-13.1c-24.7-24.7-57.6-38.4-92.5-38.4-34.8 0-67.6 13.6-92.2 38.2-24.7 24.7-38.3 57.5-38.2 92.4 0 34.9 13.7 67.6 38.4 92.3l187.8 187.8c2.6 2.6 6.1 4 9.5 4 3.4 0 6.9-1.3 9.5-3.9l188.2-187.5c24.7-24.7 38.3-57.5 38.3-92.4.1-34.9-13.4-67.7-38.1-92.4zm-19.2 165.7-178.7 178-178.3-178.3c-19.6-19.6-30.4-45.6-30.4-73.3s10.7-53.7 30.3-73.2c19.5-19.5 45.5-30.3 73.1-30.3 27.7 0 53.8 10.8 73.4 30.4l22.6 22.6c5.3 5.3 13.8 5.3 19.1 0l22.4-22.4c19.6-19.6 45.7-30.4 73.3-30.4 27.6 0 53.6 10.8 73.2 30.3 19.6 19.6 30.3 45.6 30.3 73.3.1 27.7-10.7 53.7-30.3 73.3z"
-            fill={fillColor ? fillColor : 'currentColor'}
-        />
-    </svg>
-)
-
-export default SvgHeartOutline