@platformatic/ui-components 0.7.2 → 0.7.3
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-DbI83KVc.js → index-D5dGmVAb.js} +10 -10
- package/dist/index.html +1 -1
- package/package.json +1 -1
- package/src/components/icons/HorizontalPodAutoscalerIcon.jsx +96 -0
- package/src/components/icons/PodMetricsIcon.jsx +101 -0
- package/src/components/icons/PodPerformanceIcon.jsx +103 -0
- package/src/components/icons/ScalerDetailsIcon.jsx +99 -0
- package/src/components/icons/ScalerHistoryIcon.jsx +102 -0
- package/src/components/icons/index.js +10 -0
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-D5dGmVAb.js"></script>
|
|
8
8
|
<link rel="stylesheet" crossorigin href="/assets/index-BUMVjZ-U.css">
|
|
9
9
|
</head>
|
|
10
10
|
<body>
|
package/package.json
CHANGED
|
@@ -0,0 +1,96 @@
|
|
|
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 HorizontalPodAutoscalerIcon = ({
|
|
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='M7.99996 5L5.21537 6.60769V9.82306L7.99996 11.4307L10.7846 9.82306V6.60769L7.99996 5Z' stroke='none' strokeLinejoin='round' />
|
|
33
|
+
<path d='M11.2154 5L14 6.60769V9.82306L11.2154 11.4307' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
34
|
+
<path d='M4.78467 5L2.00008 6.60769V9.82306L4.78467 11.4307' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
35
|
+
</svg>
|
|
36
|
+
)
|
|
37
|
+
break
|
|
38
|
+
case MEDIUM:
|
|
39
|
+
icon = (
|
|
40
|
+
<svg
|
|
41
|
+
width={24}
|
|
42
|
+
height={24}
|
|
43
|
+
viewBox='0 0 24 24'
|
|
44
|
+
fill='none'
|
|
45
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
46
|
+
className={className}
|
|
47
|
+
>
|
|
48
|
+
<path d='M12.0002 7.5L7.8233 9.91153V14.7346L12.0002 17.1461L16.1771 14.7346V9.91153L12.0002 7.5Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
49
|
+
<path d='M16.8231 7.5L21 9.91153V14.7346L16.8231 17.1461' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
50
|
+
<path d='M7.17676 7.5L2.99987 9.91153V14.7346L7.17676 17.1461' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
</svg>
|
|
52
|
+
)
|
|
53
|
+
break
|
|
54
|
+
case LARGE:
|
|
55
|
+
icon = (
|
|
56
|
+
<svg
|
|
57
|
+
width={40}
|
|
58
|
+
height={40}
|
|
59
|
+
viewBox='0 0 40 40'
|
|
60
|
+
fill='none'
|
|
61
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
62
|
+
className={className}
|
|
63
|
+
>
|
|
64
|
+
<path d='M20.0001 12.5L13.0387 16.5192V24.5576L20.0001 28.5769L26.9616 24.5576V16.5192L20.0001 12.5Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
|
|
65
|
+
<path d='M28.0385 12.5L35 16.5192V24.5576L28.0385 28.5769' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
66
|
+
<path d='M11.9614 12.5L4.99995 16.5192V24.5576L11.9614 28.5769' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
67
|
+
</svg>
|
|
68
|
+
)
|
|
69
|
+
break
|
|
70
|
+
|
|
71
|
+
default:
|
|
72
|
+
break
|
|
73
|
+
}
|
|
74
|
+
return icon
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
HorizontalPodAutoscalerIcon.propTypes = {
|
|
78
|
+
/**
|
|
79
|
+
* color of text, icon and borders
|
|
80
|
+
*/
|
|
81
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
82
|
+
/**
|
|
83
|
+
* Size
|
|
84
|
+
*/
|
|
85
|
+
size: PropTypes.oneOf(SIZES),
|
|
86
|
+
/**
|
|
87
|
+
* disabled
|
|
88
|
+
*/
|
|
89
|
+
disabled: PropTypes.bool,
|
|
90
|
+
/**
|
|
91
|
+
* inactive
|
|
92
|
+
*/
|
|
93
|
+
inactive: PropTypes.bool
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
export default HorizontalPodAutoscalerIcon
|
|
@@ -0,0 +1,101 @@
|
|
|
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 PodMetricsIcon = ({
|
|
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='M5.5 7H4.5C4.22386 7 4 7.22386 4 7.5V12C4 12.2761 4.22386 12.5 4.5 12.5H5.5C5.77614 12.5 6 12.2761 6 12V7.5C6 7.22386 5.77614 7 5.5 7Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
33
|
+
<path d='M10 6.5V4.5C10 4.22386 9.77614 4 9.5 4H8.5C8.22386 4 8 4.22386 8 4.5V8' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
34
|
+
<path d='M12 6.5V2.5C12 2.22386 12.2239 2 12.5 2H13.5C13.7761 2 14 2.22386 14 2.5V8' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
35
|
+
<path d='M2 2V14H8' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
36
|
+
<path d='M11 8L8.40192 9.5V12.5L11 14L13.5981 12.5V9.5L11 8Z' stroke='none' strokeLinejoin='round' />
|
|
37
|
+
</svg>
|
|
38
|
+
)
|
|
39
|
+
break
|
|
40
|
+
case MEDIUM:
|
|
41
|
+
icon = (
|
|
42
|
+
<svg
|
|
43
|
+
width={24}
|
|
44
|
+
height={24}
|
|
45
|
+
viewBox='0 0 24 24'
|
|
46
|
+
fill='none'
|
|
47
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
48
|
+
className={className}
|
|
49
|
+
>
|
|
50
|
+
<path d='M8.5 10.5H6.5C6.22386 10.5 6 10.7239 6 11V18.25C6 18.5261 6.22386 18.75 6.5 18.75H8.5C8.77614 18.75 9 18.5261 9 18.25V11C9 10.7239 8.77614 10.5 8.5 10.5Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
<path d='M15 9.75V6.5C15 6.22386 14.7761 6 14.5 6H12.5C12.2239 6 12 6.22386 12 6.5V12' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
52
|
+
<path d='M18 9.75V3.5C18 3.22386 18.2239 3 18.5 3H20.5C20.7761 3 21 3.22386 21 3.5V12' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
53
|
+
<path d='M3 3V21H12' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
54
|
+
<path d='M16.5 12L12.6029 14.25V18.75L16.5 21L20.3971 18.75V14.25L16.5 12Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
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
|
+
><path d='M14.5 17.5H10.5C10.2239 17.5 10 17.7239 10 18V30.75C10 31.0261 10.2239 31.25 10.5 31.25H14.5C14.7761 31.25 15 31.0261 15 30.75V18C15 17.7239 14.7761 17.5 14.5 17.5Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
68
|
+
<path d='M25 16.25V10.5C25 10.2239 24.7761 10 24.5 10H20.5C20.2239 10 20 10.2239 20 10.5V20' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
69
|
+
<path d='M30 16.25V5.5C30 5.22386 30.2239 5 30.5 5H34.5C34.7761 5 35 5.22386 35 5.5V20' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
70
|
+
<path d='M5 5V35H20' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
71
|
+
<path d='M27.5 20L21.0048 23.75V31.25L27.5 35L33.9952 31.25V23.75L27.5 20Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
|
|
72
|
+
</svg>
|
|
73
|
+
)
|
|
74
|
+
break
|
|
75
|
+
|
|
76
|
+
default:
|
|
77
|
+
break
|
|
78
|
+
}
|
|
79
|
+
return icon
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
PodMetricsIcon.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
|
+
* disabled
|
|
93
|
+
*/
|
|
94
|
+
disabled: PropTypes.bool,
|
|
95
|
+
/**
|
|
96
|
+
* inactive
|
|
97
|
+
*/
|
|
98
|
+
inactive: PropTypes.bool
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
export default PodMetricsIcon
|
|
@@ -0,0 +1,103 @@
|
|
|
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 PodPerformanceIcon = ({
|
|
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
|
+
><path d='M7.06325 14C4.26689 14 2 11.727 2 8.92311C2 6.11921 4.26689 3.84619 7.06325 3.84619C9.46576 3.84619 11.4775 5.52403 11.9965 7.77486' stroke='none' strokeLinecap='round' />
|
|
32
|
+
<path d='M7.06286 3.84615V2M5.22168 2H8.90404' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
33
|
+
<path d='M10.9837 5.02751L11.642 4.38226M10.9985 3.72217L12.2856 5.04235' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
34
|
+
<path d='M3.33446 5.09739L2.69392 4.43439M2.03271 5.07666L3.35514 3.79212' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
35
|
+
<path d='M8.67407 6.61512L7.06295 9.38435' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
36
|
+
<path d='M10.5 9L8.33494 10.25V12.75L10.5 14L12.6651 12.75V10.25L10.5 9Z' stroke='none' strokeLinejoin='round' />
|
|
37
|
+
</svg>
|
|
38
|
+
)
|
|
39
|
+
break
|
|
40
|
+
case MEDIUM:
|
|
41
|
+
icon = (
|
|
42
|
+
<svg
|
|
43
|
+
width={24}
|
|
44
|
+
height={24}
|
|
45
|
+
viewBox='0 0 24 24'
|
|
46
|
+
fill='none'
|
|
47
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
48
|
+
className={className}
|
|
49
|
+
><path d='M10.5949 21.0001C6.40034 21.0001 3 17.5905 3 13.3847C3 9.17881 6.40034 5.76929 10.5949 5.76929C14.1986 5.76929 17.2162 8.28604 17.9947 11.6623' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
50
|
+
<path d='M10.5943 5.76923V3M7.83252 3H13.3561' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
<path d='M16.4754 7.54127L17.4628 6.57339M16.4976 5.58325L18.4281 7.56353' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
52
|
+
<path d='M5.00145 7.64608L4.04064 6.65159M3.04883 7.61499L5.03246 5.68819' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
53
|
+
<path d='M13.0114 9.9228L10.5947 14.0767' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
54
|
+
<path d='M15.75 13.5L12.5024 15.375V19.125L15.75 21L18.9976 19.125V15.375L15.75 13.5Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
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
|
+
>
|
|
68
|
+
<path d='M17.6581 35.0001C10.6672 35.0001 5 29.3176 5 22.3078C5 15.298 10.6672 9.61548 17.6581 9.61548C23.6644 9.61548 28.6936 13.8101 29.9911 19.4372' stroke='none' strokeWidth={2} strokeLinecap='round' />
|
|
69
|
+
<path d='M17.6576 9.61538V5M13.0547 5H22.2606' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
70
|
+
<path d='M27.4591 12.5688L29.1049 10.9556M27.4961 9.30542L30.7137 12.6059' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
71
|
+
<path d='M8.33591 12.7435L6.73457 11.086M5.08154 12.6917L8.38759 9.48031' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
72
|
+
<path d='M21.6859 16.5379L17.6581 23.461' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
73
|
+
<path d='M26.25 22.5L20.8373 25.625V31.875L26.25 35L31.6627 31.875V25.625L26.25 22.5Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
|
|
74
|
+
</svg>
|
|
75
|
+
)
|
|
76
|
+
break
|
|
77
|
+
|
|
78
|
+
default:
|
|
79
|
+
break
|
|
80
|
+
}
|
|
81
|
+
return icon
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
PodPerformanceIcon.propTypes = {
|
|
85
|
+
/**
|
|
86
|
+
* color of text, icon and borders
|
|
87
|
+
*/
|
|
88
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
89
|
+
/**
|
|
90
|
+
* Size
|
|
91
|
+
*/
|
|
92
|
+
size: PropTypes.oneOf(SIZES),
|
|
93
|
+
/**
|
|
94
|
+
* disabled
|
|
95
|
+
*/
|
|
96
|
+
disabled: PropTypes.bool,
|
|
97
|
+
/**
|
|
98
|
+
* inactive
|
|
99
|
+
*/
|
|
100
|
+
inactive: PropTypes.bool
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
export default PodPerformanceIcon
|
|
@@ -0,0 +1,99 @@
|
|
|
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 ScalerDetailsIcon = ({
|
|
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
|
+
><path d='M10.7847 5.5V3.60769L8.00008 2L5.21548 3.60769V6.82306L6.21865 7.40224' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
32
|
+
<circle cx='9.91667' cy='9.91667' r='2.91667' stroke='none' />
|
|
33
|
+
<path d='M14 14L12.25 12.25' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
34
|
+
<path d='M11.2154 2L14 3.60769V6.82306L13.3039 7.22498' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
35
|
+
<path d='M4.78467 2L2.00008 3.60769V6.82306L4.78467 8.43074' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
36
|
+
</svg>
|
|
37
|
+
)
|
|
38
|
+
break
|
|
39
|
+
case MEDIUM:
|
|
40
|
+
icon = (
|
|
41
|
+
<svg
|
|
42
|
+
width={24}
|
|
43
|
+
height={24}
|
|
44
|
+
viewBox='0 0 24 24'
|
|
45
|
+
fill='none'
|
|
46
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
47
|
+
className={className}
|
|
48
|
+
><path d='M16.1768 8.25V5.41153L11.9999 3L7.82298 5.41153V10.2346L9.32773 11.1034' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
49
|
+
<circle cx='14.875' cy='14.875' r='4.375' stroke='none' strokeWidth={1.5} />
|
|
50
|
+
<path d='M21 21L18.375 18.375' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
<path d='M16.8231 3L21 5.41153V10.2346L19.9558 10.8375' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
52
|
+
<path d='M7.17676 3L2.99987 5.41153V10.2346L7.17676 12.6461' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
53
|
+
</svg>
|
|
54
|
+
)
|
|
55
|
+
break
|
|
56
|
+
case LARGE:
|
|
57
|
+
icon = (
|
|
58
|
+
<svg
|
|
59
|
+
width={40}
|
|
60
|
+
height={40}
|
|
61
|
+
viewBox='0 0 40 40'
|
|
62
|
+
fill='none'
|
|
63
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
64
|
+
className={className}
|
|
65
|
+
><path d='M26.9614 13.75V9.01921L19.9999 5L13.0385 9.01921V17.0576L15.5464 18.5056' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
66
|
+
<circle cx='24.7917' cy='24.7917' r='7.29167' stroke='none' strokeWidth={2} />
|
|
67
|
+
<path d='M35 35L30.625 30.625' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
68
|
+
<path d='M28.0385 5L35 9.01921V17.0576L33.2596 18.0624' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
69
|
+
<path d='M11.9614 5L4.99995 9.01921V17.0576L11.9614 21.0769' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
70
|
+
</svg>
|
|
71
|
+
)
|
|
72
|
+
break
|
|
73
|
+
|
|
74
|
+
default:
|
|
75
|
+
break
|
|
76
|
+
}
|
|
77
|
+
return icon
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
ScalerDetailsIcon.propTypes = {
|
|
81
|
+
/**
|
|
82
|
+
* color of text, icon and borders
|
|
83
|
+
*/
|
|
84
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
85
|
+
/**
|
|
86
|
+
* Size
|
|
87
|
+
*/
|
|
88
|
+
size: PropTypes.oneOf(SIZES),
|
|
89
|
+
/**
|
|
90
|
+
* disabled
|
|
91
|
+
*/
|
|
92
|
+
disabled: PropTypes.bool,
|
|
93
|
+
/**
|
|
94
|
+
* inactive
|
|
95
|
+
*/
|
|
96
|
+
inactive: PropTypes.bool
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
export default ScalerDetailsIcon
|
|
@@ -0,0 +1,102 @@
|
|
|
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 ScalerHistoryIcon = ({
|
|
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
|
+
><path d='M7.99996 7L5.21537 8.60769V11.8231L7.99996 13.4307L10.7846 11.8231V8.60769L7.99996 7Z' stroke='none' strokeLinejoin='round' />
|
|
32
|
+
<path d='M11.2154 7L14 8.60769V11.8231L11.2154 13.4307' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
33
|
+
<path d='M10 6.8V3C10 2.44772 9.55228 2 9 2H3C2.44772 2 2 2.44771 2 3V10.6C2 11.1523 2.44772 11.6 3 11.6H4' stroke='none' strokeLinecap='round' />
|
|
34
|
+
<path d='M4 4H8.44444' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
35
|
+
<path d='M4 6H7' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
36
|
+
<path d='M4 9H5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
37
|
+
</svg>
|
|
38
|
+
)
|
|
39
|
+
break
|
|
40
|
+
case MEDIUM:
|
|
41
|
+
icon = (
|
|
42
|
+
<svg
|
|
43
|
+
width={24}
|
|
44
|
+
height={24}
|
|
45
|
+
viewBox='0 0 24 24'
|
|
46
|
+
fill='none'
|
|
47
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
48
|
+
className={className}
|
|
49
|
+
><path d='M11.9999 10.5L7.82305 12.9115V17.7346L11.9999 20.1461L16.1768 17.7346V12.9115L11.9999 10.5Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
50
|
+
<path d='M16.8231 10.5L21 12.9115V17.7346L16.8231 20.1461' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
<path d='M15 10.2V4C15 3.44772 14.5523 3 14 3H4C3.44772 3 3 3.44772 3 4V16.4C3 16.9523 3.44772 17.4 4 17.4H6' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
52
|
+
<path d='M6 6H12.6667' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
53
|
+
<path d='M6 9H10.5' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
54
|
+
<path d='M6 13.5H7.5' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
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
|
+
><path d='M20.0001 17.5L13.0387 21.5192V29.5576L20.0001 33.5769L26.9616 29.5576V21.5192L20.0001 17.5Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
|
|
68
|
+
<path d='M28.0388 17.5L35.0002 21.5192V29.5576L28.0388 33.5769' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
69
|
+
<path d='M25 17V6C25 5.44772 24.5523 5 24 5H6C5.44772 5 5 5.44772 5 6V28C5 28.5523 5.44772 29 6 29H10' stroke='none' strokeWidth={2} strokeLinecap='round' />
|
|
70
|
+
<path d='M10 10H21.1111' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
71
|
+
<path d='M10 15H17.5' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
72
|
+
<path d='M10 22.5H12.5' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
73
|
+
</svg>
|
|
74
|
+
)
|
|
75
|
+
break
|
|
76
|
+
|
|
77
|
+
default:
|
|
78
|
+
break
|
|
79
|
+
}
|
|
80
|
+
return icon
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
ScalerHistoryIcon.propTypes = {
|
|
84
|
+
/**
|
|
85
|
+
* color of text, icon and borders
|
|
86
|
+
*/
|
|
87
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
88
|
+
/**
|
|
89
|
+
* Size
|
|
90
|
+
*/
|
|
91
|
+
size: PropTypes.oneOf(SIZES),
|
|
92
|
+
/**
|
|
93
|
+
* disabled
|
|
94
|
+
*/
|
|
95
|
+
disabled: PropTypes.bool,
|
|
96
|
+
/**
|
|
97
|
+
* inactive
|
|
98
|
+
*/
|
|
99
|
+
inactive: PropTypes.bool
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
export default ScalerHistoryIcon
|
|
@@ -171,6 +171,11 @@ import ZoomInIcon from './ZoomInIcon'
|
|
|
171
171
|
import ZoomOutIcon from './ZoomOutIcon'
|
|
172
172
|
import SortUpArrowAndBarIcon from './SortUpArrowAndBarIcon'
|
|
173
173
|
import SortDownArrowAndBarIcon from './SortDownArrowAndBarIcon'
|
|
174
|
+
import HorizontalPodAutoscalerIcon from './HorizontalPodAutoscalerIcon'
|
|
175
|
+
import PodMetricsIcon from './PodMetricsIcon'
|
|
176
|
+
import PodPerformanceIcon from './PodPerformanceIcon'
|
|
177
|
+
import ScalerDetailsIcon from './ScalerDetailsIcon'
|
|
178
|
+
import ScalerHistoryIcon from './ScalerHistoryIcon'
|
|
174
179
|
|
|
175
180
|
export default {
|
|
176
181
|
AddIcon,
|
|
@@ -263,6 +268,7 @@ export default {
|
|
|
263
268
|
GitHubRepo2Icon,
|
|
264
269
|
GraphQLIcon,
|
|
265
270
|
GraphQLEditsIcon,
|
|
271
|
+
HorizontalPodAutoscalerIcon,
|
|
266
272
|
ImportAppIcon,
|
|
267
273
|
InfrastructureIcon,
|
|
268
274
|
InternetIcon,
|
|
@@ -295,6 +301,8 @@ export default {
|
|
|
295
301
|
PlatformaticRuntimeIcon,
|
|
296
302
|
PlatformaticServiceIcon,
|
|
297
303
|
PlayIcon,
|
|
304
|
+
PodPerformanceIcon,
|
|
305
|
+
PodMetricsIcon,
|
|
298
306
|
PreviewPRIcon,
|
|
299
307
|
PullRequestIcon,
|
|
300
308
|
PullRequestLoadingIcon,
|
|
@@ -304,6 +312,8 @@ export default {
|
|
|
304
312
|
RestartIcon,
|
|
305
313
|
RocketIcon,
|
|
306
314
|
RunningIcon,
|
|
315
|
+
ScalerDetailsIcon,
|
|
316
|
+
ScalerHistoryIcon,
|
|
307
317
|
SendIcon,
|
|
308
318
|
ServiceIcon,
|
|
309
319
|
ServicesWorkingIcon,
|