@platformatic/ui-components 0.2.3 → 0.2.5
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-DnNOQ9Mz.js +206 -0
- package/dist/index.html +1 -1
- package/package.json +1 -1
- package/src/components/Modal.module.css +3 -3
- package/src/components/ModalDirectional.module.css +1 -1
- package/src/components/icons/CLIIcon.jsx +115 -0
- package/src/components/icons/CirclePlayIcon.jsx +98 -0
- package/src/components/icons/CircleStopIcon.jsx +97 -0
- package/src/components/icons/StoppedAppIcon.jsx +107 -0
- package/src/components/icons/index.js +8 -0
- package/dist/assets/index-DcjcxgBQ.js +0 -206
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-DnNOQ9Mz.js"></script>
|
|
8
8
|
<link rel="stylesheet" crossorigin href="/assets/index-DGu0wALr.css">
|
|
9
9
|
</head>
|
|
10
10
|
<body>
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
.blur {
|
|
2
2
|
@apply fixed top-0 left-0 w-full h-screen z-20;
|
|
3
|
-
background-color: rgba(0, 0, 0, 0.
|
|
3
|
+
background-color: rgba(0, 0, 0, 0.95);
|
|
4
4
|
}
|
|
5
5
|
.blur-absolute {
|
|
6
|
-
@apply absolute top-0 left-0 w-full h-full z-10 bg-rich-black/
|
|
6
|
+
@apply absolute top-0 left-0 w-full h-full z-10 bg-rich-black/95;
|
|
7
7
|
}
|
|
8
8
|
.blur-fixed {
|
|
9
|
-
@apply fixed top-0 left-0 w-screen h-full z-20 bg-rich-black/
|
|
9
|
+
@apply fixed top-0 left-0 w-screen h-full z-20 bg-rich-black/95 flex justify-center items-center;
|
|
10
10
|
}
|
|
11
11
|
.fixedContainer {
|
|
12
12
|
@apply fixed top-0 left-0 w-full h-screen z-20 ;
|
|
@@ -0,0 +1,115 @@
|
|
|
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 CLIIcon = ({ color, size, disabled, inactive }) => {
|
|
7
|
+
let className = `${styles.svgClassName} ` + styles[`${color}`]
|
|
8
|
+
if (disabled) {
|
|
9
|
+
className += ` ${styles.iconDisabled}`
|
|
10
|
+
}
|
|
11
|
+
if (inactive) {
|
|
12
|
+
className += ` ${styles.iconInactive}`
|
|
13
|
+
}
|
|
14
|
+
let icon = <></>
|
|
15
|
+
const filledClassName = styles[`filled-${color}`]
|
|
16
|
+
|
|
17
|
+
switch (size) {
|
|
18
|
+
case SMALL:
|
|
19
|
+
icon = (
|
|
20
|
+
<svg
|
|
21
|
+
width={16}
|
|
22
|
+
height={16}
|
|
23
|
+
viewBox='0 0 16 16'
|
|
24
|
+
fill='none'
|
|
25
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
26
|
+
className={className}
|
|
27
|
+
>
|
|
28
|
+
<rect x='2' y='2' width='12' height='12' rx='1' stroke='none' />
|
|
29
|
+
<path d='M2 5H14' stroke='none' />
|
|
30
|
+
<circle cx='3.5' cy='3.5' r='0.5' fill='none' className={filledClassName} />
|
|
31
|
+
<circle cx='5' cy='3.5' r='0.5' fill='none' className={filledClassName} />
|
|
32
|
+
<circle cx='6.5' cy='3.5' r='0.5' fill='none' className={filledClassName} />
|
|
33
|
+
<path d='M4 7H9' stroke='none' strokeLinecap='round' />
|
|
34
|
+
<path d='M5 9H12' stroke='none' strokeLinecap='round' />
|
|
35
|
+
<path d='M5 11H12' stroke='none' strokeLinecap='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
|
+
>
|
|
49
|
+
<rect x='3' y='3' width='18' height='18' rx='1' stroke='none' strokeWidth={1.5} />
|
|
50
|
+
<path d='M3 7.5H21' stroke='none' strokeWidth={1.5} />
|
|
51
|
+
<circle cx='5.25' cy='5.25' r='0.75' fill='none' className={filledClassName} />
|
|
52
|
+
<circle cx='7.5' cy='5.25' r='0.75' fill='none' className={filledClassName} />
|
|
53
|
+
<circle cx='9.75' cy='5.25' r='0.75' fill='none' className={filledClassName} />
|
|
54
|
+
<path d='M6 10.5H13.5' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
55
|
+
<path d='M7.5 13.5H18' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
56
|
+
<path d='M7.5 16.5H18' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
57
|
+
|
|
58
|
+
</svg>
|
|
59
|
+
)
|
|
60
|
+
break
|
|
61
|
+
case LARGE:
|
|
62
|
+
icon = (
|
|
63
|
+
<svg
|
|
64
|
+
width={40}
|
|
65
|
+
height={40}
|
|
66
|
+
viewBox='0 0 40 40'
|
|
67
|
+
fill='none'
|
|
68
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
69
|
+
className={className}
|
|
70
|
+
>
|
|
71
|
+
<rect x='5' y='5' width='30' height='30' rx='1' stroke='none' strokeWidth={2} />
|
|
72
|
+
<path d='M5 12.5H35' stroke='none' strokeWidth={2} />
|
|
73
|
+
<circle cx='8.75' cy='8.75' r='1.25' fill='none' className={filledClassName} />
|
|
74
|
+
<circle cx='12.5' cy='8.75' r='1.25' fill='none' className={filledClassName} />
|
|
75
|
+
<circle cx='16.25' cy='8.75' r='1.25' fill='none' className={filledClassName} />
|
|
76
|
+
<path d='M10 17.5H22.5' stroke='none' strokeWidth={2} strokeLinecap='round' />
|
|
77
|
+
<path d='M12.5 22.5H30' stroke='none' strokeWidth={2} strokeLinecap='round' />
|
|
78
|
+
<path d='M12.5 27.5H30' stroke='none' strokeWidth={2} strokeLinecap='round' />
|
|
79
|
+
|
|
80
|
+
</svg>
|
|
81
|
+
)
|
|
82
|
+
break
|
|
83
|
+
|
|
84
|
+
default:
|
|
85
|
+
break
|
|
86
|
+
}
|
|
87
|
+
return icon
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
CLIIcon.propTypes = {
|
|
91
|
+
/**
|
|
92
|
+
* color of text, icon and borders
|
|
93
|
+
*/
|
|
94
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
95
|
+
/**
|
|
96
|
+
* Size
|
|
97
|
+
*/
|
|
98
|
+
size: PropTypes.oneOf(SIZES),
|
|
99
|
+
/**
|
|
100
|
+
* disabled
|
|
101
|
+
*/
|
|
102
|
+
disabled: PropTypes.bool,
|
|
103
|
+
/**
|
|
104
|
+
* inactive
|
|
105
|
+
*/
|
|
106
|
+
inactive: PropTypes.bool
|
|
107
|
+
}
|
|
108
|
+
CLIIcon.defaultProps = {
|
|
109
|
+
color: MAIN_DARK_BLUE,
|
|
110
|
+
size: MEDIUM,
|
|
111
|
+
disabled: false,
|
|
112
|
+
inactive: false
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
export default CLIIcon
|
|
@@ -0,0 +1,98 @@
|
|
|
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 CirclePlayIcon = ({ color, size, disabled, inactive }) => {
|
|
7
|
+
let className = `${styles.svgClassName} ` + styles[`${color}`]
|
|
8
|
+
if (disabled) {
|
|
9
|
+
className += ` ${styles.iconDisabled}`
|
|
10
|
+
}
|
|
11
|
+
if (inactive) {
|
|
12
|
+
className += ` ${styles.iconInactive}`
|
|
13
|
+
}
|
|
14
|
+
let icon = <></>
|
|
15
|
+
const filledClassName = styles[`filled-${color}`]
|
|
16
|
+
|
|
17
|
+
switch (size) {
|
|
18
|
+
case SMALL:
|
|
19
|
+
icon = (
|
|
20
|
+
<svg
|
|
21
|
+
width={16}
|
|
22
|
+
height={16}
|
|
23
|
+
viewBox='0 0 16 16'
|
|
24
|
+
fill='none'
|
|
25
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
26
|
+
className={className}
|
|
27
|
+
>
|
|
28
|
+
<circle cx='8' cy='8' r='6' stroke='none' />
|
|
29
|
+
<path d='M7 10V6L10.5 8L7 10Z' fill='none' className={filledClassName} stroke='none' strokeLinejoin='round' />
|
|
30
|
+
|
|
31
|
+
</svg>
|
|
32
|
+
)
|
|
33
|
+
break
|
|
34
|
+
case MEDIUM:
|
|
35
|
+
icon = (
|
|
36
|
+
<svg
|
|
37
|
+
width={24}
|
|
38
|
+
height={24}
|
|
39
|
+
viewBox='0 0 24 24'
|
|
40
|
+
fill='none'
|
|
41
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
42
|
+
className={className}
|
|
43
|
+
>
|
|
44
|
+
<circle cx='12' cy='12' r='9' stroke='none' strokeWidth={1.5} />
|
|
45
|
+
<path d='M10.5 15V9L15.75 12L10.5 15Z' fill='none' className={filledClassName} stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
46
|
+
|
|
47
|
+
</svg>
|
|
48
|
+
)
|
|
49
|
+
break
|
|
50
|
+
case LARGE:
|
|
51
|
+
icon = (
|
|
52
|
+
<svg
|
|
53
|
+
width={40}
|
|
54
|
+
height={40}
|
|
55
|
+
viewBox='0 0 40 40'
|
|
56
|
+
fill='none'
|
|
57
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
58
|
+
className={className}
|
|
59
|
+
>
|
|
60
|
+
<circle cx='20' cy='20' r='15' stroke='none' strokeWidth={2} />
|
|
61
|
+
<path d='M17.5 25V15L26.25 20L17.5 25Z' fill='none' className={filledClassName} stroke='none' strokeWidth={2} strokeLinejoin='round' />
|
|
62
|
+
|
|
63
|
+
</svg>
|
|
64
|
+
)
|
|
65
|
+
break
|
|
66
|
+
|
|
67
|
+
default:
|
|
68
|
+
break
|
|
69
|
+
}
|
|
70
|
+
return icon
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
CirclePlayIcon.propTypes = {
|
|
74
|
+
/**
|
|
75
|
+
* color of text, icon and borders
|
|
76
|
+
*/
|
|
77
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
78
|
+
/**
|
|
79
|
+
* Size
|
|
80
|
+
*/
|
|
81
|
+
size: PropTypes.oneOf(SIZES),
|
|
82
|
+
/**
|
|
83
|
+
* disabled
|
|
84
|
+
*/
|
|
85
|
+
disabled: PropTypes.bool,
|
|
86
|
+
/**
|
|
87
|
+
* inactive
|
|
88
|
+
*/
|
|
89
|
+
inactive: PropTypes.bool
|
|
90
|
+
}
|
|
91
|
+
CirclePlayIcon.defaultProps = {
|
|
92
|
+
color: MAIN_DARK_BLUE,
|
|
93
|
+
size: MEDIUM,
|
|
94
|
+
disabled: false,
|
|
95
|
+
inactive: false
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
export default CirclePlayIcon
|
|
@@ -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 CircleStopIcon = ({ color, size, disabled, inactive }) => {
|
|
7
|
+
let className = `${styles.svgClassName} ` + styles[`${color}`]
|
|
8
|
+
if (disabled) {
|
|
9
|
+
className += ` ${styles.iconDisabled}`
|
|
10
|
+
}
|
|
11
|
+
if (inactive) {
|
|
12
|
+
className += ` ${styles.iconInactive}`
|
|
13
|
+
}
|
|
14
|
+
let icon = <></>
|
|
15
|
+
const filledClassName = styles[`filled-${color}`]
|
|
16
|
+
|
|
17
|
+
switch (size) {
|
|
18
|
+
case SMALL:
|
|
19
|
+
icon = (
|
|
20
|
+
<svg
|
|
21
|
+
width={16}
|
|
22
|
+
height={16}
|
|
23
|
+
viewBox='0 0 16 16'
|
|
24
|
+
fill='none'
|
|
25
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
26
|
+
className={className}
|
|
27
|
+
>
|
|
28
|
+
<circle cx='8' cy='8' r='6' stroke='none' />
|
|
29
|
+
<rect x='6' y='6' width='4' height='4' rx='1' fill='none' className={filledClassName} />
|
|
30
|
+
|
|
31
|
+
</svg>
|
|
32
|
+
)
|
|
33
|
+
break
|
|
34
|
+
case MEDIUM:
|
|
35
|
+
icon = (
|
|
36
|
+
<svg
|
|
37
|
+
width={24}
|
|
38
|
+
height={24}
|
|
39
|
+
viewBox='0 0 24 24'
|
|
40
|
+
fill='none'
|
|
41
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
42
|
+
className={className}
|
|
43
|
+
>
|
|
44
|
+
<circle cx='12' cy='12' r='9' stroke='none' strokeWidth={1.5} />
|
|
45
|
+
<rect x='9' y='9.00006' width='6' height='6' rx='1' fill='none' className={filledClassName} />
|
|
46
|
+
|
|
47
|
+
</svg>
|
|
48
|
+
)
|
|
49
|
+
break
|
|
50
|
+
case LARGE:
|
|
51
|
+
icon = (
|
|
52
|
+
<svg
|
|
53
|
+
width={40}
|
|
54
|
+
height={40}
|
|
55
|
+
viewBox='0 0 40 40'
|
|
56
|
+
fill='none'
|
|
57
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
58
|
+
className={className}
|
|
59
|
+
>
|
|
60
|
+
<circle cx='20' cy='20' r='15' stroke='none' strokeWidth={2} />
|
|
61
|
+
<rect x='14.9998' y='15.0001' width='10' height='10' rx='1' fill='none' className={filledClassName} />
|
|
62
|
+
</svg>
|
|
63
|
+
)
|
|
64
|
+
break
|
|
65
|
+
|
|
66
|
+
default:
|
|
67
|
+
break
|
|
68
|
+
}
|
|
69
|
+
return icon
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
CircleStopIcon.propTypes = {
|
|
73
|
+
/**
|
|
74
|
+
* color of text, icon and borders
|
|
75
|
+
*/
|
|
76
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
77
|
+
/**
|
|
78
|
+
* Size
|
|
79
|
+
*/
|
|
80
|
+
size: PropTypes.oneOf(SIZES),
|
|
81
|
+
/**
|
|
82
|
+
* disabled
|
|
83
|
+
*/
|
|
84
|
+
disabled: PropTypes.bool,
|
|
85
|
+
/**
|
|
86
|
+
* inactive
|
|
87
|
+
*/
|
|
88
|
+
inactive: PropTypes.bool
|
|
89
|
+
}
|
|
90
|
+
CircleStopIcon.defaultProps = {
|
|
91
|
+
color: MAIN_DARK_BLUE,
|
|
92
|
+
size: MEDIUM,
|
|
93
|
+
disabled: false,
|
|
94
|
+
inactive: false
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
export default CircleStopIcon
|
|
@@ -0,0 +1,107 @@
|
|
|
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 StoppedAppIcon = ({ color, size, disabled, inactive }) => {
|
|
7
|
+
let className = `${styles.svgClassName} ` + styles[`${color}`]
|
|
8
|
+
if (disabled) {
|
|
9
|
+
className += ` ${styles.iconDisabled}`
|
|
10
|
+
}
|
|
11
|
+
if (inactive) {
|
|
12
|
+
className += ` ${styles.iconInactive}`
|
|
13
|
+
}
|
|
14
|
+
let icon = <></>
|
|
15
|
+
|
|
16
|
+
switch (size) {
|
|
17
|
+
case SMALL:
|
|
18
|
+
icon = (
|
|
19
|
+
<svg
|
|
20
|
+
width={16}
|
|
21
|
+
height={16}
|
|
22
|
+
viewBox='0 0 16 16'
|
|
23
|
+
fill='none'
|
|
24
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
25
|
+
className={className}
|
|
26
|
+
>
|
|
27
|
+
<path d='M7.5 2H3C2.44772 2 2 2.44772 2 3V9.34775C2 9.90004 2.44772 10.3478 3 10.3478H13C13.5523 10.3478 14 9.90004 14 9.34775V5.84783V3.04352C14 2.49124 13.5523 2.04352 13 2.04352H11.5' stroke='none' strokeLinecap='round' />
|
|
28
|
+
<rect x='6' y='10.3477' width='4' height='2.08694' stroke='none' />
|
|
29
|
+
<path d='M4 13.4348C4 12.8825 4.44772 12.4348 5 12.4348H11C11.5523 12.4348 12 12.8825 12 13.4348V14H4V13.4348Z' stroke='none' />
|
|
30
|
+
<path d='M7.44287 4.67217H8.0786H8.71432L9.50012 2.04346L10.2859 4.67217H12.8288L10.7716 6.29681L11.5574 8.92553L9.50012 7.30089L7.44287 8.92553L8.22867 6.29681L7.5 6' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
31
|
+
<path d='M6 5L6 7' stroke='none' strokeLinecap='round' />
|
|
32
|
+
<path d='M4 5L4 7' stroke='none' strokeLinecap='round' />
|
|
33
|
+
|
|
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='M11.25 3H4C3.44772 3 3 3.44771 3 4V14.5216C3 15.0739 3.44772 15.5216 4 15.5216H20C20.5523 15.5216 21 15.0739 21 14.5216V8.77175V4.06528C21 3.513 20.5523 3.06528 20 3.06528H17.25' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
48
|
+
<rect x='9' y='15.5215' width='6' height='3.13041' stroke='none' strokeWidth={1.5} />
|
|
49
|
+
<path d='M6 19.6521C6 19.0998 6.44772 18.6521 7 18.6521H17C17.5523 18.6521 18 19.0998 18 19.6521V20.9999H6V19.6521Z' stroke='none' strokeWidth={1.5} />
|
|
50
|
+
<path d='M11.1641 7.00826H12.1176H13.0712L14.2499 3.06519L15.4286 7.00826H19.243L16.1571 9.44521L17.3358 13.3883L14.2499 10.9513L11.1641 13.3883L12.3428 9.44521L11.2498 9' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
<path d='M9 7.5L9 10.5' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
|
|
52
|
+
<path d='M6 7.5L6 10.5' stroke='none' strokeWidth={1.5} strokeLinecap='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
|
+
>
|
|
66
|
+
<path d='M18.75 5H6C5.44772 5 5 5.44771 5 6V24.8694C5 25.4217 5.44772 25.8694 6 25.8694H34C34.5523 25.8694 35 25.4217 35 24.8694V14.6196V6.1088C35 5.55652 34.5523 5.1088 34 5.1088H28.75' stroke='none' strokeWidth={2} strokeLinecap='round' />
|
|
67
|
+
<rect x='15' y='25.8691' width='10' height='5.21734' stroke='none' strokeWidth={2} />
|
|
68
|
+
<path d='M10 32.0869C10 31.5346 10.4477 31.0869 11 31.0869H29C29.5523 31.0869 30 31.5346 30 32.0869V34.9999H10V32.0869Z' stroke='none' strokeWidth={2} />
|
|
69
|
+
<path d='M18.6069 11.6807H20.1962H21.7856L23.7501 5.10889L25.7146 11.6807H32.0718L26.9287 15.7423L28.8932 22.3141L23.7501 18.2525L18.6069 22.3141L20.5714 15.7423L18.7498 15.0002' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
70
|
+
<path d='M15 12.5L15 17.5' stroke='none' strokeWidth={2} strokeLinecap='round' />
|
|
71
|
+
<path d='M10 12.5L10 17.5' stroke='none' strokeWidth={2} strokeLinecap='round' />
|
|
72
|
+
</svg>
|
|
73
|
+
)
|
|
74
|
+
break
|
|
75
|
+
|
|
76
|
+
default:
|
|
77
|
+
break
|
|
78
|
+
}
|
|
79
|
+
return icon
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
StoppedAppIcon.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
|
+
StoppedAppIcon.defaultProps = {
|
|
101
|
+
color: MAIN_DARK_BLUE,
|
|
102
|
+
size: MEDIUM,
|
|
103
|
+
disabled: false,
|
|
104
|
+
inactive: false
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
export default StoppedAppIcon
|
|
@@ -39,11 +39,14 @@ import CircleEditIcon from './CircleEditIcon'
|
|
|
39
39
|
import CircleFullIcon from './CircleFullIcon'
|
|
40
40
|
import CircleGearIcon from './CircleGearIcon'
|
|
41
41
|
import CircleRestartIcon from './CircleRestartIcon'
|
|
42
|
+
import CirclePlayIcon from './CirclePlayIcon'
|
|
42
43
|
import CircleSubtractIcon from './CircleSubtractIcon'
|
|
44
|
+
import CircleStopIcon from './CircleStopIcon'
|
|
43
45
|
import CircleTwoArrowsDownIcon from './CircleTwoArrowsDownIcon'
|
|
44
46
|
import CircleTwoArrowsUpIcon from './CircleTwoArrowsUpIcon'
|
|
45
47
|
import CloseIcon from './CloseIcon'
|
|
46
48
|
import CloudIcon from './CloudIcon'
|
|
49
|
+
import CLIIcon from './CLIIcon'
|
|
47
50
|
import ComputerIcon from './ComputerIcon'
|
|
48
51
|
import CopyPasteIcon from './CopyPasteIcon'
|
|
49
52
|
import CreditCardIcon from './CreditCardIcon'
|
|
@@ -113,6 +116,7 @@ import StackablesIcon from './StackablesIcon'
|
|
|
113
116
|
import StackablesPluginIcon from './StackablesPluginIcon'
|
|
114
117
|
import StackablesTemplateIcon from './StackablesTemplateIcon'
|
|
115
118
|
import StopIcon from './StopIcon'
|
|
119
|
+
import StoppedAppIcon from './StoppedAppIcon'
|
|
116
120
|
import TerminalIcon from './TerminalIcon'
|
|
117
121
|
import TwoUsersIcon from './TwoUsersIcon'
|
|
118
122
|
import TeamsIcon from './TeamsIcon'
|
|
@@ -172,11 +176,14 @@ export default {
|
|
|
172
176
|
CircleFullIcon,
|
|
173
177
|
CircleGearIcon,
|
|
174
178
|
CircleRestartIcon,
|
|
179
|
+
CirclePlayIcon,
|
|
175
180
|
CircleSubtractIcon,
|
|
181
|
+
CircleStopIcon,
|
|
176
182
|
CircleTwoArrowsDownIcon,
|
|
177
183
|
CircleTwoArrowsUpIcon,
|
|
178
184
|
CloseIcon,
|
|
179
185
|
CloudIcon,
|
|
186
|
+
CLIIcon,
|
|
180
187
|
ComputerIcon,
|
|
181
188
|
CopyPasteIcon,
|
|
182
189
|
CreditCardIcon,
|
|
@@ -231,6 +238,7 @@ export default {
|
|
|
231
238
|
SendIcon,
|
|
232
239
|
ServiceIcon,
|
|
233
240
|
StopIcon,
|
|
241
|
+
StoppedAppIcon,
|
|
234
242
|
SlotIcon,
|
|
235
243
|
SwitchIcon,
|
|
236
244
|
SocialDiscordIcon,
|