@platformatic/ui-components 0.1.48 → 0.1.50

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.
Files changed (152) hide show
  1. package/.github/workflows/ci.yml +26 -26
  2. package/.nvmrc +1 -1
  3. package/LICENSE +201 -201
  4. package/README.md +30 -30
  5. package/fonts/Montserrat/README.txt +81 -81
  6. package/index.html +12 -12
  7. package/index.js +71 -71
  8. package/package.json +76 -76
  9. package/postcss.config.cjs +8 -8
  10. package/public/api-icon-closed.svg +6 -6
  11. package/public/api-icon.svg +9 -9
  12. package/src/App.jsx +12 -12
  13. package/src/components/BorderedBox.jsx +18 -18
  14. package/src/components/BorderedBox.module.css +8 -8
  15. package/src/components/BorderedText.jsx +8 -8
  16. package/src/components/BorderedText.module.css +2 -2
  17. package/src/components/Box.jsx +14 -14
  18. package/src/components/Box.module.css +7 -7
  19. package/src/components/Button.jsx +95 -95
  20. package/src/components/Button.module.css +127 -127
  21. package/src/components/ButtonFullRounded.jsx +17 -17
  22. package/src/components/ButtonFullRounded.module.css +28 -28
  23. package/src/components/Checkbox.jsx +11 -11
  24. package/src/components/Checkbox.module.css +18 -18
  25. package/src/components/Common.module.css +28 -28
  26. package/src/components/DetailedMetric.jsx +32 -32
  27. package/src/components/DetailedMetric.module.css +2 -2
  28. package/src/components/DropDown.jsx +36 -36
  29. package/src/components/DropDown.module.css +27 -27
  30. package/src/components/FollowUs.jsx +35 -35
  31. package/src/components/FollowUs.module.css +11 -11
  32. package/src/components/GHLoginButton.jsx +14 -14
  33. package/src/components/HorizontalSeparator.jsx +15 -15
  34. package/src/components/HorizontalSeparator.module.css +26 -26
  35. package/src/components/InfoBox.jsx +50 -50
  36. package/src/components/InfoBox.module.css +5 -5
  37. package/src/components/List.jsx +20 -20
  38. package/src/components/List.module.css +11 -11
  39. package/src/components/ListElement.jsx +23 -23
  40. package/src/components/ListElement.module.css +23 -23
  41. package/src/components/Loadable.jsx +34 -34
  42. package/src/components/Loadable.module.css +13 -13
  43. package/src/components/Loader.jsx +22 -22
  44. package/src/components/Loader.module.css +13 -13
  45. package/src/components/LoginButton.jsx +17 -17
  46. package/src/components/LoginButton.module.css +7 -7
  47. package/src/components/LoginButton.test.jsx +25 -25
  48. package/src/components/Logo.jsx +62 -62
  49. package/src/components/Logo.module.css +5 -5
  50. package/src/components/Main.jsx +33 -33
  51. package/src/components/MetricValue.jsx +15 -15
  52. package/src/components/MetricValue.module.css +9 -9
  53. package/src/components/Modal.jsx +93 -93
  54. package/src/components/Modal.module.css +50 -50
  55. package/src/components/PlatformaticIcon.jsx +57 -57
  56. package/src/components/PlatformaticIcon.module.css +2 -2
  57. package/src/components/Playground.jsx +9 -9
  58. package/src/components/SearchBar.jsx +63 -63
  59. package/src/components/SearchBar.module.css +20 -20
  60. package/src/components/Sidebar.jsx +153 -153
  61. package/src/components/Sidebar.module.css +66 -66
  62. package/src/components/SimpleMetric.jsx +28 -28
  63. package/src/components/SimpleMetric.module.css +6 -6
  64. package/src/components/Status.jsx +26 -26
  65. package/src/components/TabbedWindow.jsx +39 -39
  66. package/src/components/TabbedWindow.module.css +16 -16
  67. package/src/components/TextWithLabel.jsx +11 -11
  68. package/src/components/TextWithLabel.module.css +8 -8
  69. package/src/components/Versions.jsx +9 -9
  70. package/src/components/VerticalSeparator.jsx +5 -5
  71. package/src/components/forms/Field.jsx +53 -20
  72. package/src/components/forms/Field.module.css +23 -17
  73. package/src/components/forms/Input.jsx +80 -87
  74. package/src/components/forms/Input.module.css +28 -28
  75. package/src/components/forms/Preview.jsx +75 -77
  76. package/src/components/forms/Preview.module.css +14 -14
  77. package/src/components/forms/ToggleSwitch.jsx +18 -18
  78. package/src/components/forms/ToggleSwitch.module.css +42 -42
  79. package/src/components/forms/index.js +8 -8
  80. package/src/components/icons/ApiEmptyIcon.jsx +107 -107
  81. package/src/components/icons/ApiIcon.jsx +29 -29
  82. package/src/components/icons/ApiIconClosed.jsx +19 -19
  83. package/src/components/icons/AppEmptyIcon.jsx +94 -94
  84. package/src/components/icons/AppIcon.jsx +38 -38
  85. package/src/components/icons/AppListIcon.jsx +73 -73
  86. package/src/components/icons/Calendar1Icon.jsx +54 -54
  87. package/src/components/icons/Calendar7Icon.jsx +55 -55
  88. package/src/components/icons/CalendarIcon.jsx +56 -56
  89. package/src/components/icons/CircleAddIcon.jsx +40 -40
  90. package/src/components/icons/CircleBackIcon.jsx +51 -51
  91. package/src/components/icons/CircleCheckMarkIcon.jsx +66 -0
  92. package/src/components/icons/CircleCloseHoverIcon.jsx +42 -42
  93. package/src/components/icons/CircleCloseIcon.jsx +32 -32
  94. package/src/components/icons/CircleExclamationIcon.jsx +29 -29
  95. package/src/components/icons/CloseIcon.jsx +31 -31
  96. package/src/components/icons/CopyIcon.jsx +75 -46
  97. package/src/components/icons/CreatedWorkspaceIcon.jsx +70 -70
  98. package/src/components/icons/DynamicWorkspaceIcon.jsx +125 -125
  99. package/src/components/icons/EditIcon.jsx +38 -0
  100. package/src/components/icons/GearIcon.jsx +40 -40
  101. package/src/components/icons/Icons.module.css +29 -29
  102. package/src/components/icons/LiveIcon.jsx +43 -43
  103. package/src/components/icons/MetricsIcon.jsx +52 -52
  104. package/src/components/icons/PlayIcon.jsx +20 -20
  105. package/src/components/icons/PullRequestIcon.jsx +35 -35
  106. package/src/components/icons/StaticWorkspaceIcon.jsx +119 -119
  107. package/src/components/icons/StopIcon.jsx +21 -21
  108. package/src/components/icons/TerminalIcon.jsx +22 -22
  109. package/src/components/icons/TriangleExclamationIcon.jsx +26 -26
  110. package/src/components/icons/UpgradeIcon.jsx +48 -48
  111. package/src/components/icons/index.js +63 -59
  112. package/src/components/layouts/Layout.jsx +11 -11
  113. package/src/components/layouts/TwoColumnsLayout.jsx +12 -12
  114. package/src/components/layouts/TwoColumnsLayout.module.css +9 -9
  115. package/src/hooks/useEscapeKey.js +20 -20
  116. package/src/lib/utils.js +23 -23
  117. package/src/main.jsx +9 -9
  118. package/src/stories/BorderedBox.stories.jsx +33 -33
  119. package/src/stories/BorderedText.stories.jsx +24 -24
  120. package/src/stories/Button.stories.jsx +114 -114
  121. package/src/stories/ButtonFullRounded.stories.jsx +61 -61
  122. package/src/stories/Checkbox.stories.jsx +27 -27
  123. package/src/stories/DetailedMetric.stories.jsx +33 -33
  124. package/src/stories/DropDown.stories.jsx +62 -62
  125. package/src/stories/FollowUs.stories.jsx +14 -14
  126. package/src/stories/GHLoginButton.stories.jsx +14 -14
  127. package/src/stories/HorizontalSeparator.stories.jsx +12 -12
  128. package/src/stories/InfoBox.stories.jsx +46 -46
  129. package/src/stories/Introduction.stories.mdx +211 -211
  130. package/src/stories/List.stories.jsx +29 -29
  131. package/src/stories/ListElement.stories.jsx +15 -15
  132. package/src/stories/Loadable.stories.jsx +75 -75
  133. package/src/stories/Loader.stories.jsx +44 -44
  134. package/src/stories/LoginButton.stories.jsx +15 -15
  135. package/src/stories/Logo.stories.jsx +17 -17
  136. package/src/stories/Modal.stories.jsx +100 -100
  137. package/src/stories/PlatformaticIcon.stories.jsx +51 -35
  138. package/src/stories/SearchBar.stories.jsx +28 -28
  139. package/src/stories/Sidebar.stories.jsx +61 -61
  140. package/src/stories/SimpleMetric.stories.jsx +41 -41
  141. package/src/stories/Status.stories.jsx +31 -31
  142. package/src/stories/TextWithLabel.stories.jsx +25 -25
  143. package/src/stories/TwoColumnsLayout.stories.jsx +42 -42
  144. package/src/stories/forms/Field.stories.jsx +89 -81
  145. package/src/stories/forms/Input.stories.jsx +89 -69
  146. package/src/stories/forms/Preview.stories.jsx +57 -57
  147. package/src/stories/forms/ToggleSwitch.stories.jsx +15 -15
  148. package/src/stories/icons/Icons.stories.jsx +74 -74
  149. package/src/styles/main.css +15 -15
  150. package/tailwind.config.cjs +60 -60
  151. package/vite.config.js +6 -6
  152. package/vitest.config.js +14 -14
