@platformatic/ui-components 0.1.121 → 0.1.123
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-d72b255b.css → index-3a61658e.css} +1 -1
- package/dist/assets/index-8f6ac36c.js +206 -0
- package/dist/index.html +2 -2
- package/dist/main.css +14 -8
- package/package.json +1 -1
- package/src/components/FollowUs.jsx +7 -5
- package/src/components/FollowUs.module.css +0 -6
- package/src/components/HorizontalSeparator.jsx +2 -2
- package/src/components/icons/ApiPerformanceIcon.jsx +100 -0
- package/src/components/icons/ApplicationTypeIcon.jsx +51 -0
- package/src/components/icons/ArrowLongRightIcon.jsx +77 -0
- package/src/components/icons/CloudIcon.jsx +77 -0
- package/src/components/icons/DepencenciesReloadIcon.jsx +90 -0
- package/src/components/icons/EditDocumentIcon.jsx +97 -0
- package/src/components/icons/GitHubRepo2Icon.jsx +86 -0
- package/src/components/icons/ImportApplicationIcon.jsx +52 -0
- package/src/components/icons/OutOfBoxGraphQLIcon.jsx +112 -0
- package/src/components/icons/PlatformaticComposerIcon.jsx +79 -0
- package/src/components/icons/PlatformaticDBIcon.jsx +99 -0
- package/src/components/icons/PlatformaticRuntimeIcon.jsx +91 -0
- package/src/components/icons/PlatformaticServiceIcon.jsx +91 -0
- package/src/components/icons/PreviewPRIcon.jsx +100 -0
- package/src/components/icons/SocialXIcon.jsx +79 -0
- package/src/components/icons/index.js +30 -2
- package/tailwind.config.cjs +8 -4
- package/dist/assets/index-b5325ff4.js +0 -206
- package/src/components/icons/SocialTwitterIcon.jsx +0 -78
|
@@ -0,0 +1,86 @@
|
|
|
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 GitHubRepo2Icon = ({ color, size }) => {
|
|
7
|
+
const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
|
|
8
|
+
let icon = <></>
|
|
9
|
+
|
|
10
|
+
switch (size) {
|
|
11
|
+
case SMALL:
|
|
12
|
+
icon = (
|
|
13
|
+
<svg
|
|
14
|
+
width={16}
|
|
15
|
+
height={16}
|
|
16
|
+
viewBox='0 0 16 16'
|
|
17
|
+
fill='none'
|
|
18
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
19
|
+
className={className}
|
|
20
|
+
>
|
|
21
|
+
<path d='M6.15625 3.84375L2 8L8 14L14 8L8 2L6.15625 3.84375ZM6.15625 3.84375L8 5.6875M10.5 8.1875L8 5.6875M8 5.6875V10' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
22
|
+
<circle cx='11' cy='8.5' r='1' fill='none' />
|
|
23
|
+
<circle cx='8' cy='10' r='1' fill='none' />
|
|
24
|
+
<circle cx='8' cy='5.5' r='1' fill='none' />
|
|
25
|
+
</svg>
|
|
26
|
+
)
|
|
27
|
+
break
|
|
28
|
+
case MEDIUM:
|
|
29
|
+
icon = (
|
|
30
|
+
<svg
|
|
31
|
+
width={24}
|
|
32
|
+
height={24}
|
|
33
|
+
viewBox='0 0 24 24'
|
|
34
|
+
fill='none'
|
|
35
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
36
|
+
className={className}
|
|
37
|
+
><path d='M9.23438 5.76562L3 12L12 21L21 12L12 3L9.23438 5.76562ZM9.23438 5.76562L12 8.53125M15.75 12.2812L12 8.53125M12 8.53125V15' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
38
|
+
<circle cx='16.5' cy='12.75' r='1.5' fill='none' />
|
|
39
|
+
<circle cx='12' cy='15' r='1.5' fill='none' />
|
|
40
|
+
<circle cx='12' cy='8.25' r='1.5' fill='none' />
|
|
41
|
+
|
|
42
|
+
</svg>
|
|
43
|
+
)
|
|
44
|
+
break
|
|
45
|
+
case LARGE:
|
|
46
|
+
icon = (
|
|
47
|
+
<svg
|
|
48
|
+
width={40}
|
|
49
|
+
height={40}
|
|
50
|
+
viewBox='0 0 40 40'
|
|
51
|
+
fill='none'
|
|
52
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
53
|
+
className={className}
|
|
54
|
+
>
|
|
55
|
+
<path d='M15.3906 9.60937L5 20L20 35L35 20L20 5L15.3906 9.60937ZM15.3906 9.60937L20 14.2187M26.25 20.4687L20 14.2187M20 14.2187V25' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
56
|
+
<circle cx='27.5' cy='21.25' r='2.5' fill='none' />
|
|
57
|
+
<circle cx='20' cy='25' r='2.5' fill='none' />
|
|
58
|
+
<circle cx='20' cy='13.75' r='2.5' fill='none' />
|
|
59
|
+
|
|
60
|
+
</svg>
|
|
61
|
+
)
|
|
62
|
+
break
|
|
63
|
+
|
|
64
|
+
default:
|
|
65
|
+
break
|
|
66
|
+
}
|
|
67
|
+
return icon
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
GitHubRepo2Icon.propTypes = {
|
|
71
|
+
/**
|
|
72
|
+
* color of text, icon and borders
|
|
73
|
+
*/
|
|
74
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
75
|
+
/**
|
|
76
|
+
* Size
|
|
77
|
+
*/
|
|
78
|
+
size: PropTypes.oneOf(SIZES)
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
GitHubRepo2Icon.defaultProps = {
|
|
82
|
+
color: MAIN_DARK_BLUE,
|
|
83
|
+
size: MEDIUM
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
export default GitHubRepo2Icon
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import * as React from 'react'
|
|
2
|
+
import PropTypes from 'prop-types'
|
|
3
|
+
import styles from './Icons.module.css'
|
|
4
|
+
import { COLORS_ICON, SIZES, LARGE, MAIN_DARK_BLUE } from '../constants'
|
|
5
|
+
|
|
6
|
+
const ImportApplicationIcon = ({ color, size }) => {
|
|
7
|
+
const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
|
|
8
|
+
let icon = <></>
|
|
9
|
+
|
|
10
|
+
switch (size) {
|
|
11
|
+
case LARGE:
|
|
12
|
+
icon = (
|
|
13
|
+
<svg
|
|
14
|
+
width={40}
|
|
15
|
+
height={40}
|
|
16
|
+
viewBox='0 0 40 40'
|
|
17
|
+
fill='none'
|
|
18
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
19
|
+
className={className}
|
|
20
|
+
>
|
|
21
|
+
<path d='M34 5.00021H6C5.44772 5.00021 5 5.44793 5 6.00021V24.0002C5 24.5525 5.44772 25.0002 6 25.0002H34C34.5523 25.0002 35 24.5525 35 24.0002V6.00021C35 5.44793 34.5523 5.00021 34 5.00021Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
22
|
+
<rect x={15} y={25.0002} width={10} height={5} stroke='none' strokeWidth={2} />
|
|
23
|
+
<path d='M10 31.0002C10 30.4479 10.4477 30.0002 11 30.0002H29C29.5523 30.0002 30 30.4479 30 31.0002V35.0002H10V31.0002Z' stroke='none' strokeWidth={2} />
|
|
24
|
+
<path d='M26.25 8.75021L27.6532 13.0689H32.1941L28.5204 15.7379L29.9237 20.0566L26.25 17.3875L22.5763 20.0566L23.9796 15.7379L20.3059 13.0689H24.8468L26.25 8.75021Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
|
|
25
|
+
<path d='M22.5 15.0002H10M10 15.0002L15 10.0002M10 15.0002L15 20.0002' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
26
|
+
</svg>
|
|
27
|
+
)
|
|
28
|
+
break
|
|
29
|
+
|
|
30
|
+
default:
|
|
31
|
+
break
|
|
32
|
+
}
|
|
33
|
+
return icon
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
ImportApplicationIcon.propTypes = {
|
|
37
|
+
/**
|
|
38
|
+
* color of text, icon and borders
|
|
39
|
+
*/
|
|
40
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
41
|
+
/**
|
|
42
|
+
* Size
|
|
43
|
+
*/
|
|
44
|
+
size: PropTypes.oneOf(SIZES)
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
ImportApplicationIcon.defaultProps = {
|
|
48
|
+
color: MAIN_DARK_BLUE,
|
|
49
|
+
size: LARGE
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
export default ImportApplicationIcon
|
|
@@ -0,0 +1,112 @@
|
|
|
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 OutOfBoxGraphQLIcon = ({ color, size }) => {
|
|
7
|
+
const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
|
|
8
|
+
let icon = <></>
|
|
9
|
+
|
|
10
|
+
switch (size) {
|
|
11
|
+
case SMALL:
|
|
12
|
+
icon = (
|
|
13
|
+
<svg
|
|
14
|
+
width={16}
|
|
15
|
+
height={16}
|
|
16
|
+
viewBox='0 0 16 16'
|
|
17
|
+
fill='none'
|
|
18
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
19
|
+
className={className}
|
|
20
|
+
>
|
|
21
|
+
<path d='M3.5 9.84863V11.7356L8 14L12.5 11.7356V9.84863' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
22
|
+
<path d='M8 9.64515L6.61538 11.0386L2 8.94841L3.5 7.38086' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
23
|
+
<path d='M8 9.64515L9.38462 11.0386L14 8.94841L12.5 7.38086' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
24
|
+
<path d='M3.5 7.38086L8 9.4493L12.5 7.38086' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
25
|
+
<path d='M5.45801 6.29636L8.00002 2.40332L10.5417 6.29636H5.45801Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
26
|
+
<path d='M5.45801 3.71036V6.3241L8.00002 7.6308L10.5417 6.3241V3.71036L8.00002 2.40332L5.45801 3.71036Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
27
|
+
<path d='M7.99989 2.80687C8.25009 2.80687 8.45291 2.62625 8.45291 2.40343C8.45291 2.18062 8.25009 2 7.99989 2C7.7497 2 7.54688 2.18062 7.54688 2.40343C7.54688 2.62625 7.7497 2.80687 7.99989 2.80687Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
28
|
+
<path d='M5.45839 4.10228C5.70858 4.10228 5.9114 3.92166 5.9114 3.69884C5.9114 3.47603 5.70858 3.29541 5.45839 3.29541C5.20819 3.29541 5.00537 3.47603 5.00537 3.69884C5.00537 3.92166 5.20819 4.10228 5.45839 4.10228Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
29
|
+
<path d='M10.5416 4.10228C10.7918 4.10228 10.9947 3.92166 10.9947 3.69884C10.9947 3.47603 10.7918 3.29541 10.5416 3.29541C10.2914 3.29541 10.0886 3.47603 10.0886 3.69884C10.0886 3.92166 10.2914 4.10228 10.5416 4.10228Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
30
|
+
<path d='M8.00573 7.99538C8.25591 7.99274 8.45631 7.80998 8.45334 7.58719C8.45037 7.36439 8.24515 7.18593 7.99498 7.18857C7.7448 7.19122 7.5444 7.37397 7.54737 7.59677C7.55034 7.81956 7.75555 7.99803 8.00573 7.99538Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
31
|
+
<path d='M10.547 6.69997C10.7972 6.69733 10.9976 6.51457 10.9946 6.29178C10.9916 6.06898 10.7864 5.89052 10.5362 5.89316C10.2861 5.89581 10.0857 6.07856 10.0886 6.30136C10.0916 6.52415 10.2968 6.70262 10.547 6.69997Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
32
|
+
<path d='M5.46374 6.69997C5.71391 6.69733 5.91431 6.51457 5.91135 6.29178C5.90838 6.06898 5.70316 5.89052 5.45298 5.89316C5.20281 5.89581 5.00241 6.07856 5.00538 6.30136C5.00835 6.52415 5.21356 6.70262 5.46374 6.69997Z' stroke='none' strokeLinecap='round' strokeLinejoin='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='M5.25 14.7729V17.6035L12 21.0001L18.75 17.6035V14.7729' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
48
|
+
<path d='M12 14.4677L9.92308 16.5579L3 13.4226L5.25 11.0713' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
49
|
+
<path d='M12 14.4677L14.0769 16.5579L21 13.4226L18.75 11.0713' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
50
|
+
<path d='M5.25 11.0713L12 14.174L18.75 11.0713' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
<path d='M8.18701 9.44455L12 3.60498L15.8125 9.44455H8.18701Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
52
|
+
<path d='M8.18701 5.56553V9.48614L12 11.4462L15.8125 9.48614V5.56553L12 3.60498L8.18701 5.56553Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
53
|
+
<path d='M11.9998 4.2103C12.3751 4.2103 12.6794 3.93937 12.6794 3.60515C12.6794 3.27094 12.3751 3 11.9998 3C11.6245 3 11.3203 3.27094 11.3203 3.60515C11.3203 3.93937 11.6245 4.2103 11.9998 4.2103Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
54
|
+
<path d='M8.18758 6.15366C8.56287 6.15366 8.86711 5.88273 8.86711 5.54851C8.86711 5.21429 8.56287 4.94336 8.18758 4.94336C7.81229 4.94336 7.50806 5.21429 7.50806 5.54851C7.50806 5.88273 7.81229 6.15366 8.18758 6.15366Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
55
|
+
<path d='M15.8126 6.15366C16.1879 6.15366 16.4921 5.88273 16.4921 5.54851C16.4921 5.21429 16.1879 4.94336 15.8126 4.94336C15.4373 4.94336 15.1331 5.21429 15.1331 5.54851C15.1331 5.88273 15.4373 6.15366 15.8126 6.15366Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
56
|
+
<path d='M12.0086 11.9926C12.3839 11.9886 12.6845 11.7145 12.68 11.3803C12.6756 11.0461 12.3677 10.7784 11.9925 10.7824C11.6172 10.7863 11.3166 11.0605 11.3211 11.3947C11.3255 11.7289 11.6333 11.9966 12.0086 11.9926Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
57
|
+
<path d='M15.8204 10.0497C16.1956 10.0457 16.4962 9.77162 16.4918 9.43743C16.4873 9.10323 16.1795 8.83553 15.8042 8.8395C15.429 8.84346 15.1284 9.1176 15.1328 9.45179C15.1373 9.78598 15.4451 10.0537 15.8204 10.0497Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
58
|
+
<path d='M8.19561 10.0497C8.57087 10.0457 8.87147 9.77162 8.86702 9.43743C8.86256 9.10323 8.55474 8.83553 8.17948 8.8395C7.80421 8.84346 7.50361 9.1176 7.50806 9.45179C7.51252 9.78598 7.82034 10.0537 8.19561 10.0497Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
59
|
+
|
|
60
|
+
</svg>
|
|
61
|
+
)
|
|
62
|
+
break
|
|
63
|
+
case LARGE:
|
|
64
|
+
icon = (
|
|
65
|
+
<svg
|
|
66
|
+
width={40}
|
|
67
|
+
height={40}
|
|
68
|
+
viewBox='0 0 40 40'
|
|
69
|
+
fill='none'
|
|
70
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
71
|
+
className={className}
|
|
72
|
+
>
|
|
73
|
+
<path d='M8.75 24.6216V29.3391L20 35.0001L31.25 29.3391V24.6216' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
74
|
+
<path d='M20 24.1129L16.5385 27.5966L5 22.371L8.75 18.4521' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
75
|
+
<path d='M20 24.1129L23.4615 27.5966L35 22.371L31.25 18.4521' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
76
|
+
<path d='M8.75 18.4521L20 23.6233L31.25 18.4521' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
77
|
+
<path d='M13.6453 15.7414L20.0003 6.00879L26.3544 15.7414H13.6453Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
78
|
+
<path d='M13.6453 9.27638V15.8107L20.0003 19.0775L26.3544 15.8107V9.27638L20.0003 6.00879L13.6453 9.27638Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
79
|
+
<path d='M20 7.01717C20.6255 7.01717 21.1325 6.56561 21.1325 6.00859C21.1325 5.45156 20.6255 5 20 5C19.3745 5 18.8674 5.45156 18.8674 6.00859C18.8674 6.56561 19.3745 7.01717 20 7.01717Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
80
|
+
<path d='M13.6462 10.2559C14.2717 10.2559 14.7788 9.80438 14.7788 9.24736C14.7788 8.69033 14.2717 8.23877 13.6462 8.23877C13.0207 8.23877 12.5137 8.69033 12.5137 9.24736C12.5137 9.80438 13.0207 10.2559 13.6462 10.2559Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
81
|
+
<path d='M26.3542 10.2559C26.9797 10.2559 27.4868 9.80438 27.4868 9.24736C27.4868 8.69033 26.9797 8.23877 26.3542 8.23877C25.7287 8.23877 25.2217 8.69033 25.2217 9.24736C25.2217 9.80438 25.7287 10.2559 26.3542 10.2559Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
82
|
+
<path d='M20.0141 19.988C20.6395 19.9814 21.1405 19.5245 21.1331 18.9675C21.1257 18.4105 20.6126 17.9643 19.9872 17.9709C19.3618 17.9776 18.8608 18.4344 18.8682 18.9914C18.8756 19.5484 19.3886 19.9946 20.0141 19.988Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
83
|
+
<path d='M26.3674 16.7492C26.9928 16.7426 27.4938 16.2857 27.4864 15.7287C27.4789 15.1717 26.9659 14.7256 26.3405 14.7322C25.715 14.7388 25.214 15.1957 25.2214 15.7527C25.2289 16.3096 25.7419 16.7558 26.3674 16.7492Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
84
|
+
<path d='M13.6593 16.7502C14.2848 16.7436 14.7858 16.2867 14.7784 15.7297C14.7709 15.1727 14.2579 14.7265 13.6325 14.7331C13.007 14.7398 12.506 15.1966 12.5134 15.7536C12.5209 16.3106 13.0339 16.7568 13.6593 16.7502Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
85
|
+
|
|
86
|
+
</svg>
|
|
87
|
+
)
|
|
88
|
+
break
|
|
89
|
+
|
|
90
|
+
default:
|
|
91
|
+
break
|
|
92
|
+
}
|
|
93
|
+
return icon
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
OutOfBoxGraphQLIcon.propTypes = {
|
|
97
|
+
/**
|
|
98
|
+
* color of text, icon and borders
|
|
99
|
+
*/
|
|
100
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
101
|
+
/**
|
|
102
|
+
* Size
|
|
103
|
+
*/
|
|
104
|
+
size: PropTypes.oneOf(SIZES)
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
OutOfBoxGraphQLIcon.defaultProps = {
|
|
108
|
+
color: MAIN_DARK_BLUE,
|
|
109
|
+
size: MEDIUM
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
export default OutOfBoxGraphQLIcon
|
|
@@ -0,0 +1,79 @@
|
|
|
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 PlatformaticComposerIcon = ({ color, size }) => {
|
|
7
|
+
const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
|
|
8
|
+
let icon = <></>
|
|
9
|
+
|
|
10
|
+
switch (size) {
|
|
11
|
+
case SMALL:
|
|
12
|
+
icon = (
|
|
13
|
+
<svg
|
|
14
|
+
width={16}
|
|
15
|
+
height={16}
|
|
16
|
+
viewBox='0 0 16 16'
|
|
17
|
+
fill='none'
|
|
18
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
19
|
+
className={className}
|
|
20
|
+
>
|
|
21
|
+
<path d='M4.77494 8.81913C4.24107 8.81913 3.80818 8.40121 3.80818 7.8858C3.80818 7.67079 3.88373 7.47306 4.01013 7.31543H2.17509C2.07841 7.31543 2 7.39113 2 7.48447V9.22081C2.16864 9.08185 2.38742 9.09568 2.6266 9.09568C3.05 9.09568 3.4 9.5321 3.4 10.1154C3.4 10.6308 3.16046 10.9623 2.6266 10.9623C2.38742 10.9623 2.16864 10.982 2 10.8431V12.5044C2 12.5978 2.07841 12.6735 2.17509 12.6735H4.25361C4.04665 12.8446 3.9156 13.0986 3.9156 13.3821C3.9156 13.8975 4.34849 14.3154 4.88235 14.3154C5.41621 14.3154 5.8491 13.8975 5.8491 13.3821C5.8491 13.0986 5.71806 12.8446 5.5111 12.6735H7.37478C7.47146 12.6735 7.54987 12.5978 7.54987 12.5044V10.8372' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
22
|
+
<path d='M12.8348 6.55836C12.6823 6.47028 12.5165 6.42727 12.3536 6.42505L13.2218 4.92133C13.2685 4.8405 13.2384 4.73573 13.1547 4.68739L11.5655 3.76987C11.5962 3.96958 11.5627 4.17859 11.4552 4.3648C11.1975 4.81116 10.6137 4.95664 10.1513 4.68971C9.68898 4.42278 9.52304 3.8444 9.78075 3.39805C9.88825 3.21184 10.0525 3.07838 10.2408 3.00506L8.65163 2.08754C8.56791 2.03921 8.46215 2.06556 8.41548 2.14639L7.54731 3.65011C7.76284 3.61409 7.94539 3.73545 8.15253 3.85504C8.5192 4.06674 8.6041 4.61969 8.31244 5.12487C8.05473 5.57123 7.68153 5.73855 7.21919 5.47162C7.01206 5.35203 6.81274 5.25971 6.73617 5.05504L5.90551 6.4938C5.85884 6.57462 5.8889 6.67939 5.97262 6.72773L7.77267 7.76699C7.50788 7.8117 7.26735 7.96621 7.12563 8.21169C6.86792 8.65804 7.03385 9.23642 7.49619 9.50335C7.95853 9.77029 8.54239 9.6248 8.80009 9.17844C8.94182 8.93296 8.95536 8.6474 8.86169 8.39574L10.4757 9.32758C10.5594 9.37591 10.6652 9.34956 10.7118 9.26873L11.5454 7.82489C11.6288 7.96481 11.7489 8.08686 11.9015 8.17494C12.3638 8.44188 12.9477 8.29639 13.2054 7.85003C13.4631 7.40367 13.2972 6.82529 12.8348 6.55836Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
23
|
+
</svg>
|
|
24
|
+
)
|
|
25
|
+
break
|
|
26
|
+
case MEDIUM:
|
|
27
|
+
icon = (
|
|
28
|
+
<svg
|
|
29
|
+
width={24}
|
|
30
|
+
height={24}
|
|
31
|
+
viewBox='0 0 24 24'
|
|
32
|
+
fill='none'
|
|
33
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
34
|
+
className={className}
|
|
35
|
+
>
|
|
36
|
+
<path d='M7.1624 13.2287C6.36161 13.2287 5.71228 12.6018 5.71228 11.8287C5.71228 11.5062 5.8256 11.2096 6.01519 10.9731H3.26263C3.11762 10.9731 3 11.0867 3 11.2267V13.8312C3.25297 13.6228 3.58113 13.6435 3.9399 13.6435C4.575 13.6435 5.1 14.2981 5.1 15.1731C5.1 15.9463 4.74069 16.4435 3.9399 16.4435C3.58113 16.4435 3.25297 16.4731 3 16.2646V18.7566C3 18.8966 3.11762 19.0102 3.26263 19.0102H6.38041C6.06997 19.2668 5.8734 19.648 5.8734 20.0731C5.8734 20.8463 6.52274 21.4731 7.32353 21.4731C8.12432 21.4731 8.77366 20.8463 8.77366 20.0731C8.77366 19.648 8.57708 19.2668 8.26665 19.0102H11.0622C11.2072 19.0102 11.3248 18.8966 11.3248 18.7566V16.2558' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
37
|
+
<path d='M19.2522 9.83754C19.0234 9.70542 18.7747 9.6409 18.5305 9.63757L19.8327 7.38199C19.9027 7.26075 19.8576 7.10359 19.732 7.03109L17.3483 5.65481C17.3942 5.95437 17.3441 6.26789 17.1828 6.5472C16.7963 7.21673 15.9205 7.43497 15.227 7.03457C14.5335 6.63417 14.2846 5.7666 14.6711 5.09707C14.8324 4.81776 15.0788 4.61757 15.3612 4.5076L12.9774 3.13132C12.8519 3.05881 12.6932 3.09834 12.6232 3.21959L11.321 5.47516C11.6443 5.42113 11.9181 5.60317 12.2288 5.78256C12.7788 6.10011 12.9062 6.92953 12.4687 7.68731C12.0821 8.35684 11.5223 8.60783 10.8288 8.20743C10.5181 8.02804 10.2191 7.88956 10.1043 7.58256L8.85826 9.74069C8.78826 9.86194 8.83334 10.0191 8.95893 10.0916L11.659 11.6505C11.2618 11.7175 10.901 11.9493 10.6884 12.3175C10.3019 12.9871 10.5508 13.8546 11.2443 14.255C11.9378 14.6554 12.8136 14.4372 13.2001 13.7677C13.4127 13.3994 13.433 12.9711 13.2925 12.5936L15.7135 13.9914C15.8391 14.0639 15.9978 14.0243 16.0678 13.9031L17.3182 11.7373C17.4432 11.9472 17.6234 12.1303 17.8522 12.2624C18.5457 12.6628 19.4215 12.4446 19.8081 11.775C20.1946 11.1055 19.9457 10.2379 19.2522 9.83754Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
38
|
+
</svg>
|
|
39
|
+
)
|
|
40
|
+
break
|
|
41
|
+
case LARGE:
|
|
42
|
+
icon = (
|
|
43
|
+
<svg
|
|
44
|
+
width={40}
|
|
45
|
+
height={40}
|
|
46
|
+
viewBox='0 0 40 40'
|
|
47
|
+
fill='none'
|
|
48
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
49
|
+
className={className}
|
|
50
|
+
>
|
|
51
|
+
<path d='M11.9373 22.0478C10.6027 22.0478 9.52046 21.003 9.52046 19.7145C9.52046 19.177 9.70933 18.6826 10.0253 18.2886H5.43772C5.19604 18.2886 5 18.4778 5 18.7112V23.052C5.42161 22.7046 5.96854 22.7392 6.5665 22.7392C7.625 22.7392 8.5 23.8302 8.5 25.2886C8.5 26.5771 7.90115 27.4059 6.5665 27.4059C5.96854 27.4059 5.42161 27.4551 5 27.1077V31.261C5 31.4944 5.19604 31.6836 5.43772 31.6836H10.634C10.1166 32.1114 9.789 32.7466 9.789 33.4552C9.789 34.7438 10.8712 35.7886 12.2059 35.7886C13.5405 35.7886 14.6228 34.7438 14.6228 33.4552C14.6228 32.7466 14.2951 32.1114 13.7777 31.6836H18.437C18.6786 31.6836 18.8747 31.4944 18.8747 31.261V27.093' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
52
|
+
<path d='M32.0871 16.3959C31.7057 16.1757 31.2912 16.0682 30.8841 16.0626L33.0545 12.3033C33.1712 12.1012 33.0961 11.8393 32.8867 11.7185L28.9138 9.42468C28.9904 9.92395 28.9068 10.4465 28.638 10.912C27.9938 12.0279 26.5341 12.3916 25.3783 11.7243C24.2224 11.057 23.8076 9.61101 24.4519 8.49512C24.7206 8.0296 25.1314 7.69595 25.6021 7.51266L21.6291 5.21886C21.4198 5.09802 21.1554 5.1639 21.0387 5.36598L18.8683 9.12527C19.4071 9.03522 19.8635 9.33862 20.3813 9.6376C21.298 10.1668 21.5103 11.5492 20.7811 12.8122C20.1368 13.9281 19.2038 14.3464 18.048 13.679C17.5301 13.3801 17.0319 13.1493 16.8404 12.6376L14.7638 16.2345C14.6471 16.4366 14.7222 16.6985 14.9315 16.8193L19.4317 19.4175C18.7697 19.5292 18.1684 19.9155 17.8141 20.5292C17.1698 21.6451 17.5846 23.0911 18.7405 23.7584C19.8963 24.4257 21.356 24.062 22.0002 22.9461C22.3545 22.3324 22.3884 21.6185 22.1542 20.9893L26.1892 23.3189C26.3985 23.4398 26.6629 23.3739 26.7796 23.1718L28.8636 19.5622C29.072 19.912 29.3723 20.2172 29.7537 20.4374C30.9096 21.1047 32.3692 20.741 33.0135 19.6251C33.6577 18.5092 33.2429 17.0632 32.0871 16.3959Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
53
|
+
</svg>
|
|
54
|
+
)
|
|
55
|
+
break
|
|
56
|
+
|
|
57
|
+
default:
|
|
58
|
+
break
|
|
59
|
+
}
|
|
60
|
+
return icon
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
PlatformaticComposerIcon.propTypes = {
|
|
64
|
+
/**
|
|
65
|
+
* color of text, icon and borders
|
|
66
|
+
*/
|
|
67
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
68
|
+
/**
|
|
69
|
+
* Size
|
|
70
|
+
*/
|
|
71
|
+
size: PropTypes.oneOf(SIZES)
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
PlatformaticComposerIcon.defaultProps = {
|
|
75
|
+
color: MAIN_DARK_BLUE,
|
|
76
|
+
size: MEDIUM
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
export default PlatformaticComposerIcon
|
|
@@ -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 PlatformaticDBIcon = ({ color, size }) => {
|
|
7
|
+
const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
|
|
8
|
+
let icon = <></>
|
|
9
|
+
|
|
10
|
+
switch (size) {
|
|
11
|
+
case SMALL:
|
|
12
|
+
icon = (
|
|
13
|
+
<svg
|
|
14
|
+
width={16}
|
|
15
|
+
height={16}
|
|
16
|
+
viewBox='0 0 16 16'
|
|
17
|
+
fill='none'
|
|
18
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
19
|
+
className={className}
|
|
20
|
+
>
|
|
21
|
+
<path d='M7.99994 7.54958C9.44008 7.54958 10.6076 6.89339 10.6076 6.08393C10.6076 5.27448 9.44008 4.61829 7.99994 4.61829C6.5598 4.61829 5.39233 5.27448 5.39233 6.08393C5.39233 6.89339 6.5598 7.54958 7.99994 7.54958Z' stroke='none' strokeWidth={0.817424} strokeLinecap='round' strokeLinejoin='round' />
|
|
22
|
+
<path d='M10.6076 7.54956C10.6076 8.35901 9.44015 9.01521 7.99994 9.01521C6.55973 9.01521 5.39233 8.35901 5.39233 7.54956' stroke='none' strokeWidth={0.817424} strokeLinecap='round' strokeLinejoin='round' />
|
|
23
|
+
<path d='M5.39233 6.08386V9.01494C5.39233 9.82439 6.55973 10.4806 7.99994 10.4806C9.44015 10.4806 10.6076 9.82439 10.6076 9.01494V6.08386' stroke='none' strokeWidth={0.817424} strokeLinecap='round' strokeLinejoin='round' />
|
|
24
|
+
<path d='M3.31616 4.14833C4.41581 2.83875 6.10542 2 8.00008 2C11.3138 2 14.0001 4.56489 14.0001 7.72888C14.0001 10.8929 11.3138 13.4578 8.00008 13.4578C6.9002 13.4578 5.86944 13.1751 4.98303 12.682' stroke='none' strokeWidth={0.817424} strokeLinecap='round' strokeLinejoin='round' />
|
|
25
|
+
<path d='M2.13599 6.5105C2.24488 6.03013 2.41698 5.57233 2.64341 5.14514' stroke='none' strokeWidth={0.817424} strokeLinecap='round' strokeLinejoin='round' />
|
|
26
|
+
<path d='M2.1023 8.78753C2.03524 8.44434 2 8.09052 2 7.72888' stroke='none' strokeWidth={0.817424} strokeLinecap='round' strokeLinejoin='round' />
|
|
27
|
+
<path d='M2.81374 10.6113C2.68665 10.4034 2.57298 10.187 2.47363 9.96338' stroke='none' strokeWidth={0.817424} strokeLinecap='round' strokeLinejoin='round' />
|
|
28
|
+
<path d='M6.22998 11.9454L4.55493 12.5072L5.2922 14' stroke='none' strokeWidth={0.817424} strokeLinecap='round' strokeLinejoin='round' />
|
|
29
|
+
|
|
30
|
+
</svg>
|
|
31
|
+
)
|
|
32
|
+
break
|
|
33
|
+
case MEDIUM:
|
|
34
|
+
icon = (
|
|
35
|
+
<svg
|
|
36
|
+
width={24}
|
|
37
|
+
height={24}
|
|
38
|
+
viewBox='0 0 24 24'
|
|
39
|
+
fill='none'
|
|
40
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
41
|
+
className={className}
|
|
42
|
+
>
|
|
43
|
+
<path d='M11.9998 11.3243C14.16 11.3243 15.9112 10.34 15.9112 9.12584C15.9112 7.91166 14.16 6.92737 11.9998 6.92737C9.83958 6.92737 8.08838 7.91166 8.08838 9.12584C8.08838 10.34 9.83958 11.3243 11.9998 11.3243Z' stroke='none' strokeWidth={1.22614} strokeLinecap='round' strokeLinejoin='round' />
|
|
44
|
+
<path d='M15.9112 11.3243C15.9112 12.5385 14.1601 13.5228 11.9998 13.5228C9.83948 13.5228 8.08838 12.5385 8.08838 11.3243' stroke='none' strokeWidth={1.22614} strokeLinecap='round' strokeLinejoin='round' />
|
|
45
|
+
<path d='M8.08838 9.12585V13.5225C8.08838 14.7366 9.83948 15.7209 11.9998 15.7209C14.1601 15.7209 15.9112 14.7366 15.9112 13.5225V9.12585' stroke='none' strokeWidth={1.22614} strokeLinecap='round' strokeLinejoin='round' />
|
|
46
|
+
<path d='M4.97437 6.2225C6.62384 4.25813 9.15825 3 12.0002 3C16.9708 3 21.0002 6.84733 21.0002 11.5933C21.0002 16.3393 16.9708 20.1866 12.0002 20.1866C10.3504 20.1866 8.80427 19.7627 7.47467 19.0229' stroke='none' strokeWidth={1.22614} strokeLinecap='round' strokeLinejoin='round' />
|
|
47
|
+
<path d='M3.2041 9.7657C3.36745 9.04514 3.62559 8.35844 3.96524 7.71765' stroke='none' strokeWidth={1.22614} strokeLinecap='round' strokeLinejoin='round' />
|
|
48
|
+
<path d='M3.15346 13.1812C3.05286 12.6665 3 12.1357 3 11.5933' stroke='none' strokeWidth={1.22614} strokeLinecap='round' strokeLinejoin='round' />
|
|
49
|
+
<path d='M4.22036 15.917C4.02973 15.6051 3.85923 15.2804 3.71021 14.9451' stroke='none' strokeWidth={1.22614} strokeLinecap='round' strokeLinejoin='round' />
|
|
50
|
+
<path d='M9.3451 17.9181L6.83252 18.7608L7.93842 20.9999' stroke='none' strokeWidth={1.22614} strokeLinecap='round' strokeLinejoin='round' />
|
|
51
|
+
|
|
52
|
+
</svg>
|
|
53
|
+
)
|
|
54
|
+
break
|
|
55
|
+
case LARGE:
|
|
56
|
+
icon = (
|
|
57
|
+
<svg
|
|
58
|
+
width={40}
|
|
59
|
+
height={40}
|
|
60
|
+
viewBox='0 0 40 40'
|
|
61
|
+
fill='none'
|
|
62
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
63
|
+
className={className}
|
|
64
|
+
>
|
|
65
|
+
<path d='M19.9997 18.8739C23.6001 18.8739 26.5188 17.2334 26.5188 15.2098C26.5188 13.1861 23.6001 11.5457 19.9997 11.5457C16.3994 11.5457 13.4807 13.1861 13.4807 15.2098C13.4807 17.2334 16.3994 18.8739 19.9997 18.8739Z' stroke='none' strokeWidth={2.04356} strokeLinecap='round' strokeLinejoin='round' />
|
|
66
|
+
<path d='M26.519 18.8739C26.519 20.8975 23.6005 22.538 20 22.538C16.3995 22.538 13.481 20.8975 13.481 18.8739' stroke='none' strokeWidth={2.04356} strokeLinecap='round' strokeLinejoin='round' />
|
|
67
|
+
<path d='M13.481 15.2097V22.5374C13.481 24.561 16.3995 26.2015 20 26.2015C23.6005 26.2015 26.519 24.561 26.519 22.5374V15.2097' stroke='none' strokeWidth={2.04356} strokeLinecap='round' strokeLinejoin='round' />
|
|
68
|
+
<path d='M8.29053 10.3708C11.0397 7.09688 15.2637 5 20.0003 5C28.2846 5 35.0003 11.4122 35.0003 19.3222C35.0003 27.2322 28.2846 33.6444 20.0003 33.6444C17.2506 33.6444 14.6737 32.9378 12.4577 31.7049' stroke='none' strokeWidth={2.04356} strokeLinecap='round' strokeLinejoin='round' />
|
|
69
|
+
<path d='M5.34033 16.2762C5.61257 15.0753 6.04282 13.9308 6.6089 12.8628' stroke='none' strokeWidth={2.04356} strokeLinecap='round' strokeLinejoin='round' />
|
|
70
|
+
<path d='M5.25576 21.9688C5.08809 21.1108 5 20.2262 5 19.3221' stroke='none' strokeWidth={2.04356} strokeLinecap='round' strokeLinejoin='round' />
|
|
71
|
+
<path d='M7.0341 26.5283C6.71639 26.0084 6.43221 25.4674 6.18384 24.9084' stroke='none' strokeWidth={2.04356} strokeLinecap='round' strokeLinejoin='round' />
|
|
72
|
+
<path d='M15.5751 29.8635L11.3875 31.268L13.2306 34.9999' stroke='none' strokeWidth={2.04356} strokeLinecap='round' strokeLinejoin='round' />
|
|
73
|
+
</svg>
|
|
74
|
+
)
|
|
75
|
+
break
|
|
76
|
+
|
|
77
|
+
default:
|
|
78
|
+
break
|
|
79
|
+
}
|
|
80
|
+
return icon
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
PlatformaticDBIcon.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
|
+
|
|
94
|
+
PlatformaticDBIcon.defaultProps = {
|
|
95
|
+
color: MAIN_DARK_BLUE,
|
|
96
|
+
size: MEDIUM
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
export default PlatformaticDBIcon
|
|
@@ -0,0 +1,91 @@
|
|
|
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 PlatformaticRuntimeIcon = ({ color, size }) => {
|
|
7
|
+
const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
|
|
8
|
+
let icon = <></>
|
|
9
|
+
|
|
10
|
+
switch (size) {
|
|
11
|
+
case SMALL:
|
|
12
|
+
icon = (
|
|
13
|
+
<svg
|
|
14
|
+
width={16}
|
|
15
|
+
height={16}
|
|
16
|
+
viewBox='0 0 16 16'
|
|
17
|
+
fill='none'
|
|
18
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
19
|
+
className={className}
|
|
20
|
+
>
|
|
21
|
+
<ellipse cx='7.92262' cy='8.73084' rx='4.92262' ry='4.93592' stroke='none' />
|
|
22
|
+
<path d='M7.92237 3.79488V2M6.13232 2H9.71241' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
23
|
+
<path d='M11.7341 4.94341L12.3742 4.31607M11.7485 3.67432L12.9998 4.95783' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
24
|
+
<path d='M4.29733 5.01136L3.67458 4.36678M3.03174 4.99121L4.31743 3.74235' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
25
|
+
<path d='M9.48891 6.48699L7.92254 9.17931' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
26
|
+
|
|
27
|
+
</svg>
|
|
28
|
+
)
|
|
29
|
+
break
|
|
30
|
+
case MEDIUM:
|
|
31
|
+
icon = (
|
|
32
|
+
<svg
|
|
33
|
+
width={24}
|
|
34
|
+
height={24}
|
|
35
|
+
viewBox='0 0 24 24'
|
|
36
|
+
fill='none'
|
|
37
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
38
|
+
className={className}
|
|
39
|
+
>
|
|
40
|
+
<ellipse cx='11.8839' cy='13.0963' rx='7.38393' ry='7.40387' stroke='none' strokeWidth={1.5} />
|
|
41
|
+
<path d='M11.8838 5.69232V3M9.19873 3H14.5689' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
42
|
+
<path d='M17.6012 7.41535L18.5613 6.47436M17.6228 5.51172L19.4997 7.43699' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
43
|
+
<path d='M6.446 7.51704L5.51188 6.55017M4.54761 7.48682L6.47614 5.61353' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
44
|
+
<path d='M14.2335 9.73073L11.8839 13.7692' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
45
|
+
|
|
46
|
+
</svg>
|
|
47
|
+
)
|
|
48
|
+
break
|
|
49
|
+
case LARGE:
|
|
50
|
+
icon = (
|
|
51
|
+
<svg
|
|
52
|
+
width={40}
|
|
53
|
+
height={40}
|
|
54
|
+
viewBox='0 0 40 40'
|
|
55
|
+
fill='none'
|
|
56
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
57
|
+
className={className}
|
|
58
|
+
>
|
|
59
|
+
<ellipse cx='19.8066' cy='21.8271' rx='12.3066' ry='12.3398' stroke='none' strokeWidth={2} />
|
|
60
|
+
<path d='M19.8062 9.4872V5M15.3311 5H24.2813' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
61
|
+
<path d='M29.3356 12.3588L30.9357 10.7904M29.3716 9.18604L32.4998 12.3948' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
62
|
+
<path d='M10.7436 12.5279L9.1867 10.9165M7.57959 12.4775L10.7938 9.35539' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
63
|
+
<path d='M23.7224 16.2177L19.8065 22.9485' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
64
|
+
|
|
65
|
+
</svg>
|
|
66
|
+
)
|
|
67
|
+
break
|
|
68
|
+
|
|
69
|
+
default:
|
|
70
|
+
break
|
|
71
|
+
}
|
|
72
|
+
return icon
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
PlatformaticRuntimeIcon.propTypes = {
|
|
76
|
+
/**
|
|
77
|
+
* color of text, icon and borders
|
|
78
|
+
*/
|
|
79
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
80
|
+
/**
|
|
81
|
+
* Size
|
|
82
|
+
*/
|
|
83
|
+
size: PropTypes.oneOf(SIZES)
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
PlatformaticRuntimeIcon.defaultProps = {
|
|
87
|
+
color: MAIN_DARK_BLUE,
|
|
88
|
+
size: MEDIUM
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
export default PlatformaticRuntimeIcon
|
|
@@ -0,0 +1,91 @@
|
|
|
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 PlatformaticServiceIcon = ({ color, size }) => {
|
|
7
|
+
const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
|
|
8
|
+
let icon = <></>
|
|
9
|
+
|
|
10
|
+
switch (size) {
|
|
11
|
+
case SMALL:
|
|
12
|
+
icon = (
|
|
13
|
+
<svg
|
|
14
|
+
width={16}
|
|
15
|
+
height={16}
|
|
16
|
+
viewBox='0 0 16 16'
|
|
17
|
+
fill='none'
|
|
18
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
19
|
+
className={className}
|
|
20
|
+
>
|
|
21
|
+
<path d='M10.813 2.22453V2.71361C10.813 2.80669 10.874 2.89079 10.9658 2.92345L11.6214 3.15941C11.7106 3.19126 11.8119 3.16921 11.8771 3.10226L12.192 2.78056C12.2847 2.68585 12.4426 2.68503 12.5361 2.77975L13.2964 3.54561C13.3813 3.63134 13.3822 3.76443 13.2989 3.85098L12.8939 4.27392C12.8296 4.34087 12.8141 4.43803 12.8544 4.51968L13.129 5.08306C13.1676 5.16226 13.2517 5.2137 13.3436 5.2137H13.764C13.8945 5.2137 14 5.31412 14 5.43823V6.38372C14 6.50783 13.8945 6.60826 13.764 6.60826H13.3221C13.22 6.60826 13.129 6.67113 13.0973 6.76339L12.8742 7.41413C12.8476 7.49088 12.8665 7.57498 12.924 7.63458L13.2869 8.01588C13.3753 8.10896 13.3667 8.25348 13.2672 8.33594L12.4305 9.03241C12.3344 9.11242 12.1886 9.10508 12.1019 9.01608L11.8101 8.71724C11.7466 8.65193 11.648 8.62825 11.5596 8.65764L10.9503 8.86013C10.8551 8.89197 10.7916 8.97689 10.7916 9.07242V9.5174C10.7916 9.64151 10.686 9.74194 10.5556 9.74194H9.44353C9.3131 9.74194 9.20755 9.64151 9.20755 9.5174V9.07242C9.20755 8.97689 9.14405 8.89197 9.0488 8.86013L8.43956 8.65764C8.35117 8.62825 8.25249 8.65111 8.18899 8.71724L7.89724 9.01608C7.81058 9.10508 7.6647 9.11242 7.56859 9.03241L6.73195 8.33594C6.63241 8.25348 6.62383 8.10896 6.71222 8.01588L7.07519 7.63458C7.13182 7.57498 7.1507 7.49088 7.12496 7.41413L6.90186 6.76339C6.87011 6.67113 6.77915 6.60826 6.67704 6.60826H6.23598C6.10555 6.60826 6 6.50783 6 6.38372V5.43823C6 5.31412 6.10555 5.2137 6.23598 5.2137H6.65644C6.74826 5.2137 6.83235 5.16307 6.87096 5.08306L7.14555 4.51968C7.18588 4.43722 7.16958 4.34087 7.10608 4.27392L6.70106 3.85098C6.61783 3.76443 6.61868 3.63053 6.70364 3.54561L7.46391 2.77975C7.55744 2.68585 7.71533 2.68585 7.808 2.78056L8.12292 3.10226C8.18814 3.16921 8.28939 3.19126 8.37863 3.15941L9.03422 2.92345C9.12603 2.89079 9.18696 2.80669 9.18696 2.71361V2.22453C9.18696 2.10043 9.2925 2 9.42293 2H10.5771C10.7075 2 10.813 2.10043 10.813 2.22453Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
22
|
+
<path d='M11.5 7H8.5L10 4L11.5 7Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
23
|
+
<path d='M4 5.09668H2V11.2902H11.6V11.1289' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
|
|
24
|
+
<rect x='5.2002' y='11.2903' width='3.2' height='1.54839' stroke='none' />
|
|
25
|
+
<path d='M3.6001 12.8386H10.0001V13.9999H3.6001V12.8386Z' stroke='none' strokeLinejoin='round' />
|
|
26
|
+
|
|
27
|
+
</svg>
|
|
28
|
+
)
|
|
29
|
+
break
|
|
30
|
+
case MEDIUM:
|
|
31
|
+
icon = (
|
|
32
|
+
<svg
|
|
33
|
+
width={24}
|
|
34
|
+
height={24}
|
|
35
|
+
viewBox='0 0 24 24'
|
|
36
|
+
fill='none'
|
|
37
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
38
|
+
className={className}
|
|
39
|
+
>
|
|
40
|
+
<path d='M16.2196 3.3368V4.07042C16.2196 4.21003 16.311 4.33618 16.4487 4.38517L17.4321 4.73912C17.5659 4.78688 17.7178 4.75382 17.8156 4.65339L18.288 4.17084C18.427 4.02877 18.6638 4.02755 18.8041 4.16962L19.9445 5.31842C20.072 5.44701 20.0733 5.64664 19.9484 5.77647L19.3409 6.41088C19.2443 6.51131 19.2212 6.65705 19.2817 6.77952L19.6936 7.62459C19.7515 7.74338 19.8776 7.82054 20.0153 7.82054H20.646C20.8417 7.82054 21 7.97118 21 8.15734V9.57558C21 9.76174 20.8417 9.91238 20.646 9.91238H19.9832C19.83 9.91238 19.6936 10.0067 19.6459 10.1451L19.3113 11.1212C19.2714 11.2363 19.2997 11.3625 19.3859 11.4519L19.9304 12.0238C20.063 12.1634 20.0501 12.3802 19.9008 12.5039L18.6458 13.5486C18.5017 13.6686 18.2828 13.6576 18.1528 13.5241L17.7152 13.0759C17.62 12.9779 17.472 12.9424 17.3394 12.9865L16.4255 13.2902C16.2826 13.338 16.1874 13.4653 16.1874 13.6086V14.2761C16.1874 14.4623 16.0291 14.6129 15.8334 14.6129H14.1653C13.9696 14.6129 13.8113 14.4623 13.8113 14.2761V13.6086C13.8113 13.4653 13.7161 13.338 13.5732 13.2902L12.6593 12.9865C12.5268 12.9424 12.3787 12.9767 12.2835 13.0759L11.8459 13.5241C11.7159 13.6576 11.4971 13.6686 11.3529 13.5486L10.0979 12.5039C9.94862 12.3802 9.93575 12.1634 10.0683 12.0238L10.6128 11.4519C10.6977 11.3625 10.7261 11.2363 10.6874 11.1212L10.3528 10.1451C10.3052 10.0067 10.1687 9.91238 10.0156 9.91238H9.35396C9.15832 9.91238 9 9.76174 9 9.57558V8.15734C9 7.97118 9.15832 7.82054 9.35396 7.82054H9.98466C10.1224 7.82054 10.2485 7.74461 10.3064 7.62459L10.7183 6.77952C10.7788 6.65582 10.7544 6.51131 10.6591 6.41088L10.0516 5.77647C9.92674 5.64664 9.92803 5.44579 10.0555 5.31842L11.1959 4.16962C11.3362 4.02877 11.573 4.02877 11.712 4.17084L12.1844 4.65339C12.2822 4.75382 12.4341 4.78688 12.568 4.73912L13.5513 4.38517C13.689 4.33618 13.7804 4.21003 13.7804 4.07042V3.3368C13.7804 3.15064 13.9388 3 14.1344 3H15.8656C16.0612 3 16.2196 3.15064 16.2196 3.3368Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
41
|
+
<path d='M17.25 10.5H12.75L15 6L17.25 10.5Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
42
|
+
<path d='M6 7.64502H3V16.9353H17.4V16.6934' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
|
|
43
|
+
<rect x='7.7998' y='16.9353' width='4.8' height='2.32258' stroke='none' strokeWidth={1.5} />
|
|
44
|
+
<path d='M5.3999 19.2578H14.9999V20.9997H5.3999V19.2578Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
|
|
45
|
+
|
|
46
|
+
</svg>
|
|
47
|
+
)
|
|
48
|
+
break
|
|
49
|
+
case LARGE:
|
|
50
|
+
icon = (
|
|
51
|
+
<svg
|
|
52
|
+
width={40}
|
|
53
|
+
height={40}
|
|
54
|
+
viewBox='0 0 40 40'
|
|
55
|
+
fill='none'
|
|
56
|
+
xmlns='http://www.w3.org/2000/svg'
|
|
57
|
+
className={className}
|
|
58
|
+
>
|
|
59
|
+
<path d='M27.0326 5.56134V6.78403C27.0326 7.01672 27.1849 7.22697 27.4145 7.30862L29.0534 7.89853C29.2765 7.97814 29.5297 7.92303 29.6927 7.75565L30.48 6.95141C30.7117 6.71462 31.1064 6.71258 31.3402 6.94936L33.2409 8.86403C33.4533 9.07836 33.4554 9.41107 33.2473 9.62744L32.2348 10.6848C32.0739 10.8522 32.0353 11.0951 32.1361 11.2992L32.8226 12.7076C32.9191 12.9056 33.1294 13.0342 33.3589 13.0342H34.4101C34.7361 13.0342 35 13.2853 35 13.5956V15.9593C35 16.2696 34.7361 16.5206 34.4101 16.5206H33.3053C33.05 16.5206 32.8226 16.6778 32.7432 16.9085L32.1855 18.5353C32.119 18.7272 32.1661 18.9374 32.3099 19.0865L33.2173 20.0397C33.4383 20.2724 33.4168 20.6337 33.168 20.8399L31.0764 22.581C30.8361 22.7811 30.4714 22.7627 30.2547 22.5402L29.5254 21.7931C29.3666 21.6298 29.1199 21.5706 28.899 21.6441L27.3758 22.1503C27.1377 22.2299 26.979 22.4422 26.979 22.681V23.7935C26.979 24.1038 26.7151 24.3548 26.389 24.3548H23.6088C23.2827 24.3548 23.0189 24.1038 23.0189 23.7935V22.681C23.0189 22.4422 22.8601 22.2299 22.622 22.1503L21.0989 21.6441C20.8779 21.5706 20.6312 21.6278 20.4725 21.7931L19.7431 22.5402C19.5264 22.7627 19.1618 22.7811 18.9215 22.581L16.8299 20.8399C16.581 20.6337 16.5596 20.2724 16.7805 20.0397L17.688 19.0865C17.8296 18.9374 17.8768 18.7272 17.8124 18.5353L17.2546 16.9085C17.1753 16.6778 16.9479 16.5206 16.6926 16.5206H15.5899C15.2639 16.5206 15 16.2696 15 15.9593V13.5956C15 13.2853 15.2639 13.0342 15.5899 13.0342H16.6411C16.8706 13.0342 17.0809 12.9077 17.1774 12.7076L17.8639 11.2992C17.9647 11.093 17.924 10.8522 17.7652 10.6848L16.7527 9.62744C16.5446 9.41107 16.5467 9.07631 16.7591 8.86403L18.6598 6.94936C18.8936 6.71462 19.2883 6.71462 19.52 6.95141L20.3073 7.75565C20.4703 7.92303 20.7235 7.97814 20.9466 7.89853L22.5855 7.30862C22.8151 7.22697 22.9674 7.01672 22.9674 6.78403V5.56134C22.9674 5.25107 23.2313 5 23.5573 5H26.4427C26.7687 5 27.0326 5.25107 27.0326 5.56134Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
60
|
+
<path d='M28.75 17.5H21.25L25 10L28.75 17.5Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
61
|
+
<path d='M10 12.7417H5V28.2256H29V27.8223' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
|
|
62
|
+
<rect x='13' y='28.2256' width='8' height='3.87097' stroke='none' strokeWidth={2} />
|
|
63
|
+
<path d='M9 32.0964H25V34.9997H9V32.0964Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
|
|
64
|
+
|
|
65
|
+
</svg>
|
|
66
|
+
)
|
|
67
|
+
break
|
|
68
|
+
|
|
69
|
+
default:
|
|
70
|
+
break
|
|
71
|
+
}
|
|
72
|
+
return icon
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
PlatformaticServiceIcon.propTypes = {
|
|
76
|
+
/**
|
|
77
|
+
* color of text, icon and borders
|
|
78
|
+
*/
|
|
79
|
+
color: PropTypes.oneOf(COLORS_ICON),
|
|
80
|
+
/**
|
|
81
|
+
* Size
|
|
82
|
+
*/
|
|
83
|
+
size: PropTypes.oneOf(SIZES)
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
PlatformaticServiceIcon.defaultProps = {
|
|
87
|
+
color: MAIN_DARK_BLUE,
|
|
88
|
+
size: MEDIUM
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
export default PlatformaticServiceIcon
|