@platformatic/ui-components 0.6.0 → 0.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/index-CTXhzp-V.js +40 -0
- package/dist/index.html +1 -1
- package/dist/main.css +1 -1
- package/package.json +1 -1
- package/src/components/CopyAndPaste.jsx +7 -2
- package/src/components/constants.js +2 -1
- package/src/components/icons/AddEnvVariableIcon.jsx +97 -0
- package/src/components/icons/AllAppsIcon.jsx +21 -1
- package/src/components/icons/AppDetailsIcon.jsx +17 -1
- package/src/components/icons/CheckListIcon.jsx +22 -1
- package/src/components/icons/CodeTestingIcon.jsx +23 -3
- package/src/components/icons/DeploymentHistoryIcon.jsx +24 -1
- package/src/components/icons/DownloadIcon.jsx +93 -0
- package/src/components/icons/GearIcon.jsx +17 -1
- package/src/components/icons/InfrastructureIcon.jsx +24 -1
- package/src/components/icons/MetricsLogsIcon.jsx +26 -1
- package/src/components/icons/PlatformaticServiceIcon.jsx +19 -3
- package/src/components/icons/ResourceIcon.jsx +22 -1
- package/src/components/icons/RocketIcon.jsx +19 -1
- package/src/components/icons/TaxonomyIcon.jsx +26 -4
- package/src/components/icons/index.js +4 -0
- package/src/stories/CopyAndPaste.stories.jsx +2 -1
- package/src/stories/PlatformaticIcon.stories.jsx +9 -0
- package/dist/assets/index-DIt4e34R.js +0 -40
package/dist/index.html
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
<meta charset="UTF-8" />
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
6
|
<title>Platformatic UI Components</title>
|
|
7
|
-
<script type="module" crossorigin src="/assets/index-
|
|
7
|
+
<script type="module" crossorigin src="/assets/index-CTXhzp-V.js"></script>
|
|
8
8
|
<link rel="stylesheet" crossorigin href="/assets/index-CeMo0DvI.css">
|
|
9
9
|
</head>
|
|
10
10
|
<body>
|
package/dist/main.css
CHANGED
package/package.json
CHANGED
|
@@ -12,7 +12,8 @@ function CopyAndPaste ({
|
|
|
12
12
|
timeout = 1500,
|
|
13
13
|
size = MEDIUM,
|
|
14
14
|
tooltipClassName = '',
|
|
15
|
-
position = POSITION_CENTER
|
|
15
|
+
position = POSITION_CENTER,
|
|
16
|
+
internalOverHandling = false
|
|
16
17
|
}) {
|
|
17
18
|
const [copied, setCopied] = useState(false)
|
|
18
19
|
|
|
@@ -25,7 +26,7 @@ function CopyAndPaste ({
|
|
|
25
26
|
}
|
|
26
27
|
|
|
27
28
|
return !copied
|
|
28
|
-
? (<PlatformaticIcon size={size} iconName='CopyPasteIcon' color={color} onClick={() => copy()} />)
|
|
29
|
+
? (<PlatformaticIcon size={size} iconName='CopyPasteIcon' color={color} onClick={() => copy()} internalOverHandling={internalOverHandling} />)
|
|
29
30
|
: (
|
|
30
31
|
<TooltipAbsolute
|
|
31
32
|
tooltipClassName={tooltipClassName}
|
|
@@ -63,6 +64,10 @@ CopyAndPaste.propTypes = {
|
|
|
63
64
|
* timeout
|
|
64
65
|
*/
|
|
65
66
|
timeout: PropTypes.number,
|
|
67
|
+
/**
|
|
68
|
+
* internalOverHandling
|
|
69
|
+
*/
|
|
70
|
+
internalOverHandling: PropTypes.bool,
|
|
66
71
|
/**
|
|
67
72
|
* timeout
|
|
68
73
|
*/
|
|
@@ -18,10 +18,11 @@ export const NONE = 'none'
|
|
|
18
18
|
export const EXTRA_SMALL = 'extra-small'
|
|
19
19
|
export const SMALL = 'small'
|
|
20
20
|
export const MEDIUM = 'medium'
|
|
21
|
+
export const EXTRA_MEDIUM = 'extra-medium'
|
|
21
22
|
export const LARGE = 'large'
|
|
22
23
|
export const EXTRA_LARGE = 'extra-large'
|
|
23
24
|
|
|
24
|
-
export const SIZES = [EXTRA_SMALL, SMALL, MEDIUM, LARGE, EXTRA_LARGE]
|
|
25
|
+
export const SIZES = [EXTRA_SMALL, SMALL, MEDIUM, EXTRA_MEDIUM, LARGE, EXTRA_LARGE]
|
|
25
26
|
export const PADDING_SIZES = [NONE, ...SIZES]
|
|
26
27
|
export const CHANGE_BACKGROUND_COLOR = 'background-color-change'
|
|
27
28
|
export const BOX_SHADOW = 'box-shadow'
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import * as React from 'react'
|
|
2
|
+
import PropTypes from 'prop-types'
|
|
3
|
+
import styles from './Icons.module.css'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
5
|
+
|
|
6
|
+
const AddEnvVariableIcon = ({
|
|
7
|
+
color = MAIN_DARK_BLUE,
|
|
8
|
+
size = MEDIUM,
|
|
9
|
+
tip = '',
|
|
10
|
+
disabled = false,
|
|
11
|
+
inactive = false
|
|
12
|
+
}) => {
|
|
13
|
+
let className = `${styles.svgClassName} ` + styles[`${color}`]
|
|
14
|
+
if (disabled) {
|
|
15
|
+
className += ` ${styles.iconDisabled}`
|
|
16
|
+
}
|
|
17
|
+
if (inactive) {
|
|
18
|
+
className += ` ${styles.iconInactive}`
|
|
19
|
+
}
|
|
20
|
+
const filledClassName = styles[`filled-${color}`]
|
|
21
|
+
let icon = <></>
|
|
22
|
+
|
|
23
|
+
switch (size) {
|
|
24
|
+
case SMALL:
|
|
25
|
+
icon = (
|
|
26
|
+
<svg
|
|
27
|
+
width={16}
|
|
28
|
+
height={16}
|
|
29
|
+
viewBox='0 0 16 16'
|
|
30
|
+
fill='none'
|
|
31
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
32
|
+
data-tip={tip}
|
|
33
|
+
className={className}
|
|
34
|
+
>
|
|
35
|
+
<path d='M10 5.35553C9.67562 3.45026 8.0211 2 6.02882 2C3.80376 2 2 3.80895 2 6.04041C2 7.99513 3.38411 9.62564 5.22306 10M6.02882 4V8M4 6L8 6.04041' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
36
|
+
<path d='M8 9.5V14H14V9.5M8 9.5V8H14V9.5M8 9.5H14' stroke='none' strokeLinejoin='round' />
|
|
37
|
+
<path d='M10.6505 10.75L10.9899 11.332H11.0061L11.3495 10.75H11.9758L11.3576 11.75L12 12.75H11.3576L11.0061 12.1562H10.9899L10.6384 12.75H10L10.6343 11.75L10.0202 10.75H10.6505Z' fill='none' className={filledClassName} />
|
|
38
|
+
</svg>
|
|
39
|
+
)
|
|
40
|
+
break
|
|
41
|
+
case MEDIUM:
|
|
42
|
+
icon = (
|
|
43
|
+
<svg
|
|
44
|
+
width={24}
|
|
45
|
+
height={24}
|
|
46
|
+
viewBox='0 0 24 24'
|
|
47
|
+
fill='none'
|
|
48
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
49
|
+
className={className}
|
|
50
|
+
data-tip={tip}
|
|
51
|
+
>
|
|
52
|
+
<path d='M15 8.03329C14.5134 5.17539 12.0316 3 9.04323 3C5.70565 3 3 5.71343 3 9.06062C3 11.9927 5.07616 14.4385 7.83459 15M9.04323 6V12M6 9L12 9.06062' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
53
|
+
<path d='M12 14.25V21H21V14.25M12 14.25V12H21V14.25M12 14.25H21' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
54
|
+
<path d='M15.9758 16.125L16.4848 16.998H16.5091L17.0242 16.125H17.9636L17.0364 17.625L18 19.125H17.0364L16.5091 18.2344H16.4848L15.9576 19.125H15L15.9515 17.625L15.0303 16.125H15.9758Z' fill='none' className={filledClassName} />
|
|
55
|
+
</svg>
|
|
56
|
+
)
|
|
57
|
+
break
|
|
58
|
+
case LARGE:
|
|
59
|
+
icon = (
|
|
60
|
+
<svg
|
|
61
|
+
width={40}
|
|
62
|
+
height={40}
|
|
63
|
+
viewBox='0 0 40 40'
|
|
64
|
+
fill='none'
|
|
65
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
66
|
+
className={className}
|
|
67
|
+
data-tip={tip}
|
|
68
|
+
>
|
|
69
|
+
<path d='M25 13.3888C24.1891 8.62565 20.0527 5 15.0721 5C9.50941 5 5 9.52239 5 15.101C5 19.9878 8.46027 24.0641 13.0576 25M15.0721 10V20M10 15L20 15.101' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
70
|
+
<path d='M20 23.75V35H35V23.75M20 23.75V20H35V23.75M20 23.75H35' stroke='none' strokeWidth={2} strokeLinejoin='round' />
|
|
71
|
+
<path d='M26.6263 26.875L27.4747 28.3301H27.5152L28.3737 26.875H29.9394L28.3939 29.375L30 31.875H28.3939L27.5152 30.3906H27.4747L26.596 31.875H25L26.5859 29.375L25.0505 26.875H26.6263Z' fill='none' className={filledClassName} />
|
|
72
|
+
</svg>
|
|
73
|
+
)
|
|
74
|
+
break
|
|
75
|
+
|
|
76
|
+
default:
|
|
77
|
+
break
|
|
78
|
+
}
|
|
79
|
+
return icon
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
AddEnvVariableIcon.propTypes = {
|
|
83
|
+
/**
|
|
84
|
+
* color of text, icon and borders
|
|
85
|
+
*/
|
|
86
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
87
|
+
/**
|
|
88
|
+
* Size
|
|
89
|
+
*/
|
|
90
|
+
size: PropTypes.oneOf(SIZES),
|
|
91
|
+
/**
|
|
92
|
+
* tip
|
|
93
|
+
*/
|
|
94
|
+
tip: PropTypes.string
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
export default AddEnvVariableIcon
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const AllAppsIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -60,6 +60,26 @@ const AllAppsIcon = ({
|
|
|
60
60
|
</svg>
|
|
61
61
|
)
|
|
62
62
|
break
|
|
63
|
+
case EXTRA_MEDIUM:
|
|
64
|
+
icon = (
|
|
65
|
+
<svg
|
|
66
|
+
width={32}
|
|
67
|
+
height={32}
|
|
68
|
+
viewBox='0 0 32 32'
|
|
69
|
+
fill='none'
|
|
70
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
71
|
+
className={className}
|
|
72
|
+
>
|
|
73
|
+
<path d='M8.5 0.999512L12.8301 3.49951V8.49951L8.5 10.9995L4.16987 8.49951V3.49951L8.5 0.999512Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
74
|
+
<path d='M8.5 20.9995L12.8301 23.4995V28.4995L8.5 30.9995L4.16987 28.4995V23.4995L8.5 20.9995Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
75
|
+
<path d='M16 10.9995L20.3301 13.4995V18.4995L16 20.9995L11.6699 18.4995V13.4995L16 10.9995Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
76
|
+
<path d='M1 10.9995L5.33013 13.4995V18.4995L1 20.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
77
|
+
<path d='M30.3296 10.9995L25.9995 13.4995V18.4995L30.3296 20.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
78
|
+
<path d='M23.5 0.999512L27.8301 3.49951V8.49951L23.5 10.9995L19.1699 8.49951V3.49951L23.5 0.999512Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
79
|
+
<path d='M23.5 20.9995L27.8301 23.4995V28.4995L23.5 30.9995L19.1699 28.4995V23.4995L23.5 20.9995Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
80
|
+
</svg>
|
|
81
|
+
)
|
|
82
|
+
break
|
|
63
83
|
case LARGE:
|
|
64
84
|
icon = (
|
|
65
85
|
<svg
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const AppDetailsIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -48,6 +48,22 @@ const AppDetailsIcon = ({
|
|
|
48
48
|
<path d='M15.9904 9V6.75L9.49519 3L3 6.75V14.25L7.99512 17.1339' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
49
49
|
<circle cx='13.8701' cy='14.875' r='4.375' stroke='none' strokeWidth={1.5} />
|
|
50
50
|
<path d='M19.9951 21L17.3701 18.375' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
</svg>
|
|
52
|
+
)
|
|
53
|
+
break
|
|
54
|
+
case EXTRA_MEDIUM:
|
|
55
|
+
icon = (
|
|
56
|
+
<svg
|
|
57
|
+
width={32}
|
|
58
|
+
height={32}
|
|
59
|
+
viewBox='0 0 32 32'
|
|
60
|
+
fill='none'
|
|
61
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
62
|
+
className={className}
|
|
63
|
+
>
|
|
64
|
+
<path d='M21.3205 12V9L12.6603 4L4 9V19L10.6602 22.8452' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
65
|
+
<circle cx='18.4935' cy='19.8333' r='5.83333' stroke='none' strokeWidth={1.5} />
|
|
66
|
+
<path d='M26.6602 28L23.1602 24.5' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
67
|
|
|
52
68
|
</svg>
|
|
53
69
|
)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const CheckListIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -62,6 +62,27 @@ const CheckListIcon = ({
|
|
|
62
62
|
</svg>
|
|
63
63
|
)
|
|
64
64
|
break
|
|
65
|
+
case EXTRA_MEDIUM:
|
|
66
|
+
icon = (
|
|
67
|
+
<svg
|
|
68
|
+
width={32}
|
|
69
|
+
height={32}
|
|
70
|
+
viewBox='0 0 32 32'
|
|
71
|
+
fill='none'
|
|
72
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
73
|
+
className={className}
|
|
74
|
+
>
|
|
75
|
+
<path d='M22 5.99951H25C25.5523 5.99951 26 6.44723 26 6.99951V26.9995C26 27.5518 25.5523 27.9995 25 27.9995H7C6.44772 27.9995 6 27.5518 6 26.9995V6.99951C6 6.44723 6.44772 5.99951 7 5.99951H10' stroke='none' strokeWidth={1.5} />
|
|
76
|
+
<rect x='10' y='3.99951' width='12' height='4' rx='1' stroke='none' strokeWidth={1.5} />
|
|
77
|
+
<path d='M18 13.9995L22 13.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
78
|
+
<path d='M18 23.9995L22 23.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
79
|
+
<path d='M10 12.9995L12 14.9995L15 11.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
80
|
+
<path d='M18 18.9995L22 18.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
81
|
+
<path d='M10 17.9995L12 19.9995L15 16.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
82
|
+
<path d='M10 22.9995L12 24.9995L15 21.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
83
|
+
</svg>
|
|
84
|
+
)
|
|
85
|
+
break
|
|
65
86
|
case LARGE:
|
|
66
87
|
icon = (
|
|
67
88
|
<svg
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const CodeTestingIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -30,7 +30,6 @@ const CodeTestingIcon = ({
|
|
|
30
30
|
xmlns='http://www.w3.org/2000/svg'
|
|
31
31
|
className={className}
|
|
32
32
|
>
|
|
33
|
-
|
|
34
33
|
<path d='M6.5 11H3C2.44772 11 2 10.5523 2 10V3C2 2.44772 2.44772 2 3 2H10C10.5523 2 11 2.44772 11 3V5.5' stroke='none' strokeLinecap='round' />
|
|
35
34
|
<path d='M2 4.25H11' stroke='none' />
|
|
36
35
|
<circle cx='3.125' cy='3.125' r='0.375' fill='none' className={filledClassName} />
|
|
@@ -40,7 +39,6 @@ const CodeTestingIcon = ({
|
|
|
40
39
|
<path d='M4.25 7.25H7.5' stroke='none' strokeLinecap='round' />
|
|
41
40
|
<path d='M4.25 8.75H6.5' stroke='none' strokeLinecap='round' />
|
|
42
41
|
<path d='M12.3639 11.6957C13.0262 11.2197 13.4545 10.4621 13.4545 9.6087C13.4545 8.16795 12.2335 7 10.7273 7C9.22104 7 8 8.16795 8 9.6087C8 11.0494 9.22104 12.2174 10.7273 12.2174C11.3414 12.2174 11.908 12.0233 12.3639 11.6957ZM12.3639 11.6957L14 13.7826' stroke='none' strokeLinecap='round' />
|
|
43
|
-
|
|
44
42
|
</svg>
|
|
45
43
|
)
|
|
46
44
|
break
|
|
@@ -63,6 +61,28 @@ const CodeTestingIcon = ({
|
|
|
63
61
|
<path d='M6.375 10.875H11.25' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
64
62
|
<path d='M6.375 13.125H9.75' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
65
63
|
<path d='M18.5459 17.5435C19.5393 16.8296 20.1818 15.6931 20.1818 14.413C20.1818 12.2519 18.3503 10.5 16.0909 10.5C13.8316 10.5 12 12.2519 12 14.413C12 16.5742 13.8316 18.3261 16.0909 18.3261C17.012 18.3261 17.8621 18.0349 18.5459 17.5435ZM18.5459 17.5435L21 20.6739' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
64
|
+
</svg>
|
|
65
|
+
)
|
|
66
|
+
break
|
|
67
|
+
case EXTRA_MEDIUM:
|
|
68
|
+
icon = (
|
|
69
|
+
<svg
|
|
70
|
+
width={32}
|
|
71
|
+
height={32}
|
|
72
|
+
viewBox='0 0 32 32'
|
|
73
|
+
fill='none'
|
|
74
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
75
|
+
className={className}
|
|
76
|
+
>
|
|
77
|
+
<path d='M13 21.9995H5C4.44772 21.9995 4 21.5518 4 20.9995V4.99951C4 4.44723 4.44772 3.99951 5 3.99951H21C21.5523 3.99951 22 4.44723 22 4.99951V10.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
78
|
+
<path d='M4 8.49951H22' stroke='none' strokeWidth={1.5} />
|
|
79
|
+
<circle cx='6.25' cy='6.24951' r='0.75' fill='none' className={filledClassName} />
|
|
80
|
+
<circle cx='8.5' cy='6.24951' r='0.75' fill='none' className={filledClassName} />
|
|
81
|
+
<circle cx='10.75' cy='6.24951' r='0.75' fill='none' className={filledClassName} />
|
|
82
|
+
<path d='M7 11.4995H14.5' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
83
|
+
<path d='M8.5 14.4995H15' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
84
|
+
<path d='M8.5 17.4995H13' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
85
|
+
<path d='M24.7278 23.3908C26.0524 22.4389 26.9091 20.9236 26.9091 19.2169C26.9091 16.3354 24.467 13.9995 21.4545 13.9995C18.4421 13.9995 16 16.3354 16 19.2169C16 22.0984 18.4421 24.4343 21.4545 24.4343C22.6827 24.4343 23.8161 24.046 24.7278 23.3908ZM24.7278 23.3908L28 27.5647' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
66
86
|
|
|
67
87
|
</svg>
|
|
68
88
|
)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const DeploymentHistoryIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -66,6 +66,29 @@ const DeploymentHistoryIcon = ({
|
|
|
66
66
|
</svg>
|
|
67
67
|
)
|
|
68
68
|
break
|
|
69
|
+
case EXTRA_MEDIUM:
|
|
70
|
+
icon = (
|
|
71
|
+
<svg
|
|
72
|
+
width={32}
|
|
73
|
+
height={32}
|
|
74
|
+
viewBox='0 0 32 32'
|
|
75
|
+
fill='none'
|
|
76
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
77
|
+
className={className}
|
|
78
|
+
>
|
|
79
|
+
<rect x='14' y='12' width='14' height='14' rx='1' stroke='none' strokeWidth={1.5} />
|
|
80
|
+
<path d='M20 16H25' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
81
|
+
<path d='M20 19H25' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
82
|
+
<path d='M20 22H25' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
83
|
+
<path d='M14.5642 10L14.5642 9.66979C14.5642 9.47499 14.5073 9.28443 14.4005 9.12151L11.461 4.63781C11.2635 4.33666 10.8221 4.33666 10.6247 4.63781L7.68516 9.12151C7.57836 9.28443 7.52146 9.47505 7.52146 9.66985C7.52146 12.6583 7.52146 13.6376 7.52146 14.071L4 18.2673L8.22565 18.2673L8.92992 19.9458L11.4537 19.9458' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
84
|
+
<path d='M7.521 22.4644L7.521 25.8214' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='bevel' />
|
|
85
|
+
<path d='M11.0444 24.1431L11.0444 27.5001' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='bevel' />
|
|
86
|
+
<circle cx='17' cy='16' r='1' fill='none' className={filledClassName} />
|
|
87
|
+
<circle cx='17' cy='19' r='1' fill='none' className={filledClassName} />
|
|
88
|
+
<circle cx='17' cy='22' r='1' fill='none' className={filledClassName} />
|
|
89
|
+
</svg>
|
|
90
|
+
)
|
|
91
|
+
break
|
|
69
92
|
case LARGE:
|
|
70
93
|
icon = (
|
|
71
94
|
<svg
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
import * as React from 'react'
|
|
2
|
+
import PropTypes from 'prop-types'
|
|
3
|
+
import styles from './Icons.module.css'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
5
|
+
|
|
6
|
+
const DownloadIcon = ({
|
|
7
|
+
color = MAIN_DARK_BLUE,
|
|
8
|
+
size = MEDIUM,
|
|
9
|
+
disabled = false,
|
|
10
|
+
inactive = false
|
|
11
|
+
}) => {
|
|
12
|
+
let className = `${styles.svgClassName} ` + styles[`${color}`]
|
|
13
|
+
if (disabled) {
|
|
14
|
+
className += ` ${styles.iconDisabled}`
|
|
15
|
+
}
|
|
16
|
+
if (inactive) {
|
|
17
|
+
className += ` ${styles.iconInactive}`
|
|
18
|
+
}
|
|
19
|
+
let icon = <></>
|
|
20
|
+
|
|
21
|
+
switch (size) {
|
|
22
|
+
case SMALL:
|
|
23
|
+
icon = (
|
|
24
|
+
<svg
|
|
25
|
+
width={16}
|
|
26
|
+
height={16}
|
|
27
|
+
viewBox='0 0 16 16'
|
|
28
|
+
fill='none'
|
|
29
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
30
|
+
className={className}
|
|
31
|
+
>
|
|
32
|
+
<path d='M8 12L12 8M8 12L4 8M8 12V2.5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
33
|
+
<path d='M14 12V14H2V12' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
34
|
+
</svg>
|
|
35
|
+
)
|
|
36
|
+
break
|
|
37
|
+
case MEDIUM:
|
|
38
|
+
icon = (
|
|
39
|
+
<svg
|
|
40
|
+
width={24}
|
|
41
|
+
height={24}
|
|
42
|
+
viewBox='0 0 24 24'
|
|
43
|
+
fill='none'
|
|
44
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
45
|
+
className={className}
|
|
46
|
+
>
|
|
47
|
+
<path d='M12 18L18 12M12 18L6 12M12 18V3.75' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
48
|
+
<path d='M21 18V21H3V18' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
49
|
+
</svg>
|
|
50
|
+
)
|
|
51
|
+
break
|
|
52
|
+
case LARGE:
|
|
53
|
+
icon = (
|
|
54
|
+
<svg
|
|
55
|
+
width={40}
|
|
56
|
+
height={40}
|
|
57
|
+
viewBox='0 0 40 40'
|
|
58
|
+
fill='none'
|
|
59
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
60
|
+
className={className}
|
|
61
|
+
>
|
|
62
|
+
<path d='M20 30L30 20M20 30L10 20M20 30V6.25' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
63
|
+
<path d='M35 30V35H5V30' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
64
|
+
</svg>
|
|
65
|
+
)
|
|
66
|
+
break
|
|
67
|
+
|
|
68
|
+
default:
|
|
69
|
+
break
|
|
70
|
+
}
|
|
71
|
+
return icon
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
DownloadIcon.propTypes = {
|
|
75
|
+
/**
|
|
76
|
+
* color of text, icon and borders
|
|
77
|
+
*/
|
|
78
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
79
|
+
/**
|
|
80
|
+
* Size
|
|
81
|
+
*/
|
|
82
|
+
size: PropTypes.oneOf(SIZES),
|
|
83
|
+
/**
|
|
84
|
+
* disabled
|
|
85
|
+
*/
|
|
86
|
+
disabled: PropTypes.bool,
|
|
87
|
+
/**
|
|
88
|
+
* inactive
|
|
89
|
+
*/
|
|
90
|
+
inactive: PropTypes.bool
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
export default DownloadIcon
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const GearIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -49,6 +49,22 @@ const GearIcon = ({
|
|
|
49
49
|
</svg>
|
|
50
50
|
)
|
|
51
51
|
break
|
|
52
|
+
case EXTRA_MEDIUM:
|
|
53
|
+
icon = (
|
|
54
|
+
<svg
|
|
55
|
+
width={32}
|
|
56
|
+
height={32}
|
|
57
|
+
viewBox='0 0 32 32'
|
|
58
|
+
fill='none'
|
|
59
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
60
|
+
className={className}
|
|
61
|
+
>
|
|
62
|
+
<path d='M16.0016 20.6575C18.511 20.6575 20.5452 18.6574 20.5452 16.1901C20.5452 13.7228 18.511 11.7227 16.0016 11.7227C13.4922 11.7227 11.458 13.7228 11.458 16.1901C11.458 18.6574 13.4922 20.6575 16.0016 20.6575Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
63
|
+
<path d='M18.4391 4.69606V6.21219C18.4391 6.50074 18.6219 6.76144 18.8974 6.86269L20.8641 7.59418C21.1318 7.69289 21.4356 7.62455 21.6312 7.417L22.576 6.41974C22.854 6.12613 23.3277 6.1236 23.6083 6.41721L25.8891 8.79139C26.1439 9.05716 26.1465 9.46973 25.8968 9.73803L24.6818 11.0491C24.4887 11.2567 24.4423 11.5579 24.5633 11.811L25.3871 13.5575C25.503 13.803 25.7552 13.9625 26.0307 13.9625H27.2921C27.6834 13.9625 28 14.2738 28 14.6585V17.5895C28 17.9743 27.6834 18.2856 27.2921 18.2856H25.9663C25.66 18.2856 25.3871 18.4805 25.2919 18.7665L24.6225 20.7838C24.5427 21.0217 24.5994 21.2824 24.7719 21.4672L25.8608 22.6492C26.1259 22.9378 26.1002 23.3858 25.8016 23.6414L23.2916 25.8005C23.0033 26.0485 22.5657 26.0257 22.3057 25.7498L21.4304 24.8235C21.2399 24.621 20.9439 24.5476 20.6788 24.6387L18.851 25.2664C18.5653 25.3651 18.3748 25.6283 18.3748 25.9245V27.3039C18.3748 27.6887 18.0581 28 17.6668 28H14.3306C13.9393 28 13.6227 27.6887 13.6227 27.3039V25.9245C13.6227 25.6283 13.4322 25.3651 13.1464 25.2664L11.3187 24.6387C11.0535 24.5476 10.7575 24.6184 10.567 24.8235L9.69173 25.7498C9.43173 26.0257 8.9941 26.0485 8.70578 25.8005L6.19586 23.6414C5.89724 23.3858 5.8715 22.9378 6.13665 22.6492L7.22557 21.4672C7.39547 21.2824 7.45211 21.0217 7.37488 20.7838L6.70557 18.7665C6.61032 18.4805 6.33745 18.2856 6.03111 18.2856H4.70793C4.31664 18.2856 4 17.9743 4 17.5895V14.6585C4 14.2738 4.31664 13.9625 4.70793 13.9625H5.96932C6.24477 13.9625 6.49705 13.8055 6.61289 13.5575L7.43666 11.811C7.55765 11.5554 7.50874 11.2567 7.31825 11.0491L6.10319 9.73803C5.85348 9.46973 5.85605 9.05463 6.11091 8.79139L8.39172 6.41721C8.67232 6.12613 9.14598 6.12613 9.42401 6.41974L10.3688 7.417C10.5644 7.62455 10.8682 7.69289 11.1359 7.59418L13.1026 6.86269C13.3781 6.76144 13.5609 6.50074 13.5609 6.21219V4.69606C13.5609 4.31133 13.8775 4 14.2688 4H17.7312C18.1225 4 18.4391 4.31133 18.4391 4.69606Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
64
|
+
|
|
65
|
+
</svg>
|
|
66
|
+
)
|
|
67
|
+
break
|
|
52
68
|
case LARGE:
|
|
53
69
|
icon = (
|
|
54
70
|
<svg
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const InfrastructureIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -66,6 +66,29 @@ const InfrastructureIcon = ({
|
|
|
66
66
|
</svg>
|
|
67
67
|
)
|
|
68
68
|
break
|
|
69
|
+
case EXTRA_MEDIUM:
|
|
70
|
+
icon = (
|
|
71
|
+
<svg
|
|
72
|
+
width={32}
|
|
73
|
+
height={32}
|
|
74
|
+
viewBox='0 0 32 32'
|
|
75
|
+
fill='none'
|
|
76
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
77
|
+
className={className}
|
|
78
|
+
>
|
|
79
|
+
<path d='M7 11.9995H16M16 11.9995V5.99951M16 11.9995L26 20.9995M5 20.9995L15 19.9995L26 10.9995' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
80
|
+
<path d='M5.83252 10.8414V21.2964L16.0006 26.5232L26.1671 21.2964V10.8414L16.0006 5.61328L5.83252 10.8414Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
81
|
+
<path d='M16.1 7.19951C16.9837 7.19951 17.7 6.48317 17.7 5.59951C17.7 4.71586 16.9837 3.99951 16.1 3.99951C15.2163 3.99951 14.5 4.71586 14.5 5.59951C14.5 6.48317 15.2163 7.19951 16.1 7.19951Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
82
|
+
<path d='M16.1 13.1995C16.9837 13.1995 17.7 12.4832 17.7 11.5995C17.7 10.7159 16.9837 9.99951 16.1 9.99951C15.2163 9.99951 14.5 10.7159 14.5 11.5995C14.5 12.4832 15.2163 13.1995 16.1 13.1995Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
83
|
+
<path d='M16.1 21.1995C16.9837 21.1995 17.7 20.4832 17.7 19.5995C17.7 18.7159 16.9837 17.9995 16.1 17.9995C15.2163 17.9995 14.5 18.7159 14.5 19.5995C14.5 20.4832 15.2163 21.1995 16.1 21.1995Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
84
|
+
<path d='M5.62148 12.3816C6.50514 12.3816 7.22148 11.6653 7.22148 10.7816C7.22148 9.89798 6.50514 9.18164 5.62148 9.18164C4.73783 9.18164 4.02148 9.89798 4.02148 10.7816C4.02148 11.6653 4.73783 12.3816 5.62148 12.3816Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
85
|
+
<path d='M25.9545 12.3816C26.8381 12.3816 27.5545 11.6653 27.5545 10.7816C27.5545 9.89798 26.8381 9.18164 25.9545 9.18164C25.0708 9.18164 24.3545 9.89798 24.3545 10.7816C24.3545 11.6653 25.0708 12.3816 25.9545 12.3816Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
86
|
+
<path d='M16.1426 27.9548C17.0262 27.9454 17.7329 27.2216 17.7211 26.338C17.7094 25.4544 16.9835 24.7457 16.0999 24.7551C15.2163 24.7644 14.5095 25.4883 14.5213 26.3718C14.5331 27.2554 15.2589 27.9641 16.1426 27.9548Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
87
|
+
<path d='M25.9756 22.7731C26.8592 22.7638 27.5659 22.0399 27.5542 21.1564C27.5424 20.2728 26.8165 19.5641 25.9329 19.5734C25.0493 19.5828 24.3426 20.3066 24.3543 21.1902C24.3661 22.0738 25.092 22.7825 25.9756 22.7731Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
88
|
+
<path d='M5.64255 22.7741C6.52616 22.7648 7.23292 22.0409 7.22114 21.1573C7.20937 20.2738 6.48352 19.5651 5.59991 19.5744C4.7163 19.5837 4.00955 20.3076 4.02132 21.1912C4.0331 22.0747 4.75895 22.7835 5.64255 22.7741Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
89
|
+
</svg>
|
|
90
|
+
)
|
|
91
|
+
break
|
|
69
92
|
case LARGE:
|
|
70
93
|
icon = (
|
|
71
94
|
<svg
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const MetricsLogsIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -70,6 +70,31 @@ const MetricsLogsIcon = ({
|
|
|
70
70
|
</svg>
|
|
71
71
|
)
|
|
72
72
|
break
|
|
73
|
+
case EXTRA_MEDIUM:
|
|
74
|
+
icon = (
|
|
75
|
+
<svg
|
|
76
|
+
width={32}
|
|
77
|
+
height={32}
|
|
78
|
+
viewBox='0 0 32 32'
|
|
79
|
+
fill='none'
|
|
80
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
81
|
+
className={className}
|
|
82
|
+
>
|
|
83
|
+
<rect x='7.81836' y='9.68408' width='3.81819' height='13.2632' rx='0.5' stroke='none' strokeWidth={1.5} />
|
|
84
|
+
<path d='M15.4541 11.5788V6.39453C15.4541 6.11839 15.678 5.89453 15.9541 5.89453H18.7723C19.0484 5.89453 19.2723 6.11839 19.2723 6.39453V11.5788' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
85
|
+
<path d='M23.1818 11L23.0974 4.5065C23.0938 4.22784 23.3187 4 23.5974 4H26.4153C26.6889 4 26.9117 4.21991 26.9153 4.49349L27 11' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
86
|
+
<path d='M4 4V26.7369H11' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
87
|
+
<rect x='14' y='14' width='14' height='14' rx='1' stroke='none' strokeWidth={1.5} />
|
|
88
|
+
<path d='M14 17.5H28' stroke='none' strokeWidth={1.5} />
|
|
89
|
+
<circle cx='15.7498' cy='15.7498' r='0.583333' fill='none' className={filledClassName} />
|
|
90
|
+
<ellipse cx='17.4998' cy='15.7498' rx='0.583334' ry='0.583333' fill='none' className={filledClassName} />
|
|
91
|
+
<ellipse cx='19.2498' cy='15.7498' rx='0.583334' ry='0.583333' fill='none' className={filledClassName} />
|
|
92
|
+
<path d='M16.3335 19.8335H22.1668' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
93
|
+
<path d='M17.5 22.1665H25.6667' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
94
|
+
<path d='M17.5 24.5H25.6667' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
95
|
+
</svg>
|
|
96
|
+
)
|
|
97
|
+
break
|
|
73
98
|
case LARGE:
|
|
74
99
|
icon = (
|
|
75
100
|
<svg
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
2
|
import PropTypes from 'prop-types'
|
|
3
3
|
import styles from './Icons.module.css'
|
|
4
|
-
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
4
|
+
import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE, EXTRA_MEDIUM } from '../constants'
|
|
5
5
|
|
|
6
6
|
const PlatformaticServiceIcon = ({
|
|
7
7
|
color = MAIN_DARK_BLUE,
|
|
@@ -34,7 +34,6 @@ const PlatformaticServiceIcon = ({
|
|
|
34
34
|
<path d='M4 5.09668H2V11.2902H11.6V11.1289' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
35
35
|
<rect x='5.2002' y='11.2903' width='3.2' height='1.54839' stroke='none' />
|
|
36
36
|
<path d='M3.6001 12.8386H10.0001V13.9999H3.6001V12.8386Z' stroke='none' strokeLinejoin='round' />
|
|
37
|
-
|
|
38
37
|
</svg>
|
|
39
38
|
)
|
|
40
39
|
break
|
|
@@ -53,7 +52,24 @@ const PlatformaticServiceIcon = ({
|
|
|
53
52
|
<path d='M6 7.64502H3V16.9353H17.4V16.6934' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
54
53
|
<rect x='7.7998' y='16.9353' width='4.8' height='2.32258' stroke='none' strokeWidth={1.5} />
|
|
55
54
|
<path d='M5.3999 19.2578H14.9999V20.9997H5.3999V19.2578Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
56
|
-
|
|
55
|
+
</svg>
|
|
56
|
+
)
|
|
57
|
+
break
|
|
58
|
+
case EXTRA_MEDIUM:
|
|
59
|
+
icon = (
|
|
60
|
+
<svg
|
|
61
|
+
width={32}
|
|
62
|
+
height={32}
|
|
63
|
+
viewBox='0 0 32 32'
|
|
64
|
+
fill='none'
|
|
65
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
66
|
+
className={className}
|
|
67
|
+
>
|
|
68
|
+
<path d='M21.6261 4.44907V5.42722C21.6261 5.61338 21.7479 5.78158 21.9316 5.8469L23.2427 6.31883C23.4212 6.38251 23.6237 6.33842 23.7542 6.20452L24.384 5.56112C24.5693 5.3717 24.8851 5.37007 25.0722 5.55949L26.5927 7.09122C26.7626 7.26268 26.7643 7.52886 26.5979 7.70196L25.7878 8.54784C25.6591 8.68174 25.6282 8.87606 25.7089 9.03936L26.2581 10.1661C26.3353 10.3245 26.5035 10.4274 26.6871 10.4274H27.528C27.7889 10.4274 28 10.6282 28 10.8765V12.7674C28 13.0157 27.7889 13.2165 27.528 13.2165H26.6442C26.44 13.2165 26.2581 13.3423 26.1946 13.5268L25.7484 14.8283C25.6952 14.9818 25.7329 15.15 25.8479 15.2692L26.5738 16.0318C26.7506 16.2179 26.7335 16.507 26.5344 16.6719L24.8611 18.0648C24.6689 18.2248 24.3771 18.2102 24.2038 18.0322L23.6203 17.4345C23.4933 17.3039 23.2959 17.2565 23.1192 17.3153L21.9007 17.7203C21.7102 17.7839 21.5832 17.9538 21.5832 18.1448V19.0348C21.5832 19.283 21.3721 19.4839 21.1112 19.4839H18.8871C18.6262 19.4839 18.4151 19.283 18.4151 19.0348V18.1448C18.4151 17.9538 18.2881 17.7839 18.0976 17.7203L16.8791 17.3153C16.7023 17.2565 16.505 17.3022 16.378 17.4345L15.7945 18.0322C15.6212 18.2102 15.3294 18.2248 15.1372 18.0648L13.4639 16.6719C13.2648 16.507 13.2477 16.2179 13.4244 16.0318L14.1504 15.2692C14.2636 15.15 14.3014 14.9818 14.2499 14.8283L13.8037 13.5268C13.7402 13.3423 13.5583 13.2165 13.3541 13.2165H12.472C12.2111 13.2165 12 13.0157 12 12.7674V10.8765C12 10.6282 12.2111 10.4274 12.472 10.4274H13.3129C13.4965 10.4274 13.6647 10.3261 13.7419 10.1661L14.2911 9.03936C14.3718 8.87443 14.3392 8.68174 14.2122 8.54784L13.4021 7.70196C13.2357 7.52886 13.2374 7.26105 13.4073 7.09122L14.9278 5.55949C15.1149 5.3717 15.4307 5.3717 15.616 5.56112L16.2458 6.20452C16.3763 6.33842 16.5788 6.38251 16.7573 6.31883L18.0684 5.8469C18.2521 5.78158 18.3739 5.61338 18.3739 5.42722V4.44907C18.3739 4.20086 18.585 4 18.8459 4H21.1541C21.415 4 21.6261 4.20086 21.6261 4.44907Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
69
|
+
<path d='M23 14H17L20 8L23 14Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
70
|
+
<path d='M8 10.1934H4V22.5805H23.2V22.2579' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
71
|
+
<rect x='10.3999' y='22.5806' width='6.4' height='3.09677' stroke='none' strokeWidth={1.5} />
|
|
72
|
+
<path d='M7.2002 25.6772H20.0002V27.9998H7.2002V25.6772Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
57
73
|
</svg>
|
|
58
74
|
)
|
|
59
75
|
break
|