@platformatic/ui-components 0.8.10 → 0.9.1

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/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-CIB0_B4X.js"></script>
7
+ <script type="module" crossorigin src="/assets/index-B8zIOVxw.js"></script>
8
8
  <link rel="stylesheet" crossorigin href="/assets/index-Bj5xxPry.css">
9
9
  </head>
10
10
  <body>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@platformatic/ui-components",
3
3
  "description": "Platformatic UI Components",
4
- "version": "0.8.10",
4
+ "version": "0.9.1",
5
5
  "type": "module",
6
6
  "license": "Apache-2.0",
7
7
  "repository": {
@@ -31,7 +31,7 @@
31
31
  },
32
32
  "devDependencies": {
33
33
  "@babel/core": "^7.19.3",
34
- "@chromatic-com/storybook": "^1.3.3",
34
+ "@chromatic-com/storybook": "^3.0.0",
35
35
  "@fastify/pre-commit": "^2.0.2",
36
36
  "@storybook/addon-actions": "^8.0.8",
37
37
  "@storybook/addon-essentials": "^8.0.8",
@@ -45,15 +45,15 @@
45
45
  "@types/react-dom": "^18.0.6",
46
46
  "@vitejs/plugin-react": "^4.0.0",
47
47
  "babel-loader": "^9.0.0",
48
- "happy-dom": "^14.0.0",
49
- "jsdom": "^25.0.0",
48
+ "happy-dom": "^16.0.0",
49
+ "jsdom": "^26.0.0",
50
50
  "react-test-renderer": "^18.2.0",
51
51
  "snazzy": "^9.0.0",
52
52
  "standard": "^17.0.0",
53
53
  "storybook": "^8.0.8",
54
54
  "tailwindcss": "^3.1.8",
55
55
  "vite": "^5.0.0",
56
- "vitest": "^1.0.0"
56
+ "vitest": "^3.0.0"
57
57
  },
