@platformatic/ui-components 0.3.2 → 0.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/assets/index-YI7s19_T.js +40 -0
  2. package/dist/index.html +1 -1
  3. package/package.json +1 -1
  4. package/src/components/icons/AppIcon.jsx +4 -13
  5. package/src/components/icons/MissingTemplateIcon.jsx +107 -0
  6. package/src/components/icons/index.js +3 -0
  7. package/dist/assets/index-DYLAvgx-.js +0 -40
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-DYLAvgx-.js"></script>
7
+ <script type="module" crossorigin src="/assets/index-YI7s19_T.js"></script>
8
8
  <link rel="stylesheet" crossorigin href="/assets/index-BJ-rQoWR.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.3.2",
4
+ "version": "0.3.3",
5
5
  "type": "module",
6
6
  "license": "Apache-2.0",
7
7
  "repository": {
package/src/components/icons/AppIcon.jsx CHANGED
@@ -24,11 +24,7 @@ const AppIcon = ({ color, size, disabled, inactive }) => {
24
24
  xmlns='http://www.w3.org/2000/svg'
25
25
  className={className}
26
26
  >
27
- <path d='M6 2.95996H3C2.44772 2.95996 2 3.40768 2 3.95996V9.63996C2 10.1922 2.44772 10.64 3 10.64H13C13.5523 10.64 14 10.1922 14 9.63996V3.95996C14 3.40768 13.5523 2.95996 13 2.95996H10' stroke='none' strokeLinecap='round' />
28
- <rect x={6} y={10.64} width={4} height={1.92} stroke='none' />
29
- <path d='M4 13.5601C4 13.0078 4.44772 12.5601 5 12.5601H11C11.5523 12.5601 12 13.0078 12 13.5601V14.0001H4V13.5601Z' stroke='none' />
30
- <path d='M8 2L8.89806 4.65337H11.8042L9.45308 6.29325L10.3511 8.94662L8 7.30675L5.64886 8.94662L6.54692 6.29325L4.19577 4.65337H7.10194L8 2Z' stroke='none' strokeLinejoin='round' />
31
-
27
+ <path d='M8 2L13.1962 5V11L8 14L2.80385 11V5L8 2Z' stroke='none' strokeLinejoin='round' />
32
28
  </svg>
33
29
  )
34
30
  break
@@ -42,10 +38,8 @@ const AppIcon = ({ color, size, disabled, inactive }) => {
42
38
  xmlns='http://www.w3.org/2000/svg'
43
39
  className={className}
44
40
  >
45
- <path d='M9 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.43994H15' stroke='none' strokeWidth={1.5} strokeLinecap='round' />
46
- <rect x={9} y={15.96} width={6} height={2.88} stroke='none' strokeWidth={1.5} />
47
- <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} />
48
- <path d='M12 3L13.3471 6.98006H17.7063L14.1796 9.43988L15.5267 13.4199L12 10.9601L8.47329 13.4199L9.82037 9.43988L6.29366 6.98006H10.6529L12 3Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
41
+ <path d='M12 3L19.7942 7.5V16.5L12 21L4.20577 16.5V7.5L12 3Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
42
+
49
43
  </svg>
50
44
  )
51
45
  break
@@ -59,10 +53,7 @@ const AppIcon = ({ color, size, disabled, inactive }) => {
59
53
  xmlns='http://www.w3.org/2000/svg'
60
54
  className={className}
61
55
  >
62
- <path d='M15 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.40002H25' stroke='none' strokeWidth={2} strokeLinecap='round' />
63
- <rect x={15} y={26.6} width={10} height={4.8} stroke='none' strokeWidth={2} />
64
- <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} />
65
- <path d='M20 5L22.2451 11.6334H29.5106L23.6327 15.7331L25.8779 22.3666L20 18.2669L14.1221 22.3666L16.3673 15.7331L10.4894 11.6334H17.7549L20 5Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
56
+ <path d='M20 5L32.9904 12.5V27.5L20 35L7.00962 27.5V12.5L20 5Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
66
57
  </svg>
67
58
  )
68
59
  break