@@ -1,52 +1,52 @@
1
- import * as React from 'react'
2
- import styles from './Icons.module.css'
3
- const MetricsIcon = ({ color = 'white' }) => {
4
- const className = styles[`${color}`]
5
- return (
6
- <svg
7
- width={40}
8
- height={40}
9
- viewBox='0 0 40 40'
10
- fill='none'
11
- xmlns='http://www.w3.org/2000/svg'
12
- className={className}
13
- >
14
- <rect
15
- x={10}
16
- y={12.5}
17
- width={5}
18
- height={17.5}
19
- rx={0.5}
20
- stroke='none'
21
- strokeWidth={2}
22
- />
23
- <rect
24
- x={20}
25
- y={20}
26
- width={5}
27
- height={10}
28
- rx={0.5}
29
- stroke='none'
30
- strokeWidth={2}
31
- />
32
- <rect
33
- x={30}
34
- y={5}
35
- width={5}
36
- height={25}
37
- rx={0.5}
38
- stroke='none'
39
- strokeWidth={2}
40
- />
41
- <path
42
- d='M5 5V35H35'
43
- stroke='none'
44
- strokeWidth={2}
45
- strokeLinecap='round'
46
- strokeLinejoin='round'
47
- />
48
- </svg>
49
- )
50
- }
51
-
52
- export default MetricsIcon
1
+ import * as React from 'react'
2
+ import styles from './Icons.module.css'
3
+ const MetricsIcon = ({ color = 'white' }) => {
4
+ const className = styles[`${color}`]
5
+ return (
6
+ <svg
7
+ width={40}
8
+ height={40}
9
+ viewBox='0 0 40 40'
10
+ fill='none'
11
+ xmlns='http://www.w3.org/2000/svg'
12
+ className={className}
13
+ >
14
+ <rect
15
+ x={10}
16
+ y={12.5}
17
+ width={5}
18
+ height={17.5}
19
+ rx={0.5}
20
+ stroke='none'
21
+ strokeWidth={2}
22
+ />
23
+ <rect
24
+ x={20}
25
+ y={20}
26
+ width={5}
27
+ height={10}
28
+ rx={0.5}
29
+ stroke='none'
30
+ strokeWidth={2}
31
+ />
32
+ <rect
33
+ x={30}
34
+ y={5}
35
+ width={5}
36
+ height={25}
37
+ rx={0.5}
38
+ stroke='none'
39
+ strokeWidth={2}
40
+ />
41
+ <path
42
+ d='M5 5V35H35'
43
+ stroke='none'
44
+ strokeWidth={2}
45
+ strokeLinecap='round'
46
+ strokeLinejoin='round'
47
+ />
48
+ </svg>
49
+ )
50
+ }
51
+
52
+ export default MetricsIcon
@@ -1,20 +1,20 @@
1
- import * as React from 'react'
2
- import styles from './Icons.module.css'
3
- const PlayIcon = ({ color = 'green', size = 'normal' }) => {
4
- const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
5
- let icon = <></>
6
- switch (size) {
7
- case 'small':
8
- icon = (
9
- <svg width={16} height={16} viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg' className={className}>
10
- <path d='M2 2L14 8L2 14V2Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
11
- </svg>
12
- )
13
- break
14
- default:
15
- break
16
- }
17
- return icon
18
- }
19
-
20
- export default PlayIcon
1
+ import * as React from 'react'
2
+ import styles from './Icons.module.css'
3
+ const PlayIcon = ({ color = 'green', size = 'normal' }) => {
4
+ const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
5
+ let icon = <></>
6
+ switch (size) {
7
+ case 'small':
8
+ icon = (
9
+ <svg width={16} height={16} viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg' className={className}>
10
+ <path d='M2 2L14 8L2 14V2Z' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
11
+ </svg>
12
+ )
13
+ break
14
+ default:
15
+ break
16
+ }
17
+ return icon
18
+ }
19
+
20
+ export default PlayIcon
@@ -1,35 +1,35 @@
1
- import * as React from 'react'
2
- import styles from './Icons.module.css'
3
- const PullRequestIcon = ({ color = 'white' }) => {
4
- const className = styles[`${color}`]
5
- return (
6
- <svg
7
- width={40}
8
- height={40}
9
- fill='none'
10
- xmlns='http://www.w3.org/2000/svg'
11
- className={className}
12
- >
13
- <circle cx={9.5} cy={30.5} r={4.5} stroke='none' strokeWidth={2} />
14
- <circle cx={9.5} cy={9.5} r={4.5} stroke='none' strokeWidth={2} />
15
- <path stroke='none' strokeWidth={2} d='M9 14v12' />
16
- <circle cx={30.5} cy={30.5} r={4.5} stroke='none' strokeWidth={2} />
17
- <path
18
- d='M30.5 26V10.5a1 1 0 0 0-1-1H23'
19
- stroke='none'
20
- strokeWidth={2}
21
- strokeLinecap='round'
22
- strokeLinejoin='round'
23
- />
24
- <path
25
- d='m26 5-4.5 4.5L26 14'
26
- stroke='none'
27
- strokeWidth={2}
28
- strokeLinecap='round'
29
- strokeLinejoin='round'
30
- />
31
- </svg>
32
- )
33
- }
34
-
35
- export default PullRequestIcon
1
+ import * as React from 'react'
2
+ import styles from './Icons.module.css'
3
+ const PullRequestIcon = ({ color = 'white' }) => {
4
+ const className = styles[`${color}`]
5
+ return (
6
+ <svg
7
+ width={40}
8
+ height={40}
9
+ fill='none'
10
+ xmlns='http://www.w3.org/2000/svg'
11
+ className={className}
12
+ >
13
+ <circle cx={9.5} cy={30.5} r={4.5} stroke='none' strokeWidth={2} />
14
+ <circle cx={9.5} cy={9.5} r={4.5} stroke='none' strokeWidth={2} />
15
+ <path stroke='none' strokeWidth={2} d='M9 14v12' />
16
+ <circle cx={30.5} cy={30.5} r={4.5} stroke='none' strokeWidth={2} />
17
+ <path
18
+ d='M30.5 26V10.5a1 1 0 0 0-1-1H23'
19
+ stroke='none'
20
+ strokeWidth={2}
21
+ strokeLinecap='round'
22
+ strokeLinejoin='round'
23
+ />
24
+ <path
25
+ d='m26 5-4.5 4.5L26 14'
26
+ stroke='none'
27
+ strokeWidth={2}
28
+ strokeLinecap='round'
29
+ strokeLinejoin='round'
30
+ />
31
+ </svg>
32
+ )
33
+ }
34
+
35
+ export default PullRequestIcon
@@ -1,119 +1,119 @@
1
- import * as React from 'react'
2
- import styles from './Icons.module.css'
3
-
4
- const StaticWorkspaceIcon = ({
5
- color = 'green',
6
- size = 'normal',
7
- tip = ''
8
- }) => {
9
- const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
10
- let icon = (
11
- <svg
12
- width={40}
13
- height={41}
14
- viewBox='0 0 40 41'
15
- fill='none'
16
- xmlns='http://www.w3.org/2000/svg'
17
- className={className}
18
- data-tip={tip}
19
- >
20
- <rect
21
- x={5}
22
- y={5.33325}
23
- width={10}
24
- height={12.5874}
25
- rx={1}
26
- stroke='none'
27
- strokeWidth={2.5}
28
- />
29
- <rect
30
- x={20}
31
- y={5.33325}
32
- width={15}
33
- height={12.5874}
34
- rx={1}
35
- stroke='none'
36
- strokeWidth={2.5}
37
- />
38
- <rect
39
- x={35}
40
- y={35.3333}
41
- width={10}
42
- height={12.5874}
43
- rx={1}
44
- transform='rotate(-180 35 35.3333)'
45
- stroke='none'
46
- strokeWidth={2.5}
47
- />
48
- <rect
49
- x={20}
50
- y={35.3333}
51
- width={15}
52
- height={12.5874}
53
- rx={1}
54
- transform='rotate(-180 20 35.3333)'
55
- stroke='none'
56
- strokeWidth={2.5}
57
- />
58
- </svg>
59
- )
60
- switch (size) {
61
- case 'small':
62
- icon = (
63
- <svg
64
- width={24}
65
- height={25}
66
- viewBox='0 0 24 25'
67
- fill='none'
68
- xmlns='http://www.w3.org/2000/svg'
69
- className={className}
70
- data-tip={tip}
71
- >
72
- <rect
73
- x={3}
74
- y={3.5}
75
- width={6}
76
- height={7.55245}
77
- rx={1}
78
- stroke='none'
79
- strokeWidth={1.5}
80
- />
81
- <rect
82
- x={12}
83
- y={3.5}
84
- width={9}
85
- height={7.55245}
86
- rx={1}
87
- stroke='none'
88
- strokeWidth={1.5}
89
- />
90
- <rect
91
- x={21}
92
- y={21.5}
93
- width={6}
94
- height={7.55245}
95
- rx={1}
96
- transform='rotate(-180 21 21.5)'
97
- stroke='none'
98
- strokeWidth={1.5}
99
- />
100
- <rect
101
- x={12}
102
- y={21.5}
103
- width={9}
104
- height={7.55245}
105
- rx={1}
106
- transform='rotate(-180 12 21.5)'
107
- stroke='none'
108
- strokeWidth={1.5}
109
- />
110
- </svg>
111
- )
112
- break
113
- default:
114
- break
115
- }
116
- return icon
117
- }
118
-
119
- export default StaticWorkspaceIcon
1
+ import * as React from 'react'
2
+ import styles from './Icons.module.css'
3
+
4
+ const StaticWorkspaceIcon = ({
5
+ color = 'green',
6
+ size = 'normal',
7
+ tip = ''
8
+ }) => {
9
+ const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
10
+ let icon = (
11
+ <svg
12
+ width={40}
13
+ height={41}
14
+ viewBox='0 0 40 41'
15
+ fill='none'
16
+ xmlns='http://www.w3.org/2000/svg'
17
+ className={className}
18
+ data-tip={tip}
19
+ >
20
+ <rect
21
+ x={5}
22
+ y={5.33325}
23
+ width={10}
24
+ height={12.5874}
25
+ rx={1}
26
+ stroke='none'
27
+ strokeWidth={2.5}
28
+ />
29
+ <rect
30
+ x={20}
31
+ y={5.33325}
32
+ width={15}
33
+ height={12.5874}
34
+ rx={1}
35
+ stroke='none'
36
+ strokeWidth={2.5}
37
+ />
38
+ <rect
39
+ x={35}
40
+ y={35.3333}
41
+ width={10}
42
+ height={12.5874}
43
+ rx={1}
44
+ transform='rotate(-180 35 35.3333)'
45
+ stroke='none'
46
+ strokeWidth={2.5}
47
+ />
48
+ <rect
49
+ x={20}
50
+ y={35.3333}
51
+ width={15}
52
+ height={12.5874}
53
+ rx={1}
54
+ transform='rotate(-180 20 35.3333)'
55
+ stroke='none'
56
+ strokeWidth={2.5}
57
+ />
58
+ </svg>
59
+ )
60
+ switch (size) {
61
+ case 'small':
62
+ icon = (
63
+ <svg
64
+ width={24}
65
+ height={25}
66
+ viewBox='0 0 24 25'
67
+ fill='none'
68
+ xmlns='http://www.w3.org/2000/svg'
69
+ className={className}
70
+ data-tip={tip}
71
+ >
72
+ <rect
73
+ x={3}
74
+ y={3.5}
75
+ width={6}
76
+ height={7.55245}
77
+ rx={1}
78
+ stroke='none'
79
+ strokeWidth={1.5}
80
+ />
81
+ <rect
82
+ x={12}
83
+ y={3.5}
84
+ width={9}
85
+ height={7.55245}
86
+ rx={1}
87
+ stroke='none'
88
+ strokeWidth={1.5}
89
+ />
90
+ <rect
91
+ x={21}
92
+ y={21.5}
93
+ width={6}
94
+ height={7.55245}
95
+ rx={1}
96
+ transform='rotate(-180 21 21.5)'
97
+ stroke='none'
98
+ strokeWidth={1.5}
99
+ />
100
+ <rect
101
+ x={12}
102
+ y={21.5}
103
+ width={9}
104
+ height={7.55245}
105
+ rx={1}
106
+ transform='rotate(-180 12 21.5)'
107
+ stroke='none'
108
+ strokeWidth={1.5}
109
+ />
110
+ </svg>
111
+ )
112
+ break
113
+ default:
114
+ break
115
+ }
116
+ return icon
117
+ }
118
+
119
+ export default StaticWorkspaceIcon
@@ -1,21 +1,21 @@
1
- import * as React from 'react'
2
- import styles from './Icons.module.css'
3
- const StopIcon = ({ color = 'green', size = 'normal' }) => {
4
- const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
5
- let icon = <></>
6
- switch (size) {
7
- case 'small':
8
- icon = (
9
- <svg width={16} height={16} viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg' className={className}>
10
- <circle cx={8} cy={8} r={6} stroke='none' />
11
- <path d='M3.5 12L12 3.5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
12
- </svg>
13
- )
14
- break
15
- default:
16
- break
17
- }
18
- return icon
19
- }
20
-
21
- export default StopIcon
1
+ import * as React from 'react'
2
+ import styles from './Icons.module.css'
3
+ const StopIcon = ({ color = 'green', size = 'normal' }) => {
4
+ const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
5
+ let icon = <></>
6
+ switch (size) {
7
+ case 'small':
8
+ icon = (
9
+ <svg width={16} height={16} viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg' className={className}>
10
+ <circle cx={8} cy={8} r={6} stroke='none' />
11
+ <path d='M3.5 12L12 3.5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
12
+ </svg>
13
+ )
14
+ break
15
+ default:
16
+ break
17
+ }
18
+ return icon
19
+ }
20
+
21
+ export default StopIcon
@@ -1,22 +1,22 @@
1
- import * as React from 'react'
2
- import styles from './Icons.module.css'
3
- const TerminalIcon = ({ color = 'green', size = 'normal' }) => {
4
- const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
5
- let icon = <></>
6
- switch (size) {
7
- case 'small':
8
- icon = (
9
- <svg width={16} height={16} viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg' className={className}>
10
- <rect x={2} y={2} width={12} height={12} rx={1} stroke='none' />
11
- <path d='M4 9L6 7L4 5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
12
- <path d='M7 11H11.5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
13
- </svg>
14
- )
15
- break
16
- default:
17
- break
18
- }
19
- return icon
20
- }
21
-
22
- export default TerminalIcon
1
+ import * as React from 'react'
2
+ import styles from './Icons.module.css'
3
+ const TerminalIcon = ({ color = 'green', size = 'normal' }) => {
4
+ const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
5
+ let icon = <></>
6
+ switch (size) {
7
+ case 'small':
8
+ icon = (
9
+ <svg width={16} height={16} viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg' className={className}>
10
+ <rect x={2} y={2} width={12} height={12} rx={1} stroke='none' />
11
+ <path d='M4 9L6 7L4 5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
12
+ <path d='M7 11H11.5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
13
+ </svg>
14
+ )
15
+ break
16
+ default:
17
+ break
18
+ }
19
+ return icon
20
+ }
21
+
22
+ export default TerminalIcon
@@ -1,26 +1,26 @@
1
- import * as React from 'react'
2
- import styles from './Icons.module.css'
3
- const TriangleExclamationIcon = ({ color = 'red' }) => {
4
- const className = styles[`${color}`]
5
- return (
6
- <svg
7
- width={16}
8
- height={16}
9
- viewBox='0 0 16 16'
10
- fill='none'
11
- xmlns='http://www.w3.org/2000/svg'
12
- className={className}
13
- >
14
- <path d='M14 14H2L8 2L14 14Z' stroke='none' strokeLinejoin='round' />
15
- <path
16
- d='M8 6V10.5'
17
- stroke='none'
18
- strokeLinecap='round'
19
- strokeLinejoin='round'
20
- />
21
- <circle cx={8} cy={12} r={0.5} fill='none' />
22
- </svg>
23
- )
24
- }
25
-
26
- export default TriangleExclamationIcon
1
+ import * as React from 'react'
2
+ import styles from './Icons.module.css'
3
+ const TriangleExclamationIcon = ({ color = 'red' }) => {
4
+ const className = styles[`${color}`]
5
+ return (
6
+ <svg
7
+ width={16}
8
+ height={16}
9
+ viewBox='0 0 16 16'
10
+ fill='none'
11
+ xmlns='http://www.w3.org/2000/svg'
12
+ className={className}
13
+ >
14
+ <path d='M14 14H2L8 2L14 14Z' stroke='none' strokeLinejoin='round' />
15
+ <path
16
+ d='M8 6V10.5'
17
+ stroke='none'
18
+ strokeLinecap='round'
19
+ strokeLinejoin='round'
20
+ />
21
+ <circle cx={8} cy={12} r={0.5} fill='none' />
22
+ </svg>
23
+ )
24
+ }
25
+
26
+ export default TriangleExclamationIcon