58
58
  "standard": {
59
59
  "globals": [
@@ -0,0 +1,100 @@
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 AppOptimizedIcon = ({
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='M2 4.87462V10.5015L4 11.5' stroke='white' strokeLinecap='round' strokeLinejoin='round' />
33
+ <path d='M12.5403 4.73772L7.27017 2L2 4.73772L7 7.5M12.5403 4.73772V7.74927M12.5403 4.73772L10.7542 5.66556' stroke='white' strokeLinecap='round' strokeLinejoin='round' />
34
+ <path d='M10.1379 7.5C10.3586 8.3 11.7011 9.5 12.3447 10V13.25C12.3447 13.65 11.2413 13.9167 10.6896 14H8.2069C7.10348 14 7.01153 13.3333 7.10348 13C6.91958 12.9167 6.55177 12.7 6.55177 12.5C6.55177 12.3 6.73568 12.0833 6.82763 12C6.55177 12 6.00006 11.9 6.00006 11.5C6.00006 11.1 6.36787 10.8333 6.55177 10.75C6.36787 10.75 6.00006 10.6 6.00006 10C6.00006 9.4 6.55177 9.25 6.82763 9.25H9.03447L8.48276 7.25C8.39081 6.83333 8.37242 6 9.03447 6C9.86203 6 9.86203 6.5 10.1379 7.5Z' stroke='white' strokeLinecap='round' strokeLinejoin='round' />
35
+ <path d='M12.3449 9.75011H14V13.7501H12.3449V9.75011Z' stroke='white' 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
+ >
49
+ <path d='M3 7.31193V15.7522L6 17.25' stroke='white' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
50
+ <path d='M18.8105 7.10658L10.9053 3L3 7.10658L10.5 11.25M18.8105 7.10658V11.6239M18.8105 7.10658L16.1313 8.49834' stroke='white' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
51
+ <path d='M15.2068 11.25C15.5379 12.45 17.5516 14.25 18.5171 15V19.875C18.5171 20.475 16.862 20.875 16.0344 21H12.3104C10.6552 21 10.5173 20 10.6552 19.5C10.3794 19.375 9.82766 19.05 9.82766 18.75C9.82766 18.45 10.1035 18.125 10.2414 18C9.82766 18 9.00009 17.85 9.00009 17.25C9.00009 16.65 9.5518 16.25 9.82766 16.125C9.5518 16.125 9.00009 15.9 9.00009 15C9.00009 14.1 9.82766 13.875 10.2414 13.875H13.5517L12.7241 10.875C12.5862 10.25 12.5586 9 13.5517 9C14.793 9 14.793 9.75 15.2068 11.25Z' stroke='white' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
52
+ <path d='M18.5173 14.6252H21V20.6252H18.5173V14.6252Z' stroke='white' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
53
+
54
+ </svg>
55
+ )
56
+ break
57
+ case LARGE:
58
+ icon = (
59
+ <svg
60
+ width={40}
61
+ height={40}
62
+ viewBox='0 0 40 40'
63
+ fill='none'
64
+ xmlns='http://www.w3.org/2000/svg'
65
+ className={className}
66
+ >
67
+ <path d='M5 12.1866V26.2537L10 28.75' stroke='white' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
68
+ <path d='M31.3508 11.8443L18.1754 5L5 11.8443L17.5 18.75M31.3508 11.8443V19.3732M31.3508 11.8443L26.8856 14.1639' stroke='white' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
69
+ <path d='M25.3447 18.75C25.8964 20.75 29.2527 23.75 30.8618 25V33.125C30.8618 34.125 28.1033 34.7917 26.724 35H20.5173C17.7587 35 17.5288 33.3333 17.7587 32.5C17.2989 32.2917 16.3794 31.75 16.3794 31.25C16.3794 30.75 16.8392 30.2083 17.0691 30C16.3794 30 15.0002 29.75 15.0002 28.75C15.0002 27.75 15.9197 27.0833 16.3794 26.875C15.9197 26.875 15.0002 26.5 15.0002 25C15.0002 23.5 16.3794 23.125 17.0691 23.125H22.5862L21.2069 18.125C20.977 17.0833 20.931 15 22.5862 15C24.6551 15 24.6551 16.25 25.3447 18.75Z' stroke='white' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
70
+ <path d='M30.8622 24.3753H35V34.3753H30.8622V24.3753Z' stroke='white' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
71
+ </svg>
72
+ )
73
+ break
74
+
75
+ default:
76
+ break
77
+ }
78
+ return icon
79
+ }
80
+
81
+ AppOptimizedIcon.propTypes = {
82
+ /**
83
+ * color of text, icon and borders
84
+ */
85
+ color: PropTypes.oneOf(COLORS_ICON),
86
+ /**
87
+ * Size
88
+ */
89
+ size: PropTypes.oneOf(SIZES),
90
+ /**
91
+ * disabled
92
+ */
93
+ disabled: PropTypes.bool,
94
+ /**
95
+ * inactive
96
+ */
97
+ inactive: PropTypes.bool
98
+ }
99
+
100
+ export default AppOptimizedIcon
@@ -29,8 +29,8 @@ const CircleCheckMarkButtonIcon = ({
29
29
  xmlns='http://www.w3.org/2000/svg'
30
30
  className={className}
31
31
  >
32
- <circle cx='13' cy='13' r='12' stroke='none' strokeWidth='1.5' />
33
- <path d='M7 13L12 17L19 9' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
32
+ <circle cx='13' cy='13' r='12' stroke='none' strokeWidth={1.5} />
33
+ <path d='M7 13L12 17L19 9' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
34
34
  </svg>
35
35
  )
36
36
  break
@@ -47,10 +47,10 @@ const CircleCopyPasteIcon = ({
47
47
  xmlns='http://www.w3.org/2000/svg'
48
48
  className={className}
49
49
  >
50
- <circle cx='13' cy='13' r='12' stroke='none' strokeWidth='1.5' />
51
- <path d='M10.499 19.7504V9.30664C10.499 8.89243 10.8348 8.55664 11.249 8.55664H16.122C16.3063 8.55664 16.4841 8.62449 16.6215 8.74724L20.2486 11.9864C20.4079 12.1287 20.499 12.3322 20.499 12.5458V19.7504C20.499 20.1646 20.1632 20.5004 19.749 20.5004H11.249C10.8348 20.5004 10.499 20.1646 10.499 19.7504Z' stroke='none' strokeWidth='1.5' strokeLinecap='round' />
52
- <path d='M16.124 12.737V8.55664L20.499 12.737H16.124Z' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
53
- <path d='M14.875 7.95903L12.2454 5.68293C12.1091 5.56495 11.9349 5.50001 11.7546 5.50001H8.76704H6.25C5.83579 5.50001 5.5 5.83579 5.5 6.25001L5.50001 16.1669C5.50001 16.5811 5.83579 16.9169 6.25001 16.9169H9.87501' stroke='none' strokeWidth='1.5' strokeLinecap='round' />
50
+ <circle cx='13' cy='13' r='12' stroke='none' strokeWidth={1.5} />
51
+ <path d='M10.499 19.7504V9.30664C10.499 8.89243 10.8348 8.55664 11.249 8.55664H16.122C16.3063 8.55664 16.4841 8.62449 16.6215 8.74724L20.2486 11.9864C20.4079 12.1287 20.499 12.3322 20.499 12.5458V19.7504C20.499 20.1646 20.1632 20.5004 19.749 20.5004H11.249C10.8348 20.5004 10.499 20.1646 10.499 19.7504Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
52
+ <path d='M16.124 12.737V8.55664L20.499 12.737H16.124Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
53
+ <path d='M14.875 7.95903L12.2454 5.68293C12.1091 5.56495 11.9349 5.50001 11.7546 5.50001H8.76704H6.25C5.83579 5.50001 5.5 5.83579 5.5 6.25001L5.50001 16.1669C5.50001 16.5811 5.83579 16.9169 6.25001 16.9169H9.87501' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
54
54
  </svg>
55
55
  )
56
56
  break
@@ -48,10 +48,10 @@ const CircleEditIcon = ({
48
48
  xmlns='http://www.w3.org/2000/svg'
49
49
  className={className}
50
50
  >
51
- <circle cx='13' cy='13' r='12' stroke='none' strokeWidth='1.5' />
52
- <rect x='16.083' y='7.75977' width='3.17647' height='11.6471' transform='rotate(45 16.083 7.75977)' stroke='none' strokeWidth='1.5' strokeLinejoin='round' />
53
- <path d='M10.0928 18.2402L7.84668 15.9941L6.72363 19.3633L10.0928 18.2402Z' stroke='none' strokeWidth='1.5' strokeLinejoin='round' />
54
- <path d='M17.2684 6.57238C17.8542 5.98659 18.804 5.98659 19.3898 6.57238L19.5145 6.69716C20.1003 7.28295 20.1003 8.2327 19.5145 8.81848L18.3291 10.0039L16.083 7.75782L17.2684 6.57238Z' stroke='none' strokeWidth='1.5' />
51
+ <circle cx='13' cy='13' r='12' stroke='none' strokeWidth={1.5} />
52
+ <rect x='16.083' y='7.75977' width='3.17647' height='11.6471' transform='rotate(45 16.083 7.75977)' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
53
+ <path d='M10.0928 18.2402L7.84668 15.9941L6.72363 19.3633L10.0928 18.2402Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
54
+ <path d='M17.2684 6.57238C17.8542 5.98659 18.804 5.98659 19.3898 6.57238L19.5145 6.69716C20.1003 7.28295 20.1003 8.2327 19.5145 8.81848L18.3291 10.0039L16.083 7.75782L17.2684 6.57238Z' stroke='none' strokeWidth={1.5} />
55
55
 
56
56
  </svg>
57
57
  )
@@ -47,10 +47,10 @@ const CircleRestartIcon = ({
47
47
  xmlns='http://www.w3.org/2000/svg'
48
48
  className={className}
49
49
  >
50
- <circle cx='13' cy='13' r='12' stroke='none' strokeWidth='1.5' />
51
- <path d='M7.07675 8.85276C8.34335 6.83189 10.5092 5.5 12.9683 5.5C16.8729 5.5 20.0382 8.85786 20.0382 13C20.0382 13.7532 19.9335 14.4805 19.7388 15.1664M5.99619 11.75C5.9319 12.1565 5.89844 12.5741 5.89844 13C5.89844 17.1421 9.06373 20.5 12.9683 20.5C15.0799 20.5 16.9753 19.518 18.2707 17.9609' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
52
- <path d='M17.8574 12.8125L19.7043 15.2471L21.9992 13.2879' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
53
- <path d='M8.15723 13.5273L5.93706 11.4735L4.00095 13.8287' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
50
+ <circle cx='13' cy='13' r='12' stroke='none' strokeWidth={1.5} />
51
+ <path d='M7.07675 8.85276C8.34335 6.83189 10.5092 5.5 12.9683 5.5C16.8729 5.5 20.0382 8.85786 20.0382 13C20.0382 13.7532 19.9335 14.4805 19.7388 15.1664M5.99619 11.75C5.9319 12.1565 5.89844 12.5741 5.89844 13C5.89844 17.1421 9.06373 20.5 12.9683 20.5C15.0799 20.5 16.9753 19.518 18.2707 17.9609' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
52
+ <path d='M17.8574 12.8125L19.7043 15.2471L21.9992 13.2879' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
53
+ <path d='M8.15723 13.5273L5.93706 11.4735L4.00095 13.8287' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
54
54
  </svg>
55
55
  )
56
56
  break
@@ -0,0 +1,100 @@
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 CollapseIcon = ({
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='M13.1426 7.14258L8.85686 7.14258L8.85686 2.85686' stroke='white' strokeLinecap='round' strokeLinejoin='round' />
33
+ <path d='M14.0004 2L9.28613 6.71429' stroke='white' strokeLinecap='round' strokeLinejoin='round' />
34
+ <path d='M2.85742 8.85742L7.14314 8.85742L7.14314 13.1431' stroke='white' strokeLinecap='round' strokeLinejoin='round' />
35
+ <path d='M6.71429 9.28613L2 14.0004' stroke='white' 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
+ >
49
+ <path d='M19.7139 10.7144L13.2853 10.7144L13.2853 4.28578' stroke='white' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
50
+ <path d='M21.0001 3L13.9287 10.0714' stroke='white' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
51
+ <path d='M4.28613 13.2856L10.7147 13.2856L10.7147 19.7142' stroke='white' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
52
+ <path d='M10.0714 13.9287L3 21.0001' stroke='white' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
53
+
54
+ </svg>
55
+ )
56
+ break
57
+ case LARGE:
58
+ icon = (
59
+ <svg
60
+ width={40}
61
+ height={40}
62
+ viewBox='0 0 40 40'
63
+ fill='none'
64
+ xmlns='http://www.w3.org/2000/svg'
65
+ className={className}
66
+ >
67
+ <path d='M32.8574 17.8569L22.1431 17.8569L22.1431 7.14265' stroke='white' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
68
+ <path d='M35.0006 5L23.2148 16.7857' stroke='white' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
69
+ <path d='M7.14355 22.1431L17.8578 22.1431L17.8578 32.8574' stroke='white' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
70
+ <path d='M16.7857 23.2144L5 35.0001' stroke='white' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
71
+ </svg>
72
+ )
73
+ break
74
+
75
+ default:
76
+ break
77
+ }
78
+ return icon
79
+ }
80
+
81
+ CollapseIcon.propTypes = {
82
+ /**
83
+ * color of text, icon and borders
84
+ */
85
+ color: PropTypes.oneOf(COLORS_ICON),
86
+ /**
87
+ * Size
88
+ */
89
+ size: PropTypes.oneOf(SIZES),
90
+ /**
91
+ * disabled
92
+ */
93
+ disabled: PropTypes.bool,
94
+ /**
95
+ * inactive
96
+ */
97
+ inactive: PropTypes.bool
98
+ }
99
+
100
+ export default CollapseIcon
@@ -47,11 +47,11 @@ const ConfigureDatabaseIcon = ({
47
47
  xmlns='http://www.w3.org/2000/svg'
48
48
  className={className}
49
49
  >
50
- <path d='M8.99999 7.8072C12.3137 7.8072 15 6.73107 15 5.4036C15 4.07613 12.3137 3 8.99999 3C5.68629 3 3 4.07613 3 5.4036C3 6.73107 5.68629 7.8072 8.99999 7.8072Z' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
51
- <path d='M3 9.08593C3 10.134 4.67489 11.0255 7.01069 11.3542' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
52
- <path d='M3 5.4043V12.5971C3 13.5914 4.50751 14.4448 6.65669 14.8104' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
53
- <path d='M15.0008 17.3286C16.2555 17.3286 17.2726 16.3286 17.2726 15.0949C17.2726 13.8613 16.2555 12.8612 15.0008 12.8612C13.7461 12.8612 12.729 13.8613 12.729 15.0949C12.729 16.3286 13.7461 17.3286 15.0008 17.3286Z' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
54
- <path d='M16.2196 9.34803V10.1061C16.2196 10.2504 16.311 10.3807 16.4487 10.4313L17.4321 10.7971C17.5659 10.8464 17.7178 10.8123 17.8156 10.7085L18.288 10.2099C18.427 10.0631 18.6638 10.0618 18.8041 10.2086L19.9445 11.3957C20.072 11.5286 20.0733 11.7349 19.9484 11.869L19.3409 12.5246C19.2443 12.6283 19.2212 12.7789 19.2817 12.9055L19.6936 13.7787C19.7515 13.9015 19.8776 13.9812 20.0153 13.9812H20.646C20.8417 13.9812 21 14.1369 21 14.3293V15.7948C21 15.9871 20.8417 16.1428 20.646 16.1428H19.9832C19.83 16.1428 19.6936 16.2402 19.6459 16.3833L19.3113 17.3919C19.2714 17.5109 19.2997 17.6412 19.3859 17.7336L19.9304 18.3246C20.063 18.4689 20.0501 18.6929 19.9008 18.8207L18.6458 19.9002C18.5017 20.0243 18.2828 20.0129 18.1528 19.8749L17.7152 19.4117C17.62 19.3105 17.472 19.2738 17.3394 19.3193L16.4255 19.6332C16.2826 19.6826 16.1874 19.8142 16.1874 19.9622V20.652C16.1874 20.8443 16.0291 21 15.8334 21H14.1653C13.9696 21 13.8113 20.8443 13.8113 20.652V19.9622C13.8113 19.8142 13.7161 19.6826 13.5732 19.6332L12.6593 19.3193C12.5268 19.2738 12.3787 19.3092 12.2835 19.4117L11.8459 19.8749C11.7159 20.0129 11.4971 20.0243 11.3529 19.9002L10.0979 18.8207C9.94862 18.6929 9.93575 18.4689 10.0683 18.3246L10.6128 17.7336C10.6977 17.6412 10.7261 17.5109 10.6874 17.3919L10.3528 16.3833C10.3052 16.2402 10.1687 16.1428 10.0156 16.1428H9.35396C9.15832 16.1428 9 15.9871 9 15.7948V14.3293C9 14.1369 9.15832 13.9812 9.35396 13.9812H9.98466C10.1224 13.9812 10.2485 13.9028 10.3064 13.7787L10.7183 12.9055C10.7788 12.7777 10.7544 12.6283 10.6591 12.5246L10.0516 11.869C9.92674 11.7349 9.92803 11.5273 10.0555 11.3957L11.1959 10.2086C11.3362 10.0631 11.573 10.0631 11.712 10.2099L12.1844 10.7085C12.2822 10.8123 12.4341 10.8464 12.568 10.7971L13.5513 10.4313C13.689 10.3807 13.7804 10.2504 13.7804 10.1061V9.34803C13.7804 9.15566 13.9388 9 14.1344 9H15.8656C16.0612 9 16.2196 9.15566 16.2196 9.34803Z' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
50
+ <path d='M8.99999 7.8072C12.3137 7.8072 15 6.73107 15 5.4036C15 4.07613 12.3137 3 8.99999 3C5.68629 3 3 4.07613 3 5.4036C3 6.73107 5.68629 7.8072 8.99999 7.8072Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
51
+ <path d='M3 9.08593C3 10.134 4.67489 11.0255 7.01069 11.3542' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
52
+ <path d='M3 5.4043V12.5971C3 13.5914 4.50751 14.4448 6.65669 14.8104' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
53
+ <path d='M15.0008 17.3286C16.2555 17.3286 17.2726 16.3286 17.2726 15.0949C17.2726 13.8613 16.2555 12.8612 15.0008 12.8612C13.7461 12.8612 12.729 13.8613 12.729 15.0949C12.729 16.3286 13.7461 17.3286 15.0008 17.3286Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
54
+ <path d='M16.2196 9.34803V10.1061C16.2196 10.2504 16.311 10.3807 16.4487 10.4313L17.4321 10.7971C17.5659 10.8464 17.7178 10.8123 17.8156 10.7085L18.288 10.2099C18.427 10.0631 18.6638 10.0618 18.8041 10.2086L19.9445 11.3957C20.072 11.5286 20.0733 11.7349 19.9484 11.869L19.3409 12.5246C19.2443 12.6283 19.2212 12.7789 19.2817 12.9055L19.6936 13.7787C19.7515 13.9015 19.8776 13.9812 20.0153 13.9812H20.646C20.8417 13.9812 21 14.1369 21 14.3293V15.7948C21 15.9871 20.8417 16.1428 20.646 16.1428H19.9832C19.83 16.1428 19.6936 16.2402 19.6459 16.3833L19.3113 17.3919C19.2714 17.5109 19.2997 17.6412 19.3859 17.7336L19.9304 18.3246C20.063 18.4689 20.0501 18.6929 19.9008 18.8207L18.6458 19.9002C18.5017 20.0243 18.2828 20.0129 18.1528 19.8749L17.7152 19.4117C17.62 19.3105 17.472 19.2738 17.3394 19.3193L16.4255 19.6332C16.2826 19.6826 16.1874 19.8142 16.1874 19.9622V20.652C16.1874 20.8443 16.0291 21 15.8334 21H14.1653C13.9696 21 13.8113 20.8443 13.8113 20.652V19.9622C13.8113 19.8142 13.7161 19.6826 13.5732 19.6332L12.6593 19.3193C12.5268 19.2738 12.3787 19.3092 12.2835 19.4117L11.8459 19.8749C11.7159 20.0129 11.4971 20.0243 11.3529 19.9002L10.0979 18.8207C9.94862 18.6929 9.93575 18.4689 10.0683 18.3246L10.6128 17.7336C10.6977 17.6412 10.7261 17.5109 10.6874 17.3919L10.3528 16.3833C10.3052 16.2402 10.1687 16.1428 10.0156 16.1428H9.35396C9.15832 16.1428 9 15.9871 9 15.7948V14.3293C9 14.1369 9.15832 13.9812 9.35396 13.9812H9.98466C10.1224 13.9812 10.2485 13.9028 10.3064 13.7787L10.7183 12.9055C10.7788 12.7777 10.7544 12.6283 10.6591 12.5246L10.0516 11.869C9.92674 11.7349 9.92803 11.5273 10.0555 11.3957L11.1959 10.2086C11.3362 10.0631 11.573 10.0631 11.712 10.2099L12.1844 10.7085C12.2822 10.8123 12.4341 10.8464 12.568 10.7971L13.5513 10.4313C13.689 10.3807 13.7804 10.2504 13.7804 10.1061V9.34803C13.7804 9.15566 13.9388 9 14.1344 9H15.8656C16.0612 9 16.2196 9.15566 16.2196 9.34803Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
55
55
  </svg>
56
56
  )
57
57
  break
@@ -65,11 +65,11 @@ const ConfigureDatabaseIcon = ({
65
65
  xmlns='http://www.w3.org/2000/svg'
66
66
  className={className}
67
67
  >
68
- <path d='M15 13.012C20.5228 13.012 25 11.2184 25 9.006C25 6.79355 20.5228 5 15 5C9.47715 5 5 6.79355 5 9.006C5 11.2184 9.47715 13.012 15 13.012Z' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
69
- <path d='M5 15.1432C5 16.89 7.79148 18.3758 11.6845 18.9237' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
70
- <path d='M5 9.00716V20.9951C5 22.6524 7.51252 24.0746 11.0945 24.6841' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
71
- <path d='M25.0014 28.881C27.0926 28.881 28.7878 27.2143 28.7878 25.1582C28.7878 23.1021 27.0926 21.4353 25.0014 21.4353C22.9103 21.4353 21.2151 23.1021 21.2151 25.1582C21.2151 27.2143 22.9103 28.881 25.0014 28.881Z' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
72
- <path d='M27.0326 15.58V16.8435C27.0326 17.0839 27.1849 17.3012 27.4145 17.3856L29.0534 17.9951C29.2765 18.0774 29.5297 18.0205 29.6927 17.8475L30.48 17.0165C30.7117 16.7718 31.1064 16.7697 31.3402 17.0143L33.2409 18.9928C33.4533 19.2143 33.4554 19.5581 33.2473 19.7817L32.2348 20.8743C32.0739 21.0472 32.0353 21.2982 32.1361 21.5092L32.8226 22.9646C32.9191 23.1692 33.1294 23.302 33.3589 23.302H34.4101C34.7361 23.302 35 23.5615 35 23.8821V26.3246C35 26.6452 34.7361 26.9047 34.4101 26.9047H33.3053C33.05 26.9047 32.8226 27.0671 32.7432 27.3054L32.1855 28.9865C32.119 29.1848 32.1661 29.402 32.3099 29.556L33.2173 30.541C33.4383 30.7815 33.4168 31.1548 33.168 31.3679L31.0764 33.1671C30.8361 33.3738 30.4714 33.3548 30.2547 33.1249L29.5254 32.3529C29.3666 32.1841 29.1199 32.123 28.899 32.1989L27.3758 32.722C27.1377 32.8043 26.979 33.0236 26.979 33.2704V34.42C26.979 34.7406 26.7151 35 26.389 35H23.6088C23.2827 35 23.0189 34.7406 23.0189 34.42V33.2704C23.0189 33.0236 22.8601 32.8043 22.622 32.722L21.0989 32.1989C20.8779 32.123 20.6312 32.182 20.4725 32.3529L19.7431 33.1249C19.5264 33.3548 19.1618 33.3738 18.9215 33.1671L16.8299 31.3679C16.581 31.1548 16.5596 30.7815 16.7805 30.541L17.688 29.556C17.8296 29.402 17.8768 29.1848 17.8124 28.9865L17.2546 27.3054C17.1753 27.0671 16.9479 26.9047 16.6926 26.9047H15.5899C15.2639 26.9047 15 26.6452 15 26.3246V23.8821C15 23.5615 15.2639 23.302 15.5899 23.302H16.6411C16.8706 23.302 17.0809 23.1713 17.1774 22.9646L17.8639 21.5092C17.9647 21.2961 17.924 21.0472 17.7652 20.8743L16.7527 19.7817C16.5446 19.5581 16.5467 19.2122 16.7591 18.9928L18.6598 17.0143C18.8936 16.7718 19.2883 16.7718 19.52 17.0165L20.3073 17.8475C20.4703 18.0205 20.7235 18.0774 20.9466 17.9951L22.5855 17.3856C22.8151 17.3012 22.9674 17.0839 22.9674 16.8435V15.58C22.9674 15.2594 23.2313 15 23.5573 15H26.4427C26.7687 15 27.0326 15.2594 27.0326 15.58Z' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
68
+ <path d='M15 13.012C20.5228 13.012 25 11.2184 25 9.006C25 6.79355 20.5228 5 15 5C9.47715 5 5 6.79355 5 9.006C5 11.2184 9.47715 13.012 15 13.012Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
69
+ <path d='M5 15.1432C5 16.89 7.79148 18.3758 11.6845 18.9237' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
70
+ <path d='M5 9.00716V20.9951C5 22.6524 7.51252 24.0746 11.0945 24.6841' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
71
+ <path d='M25.0014 28.881C27.0926 28.881 28.7878 27.2143 28.7878 25.1582C28.7878 23.1021 27.0926 21.4353 25.0014 21.4353C22.9103 21.4353 21.2151 23.1021 21.2151 25.1582C21.2151 27.2143 22.9103 28.881 25.0014 28.881Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
72
+ <path d='M27.0326 15.58V16.8435C27.0326 17.0839 27.1849 17.3012 27.4145 17.3856L29.0534 17.9951C29.2765 18.0774 29.5297 18.0205 29.6927 17.8475L30.48 17.0165C30.7117 16.7718 31.1064 16.7697 31.3402 17.0143L33.2409 18.9928C33.4533 19.2143 33.4554 19.5581 33.2473 19.7817L32.2348 20.8743C32.0739 21.0472 32.0353 21.2982 32.1361 21.5092L32.8226 22.9646C32.9191 23.1692 33.1294 23.302 33.3589 23.302H34.4101C34.7361 23.302 35 23.5615 35 23.8821V26.3246C35 26.6452 34.7361 26.9047 34.4101 26.9047H33.3053C33.05 26.9047 32.8226 27.0671 32.7432 27.3054L32.1855 28.9865C32.119 29.1848 32.1661 29.402 32.3099 29.556L33.2173 30.541C33.4383 30.7815 33.4168 31.1548 33.168 31.3679L31.0764 33.1671C30.8361 33.3738 30.4714 33.3548 30.2547 33.1249L29.5254 32.3529C29.3666 32.1841 29.1199 32.123 28.899 32.1989L27.3758 32.722C27.1377 32.8043 26.979 33.0236 26.979 33.2704V34.42C26.979 34.7406 26.7151 35 26.389 35H23.6088C23.2827 35 23.0189 34.7406 23.0189 34.42V33.2704C23.0189 33.0236 22.8601 32.8043 22.622 32.722L21.0989 32.1989C20.8779 32.123 20.6312 32.182 20.4725 32.3529L19.7431 33.1249C19.5264 33.3548 19.1618 33.3738 18.9215 33.1671L16.8299 31.3679C16.581 31.1548 16.5596 30.7815 16.7805 30.541L17.688 29.556C17.8296 29.402 17.8768 29.1848 17.8124 28.9865L17.2546 27.3054C17.1753 27.0671 16.9479 26.9047 16.6926 26.9047H15.5899C15.2639 26.9047 15 26.6452 15 26.3246V23.8821C15 23.5615 15.2639 23.302 15.5899 23.302H16.6411C16.8706 23.302 17.0809 23.1713 17.1774 22.9646L17.8639 21.5092C17.9647 21.2961 17.924 21.0472 17.7652 20.8743L16.7527 19.7817C16.5446 19.5581 16.5467 19.2122 16.7591 18.9928L18.6598 17.0143C18.8936 16.7718 19.2883 16.7718 19.52 17.0165L20.3073 17.8475C20.4703 18.0205 20.7235 18.0774 20.9466 17.9951L22.5855 17.3856C22.8151 17.3012 22.9674 17.0839 22.9674 16.8435V15.58C22.9674 15.2594 23.2313 15 23.5573 15H26.4427C26.7687 15 27.0326 15.2594 27.0326 15.58Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
73
73
 
74
74
  </svg>
75
75
  )
@@ -46,10 +46,10 @@ const DatabaseMigrationIcon = ({
46
46
  xmlns='http://www.w3.org/2000/svg'
47
47
  className={className}
48
48
  >
49
- <path d='M14.5271 11.6665C18.2675 11.293 21 10.1114 21 8.71158C21 7.80002 19.8412 6.98102 18 6.41744M9.22005 11.6398C5.61001 11.2393 3 10.0797 3 8.71158C3 7.80002 4.15875 6.98102 6 6.41744' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
50
- <path d='M21 13.4261C21 14.8602 18.1315 16.0653 14.25 16.407M3 13.4261C3 14.7662 5.50467 15.9063 9 16.3288' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
51
- <path d='M21 8.71157V17.9221C21 19.6219 16.97 20.9999 12 20.9999C7.03 20.9999 3 19.6219 3 17.9221V8.71157' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
52
- <path d='M12 18L12 3M12 3L8.25 7.5M12 3L15.75 7.5' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
49
+ <path d='M14.5271 11.6665C18.2675 11.293 21 10.1114 21 8.71158C21 7.80002 19.8412 6.98102 18 6.41744M9.22005 11.6398C5.61001 11.2393 3 10.0797 3 8.71158C3 7.80002 4.15875 6.98102 6 6.41744' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
50
+ <path d='M21 13.4261C21 14.8602 18.1315 16.0653 14.25 16.407M3 13.4261C3 14.7662 5.50467 15.9063 9 16.3288' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
51
+ <path d='M21 8.71157V17.9221C21 19.6219 16.97 20.9999 12 20.9999C7.03 20.9999 3 19.6219 3 17.9221V8.71157' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
52
+ <path d='M12 18L12 3M12 3L8.25 7.5M12 3L15.75 7.5' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
53
53
  </svg>
54
54
  )
55
55
  break
@@ -63,10 +63,10 @@ const DatabaseMigrationIcon = ({
63
63
  xmlns='http://www.w3.org/2000/svg'
64
64
  className={className}
65
65
  >
66
- <path d='M24.2118 19.4441C30.4458 18.8216 35 16.8523 35 14.5193C35 13 33.0687 11.635 30 10.6957M15.3668 19.3997C9.35001 18.7321 5 16.7994 5 14.5193C5 13 6.93125 11.635 10 10.6957' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
67
- <path d='M35 22.3769C35 24.767 30.2191 26.7755 23.75 27.345M5 22.3769C5 24.6103 9.17444 26.5104 15 27.2147' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
68
- <path d='M35 14.5193V29.8702C35 32.7031 28.2833 34.9999 20 34.9999C11.7167 34.9999 5 32.7031 5 29.8702V14.5193' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
69
- <path d='M20 30L20 5M20 5L13.75 12.5M20 5L26.25 12.5' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
66
+ <path d='M24.2118 19.4441C30.4458 18.8216 35 16.8523 35 14.5193C35 13 33.0687 11.635 30 10.6957M15.3668 19.3997C9.35001 18.7321 5 16.7994 5 14.5193C5 13 6.93125 11.635 10 10.6957' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
67
+ <path d='M35 22.3769C35 24.767 30.2191 26.7755 23.75 27.345M5 22.3769C5 24.6103 9.17444 26.5104 15 27.2147' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
68
+ <path d='M35 14.5193V29.8702C35 32.7031 28.2833 34.9999 20 34.9999C11.7167 34.9999 5 32.7031 5 29.8702V14.5193' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
69
+ <path d='M20 30L20 5M20 5L13.75 12.5M20 5L26.25 12.5' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
70
70
 
71
71
  </svg>
72
72
  )
@@ -62,9 +62,9 @@ const GitHubRepoIcon = ({
62
62
  <path d='M11.7773 18.3878C11.7776 18.4323 11.7653 18.4703 11.7172 18.4697C11.6373 18.4685 11.6009 18.4143 11.5912 18.3394C11.5858 18.2967 11.6 18.2575 11.649 18.2581C11.7297 18.259 11.7608 18.3176 11.7773 18.3881V18.3878Z' fill='none' className={filledClassName} />
63
63
  <path d='M11.5316 18.0482C11.5353 18.0957 11.5139 18.1219 11.476 18.1216C11.4115 18.1213 11.3702 18.0836 11.3599 18.0176C11.3528 17.973 11.3699 17.9347 11.4184 17.94C11.4802 17.9471 11.5167 17.9916 11.5316 18.0482Z' fill='none' className={filledClassName} />
64
64
  <path d='M11.2764 17.8052C11.2738 17.8511 11.2424 17.8662 11.2085 17.8629C11.1655 17.8585 11.1221 17.8405 11.1113 17.791C11.1022 17.7486 11.1313 17.7282 11.1695 17.7279C11.2219 17.7276 11.2578 17.7551 11.2764 17.8052Z' fill='none' className={filledClassName} />
65
- <path d='M8.99999 7.8072C12.3137 7.8072 15 6.73107 15 5.4036C15 4.07613 12.3137 3 8.99999 3C5.68629 3 3 4.07613 3 5.4036C3 6.73107 5.68629 7.8072 8.99999 7.8072Z' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
66
- <path d='M3 9.08593C3 10.134 4.67489 11.0255 7.01069 11.3542' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
67
- <path d='M3 5.4043V12.5971C3 13.5914 4.50751 14.4448 6.65669 14.8104' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
65
+ <path d='M8.99999 7.8072C12.3137 7.8072 15 6.73107 15 5.4036C15 4.07613 12.3137 3 8.99999 3C5.68629 3 3 4.07613 3 5.4036C3 6.73107 5.68629 7.8072 8.99999 7.8072Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
66
+ <path d='M3 9.08593C3 10.134 4.67489 11.0255 7.01069 11.3542' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
67
+ <path d='M3 5.4043V12.5971C3 13.5914 4.50751 14.4448 6.65669 14.8104' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
68
68
  </svg>
69
69
  )
70
70
  break
@@ -86,9 +86,9 @@ const GitHubRepoIcon = ({
86
86
  <path d='M19.6289 30.6463C19.6294 30.7205 19.609 30.7838 19.5287 30.7828C19.3957 30.7809 19.3349 30.6905 19.3187 30.5657C19.3097 30.4945 19.3334 30.4292 19.4151 30.4301C19.5496 30.4316 19.6014 30.5294 19.6289 30.6468V30.6463Z' fill='none' className={filledClassName} />
87
87
  <path d='M19.2193 30.0803C19.2254 30.1594 19.1898 30.2032 19.1266 30.2027C19.0192 30.2022 18.9504 30.1393 18.9332 30.0293C18.9214 29.9551 18.9499 29.8912 19.0306 29.9001C19.1337 29.9118 19.1945 29.986 19.2193 30.0803Z' fill='none' className={filledClassName} />
88
88
  <path d='M18.794 29.6753C18.7897 29.7519 18.7375 29.777 18.6809 29.7716C18.6092 29.7642 18.537 29.7342 18.5189 29.6517C18.5037 29.581 18.5522 29.5471 18.6158 29.5466C18.7033 29.5461 18.7631 29.5918 18.794 29.6753Z' fill='none' className={filledClassName} />
89
- <path d='M15 13.012C20.5228 13.012 25 11.2184 25 9.006C25 6.79355 20.5228 5 15 5C9.47715 5 5 6.79355 5 9.006C5 11.2184 9.47715 13.012 15 13.012Z' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
90
- <path d='M5 15.1432C5 16.89 7.79148 18.3758 11.6845 18.9237' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
91
- <path d='M5 9.00716V20.9951C5 22.6524 7.51252 24.0746 11.0945 24.6841' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
89
+ <path d='M15 13.012C20.5228 13.012 25 11.2184 25 9.006C25 6.79355 20.5228 5 15 5C9.47715 5 5 6.79355 5 9.006C5 11.2184 9.47715 13.012 15 13.012Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
90
+ <path d='M5 15.1432C5 16.89 7.79148 18.3758 11.6845 18.9237' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
91
+ <path d='M5 9.00716V20.9951C5 22.6524 7.51252 24.0746 11.0945 24.6841' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
92
92
 
93
93
  </svg>
94
94
  )
@@ -47,11 +47,11 @@ const NameAppIcon = ({
47
47
  xmlns='http://www.w3.org/2000/svg'
48
48
  className={className}
49
49
  >
50
- <path d='M6.75 4.43994H4C3.44772 4.43994 3 4.88766 3 5.43994V14.9599C3 15.5122 3.44772 15.9599 4 15.9599H20C20.5523 15.9599 21 15.5122 21 14.9599V5.43994C21 4.88766 20.5523 4.43994 20 4.43994H17.25' stroke='none' strokeWidth='1.5' strokeLinecap='round' />
51
- <rect x='9' y='15.96' width='6' height='2.88' stroke='none' strokeWidth='1.5' />
52
- <path d='M6 19.84C6 19.2877 6.44772 18.84 7 18.84H17C17.5523 18.84 18 19.2877 18 19.84V21H6V19.84Z' stroke='none' strokeWidth='1.5' />
53
- <path d='M12 3L12.6735 5.07295H14.8532L13.0898 6.3541L13.7634 8.42705L12 7.1459L10.2366 8.42705L10.9102 6.3541L9.14683 5.07295H11.3265L12 3Z' stroke='none' strokeWidth='1.5' strokeLinejoin='round' />
54
- <path d='M8.25 11.25V12.75M6 10.5H18V13.5H6V10.5Z' stroke='none' strokeWidth='1.5' strokeLinejoin='round' />
50
+ <path d='M6.75 4.43994H4C3.44772 4.43994 3 4.88766 3 5.43994V14.9599C3 15.5122 3.44772 15.9599 4 15.9599H20C20.5523 15.9599 21 15.5122 21 14.9599V5.43994C21 4.88766 20.5523 4.43994 20 4.43994H17.25' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
51
+ <rect x='9' y='15.96' width='6' height='2.88' stroke='none' strokeWidth={1.5} />
52
+ <path d='M6 19.84C6 19.2877 6.44772 18.84 7 18.84H17C17.5523 18.84 18 19.2877 18 19.84V21H6V19.84Z' stroke='none' strokeWidth={1.5} />
53
+ <path d='M12 3L12.6735 5.07295H14.8532L13.0898 6.3541L13.7634 8.42705L12 7.1459L10.2366 8.42705L10.9102 6.3541L9.14683 5.07295H11.3265L12 3Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
54
+ <path d='M8.25 11.25V12.75M6 10.5H18V13.5H6V10.5Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
55
55
 
56
56
  </svg>
57
57
  )
@@ -66,11 +66,11 @@ const NameAppIcon = ({
66
66
  xmlns='http://www.w3.org/2000/svg'
67
67
  className={className}
68
68
  >
69
- <path d='M11.25 7.40002H6C5.44772 7.40002 5 7.84774 5 8.40002V25.6C5 26.1523 5.44772 26.6 6 26.6H34C34.5523 26.6 35 26.1523 35 25.6V8.40002C35 7.84774 34.5523 7.40002 34 7.40002H28.75' stroke='none' strokeWidth='2' strokeLinecap='round' />
70
- <rect x='15' y='26.6' width='10' height='4.8' stroke='none' strokeWidth='2' />
71
- <path d='M10 32.4C10 31.8477 10.4477 31.4 11 31.4H29C29.5523 31.4 30 31.8477 30 32.4V35H10V32.4Z' stroke='none' strokeWidth='2' />
72
- <path d='M20 5L21.1226 8.45492H24.7553L21.8164 10.5902L22.9389 14.0451L20 11.9098L17.0611 14.0451L18.1836 10.5902L15.2447 8.45492H18.8774L20 5Z' stroke='none' strokeWidth='2' strokeLinejoin='round' />
73
- <path d='M13.75 17.5V22.5M10 17.5H30V22.5H10V17.5Z' stroke='none' strokeWidth='2' strokeLinejoin='round' />
69
+ <path d='M11.25 7.40002H6C5.44772 7.40002 5 7.84774 5 8.40002V25.6C5 26.1523 5.44772 26.6 6 26.6H34C34.5523 26.6 35 26.1523 35 25.6V8.40002C35 7.84774 34.5523 7.40002 34 7.40002H28.75' stroke='none' strokeWidth={2} strokeLinecap='round' />
70
+ <rect x='15' y='26.6' width='10' height='4.8' stroke='none' strokeWidth={2} />
71
+ <path d='M10 32.4C10 31.8477 10.4477 31.4 11 31.4H29C29.5523 31.4 30 31.8477 30 32.4V35H10V32.4Z' stroke='none' strokeWidth={2} />
72
+ <path d='M20 5L21.1226 8.45492H24.7553L21.8164 10.5902L22.9389 14.0451L20 11.9098L17.0611 14.0451L18.1836 10.5902L15.2447 8.45492H18.8774L20 5Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
73
+ <path d='M13.75 17.5V22.5M10 17.5H30V22.5H10V17.5Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
74
74
 
75
75
  </svg>
76
76
  )
@@ -53,10 +53,10 @@ const OpenAPIEditsIcon = ({
53
53
  >
54
54
  <path d='M17.7265 4.96689C17.6178 5.01476 17.6356 5.12562 17.6066 5.20813C17.278 6.13844 16.3166 6.62722 15.3388 6.33118C15.1261 6.26693 15.0089 6.30032 14.8581 6.44519C13.6952 7.56194 12.5257 8.67176 11.3516 9.7778C11.214 9.90755 11.1607 10.0058 11.2324 10.2036C11.5077 10.9676 11.1923 11.7663 10.4811 12.1883C9.78771 12.5996 8.85528 12.5039 8.27647 11.9622C7.68712 11.4098 7.55806 10.5588 7.96303 9.89307C8.3838 9.20147 9.24445 8.8645 10.0465 9.10888C10.2796 9.18006 10.4133 9.14164 10.5799 8.98102C11.7421 7.86427 12.9149 6.75697 14.0877 5.64967C14.2049 5.53881 14.2569 5.45378 14.195 5.27805C13.8585 4.32947 14.3655 3.37648 15.3434 3.08234C16.3278 2.7863 17.3248 3.31224 17.6297 4.27971C17.6554 4.36222 17.6139 4.4756 17.7271 4.52788V4.96626L17.7265 4.96689Z' fill='none' className={`${filledClassName} ${strokeTransparent}`} />
55
55
  <path d='M9.37016 4.32678C10.8722 4.32867 12.07 4.68643 13.1657 5.37424C13.3218 5.4725 13.3435 5.52478 13.2019 5.6602C12.3479 6.48217 11.5004 7.30982 10.6595 8.14439C10.512 8.29052 10.3823 8.31886 10.1742 8.27036C8.52993 7.88488 6.90806 9.07092 6.93506 10.6582C6.95284 11.6886 7.477 12.4583 8.46013 12.8822C9.47816 13.3212 10.4527 13.1776 11.2969 12.4772C12.0199 11.8776 12.2853 11.094 12.1141 10.1921C12.0785 10.005 12.1167 9.88281 12.2537 9.75054C13.1005 8.93613 13.9447 8.12045 14.7764 7.29155C14.9634 7.10511 15.0259 7.1681 15.1425 7.34635C16.6458 9.6378 16.3515 12.852 14.4537 14.8581C13.1203 16.2671 11.4596 16.9871 9.47684 16.9858C6.41749 16.9839 3.68343 14.7851 3.12305 11.9059C2.43888 8.38814 4.66722 5.18969 8.3258 4.43889C8.73209 4.35575 9.1443 4.31922 9.37016 4.32678Z' fill='none' className={`${filledClassName} ${strokeTransparent}`} />
56
- <path d='M10.0824 16.8261H16.6364H20C20.5523 16.8261 21 16.3784 21 15.8261V10.2609C21 9.70858 20.5523 9.26086 20 9.26086H17.7273' stroke='none' strokeWidth='1.5' strokeLinecap='round' />
57
- <path d='M16.6367 16.8262V18.9131' stroke='none' strokeWidth='1.5' />
58
- <path d='M14.4541 16.8262V18.9131' stroke='none' strokeWidth='1.5' />
59
- <path d='M18.8184 20.9999H12.8186V19.913C12.8186 19.3607 13.2663 18.913 13.8186 18.913H16.0911H17.8184C18.3706 18.913 18.8184 19.3607 18.8184 19.913V20.9999Z' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
56
+ <path d='M10.0824 16.8261H16.6364H20C20.5523 16.8261 21 16.3784 21 15.8261V10.2609C21 9.70858 20.5523 9.26086 20 9.26086H17.7273' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
57
+ <path d='M16.6367 16.8262V18.9131' stroke='none' strokeWidth={1.5} />
58
+ <path d='M14.4541 16.8262V18.9131' stroke='none' strokeWidth={1.5} />
59
+ <path d='M18.8184 20.9999H12.8186V19.913C12.8186 19.3607 13.2663 18.913 13.8186 18.913H16.0911H17.8184C18.3706 18.913 18.8184 19.3607 18.8184 19.913V20.9999Z' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
60
60
  </svg>
61
61
  )
62
62
  break
@@ -72,10 +72,10 @@ const OpenAPIEditsIcon = ({
72
72
  >
73
73
  <path d='M29.5441 8.27815C29.363 8.35794 29.3927 8.5427 29.3444 8.68022C28.7967 10.2307 27.1944 11.0454 25.5646 10.552C25.2102 10.4449 25.0148 10.5005 24.7635 10.742C22.8253 12.6032 20.8762 14.4529 18.9194 16.2963C18.69 16.5126 18.6011 16.6764 18.7207 17.006C19.1795 18.2794 18.6538 19.6105 17.4685 20.3138C16.3128 20.9993 14.7588 20.8398 13.7941 19.937C12.8119 19.0163 12.5968 17.5981 13.2717 16.4884C13.973 15.3358 15.4074 14.7742 16.7442 15.1815C17.1327 15.3001 17.3555 15.2361 17.6331 14.9684C19.5702 13.1071 21.5248 11.2616 23.4794 9.41611C23.6748 9.23135 23.7615 9.08963 23.6583 8.79674C23.0975 7.21578 23.9426 5.62747 25.5723 5.13723C27.2131 4.64383 28.8747 5.5204 29.3828 7.13285C29.4256 7.27037 29.3565 7.45933 29.5452 7.54646V8.2771L29.5441 8.27815Z' fill='none' className={`${filledClassName} ${strokeTransparent}`} />
74
74
  <path d='M15.6169 7.21133C18.1203 7.21448 20.1166 7.81076 21.9428 8.95711C22.203 9.12087 22.2392 9.20801 22.0032 9.43371C20.5798 10.8037 19.1673 12.1831 17.7658 13.574C17.52 13.8176 17.3038 13.8648 16.957 13.784C14.2165 13.1415 11.5134 15.1182 11.5584 17.7637C11.5881 19.4811 12.4617 20.7639 14.1002 21.4704C15.7969 22.2021 17.4212 21.9628 18.8282 20.7954C20.0332 19.796 20.4755 18.4901 20.1902 16.9868C20.1309 16.6751 20.1946 16.4714 20.4228 16.2509C21.8342 14.8936 23.2412 13.5341 24.6273 12.1526C24.939 11.8419 25.0432 11.9469 25.2375 12.244C27.7431 16.063 27.2525 21.42 24.0895 24.7636C21.8671 27.1119 19.0993 28.3118 15.7947 28.3097C10.6958 28.3066 6.13905 24.6418 5.20509 19.8433C4.0648 13.9803 7.7787 8.64953 13.8763 7.39819C14.5535 7.25962 15.2405 7.19874 15.6169 7.21133Z' fill='none' className={`${filledClassName} ${strokeTransparent}`} />
75
- <path d='M16.804 28.0436H27.7273H34C34.5523 28.0436 35 27.5959 35 27.0436V16.4348C35 15.8825 34.5523 15.4348 34 15.4348H29.5455' stroke='none' strokeWidth='2' strokeLinecap='round' />
76
- <path d='M27.7285 28.0437V31.522' stroke='none' strokeWidth='2' />
77
- <path d='M24.0908 28.0437V31.522' stroke='none' strokeWidth='2' />
78
- <path d='M31.3633 35H21.3637V32.5217C21.3637 31.9694 21.8114 31.5217 22.3637 31.5217H26.8178H30.3633C30.9156 31.5217 31.3633 31.9694 31.3633 32.5217V35Z' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
75
+ <path d='M16.804 28.0436H27.7273H34C34.5523 28.0436 35 27.5959 35 27.0436V16.4348C35 15.8825 34.5523 15.4348 34 15.4348H29.5455' stroke='none' strokeWidth={2} strokeLinecap='round' />
76
+ <path d='M27.7285 28.0437V31.522' stroke='none' strokeWidth={2} />
77
+ <path d='M24.0908 28.0437V31.522' stroke='none' strokeWidth={2} />
78
+ <path d='M31.3633 35H21.3637V32.5217C21.3637 31.9694 21.8114 31.5217 22.3637 31.5217H26.8178H30.3633C30.9156 31.5217 31.3633 31.9694 31.3633 32.5217V35Z' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
79
79
  </svg>
80
80
  )
81
81
  break
@@ -44,7 +44,7 @@ const RestartIcon = ({
44
44
  xmlns='http://www.w3.org/2000/svg'
45
45
  className={className}
46
46
  >
47
- <path d='M16.7646 13.5883V17.8236H20.9999' stroke='none' strokeWidth='1.5' strokeLinecap='round' strokeLinejoin='round' />
47
+ <path d='M16.7646 13.5883V17.8236H20.9999' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
48
48
  <path d='M11.4706 19.9412C6.79241 19.9412 3 16.1488 3 11.4706C3 6.79241 6.79241 3 11.4706 3C16.1488 3 19.9412 6.79241 19.9412 11.4706C19.9412 12.5299 19.7467 13.5438 19.3916 14.4786C19.0265 15.4394 18.4916 16.3166 17.8235 17.0735' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
49
49
  </svg>
50
50
  )
@@ -59,7 +59,7 @@ const RestartIcon = ({
59
59
  xmlns='http://www.w3.org/2000/svg'
60
60
  className={className}
61
61
  >
62
- <path d='M27.9412 22.647V29.7059H35' stroke='none' strokeWidth='2' strokeLinecap='round' strokeLinejoin='round' />
62
+ <path d='M27.9412 22.647V29.7059H35' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
63
63
  <path d='M19.1176 33.2353C11.3207 33.2353 5 26.9146 5 19.1176C5 11.3207 11.3207 5 19.1176 5C26.9146 5 33.2353 11.3207 33.2353 19.1176C33.2353 20.8832 32.9112 22.573 32.3193 24.1309C31.7108 25.7324 30.8193 27.1944 29.7059 28.4559' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
64
64
  </svg>
65
65
  )
@@ -65,6 +65,7 @@ import CloseIcon from './CloseIcon'
65
65
  import CloudIcon from './CloudIcon'
66
66
  import CLIIcon from './CLIIcon'
67
67
  import CodeTestingIcon from './CodeTestingIcon'
68
+ import CollapseIcon from './CollapseIcon'
68
69
  import ComputerIcon from './ComputerIcon'
69
70
  import ComputerInIcon from './ComputerInIcon'
70
71
  import ComputerOutIcon from './ComputerOutIcon'
@@ -205,6 +206,7 @@ import WorkspaceReadyIcon from './WorkspaceReadyIcon'
205
206
  import WorkspaceStaticIcon from './WorkspaceStaticIcon'
206
207
  import ZoomInIcon from './ZoomInIcon'
207
208
  import ZoomOutIcon from './ZoomOutIcon'
209
+ import AppOptimizedIcon from './AppOptimizedIcon'
208
210
 
209
211
  export default {
210
212
  AddIcon,
@@ -224,12 +226,13 @@ export default {
224
226
  AppConfigurationIcon,
225
227
  AppDetailsIcon,
226
228
  AppEditIcon,
227
- AppIcon,
228
229
  AppEmptyIcon,
230
+ AppIcon,
231
+ ApplicationTypeIcon,
229
232
  AppListIcon,
230
233
  AppMissingIcon,
234
+ AppOptimizedIcon,
231
235
  AppSettingsIcon,
232
- ApplicationTypeIcon,
233
236
  AppWorkspace,
234
237
  ArrowDownFullIcon,
235
238
  ArrowDownIcon,
@@ -274,6 +277,7 @@ export default {
274
277
  CloudIcon,
275
278
  CLIIcon,
276
279
  CodeTestingIcon,
280
+ CollapseIcon,
277
281
  ComputerIcon,
278
282
  ComputerInIcon,
279
283
  ComputerOutIcon,
@@ -5,7 +5,11 @@ import CircleCloseIcon from '../../components/icons/CircleCloseIcon'
5
5
  import WorkspaceStaticIcon from '../../components/icons/WorkspaceStaticIcon'
6
6
  import UpgradeIcon from '../../components/icons/UpgradeIcon'
7
7
  import WorkspaceDynamicIcon from '../../components/icons/WorkspaceDynamicIcon'
8
+ import CollapseIcon from '../../components/icons/CollapseIcon'
9
+ import ExpandIcon from '../../components/icons/ExpandIcon'
10
+ import EnlargeIcon from '../../components/icons/EnlargeIcon'
8
11
  import { COLORS_ICON } from '../../components/constants'
12
+ import AppOptimizedIcon from '../../components/icons/AppOptimizedIcon'
9
13
 
10
14
  const divStyle = {
11
15
  display: 'flex',
@@ -94,3 +98,15 @@ const LargeIconsTemplate = () =>
94
98
  [<UpgradeIcon key='b' size='extra-large' />].map((component) => component)
95
99
  export const LargeIconsDefault = LargeIconsTemplate.bind({})
96
100
  LargeIconsDefault.args = {}
101
+
102
+ export const Expand = ExpandIcon.bind({})
103
+ Expand.args = {}
104
+
105
+ export const Collapse = CollapseIcon.bind({})
106
+ Collapse.args = {}
107
+
108
+ export const Enlarge = EnlargeIcon.bind({})
109
+ Enlarge.args = {}
110
+
111
+ export const AppOptimized = AppOptimizedIcon.bind({})
112
+ AppOptimized.args = {}