package/src/components/icons/MissingTemplateIcon.jsx ADDED
@@ -0,0 +1,107 @@
1
+ import * as React from 'react'
2
+ import PropTypes from 'prop-types'
3
+ import styles from './Icons.module.css'
4
+ import { COLORS_ICON, SIZES, SMALL, MEDIUM, LARGE, MAIN_DARK_BLUE } from '../constants'
5
+
6
+ const MissingTemplateIcon = ({ color, size, disabled, inactive }) => {
7
+ let className = `${styles.svgClassName} ` + styles[`${color}`]
8
+ if (disabled) {
9
+ className += ` ${styles.iconDisabled}`
10
+ }
11
+ if (inactive) {
12
+ className += ` ${styles.iconInactive}`
13
+ }
14
+ let icon = <></>
15
+ const filledClassName = styles[`filled-${color}`]
16
+
17
+ switch (size) {
18
+ case SMALL:
19
+ icon = (
20
+ <svg
21
+ width={16}
22
+ height={16}
23
+ viewBox='0 0 16 16'
24
+ fill='none'
25
+ xmlns='http://www.w3.org/2000/svg'
26
+ className={className}
27
+ >
28
+ <path d='M9 4V3C9 2.44772 8.55228 2 8 2L3 2C2.44772 2 2 2.44772 2 3L2 8C2 8.55228 2.44772 9 3 9H4.5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
29
+ <rect x='3.16699' y='3.16675' width='4.66667' height='1.16667' stroke='none' strokeLinejoin='round' />
30
+ <path d='M3.16699 5.5H4.91699V7.83325H3.16699L3.16699 5.5Z' stroke='none' strokeLinejoin='round' />
31
+ <path d='M8 5.5H6.25V7.5' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
32
+ <circle cx='10.5' cy='9.5' r='4.5' stroke='none' />
33
+ <path d='M10.1714 10.4776C10.0521 10.4776 9.95546 10.381 9.95546 10.2617C9.95694 9.98421 9.97996 9.89803 10.0245 9.73311C10.0705 9.56819 10.1373 9.43498 10.2249 9.33349C10.3125 9.232 10.418 9.14003 10.5412 9.05756C10.6333 8.99413 10.7157 8.92832 10.7884 8.86013C10.8612 8.79194 10.9191 8.71662 10.9621 8.63416C11.0052 8.55011 11.0267 8.45655 11.0267 8.35347C11.0267 8.24405 11.0022 8.14811 10.9532 8.06565C10.9042 7.98319 10.8382 7.91976 10.755 7.87536C10.6733 7.83095 10.5828 7.80875 10.4833 7.80875C10.3868 7.80875 10.2955 7.83175 10.2094 7.87774C10.1232 7.92214 10.0527 7.98874 9.99777 8.07755C9.89617 8.23886 9.75751 8.40343 9.56686 8.40343H9.46744C9.21107 8.40343 8.99446 8.18808 9.06672 7.94211C9.10194 7.82222 9.15097 7.71434 9.21381 7.61846C9.34892 7.41072 9.52784 7.25611 9.75056 7.15461C9.97327 7.05154 10.219 7 10.4878 7C10.7832 7 11.0445 7.05233 11.2717 7.15699C11.4989 7.26007 11.6771 7.40993 11.8062 7.60657C11.9354 7.8032 12 8.04028 12 8.31779C12 8.50333 11.971 8.66825 11.9131 8.81256C11.8567 8.95528 11.7773 9.08214 11.6748 9.19315C11.5724 9.30257 11.4514 9.40168 11.3118 9.49049C11.1945 9.56502 11.098 9.64272 11.0223 9.7236C10.948 9.80447 10.8924 9.89803 10.8552 10.0043C10.8196 10.1105 10.801 10.1063 10.7996 10.2617C10.7996 10.381 10.7029 10.4776 10.5836 10.4776H10.1714ZM10.3964 12C10.248 12 10.121 11.9445 10.0156 11.8335C9.91166 11.7209 9.86043 11.5861 9.86192 11.4291C9.86043 11.2737 9.91166 11.1405 10.0156 11.0295C10.121 10.9185 10.248 10.863 10.3964 10.863C10.5375 10.863 10.6615 10.9185 10.7684 11.0295C10.8753 11.1405 10.9295 11.2737 10.931 11.4291C10.9295 11.5338 10.9035 11.6297 10.853 11.7169C10.804 11.8026 10.7394 11.8716 10.6592 11.9239C10.5791 11.9746 10.4915 12 10.3964 12Z' fill='none' className={filledClassName} />
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='M13.5 6V4C13.5 3.44772 13.0523 3 12.5 3L4 3C3.44772 3 3 3.44772 3 4L3 12.5C3 13.0523 3.44772 13.5 4 13.5H6.75' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
48
+ <rect x='4.75049' y='4.75012' width='7' height='1.75' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
49
+ <path d='M4.75049 8.25H7.37549V11.7499H4.75049V8.25Z' stroke='none' strokeWidth={1.5} strokeLinejoin='round' />
50
+ <path d='M12 8.25H9.375V11.25' stroke='none' strokeWidth={1.5} strokeLinecap='round' strokeLinejoin='round' />
51
+ <circle cx='15.75' cy='14.25' r='6.75' stroke='none' strokeWidth={1.5} />
52
+ <path d='M15.2571 15.7165C15.0782 15.7165 14.9332 15.5715 14.9332 15.3926C14.9354 14.9763 14.9699 14.8471 15.0367 14.5997C15.1058 14.3523 15.206 14.1525 15.3374 14.0002C15.4688 13.848 15.6269 13.71 15.8118 13.5863C15.9499 13.4912 16.0735 13.3925 16.1826 13.2902C16.2918 13.1879 16.3786 13.0749 16.4432 12.9512C16.5078 12.8252 16.5401 12.6848 16.5401 12.5302C16.5401 12.3661 16.5033 12.2222 16.4298 12.0985C16.3563 11.9748 16.2572 11.8796 16.1325 11.813C16.01 11.7464 15.8742 11.7131 15.7249 11.7131C15.5802 11.7131 15.4432 11.7476 15.314 11.8166C15.1849 11.8832 15.0791 11.9831 14.9967 12.1163C14.8442 12.3583 14.6363 12.6051 14.3503 12.6051H14.2012C13.8166 12.6051 13.4917 12.2821 13.6001 11.9132C13.6529 11.7333 13.7265 11.5715 13.8207 11.4277C14.0234 11.1161 14.2918 10.8842 14.6258 10.7319C14.9599 10.5773 15.3285 10.5 15.7316 10.5C16.1748 10.5 16.5668 10.5785 16.9076 10.7355C17.2483 10.8901 17.5156 11.1149 17.7094 11.4098C17.9031 11.7048 18 12.0604 18 12.4767C18 12.755 17.9566 13.0024 17.8697 13.2188C17.7851 13.4329 17.6659 13.6232 17.5122 13.7897C17.3586 13.9539 17.1771 14.1025 16.9677 14.2357C16.7918 14.3475 16.647 14.4641 16.5334 14.5854C16.422 14.7067 16.3385 14.8471 16.2829 15.0064C16.2294 15.1658 16.2016 15.1595 16.1993 15.3926C16.1993 15.5715 16.0543 15.7165 15.8754 15.7165H15.2571ZM15.5947 18C15.3719 18 15.1815 17.9167 15.0234 17.7502C14.8675 17.5814 14.7906 17.3792 14.7929 17.1437C14.7906 16.9106 14.8675 16.7108 15.0234 16.5442C15.1815 16.3777 15.3719 16.2945 15.5947 16.2945C15.8062 16.2945 15.9922 16.3777 16.1526 16.5442C16.3129 16.7108 16.3942 16.9106 16.3964 17.1437C16.3942 17.3007 16.3552 17.4446 16.2795 17.5754C16.206 17.7039 16.1091 17.8073 15.9889 17.8858C15.8686 17.9619 15.7372 18 15.5947 18Z' fill='none' className={filledClassName} />
53
+ </svg>
54
+ )
55
+ break
56
+ case LARGE:
57
+ icon = (
58
+ <svg
59
+ width={40}
60
+ height={40}
61
+ viewBox='0 0 40 40'
62
+ fill='none'
63
+ xmlns='http://www.w3.org/2000/svg'
64
+ className={className}
65
+ >
66
+ <path d='M22.5 10.5V6C22.5 5.44772 22.0523 5 21.5 5L6 5C5.44772 5 5 5.44772 5 6L5 21.5C5 22.0523 5.44772 22.5 6 22.5H12.5' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
67
+ <rect x='7.91748' y='7.91687' width='11.6667' height='2.91667' stroke='none' strokeWidth={2} strokeLinejoin='round' />
68
+ <path d='M7.91748 13.75H12.2925V19.5831H7.91748L7.91748 13.75Z' stroke='none' strokeWidth={2} strokeLinejoin='round' />
69
+ <path d='M21 13.75H15.625V19.5' stroke='none' strokeWidth={2} strokeLinecap='round' strokeLinejoin='round' />
70
+ <circle cx='26.25' cy='23.75' r='11.25' stroke='none' strokeWidth={2} />
71
+ <path d='M25.4284 26.1941C25.1303 26.1941 24.8886 25.9524 24.8886 25.6543C24.8924 24.9605 24.9499 24.7451 25.0612 24.3328C25.1763 23.9205 25.3434 23.5875 25.5624 23.3337C25.7814 23.08 26.0449 22.8501 26.353 22.6439C26.5831 22.4853 26.7892 22.3208 26.971 22.1503C27.1529 21.9799 27.2977 21.7915 27.4053 21.5854C27.513 21.3753 27.5668 21.1414 27.5668 20.8837C27.5668 20.6101 27.5056 20.3703 27.3831 20.1641C27.2606 19.958 27.0954 19.7994 26.8875 19.6884C26.6834 19.5774 26.4569 19.5219 26.2082 19.5219C25.967 19.5219 25.7387 19.5794 25.5234 19.6943C25.3081 19.8053 25.1318 19.9719 24.9944 20.1939C24.7404 20.5971 24.3938 21.0086 23.9172 21.0086H23.6686C23.0277 21.0086 22.4861 20.4702 22.6668 19.8553C22.7548 19.5556 22.8774 19.2858 23.0345 19.0461C23.3723 18.5268 23.8196 18.1403 24.3764 17.8865C24.9332 17.6288 25.5475 17.5 26.2194 17.5C26.9581 17.5 27.6114 17.6308 28.1793 17.8925C28.7472 18.1502 29.1926 18.5248 29.5156 19.0164C29.8385 19.508 30 20.1007 30 20.7945C30 21.2583 29.9276 21.6706 29.7829 22.0314C29.6418 22.3882 29.4432 22.7054 29.1871 22.9829C28.931 23.2564 28.6284 23.5042 28.2795 23.7262C27.9863 23.9125 27.745 24.1068 27.5557 24.309C27.3701 24.5112 27.2309 24.7451 27.1381 25.0107C27.049 25.2763 27.0026 25.2658 26.9989 25.6543C26.9989 25.9524 26.7572 26.1941 26.4591 26.1941H25.4284ZM25.9911 30C25.6199 30 25.3025 29.8612 25.039 29.5837C24.7791 29.3023 24.6511 28.9653 24.6548 28.5728C24.6511 28.1843 24.7791 27.8513 25.039 27.5737C25.3025 27.2962 25.6199 27.1575 25.9911 27.1575C26.3437 27.1575 26.6537 27.2962 26.9209 27.5737C27.1882 27.8513 27.3237 28.1843 27.3274 28.5728C27.3237 28.8344 27.2587 29.0743 27.1325 29.2923C27.01 29.5064 26.8486 29.6789 26.6481 29.8097C26.4477 29.9366 26.2287 30 25.9911 30Z' fill='none' className={filledClassName} />
72
+ </svg>
73
+ )
74
+ break
75
+
76
+ default:
77
+ break
78
+ }
79
+ return icon
80
+ }
81
+
82
+ MissingTemplateIcon.propTypes = {
83
+ /**
84
+ * color of text, icon and borders
85
+ */
86
+ color: PropTypes.oneOf(COLORS_ICON),
87
+ /**
88
+ * Size
89
+ */
90
+ size: PropTypes.oneOf(SIZES),
91
+ /**
92
+ * disabled
93
+ */
94
+ disabled: PropTypes.bool,
95
+ /**
96
+ * inactive
97
+ */
98
+ inactive: PropTypes.bool
99
+ }
100
+ MissingTemplateIcon.defaultProps = {
101
+ color: MAIN_DARK_BLUE,
102
+ size: MEDIUM,
103
+ disabled: false,
104
+ inactive: false
105
+ }
106
+
107
+ export default MissingTemplateIcon
package/src/components/icons/index.js CHANGED
@@ -92,6 +92,8 @@ import LogOutIcon from './LogOutIcon'
92
92
  import LogsRiskIcon from './LogsRiskIcon'
93
93
  import MetricsIcon from './MetricsIcon'
94
94
  import MetricsLoadingIcon from './MetricsLoadingIcon'
95
+ import MissingTemplateIcon from './MissingTemplateIcon'
96
+
95
97
  import NameAppIcon from './NameAppIcon'
96
98
  import NoMetricsIcon from './NoMetricsIcon'
97
99
  import OrganizationIcon from './OrganizationIcon'
@@ -240,6 +242,7 @@ export default {
240
242
  LogsRiskIcon,
241
243
  MetricsIcon,
242
244
  MetricsLoadingIcon,
245
+ MissingTemplateIcon,
243
246
  NameAppIcon,
244
247
  NoMetricsIcon,
245
248
  OrganizationIcon,