@hazelcast/ui 1.0.1-next.9 → 1.2.0

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 (200) hide show
  1. package/lib/Alert.d.ts +3 -2
  2. package/lib/Alert.js +23 -23
  3. package/lib/Alert.js.map +1 -1
  4. package/lib/Alert.module.scss +14 -6
  5. package/lib/AutocompleteField.d.ts +2 -1
  6. package/lib/AutocompleteField.js +41 -19
  7. package/lib/AutocompleteField.js.map +1 -1
  8. package/lib/AutocompleteField.module.scss +2 -4
  9. package/lib/AutocompleteFieldFormik.d.ts +2 -1
  10. package/lib/AutocompleteFieldFormik.js +11 -5
  11. package/lib/AutocompleteFieldFormik.js.map +1 -1
  12. package/lib/Button.d.ts +80 -41
  13. package/lib/Button.js +42 -13
  14. package/lib/Button.js.map +1 -1
  15. package/lib/Button.module.scss +119 -87
  16. package/lib/Calendar/Calendar.d.ts +1 -1
  17. package/lib/Calendar/Calendar.js +6 -1
  18. package/lib/Calendar/Calendar.js.map +1 -1
  19. package/lib/Calendar/Calendar.module.scss +132 -124
  20. package/lib/Calendar/components/CalendarTime.js +1 -1
  21. package/lib/Calendar/components/CalendarTime.js.map +1 -1
  22. package/lib/Card.d.ts +1 -0
  23. package/lib/Card.js +4 -3
  24. package/lib/Card.js.map +1 -1
  25. package/lib/Card.module.scss +15 -3
  26. package/lib/Checkbox.js +4 -3
  27. package/lib/Checkbox.js.map +1 -1
  28. package/lib/Checkbox.module.scss +15 -6
  29. package/lib/CheckboxFormik.d.ts +2 -1
  30. package/lib/CheckboxFormik.js +9 -4
  31. package/lib/CheckboxFormik.js.map +1 -1
  32. package/lib/CodeEditor.d.ts +3 -2
  33. package/lib/CodeEditor.js +3 -2
  34. package/lib/CodeEditor.js.map +1 -1
  35. package/lib/EmptyState.d.ts +6 -4
  36. package/lib/EmptyState.js +4 -6
  37. package/lib/EmptyState.js.map +1 -1
  38. package/lib/EmptyState.module.scss +0 -1
  39. package/lib/Error.d.ts +1 -0
  40. package/lib/Error.js +2 -1
  41. package/lib/Error.js.map +1 -1
  42. package/lib/FieldHeader.d.ts +20 -0
  43. package/lib/FieldHeader.js +15 -0
  44. package/lib/FieldHeader.js.map +1 -0
  45. package/lib/FieldHeader.module.scss +20 -0
  46. package/lib/Icon.d.ts +2 -2
  47. package/lib/IconButton.d.ts +13 -3
  48. package/lib/IconButton.js +2 -2
  49. package/lib/IconButton.js.map +1 -1
  50. package/lib/InteractiveList.d.ts +2 -1
  51. package/lib/InteractiveList.js.map +1 -1
  52. package/lib/Link.js +2 -3
  53. package/lib/Link.js.map +1 -1
  54. package/lib/Link.module.scss +6 -0
  55. package/lib/Loader.module.scss +3 -1
  56. package/lib/Modal.d.ts +2 -0
  57. package/lib/Modal.js +2 -2
  58. package/lib/Modal.js.map +1 -1
  59. package/lib/NumberField.js +11 -5
  60. package/lib/NumberField.js.map +1 -1
  61. package/lib/NumberFieldFormik.d.ts +2 -1
  62. package/lib/NumberFieldFormik.js +7 -4
  63. package/lib/NumberFieldFormik.js.map +1 -1
  64. package/lib/Overlay.d.ts +2 -1
  65. package/lib/Overlay.js +7 -5
  66. package/lib/Overlay.js.map +1 -1
  67. package/lib/Overlay.module.scss +16 -3
  68. package/lib/Pagination.d.ts +0 -4
  69. package/lib/Pagination.js +19 -17
  70. package/lib/Pagination.js.map +1 -1
  71. package/lib/Pagination.module.scss +6 -4
  72. package/lib/PasswordFieldFormik.d.ts +2 -1
  73. package/lib/PasswordFieldFormik.js +9 -4
  74. package/lib/PasswordFieldFormik.js.map +1 -1
  75. package/lib/Popover.d.ts +1 -0
  76. package/lib/Popover.js +2 -0
  77. package/lib/Popover.js.map +1 -0
  78. package/lib/RadioGroup.js +4 -3
  79. package/lib/RadioGroup.js.map +1 -1
  80. package/lib/RadioGroup.module.scss +2 -4
  81. package/lib/RadioGroupFormik.d.ts +2 -1
  82. package/lib/RadioGroupFormik.js +9 -4
  83. package/lib/RadioGroupFormik.js.map +1 -1
  84. package/lib/SegmentedControl.d.ts +8 -8
  85. package/lib/SegmentedControl.js.map +1 -1
  86. package/lib/SegmentedControl.module.scss +4 -2
  87. package/lib/SegmentedControlFormik.d.ts +4 -4
  88. package/lib/SegmentedControlFormik.js.map +1 -1
  89. package/lib/Select/CheckableSelectField.d.ts +31 -0
  90. package/lib/Select/CheckableSelectField.js +89 -0
  91. package/lib/Select/CheckableSelectField.js.map +1 -0
  92. package/lib/Select/CheckableSelectField.module.scss +79 -0
  93. package/lib/Select/CheckableSelectFieldFormik.d.ts +10 -0
  94. package/lib/Select/CheckableSelectFieldFormik.js +19 -0
  95. package/lib/Select/CheckableSelectFieldFormik.js.map +1 -0
  96. package/lib/Select/Common.d.ts +9 -0
  97. package/lib/Select/Common.js +37 -0
  98. package/lib/Select/Common.js.map +1 -0
  99. package/lib/Select/Common.module.scss +54 -0
  100. package/lib/Select/MultiSelectField.d.ts +28 -0
  101. package/lib/Select/MultiSelectField.js +111 -0
  102. package/lib/Select/MultiSelectField.js.map +1 -0
  103. package/lib/Select/MultiSelectField.module.scss +72 -0
  104. package/lib/Select/MultiSelectFieldFormik.d.ts +10 -0
  105. package/lib/Select/MultiSelectFieldFormik.js +19 -0
  106. package/lib/Select/MultiSelectFieldFormik.js.map +1 -0
  107. package/lib/Select/SelectField.d.ts +42 -0
  108. package/lib/Select/SelectField.js +87 -0
  109. package/lib/Select/SelectField.js.map +1 -0
  110. package/lib/Select/SelectField.module.scss +191 -0
  111. package/lib/Select/SelectFieldFormik.d.ts +10 -0
  112. package/lib/Select/SelectFieldFormik.js +19 -0
  113. package/lib/Select/SelectFieldFormik.js.map +1 -0
  114. package/lib/Select/helpers.d.ts +11 -0
  115. package/lib/Select/helpers.js +29 -0
  116. package/lib/Select/helpers.js.map +1 -0
  117. package/lib/Select/index.d.ts +7 -0
  118. package/lib/Select/index.js +8 -0
  119. package/lib/Select/index.js.map +1 -0
  120. package/lib/SimpleTable.d.ts +11 -0
  121. package/lib/SimpleTable.js +26 -0
  122. package/lib/SimpleTable.js.map +1 -0
  123. package/lib/SimpleTable.module.scss +28 -0
  124. package/lib/Slider.d.ts +6 -5
  125. package/lib/Slider.js +35 -17
  126. package/lib/Slider.js.map +1 -1
  127. package/lib/Slider.module.scss +8 -8
  128. package/lib/Table/Cell.module.scss +11 -4
  129. package/lib/Table/EnhancedRenderers.d.ts +0 -7
  130. package/lib/Table/EnhancedRenderers.js +3 -14
  131. package/lib/Table/EnhancedRenderers.js.map +1 -1
  132. package/lib/Table/Header.js +9 -3
  133. package/lib/Table/Header.js.map +1 -1
  134. package/lib/Table/Header.module.scss +26 -35
  135. package/lib/Table/Row.js +2 -3
  136. package/lib/Table/Row.js.map +1 -1
  137. package/lib/Table/Row.module.scss +4 -10
  138. package/lib/Table/Table.d.ts +11 -4
  139. package/lib/Table/Table.js +70 -29
  140. package/lib/Table/Table.js.map +1 -1
  141. package/lib/Table/Table.module.scss +5 -5
  142. package/lib/Tabs/Tab.d.ts +9 -1
  143. package/lib/Tabs/Tab.js +5 -2
  144. package/lib/Tabs/Tab.js.map +1 -1
  145. package/lib/Tabs/Tab.module.scss +4 -0
  146. package/lib/TextArea.d.ts +4 -5
  147. package/lib/TextArea.js +7 -7
  148. package/lib/TextArea.js.map +1 -1
  149. package/lib/TextArea.module.scss +6 -4
  150. package/lib/TextField.d.ts +4 -7
  151. package/lib/TextField.js +9 -8
  152. package/lib/TextField.js.map +1 -1
  153. package/lib/TextField.module.scss +4 -18
  154. package/lib/TextFieldFormik.d.ts +4 -2
  155. package/lib/TextFieldFormik.js +15 -4
  156. package/lib/TextFieldFormik.js.map +1 -1
  157. package/lib/TimeField.d.ts +2 -11
  158. package/lib/TimeField.js +7 -6
  159. package/lib/TimeField.js.map +1 -1
  160. package/lib/TimeField.module.scss +6 -6
  161. package/lib/Toggle.js +4 -3
  162. package/lib/Toggle.js.map +1 -1
  163. package/lib/Toggle.module.scss +15 -14
  164. package/lib/Tooltip.d.ts +7 -1
  165. package/lib/Tooltip.js +38 -23
  166. package/lib/Tooltip.js.map +1 -1
  167. package/lib/Tooltip.module.scss +10 -5
  168. package/lib/TruncatedText.d.ts +1 -1
  169. package/lib/TruncatedText.js +1 -1
  170. package/lib/TruncatedText.js.map +1 -1
  171. package/lib/hooks/index.d.ts +1 -0
  172. package/lib/hooks/index.js +3 -0
  173. package/lib/hooks/index.js.map +1 -0
  174. package/lib/hooks/usePrevious.d.ts +1 -0
  175. package/lib/hooks/usePrevious.js +9 -0
  176. package/lib/hooks/usePrevious.js.map +1 -0
  177. package/lib/hooks/useTableCustomizableColumns.d.ts +9 -0
  178. package/lib/hooks/useTableCustomizableColumns.js +23 -0
  179. package/lib/hooks/useTableCustomizableColumns.js.map +1 -0
  180. package/lib/index.d.ts +4 -2
  181. package/lib/index.js +4 -2
  182. package/lib/index.js.map +1 -1
  183. package/package.json +13 -13
  184. package/styles/constants/_sizes.scss +7 -6
  185. package/styles/constants/_typography.scss +3 -3
  186. package/styles/fonts.css +29 -65
  187. package/styles/helpers/_a11y.scss +4 -0
  188. package/styles/helpers/_error.scss +17 -0
  189. package/styles/helpers/_index.scss +1 -0
  190. package/lib/Calendar/components/CalendarHeader.tsx +0 -45
  191. package/lib/Calendar/components/CalendarInput.tsx +0 -50
  192. package/lib/Calendar/components/CalendarTime.tsx +0 -116
  193. package/lib/Calendar/helpers/consts.ts +0 -99
  194. package/lib/SelectField.d.ts +0 -81
  195. package/lib/SelectField.js +0 -196
  196. package/lib/SelectField.js.map +0 -1
  197. package/lib/SelectField.module.scss +0 -251
  198. package/lib/SelectFieldFormik.d.ts +0 -20
  199. package/lib/SelectFieldFormik.js +0 -19
  200. package/lib/SelectFieldFormik.js.map +0 -1
@@ -1,7 +1,9 @@
1
1
  @use '../styles/constants' as c;
2
2
 
3
3
  .wrapper {
4
- padding: c.$grid * 5;
4
+ $padding: c.$grid * 5;
5
+
6
+ padding: $padding;
5
7
  box-shadow: 0 c.$cardShadowSize c.$cardShadowBlur 0 c.$colorShadow;
6
8
  border-radius: c.$borderRadius;
7
9
  background: c.$colorNeutralWhite;
@@ -11,7 +13,6 @@
11
13
 
12
14
  display: flex;
13
15
  align-items: center;
14
- margin-bottom: c.$grid * 4;
15
16
 
16
17
  .icon {
17
18
  margin-right: c.$grid * 2.5;
@@ -19,6 +20,8 @@
19
20
 
20
21
  .title {
21
22
  margin: 0;
23
+ font-size: c.$fontSizeBodyNormal !important;
24
+ line-height: c.$lineHeightBodyNormal !important;
22
25
 
23
26
  &.space {
24
27
  margin-right: c.$grid * 2.5;
@@ -29,7 +32,7 @@
29
32
  .separator {
30
33
  width: 100%;
31
34
  height: 1px;
32
- margin: c.$grid * 4 0;
35
+ margin-top: c.$grid * 4;
33
36
  background: c.$colorNeutral;
34
37
  }
35
38
 
@@ -44,4 +47,13 @@
44
47
  margin-top: 0;
45
48
  }
46
49
  }
50
+
51
+ .caption {
52
+ display: flex;
53
+ margin: (-$padding) (-$padding) $padding (-$padding);
54
+
55
+ & > * {
56
+ flex: 1;
57
+ }
58
+ }
47
59
  }
package/lib/Checkbox.js CHANGED
@@ -15,14 +15,15 @@ import styles from './Checkbox.module.scss';
15
15
  * - It's important to realise that we don't set checkbox value, but state (on/off). That is the main difference from other input types.
16
16
  * - They can have a special indeterminate state, that represents a '3rd' value, usually used in tree structures, etc.
17
17
  */
18
- export const Checkbox = ({ checked, name, onChange, onBlur, className, classNameLabel, value, indeterminate = false, label, helperText, error, disabled = false, required, 'data-test': dataTest, }) => {
18
+ export const Checkbox = (props) => {
19
+ const { checked, name, onChange, onBlur, className, classNameLabel, value, indeterminate = false, label, helperText, error, disabled = false, required, 'data-test': dataTest, } = props;
19
20
  const inputRef = useRef(null);
20
21
  const id = useUID();
21
22
  let ariaChecked = checked ? 'true' : 'false';
22
23
  if (indeterminate) {
23
24
  ariaChecked = 'mixed';
24
25
  }
25
- return (React.createElement("div", { className: className, "data-test": dataTest },
26
+ return (React.createElement("div", { className: classNames(className, { [styles.withError]: 'error' in props }), "data-test": dataTest },
26
27
  React.createElement("label", { className: classNames(styles.wrapper, {
27
28
  [styles.error]: !!error,
28
29
  [styles.checked]: checked,
@@ -32,6 +33,6 @@ export const Checkbox = ({ checked, name, onChange, onBlur, className, className
32
33
  React.createElement("input", { type: "checkbox", ref: inputRef, id: id, name: name, checked: !!checked, onChange: onChange, onBlur: onBlur, value: value, disabled: disabled, "aria-checked": ariaChecked, "aria-invalid": !!error, "aria-required": required, "aria-describedby": helperText && helpTooltipId(id), "aria-errormessage": error && errorId(id) }),
33
34
  indeterminate ? React.createElement(Minus, { className: styles.checkmark }) : React.createElement(Check, { className: styles.checkmark }),
34
35
  helperText && React.createElement(Help, { parentId: id, helperText: helperText, className: styles.helperText })),
35
- React.createElement(Error, { error: error, className: styles.errorContainer, inputId: id })));
36
+ React.createElement(Error, { truncated: true, error: error, className: styles.errorContainer, inputId: id })));
36
37
  };
37
38
  //# sourceMappingURL=Checkbox.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../src/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA+C,MAAM,EAAE,MAAM,OAAO,CAAA;AAClF,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAE5C,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,UAAU,MAAM,YAAY,CAAA;AAEnC,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AACxC,OAAO,EAAE,IAAI,EAAa,aAAa,EAAE,MAAM,QAAQ,CAAA;AAEvD,OAAO,MAAM,MAAM,wBAAwB,CAAA;AAuB3C;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAsB,CAAC,EAC1C,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,SAAS,EACT,cAAc,EACd,KAAK,EACL,aAAa,GAAG,KAAK,EACrB,KAAK,EACL,UAAU,EACV,KAAK,EACL,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,WAAW,EAAE,QAAQ,GACtB,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;IAC/C,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;IAEnB,IAAI,WAAW,GAAmC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAA;IAC5E,IAAI,aAAa,EAAE;QACjB,WAAW,GAAG,OAAO,CAAA;KACtB;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,eAAa,QAAQ;QAK5C,+BACE,SAAS,EAAE,UAAU,CACnB,MAAM,CAAC,OAAO,EACd;gBACE,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,KAAK;gBACvB,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,OAAO;gBACzB,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;aAC5B,EACD,cAAc,CACf,EACD,OAAO,EAAE,EAAE;YAEX,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,eAAY,sBAAsB,IAC3D,KAAK,CACD;YACP,+BACE,IAAI,EAAC,UAAU,EACf,GAAG,EAAE,QAAQ,EACb,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,CAAC,CAAC,OAAO,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,kBACJ,WAAW,kBACX,CAAC,CAAC,KAAK,mBACN,QAAQ,sBACL,UAAU,IAAI,aAAa,CAAC,EAAE,CAAC,uBAC9B,KAAK,IAAI,OAAO,CAAC,EAAE,CAAC,GACvC;YACD,aAAa,CAAC,CAAC,CAAC,oBAAC,KAAK,IAAC,SAAS,EAAE,MAAM,CAAC,SAAS,GAAI,CAAC,CAAC,CAAC,oBAAC,KAAK,IAAC,SAAS,EAAE,MAAM,CAAC,SAAS,GAAI;YAC/F,UAAU,IAAI,oBAAC,IAAI,IAAC,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,UAAU,GAAI,CACrF;QACR,oBAAC,KAAK,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,CAAC,cAAc,EAAE,OAAO,EAAE,EAAE,GAAI,CAClE,CACP,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../src/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA+C,MAAM,EAAE,MAAM,OAAO,CAAA;AAClF,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAE5C,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,UAAU,MAAM,YAAY,CAAA;AAEnC,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AACxC,OAAO,EAAE,IAAI,EAAa,aAAa,EAAE,MAAM,QAAQ,CAAA;AAEvD,OAAO,MAAM,MAAM,wBAAwB,CAAA;AAuB3C;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAsB,CAAC,KAAK,EAAE,EAAE;IACnD,MAAM,EACJ,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,SAAS,EACT,cAAc,EACd,KAAK,EACL,aAAa,GAAG,KAAK,EACrB,KAAK,EACL,UAAU,EACV,KAAK,EACL,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,WAAW,EAAE,QAAQ,GACtB,GAAG,KAAK,CAAA;IACT,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;IAC/C,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;IAEnB,IAAI,WAAW,GAAmC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAA;IAC5E,IAAI,aAAa,EAAE;QACjB,WAAW,GAAG,OAAO,CAAA;KACtB;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,OAAO,IAAI,KAAK,EAAE,CAAC,eAAa,QAAQ;QAKlG,+BACE,SAAS,EAAE,UAAU,CACnB,MAAM,CAAC,OAAO,EACd;gBACE,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,KAAK;gBACvB,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,OAAO;gBACzB,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;aAC5B,EACD,cAAc,CACf,EACD,OAAO,EAAE,EAAE;YAEX,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,eAAY,sBAAsB,IAC3D,KAAK,CACD;YACP,+BACE,IAAI,EAAC,UAAU,EACf,GAAG,EAAE,QAAQ,EACb,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,CAAC,CAAC,OAAO,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,kBACJ,WAAW,kBACX,CAAC,CAAC,KAAK,mBACN,QAAQ,sBACL,UAAU,IAAI,aAAa,CAAC,EAAE,CAAC,uBAC9B,KAAK,IAAI,OAAO,CAAC,EAAE,CAAC,GACvC;YACD,aAAa,CAAC,CAAC,CAAC,oBAAC,KAAK,IAAC,SAAS,EAAE,MAAM,CAAC,SAAS,GAAI,CAAC,CAAC,CAAC,oBAAC,KAAK,IAAC,SAAS,EAAE,MAAM,CAAC,SAAS,GAAI;YAC/F,UAAU,IAAI,oBAAC,IAAI,IAAC,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,UAAU,GAAI,CACrF;QACR,oBAAC,KAAK,IAAC,SAAS,QAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,CAAC,cAAc,EAAE,OAAO,EAAE,EAAE,GAAI,CAC5E,CACP,CAAA;AACH,CAAC,CAAA"}
@@ -1,10 +1,17 @@
1
1
  @use '../styles/constants' as c;
2
2
  @use '../styles/helpers' as h;
3
3
 
4
+ @include h.withError;
5
+
4
6
  .wrapper {
5
7
  display: flex;
6
8
  flex-direction: row;
7
9
  cursor: pointer;
10
+ box-sizing: border-box;
11
+
12
+ * {
13
+ box-sizing: border-box;
14
+ }
8
15
 
9
16
  @include c.typographyBodySmall;
10
17
 
@@ -14,19 +21,25 @@
14
21
  }
15
22
 
16
23
  .helperText {
24
+ margin-top: c.$grid * 0.5;
17
25
  margin-left: c.$grid * 1.5;
18
26
  }
19
27
 
20
28
  // default visible checkmark
21
29
  .checkmark {
22
- width: c.$iconSizeSmall;
23
- height: c.$iconSizeSmall;
30
+ /* doiuse-disable calc */
31
+ $checkmarkSize: calc(#{c.$iconSizeSmall} + #{c.$borderWidth * 2});
32
+ /* doiuse-enable calc */
33
+
34
+ width: $checkmarkSize;
35
+ height: $checkmarkSize;
24
36
  border: c.$borderWidth solid c.$colorNeutralLight;
25
37
  border-radius: c.$grid;
26
38
  color: c.$colorNeutralWhite;
27
39
  // because of ~ and + selectors used below, we need to keep the current order in DOM and
28
40
  // fix it visually with order property
29
41
  order: -1;
42
+ flex-shrink: 0;
30
43
  }
31
44
 
32
45
  & > input:checked ~ .checkmark {
@@ -86,7 +99,3 @@
86
99
  }
87
100
  }
88
101
  }
89
-
90
- .errorContainer {
91
- margin-top: c.$grid;
92
- }
@@ -5,5 +5,6 @@ import { ExtractKeysOfValueType } from './utils/types';
5
5
  export declare type CheckboxFieldFormikProps<V extends object> = CheckboxExtraProps & {
6
6
  name: ExtractKeysOfValueType<V, boolean>;
7
7
  validate?: FieldValidatorGeneric<boolean>;
8
+ onChange?: (value: boolean) => void;
8
9
  };
9
- export declare const CheckboxFormik: <V extends object>({ name, validate, ...props }: CheckboxFieldFormikProps<V>) => ReactElement;
10
+ export declare const CheckboxFormik: <V extends object>({ name, validate, onChange, ...props }: CheckboxFieldFormikProps<V>) => ReactElement;
@@ -1,12 +1,17 @@
1
- import React from 'react';
1
+ import React, { useCallback } from 'react';
2
2
  import { useField } from 'formik';
3
3
  import { Checkbox } from './Checkbox';
4
4
  import { getFieldError } from './utils/formik';
5
- export const CheckboxFormik = ({ name, validate, ...props }) => {
6
- const [field, meta] = useField({
5
+ export const CheckboxFormik = ({ name, validate, onChange, ...props }) => {
6
+ const [{ onBlur, onChange: onFormikChange, value }, meta] = useField({
7
7
  name,
8
8
  validate,
9
9
  });
10
- return (React.createElement(Checkbox, Object.assign({}, props, { name: name, checked: field.value, onChange: field.onChange, onBlur: field.onBlur, error: getFieldError(meta) })));
10
+ return (React.createElement(Checkbox, Object.assign({}, props, { name: name, checked: value, onChange: useCallback((e) => {
11
+ if (onChange) {
12
+ onChange(e.target.checked);
13
+ }
14
+ onFormikChange(e);
15
+ }, [onFormikChange, onChange]), onBlur: onBlur, error: getFieldError(meta) })));
11
16
  };
12
17
  //# sourceMappingURL=CheckboxFormik.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxFormik.js","sourceRoot":"","sources":["../src/CheckboxFormik.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuB,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAsB,MAAM,YAAY,CAAA;AACzD,OAAO,EAAyB,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAQrE,MAAM,CAAC,MAAM,cAAc,GAAG,CAAmB,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,EAA+B,EAAgB,EAAE;IAC1H,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,QAAQ,CAAU;QACtC,IAAI;QACJ,QAAQ;KACT,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,QAAQ,oBAAK,KAAK,IAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,IAAI,CACtI,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"CheckboxFormik.js","sourceRoot":"","sources":["../src/CheckboxFormik.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAgB,WAAW,EAAE,MAAM,OAAO,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAsB,MAAM,YAAY,CAAA;AACzD,OAAO,EAAyB,aAAa,EAAE,MAAM,gBAAgB,CAAA;AASrE,MAAM,CAAC,MAAM,cAAc,GAAG,CAAmB,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,EAA+B,EAAgB,EAAE;IACpI,MAAM,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,KAAK,EAAE,EAAE,IAAI,CAAC,GAAG,QAAQ,CAAU;QAC5E,IAAI;QACJ,QAAQ;KACT,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,QAAQ,oBACH,KAAK,IACT,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,WAAW,CACnB,CAAC,CAAC,EAAE,EAAE;YACJ,IAAI,QAAQ,EAAE;gBACZ,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;aAC3B;YAED,cAAc,CAAC,CAAC,CAAC,CAAA;QACnB,CAAC,EACD,CAAC,cAAc,EAAE,QAAQ,CAAC,CAC3B,EACD,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,IAC1B,CACH,CAAA;AACH,CAAC,CAAA"}
@@ -1,7 +1,7 @@
1
1
  import { FC, MutableRefObject, FocusEvent } from 'react';
2
- import { EditorView } from '@codemirror/view';
2
+ import { EditorView, KeyBinding } from '@codemirror/view';
3
3
  import { EditorState, Extension } from '@codemirror/state';
4
- export { EditorView, EditorState };
4
+ export { EditorView, EditorState, KeyBinding };
5
5
  export declare type CodeOptions = {
6
6
  language?: any;
7
7
  lineWrapping?: boolean;
@@ -20,6 +20,7 @@ export declare type CodeEditorProps = {
20
20
  onChange?: OnChangeCallback;
21
21
  onBlur?: (e: FocusEvent) => void;
22
22
  customExtensions?: Extension[];
23
+ customKeymap?: KeyBinding[];
23
24
  innerRef?: MutableRefObject<EditorViewRef | null>;
24
25
  error?: string;
25
26
  errorClassName?: string;
package/lib/CodeEditor.js CHANGED
@@ -16,6 +16,7 @@
16
16
  of use (no need to add anything to your dependencies) and also there're not many CM6 languages as of
17
17
  writing this.
18
18
 
19
+ // add @codemirror/legacy-modes to your project's dependencies.
19
20
  import { javascript } from '@codemirror/legacy-modes/mode/javascript'
20
21
  import { python } from '@codemirror/legacy-modes/mode/python'
21
22
 
@@ -64,9 +65,8 @@ const DEFAULT_OPTIONS = {
64
65
  language: null,
65
66
  lineWrapping: false,
66
67
  lineNumbers: true,
67
- rows: 5,
68
68
  };
69
- export const CodeEditor = ({ name, value, className, options = {}, onChange, onBlur, customExtensions, innerRef, error, errorClassName, }) => {
69
+ export const CodeEditor = ({ name, value, className, options = {}, onChange, onBlur, customExtensions, customKeymap, innerRef, error, errorClassName, }) => {
70
70
  const id = useUID();
71
71
  const parentRef = useRef(null);
72
72
  const cm = useRef(null);
@@ -119,6 +119,7 @@ export const CodeEditor = ({ name, value, className, options = {}, onChange, onB
119
119
  ...commentKeymap,
120
120
  ...completionKeymap,
121
121
  ...lintKeymap,
122
+ ...(customKeymap !== null && customKeymap !== void 0 ? customKeymap : []),
122
123
  ]),
123
124
  ];
124
125
  const fixedHeightExtension = () => {
@@ -1 +1 @@
1
- {"version":3,"file":"CodeEditor.js","sourceRoot":"","sources":["../src/CodeEditor.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"CodeEditor.js","sourceRoot":"","sources":["../src/CodeEditor.tsx"],"names":[],"mappings":"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"}
@@ -1,6 +1,7 @@
1
- import { FC } from 'react';
1
+ import { FC, ReactChild } from 'react';
2
2
  import { ButtonTypeAnchorProps, ButtonProps } from './Button';
3
3
  import { IconProps } from './Icon';
4
+ import { DataTestProp } from '@hazelcast/helpers';
4
5
  declare type EmptyStateSize = 'normal' | 'large';
5
6
  declare type EmptyStateActionButton = {
6
7
  direction?: 'vertical';
@@ -30,11 +31,12 @@ declare type EmptyStateAction = ({
30
31
  size?: EmptyStateSize;
31
32
  };
32
33
  export declare type EmptyStateProps = {
33
- title: string;
34
- description?: string;
34
+ title: ReactChild;
35
+ description?: ReactChild;
35
36
  icon: IconProps['icon'];
36
37
  iconLabel: string;
37
- } & EmptyStateAction;
38
+ className?: string;
39
+ } & EmptyStateAction & DataTestProp;
38
40
  /**
39
41
  * ### Purpose
40
42
  * Sometimes users performs an action, that yields an empty result. Such cases may be first use of a feature, view with no data, user cleared view or an error state.
package/lib/EmptyState.js CHANGED
@@ -16,18 +16,16 @@ import styles from './EmptyState.module.scss';
16
16
  * - Good practice is add an action button to guide a user for the next steps to get out of the empty state.
17
17
  * - Description helps to describe the semantics more thoroughly.
18
18
  */
19
- export const EmptyState = ({ direction = 'vertical', size = 'normal', title, description, icon, iconLabel, ...restWActionProps }) => {
19
+ export const EmptyState = ({ 'data-test': dataTest, direction = 'vertical', size = 'normal', title, description, icon, iconLabel, className, ...restWActionProps }) => {
20
20
  const { action, actionHref, actionOnClick, actionTarget, actionRel } = restWActionProps;
21
21
  const iconSize = direction === 'vertical' && size === 'large' ? 'xlarge' : 'large';
22
- return (React.createElement("div", { "data-test": "empty-state-container", className: cn(styles.container, {
23
- // Direction
22
+ return (React.createElement("div", { "data-test": dataTest !== null && dataTest !== void 0 ? dataTest : 'empty-state-container', className: cn(styles.container, {
24
23
  [styles.horizontal]: direction === 'horizontal',
25
- // Size
26
24
  [styles.large]: size === 'large',
27
- }) },
25
+ }, className) },
28
26
  React.createElement(Icon, { "data-test": "empty-state-icon", className: styles.icon, icon: icon, ariaLabel: iconLabel, size: iconSize }),
29
27
  React.createElement("div", { className: styles.content },
30
- React.createElement("h3", { "data-test": "empty-state-title", className: styles.title }, title),
28
+ React.createElement("div", { "data-test": "empty-state-title", className: styles.title }, title),
31
29
  description && (React.createElement("p", { "data-test": "empty-state-description", className: styles.description }, description)),
32
30
  action ? (direction === 'horizontal' && actionHref !== undefined ? (React.createElement(Link, { "data-test": "empty-state-link", className: styles.action, icon: ChevronRight, ariaLabel: "Icon Chevron Right", href: actionHref, target: actionTarget, rel: actionRel, size: "small" }, action)) : (React.createElement(Button, { "data-test": "empty-state-button", className: styles.action, onClick: actionOnClick }, action))) : null)));
33
31
  };
@@ -1 +1 @@
1
- {"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../src/EmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAE5C,OAAO,EAAsC,MAAM,EAAE,MAAM,UAAU,CAAA;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AAExC,OAAO,MAAM,MAAM,0BAA0B,CAAA;AA6C7C;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,UAAU,GAAwB,CAAC,EAC9C,SAAS,GAAG,UAAU,EACtB,IAAI,GAAG,QAAQ,EACf,KAAK,EACL,WAAW,EACX,IAAI,EACJ,SAAS,EACT,GAAG,gBAAgB,EACpB,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,gBAAgB,CAAA;IAEvF,MAAM,QAAQ,GAAG,SAAS,KAAK,UAAU,IAAI,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAA;IAElF,OAAO,CACL,0CACY,uBAAuB,EACjC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE;YAC9B,YAAY;YACZ,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,SAAS,KAAK,YAAY;YAC/C,OAAO;YACP,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,OAAO;SACjC,CAAC;QAEF,oBAAC,IAAI,iBAAW,kBAAkB,EAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,GAAI;QAC/G,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO;YAE5B,yCAAc,mBAAmB,EAAC,SAAS,EAAE,MAAM,CAAC,KAAK,IACtD,KAAK,CACH;YACJ,WAAW,IAAI,CACd,wCAAa,yBAAyB,EAAC,SAAS,EAAE,MAAM,CAAC,WAAW,IACjE,WAAW,CACV,CACL;YACA,MAAM,CAAC,CAAC,CAAC,CACR,SAAS,KAAK,YAAY,IAAI,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,CACvD,oBAAC,IAAI,iBACO,kBAAkB,EAC5B,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,IAAI,EAAE,YAAY,EAClB,SAAS,EAAC,oBAAoB,EAC9B,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,YAAY,EACpB,GAAG,EAAE,SAAS,EACd,IAAI,EAAC,OAAO,IAEX,MAAM,CACF,CACR,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,iBAAW,oBAAoB,EAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,EAAE,aAAa,IACpF,MAAM,CACA,CACV,CACF,CAAC,CAAC,CAAC,IAAI,CACJ,CACF,CACP,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../src/EmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAC7C,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAE5C,OAAO,EAAsC,MAAM,EAAE,MAAM,UAAU,CAAA;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AAExC,OAAO,MAAM,MAAM,0BAA0B,CAAA;AAgD7C;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,UAAU,GAAwB,CAAC,EAC9C,WAAW,EAAE,QAAQ,EACrB,SAAS,GAAG,UAAU,EACtB,IAAI,GAAG,QAAQ,EACf,KAAK,EACL,WAAW,EACX,IAAI,EACJ,SAAS,EACT,SAAS,EACT,GAAG,gBAAgB,EACpB,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,gBAAgB,CAAA;IAEvF,MAAM,QAAQ,GAAG,SAAS,KAAK,UAAU,IAAI,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAA;IAElF,OAAO,CACL,0CACa,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,uBAAuB,EAC9C,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,SAAS,EAChB;YACE,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,SAAS,KAAK,YAAY;YAC/C,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,OAAO;SACjC,EACD,SAAS,CACV;QAED,oBAAC,IAAI,iBAAW,kBAAkB,EAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,GAAI;QAC/G,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO;YAC5B,0CAAe,mBAAmB,EAAC,SAAS,EAAE,MAAM,CAAC,KAAK,IACvD,KAAK,CACF;YACL,WAAW,IAAI,CACd,wCAAa,yBAAyB,EAAC,SAAS,EAAE,MAAM,CAAC,WAAW,IACjE,WAAW,CACV,CACL;YACA,MAAM,CAAC,CAAC,CAAC,CACR,SAAS,KAAK,YAAY,IAAI,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,CACvD,oBAAC,IAAI,iBACO,kBAAkB,EAC5B,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,IAAI,EAAE,YAAY,EAClB,SAAS,EAAC,oBAAoB,EAC9B,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,YAAY,EACpB,GAAG,EAAE,SAAS,EACd,IAAI,EAAC,OAAO,IAEX,MAAM,CACF,CACR,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,iBAAW,oBAAoB,EAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,EAAE,aAAa,IACpF,MAAM,CACA,CACV,CACF,CAAC,CAAC,CAAC,IAAI,CACJ,CACF,CACP,CAAA;AACH,CAAC,CAAA"}
@@ -5,7 +5,6 @@
5
5
  flex-direction: column;
6
6
  justify-content: center;
7
7
  align-items: center;
8
- max-width: c.$emptyStateMaxWidth;
9
8
  text-align: center;
10
9
 
11
10
  .content {
package/lib/Error.d.ts CHANGED
@@ -4,6 +4,7 @@ interface ErrorProps {
4
4
  error?: string;
5
5
  className?: string;
6
6
  inputId: string;
7
+ truncated?: boolean;
7
8
  }
8
9
  export declare const Error: FC<ErrorProps>;
9
10
  export {};
package/lib/Error.js CHANGED
@@ -1,7 +1,8 @@
1
1
  import React from 'react';
2
2
  import cn from 'classnames';
3
3
  import styles from './Error.module.scss';
4
+ import { TruncatedText } from './TruncatedText';
4
5
  export const errorId = (inputId) => `${inputId}-error`;
5
6
  /* https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role */
6
- export const Error = ({ error, className, inputId }) => (React.createElement("div", { className: cn(styles.container, error && styles.hasError, className), role: "alert", id: errorId(inputId) }, error));
7
+ export const Error = ({ error, className, inputId, truncated }) => (React.createElement("div", { className: cn(styles.container, error && styles.hasError, className), role: "alert", id: errorId(inputId) }, truncated ? React.createElement(TruncatedText, { text: error || '' }) : error));
7
8
  //# sourceMappingURL=Error.js.map
package/lib/Error.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Error.js","sourceRoot":"","sources":["../src/Error.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,MAAM,MAAM,qBAAqB,CAAA;AAExC,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,OAAe,EAAU,EAAE,CAAC,GAAG,OAAO,QAAQ,CAAA;AAQtE,0GAA0G;AAC1G,MAAM,CAAC,MAAM,KAAK,GAAmB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CACtE,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,IAAI,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,EAAE,IAAI,EAAC,OAAO,EAAC,EAAE,EAAE,OAAO,CAAC,OAAO,CAAC,IACzG,KAAK,CACF,CACP,CAAA"}
1
+ {"version":3,"file":"Error.js","sourceRoot":"","sources":["../src/Error.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,MAAM,MAAM,qBAAqB,CAAA;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,OAAe,EAAU,EAAE,CAAC,GAAG,OAAO,QAAQ,CAAA;AAStE,0GAA0G;AAC1G,MAAM,CAAC,MAAM,KAAK,GAAmB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CACjF,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,IAAI,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,EAAE,IAAI,EAAC,OAAO,EAAC,EAAE,EAAE,OAAO,CAAC,OAAO,CAAC,IACzG,SAAS,CAAC,CAAC,CAAC,oBAAC,aAAa,IAAC,IAAI,EAAE,KAAK,IAAI,EAAE,GAAI,CAAC,CAAC,CAAC,KAAK,CACrD,CACP,CAAA"}
@@ -0,0 +1,20 @@
1
+ /// <reference types="react" />
2
+ import { HelpProps } from './Help';
3
+ import { DataTestProp } from '@hazelcast/helpers';
4
+ export declare type FieldHeaderSize = 'small' | 'medium';
5
+ export declare type FieldHeaderLabelProps = {
6
+ label: string;
7
+ labelClassName?: string;
8
+ helperText?: HelpProps['helperText'];
9
+ };
10
+ export declare type FieldHeaderNoLabelProps = {
11
+ label: never;
12
+ labelClassName: never;
13
+ helperText: never;
14
+ };
15
+ export declare type FieldHeaderProps = {
16
+ size?: FieldHeaderSize;
17
+ id: string;
18
+ showAriaLabel?: boolean;
19
+ } & DataTestProp & (FieldHeaderNoLabelProps | FieldHeaderLabelProps);
20
+ export declare const FieldHeader: (props: FieldHeaderProps) => JSX.Element | null;
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ import cn from 'classnames';
3
+ import { Label } from './Label';
4
+ import { Help } from './Help';
5
+ import styles from './FieldHeader.module.scss';
6
+ export const FieldHeader = (props) => {
7
+ const { label, id, helperText, size = 'medium', labelClassName, 'data-test': dataTest, showAriaLabel } = props;
8
+ if (showAriaLabel) {
9
+ return null;
10
+ }
11
+ return (React.createElement("div", { className: styles.root },
12
+ label && (React.createElement(Label, { id: id, label: label, "data-test": dataTest ? `${dataTest}-label` : undefined, className: cn(styles.label, { [styles.small]: size === 'small' }, labelClassName) })),
13
+ label && helperText && (React.createElement(Help, { parentId: id, helperText: helperText, className: styles.helperText, "data-test": dataTest ? `${dataTest}-helperText` : undefined }))));
14
+ };
15
+ //# sourceMappingURL=FieldHeader.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FieldHeader.js","sourceRoot":"","sources":["../src/FieldHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AAGxC,OAAO,MAAM,MAAM,2BAA2B,CAAA;AAY9C,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAuB,EAAE,EAAE;IACrD,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,UAAU,EAAE,IAAI,GAAG,QAAQ,EAAE,cAAc,EAAE,WAAW,EAAE,QAAQ,EAAE,aAAa,EAAE,GAAG,KAAK,CAAA;IAE9G,IAAI,aAAa,EAAE;QACjB,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI;QACxB,KAAK,IAAI,CACR,oBAAC,KAAK,IACJ,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,eACD,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,QAAQ,CAAC,CAAC,CAAC,SAAS,EACrD,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,OAAO,EAAE,EAAE,cAAc,CAAC,GACjF,CACH;QACA,KAAK,IAAI,UAAU,IAAI,CACtB,oBAAC,IAAI,IACH,QAAQ,EAAE,EAAE,EACZ,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,MAAM,CAAC,UAAU,eACjB,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,aAAa,CAAC,CAAC,CAAC,SAAS,GAC1D,CACH,CACG,CACP,CAAA;AACH,CAAC,CAAA"}
@@ -0,0 +1,20 @@
1
+ @use '../styles/constants' as c;
2
+
3
+ .root {
4
+ display: flex;
5
+ margin-bottom: c.$grid;
6
+ }
7
+
8
+ .label {
9
+ flex-shrink: 0;
10
+ white-space: pre-wrap;
11
+
12
+ &.small {
13
+ @include c.typographyBodySmall;
14
+ }
15
+ }
16
+
17
+ .helperText {
18
+ flex-shrink: 0;
19
+ margin-top: c.$grid * 0.5;
20
+ }
package/lib/Icon.d.ts CHANGED
@@ -11,7 +11,7 @@ export declare type IconAriaProps = {
11
11
  } | {
12
12
  ariaLabel?: never;
13
13
  ariaLabelledBy?: never;
14
- ariaHidden: boolean;
14
+ ariaHidden?: boolean;
15
15
  };
16
16
  export declare type IconType = FC<SVGAttributes<SVGElement> & {
17
17
  color?: string;
@@ -57,5 +57,5 @@ export declare const Icon: React.ForwardRefExoticComponent<({
57
57
  } & {
58
58
  ariaLabel?: undefined;
59
59
  ariaLabelledBy?: undefined;
60
- ariaHidden: boolean;
60
+ ariaHidden?: boolean | undefined;
61
61
  } & React.RefAttributes<HTMLDivElement>)>;
@@ -11,6 +11,7 @@ declare type IconButtonCommonProps = {
11
11
  kind?: IconButtonKind;
12
12
  size?: IconProps['size'];
13
13
  padding?: 'normal';
14
+ tooltip?: string;
14
15
  } & IconAriaProps & Pick<ButtonHTMLAttributes<HTMLAnchorElement | HTMLButtonElement>, 'onClick' | 'onMouseDown' | 'className' | 'tabIndex' | 'style'>;
15
16
  export declare type IconButtonNotDisabledProps = {
16
17
  disabledTooltip?: never;
@@ -46,6 +47,7 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
46
47
  kind?: "transparent" | "primary" | undefined;
47
48
  size?: IconProps['size'];
48
49
  padding?: "normal" | undefined;
50
+ tooltip?: string | undefined;
49
51
  } & {
50
52
  ariaLabel: string;
51
53
  ariaLabelledBy?: undefined;
@@ -64,6 +66,7 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
64
66
  kind?: "transparent" | "primary" | undefined;
65
67
  size?: IconProps['size'];
66
68
  padding?: "normal" | undefined;
69
+ tooltip?: string | undefined;
67
70
  } & {
68
71
  ariaLabel: string;
69
72
  ariaLabelledBy?: undefined;
@@ -81,6 +84,7 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
81
84
  kind?: "transparent" | "primary" | undefined;
82
85
  size?: IconProps['size'];
83
86
  padding?: "normal" | undefined;
87
+ tooltip?: string | undefined;
84
88
  } & {
85
89
  ariaLabel: string;
86
90
  ariaLabelledBy?: undefined;
@@ -98,6 +102,7 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
98
102
  kind?: "transparent" | "primary" | undefined;
99
103
  size?: IconProps['size'];
100
104
  padding?: "normal" | undefined;
105
+ tooltip?: string | undefined;
101
106
  } & {
102
107
  ariaLabel?: undefined;
103
108
  ariaLabelledBy: string;
@@ -116,6 +121,7 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
116
121
  kind?: "transparent" | "primary" | undefined;
117
122
  size?: IconProps['size'];
118
123
  padding?: "normal" | undefined;
124
+ tooltip?: string | undefined;
119
125
  } & {
120
126
  ariaLabel?: undefined;
121
127
  ariaLabelledBy: string;
@@ -133,6 +139,7 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
133
139
  kind?: "transparent" | "primary" | undefined;
134
140
  size?: IconProps['size'];
135
141
  padding?: "normal" | undefined;
142
+ tooltip?: string | undefined;
136
143
  } & {
137
144
  ariaLabel?: undefined;
138
145
  ariaLabelledBy: string;
@@ -150,10 +157,11 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
150
157
  kind?: "transparent" | "primary" | undefined;
151
158
  size?: IconProps['size'];
152
159
  padding?: "normal" | undefined;
160
+ tooltip?: string | undefined;
153
161
  } & {
154
162
  ariaLabel?: undefined;
155
163
  ariaLabelledBy?: undefined;
156
- ariaHidden: boolean;
164
+ ariaHidden?: boolean | undefined;
157
165
  } & Pick<React.ButtonHTMLAttributes<HTMLAnchorElement | HTMLButtonElement>, "style" | "className" | "tabIndex" | "onClick" | "onMouseDown"> & {
158
166
  component: 'a';
159
167
  href: string;
@@ -168,10 +176,11 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
168
176
  kind?: "transparent" | "primary" | undefined;
169
177
  size?: IconProps['size'];
170
178
  padding?: "normal" | undefined;
179
+ tooltip?: string | undefined;
171
180
  } & {
172
181
  ariaLabel?: undefined;
173
182
  ariaLabelledBy?: undefined;
174
- ariaHidden: boolean;
183
+ ariaHidden?: boolean | undefined;
175
184
  } & Pick<React.ButtonHTMLAttributes<HTMLAnchorElement | HTMLButtonElement>, "style" | "className" | "tabIndex" | "onClick" | "onMouseDown"> & {
176
185
  component?: "button" | undefined;
177
186
  href?: undefined;
@@ -185,10 +194,11 @@ export declare const IconButton: React.ForwardRefExoticComponent<({
185
194
  kind?: "transparent" | "primary" | undefined;
186
195
  size?: IconProps['size'];
187
196
  padding?: "normal" | undefined;
197
+ tooltip?: string | undefined;
188
198
  } & {
189
199
  ariaLabel?: undefined;
190
200
  ariaLabelledBy?: undefined;
191
- ariaHidden: boolean;
201
+ ariaHidden?: boolean | undefined;
192
202
  } & Pick<React.ButtonHTMLAttributes<HTMLAnchorElement | HTMLButtonElement>, "style" | "className" | "tabIndex" | "onClick" | "onMouseDown"> & {
193
203
  component?: "button" | undefined;
194
204
  href?: undefined;
package/lib/IconButton.js CHANGED
@@ -8,11 +8,11 @@ import { Loader } from './Loader';
8
8
  import styles from './IconButton.module.scss';
9
9
  export const IconButton = forwardRef(({ component: Component = 'button', icon, iconClassName, iconColor, className, size, kind = 'transparent', ariaHidden, ariaLabelledBy, ariaLabel,
10
10
  // Disabled tooltip
11
- disabled, disabledTooltip, disabledTooltipVisible, disabledTooltipPlacement, rel = 'noopener', target, type = 'button', loading, padding, ...rest }, ref) => {
11
+ disabled, disabledTooltip, disabledTooltipVisible, disabledTooltipPlacement, rel = 'noopener', target, type = 'button', loading, padding, tooltip, ...rest }, ref) => {
12
12
  const tooltipId = useUID();
13
13
  const relFinal = Array.isArray(rel) ? rel.join(' ') : rel;
14
14
  const labelledByFinal = [ariaLabelledBy, disabled ? tooltipId : undefined].filter(Boolean).join(' ');
15
- return (React.createElement(Tooltip, { id: tooltipId, content: disabled ? disabledTooltip : undefined, placement: disabledTooltipPlacement, visible: disabledTooltipVisible }, (tooltipRef) => (React.createElement(Component, Object.assign({ className: cn(styles.iconButton, {
15
+ return (React.createElement(Tooltip, { id: tooltipId, content: disabled ? disabledTooltip : tooltip, placement: disabledTooltipPlacement, visible: disabled && disabledTooltipVisible }, (tooltipRef) => (React.createElement(Component, Object.assign({ className: cn(styles.iconButton, {
16
16
  [styles.primary]: kind === 'primary',
17
17
  [styles.transparent]: kind === 'transparent',
18
18
  [styles.paddingNormal]: padding === 'normal',
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../src/IconButton.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../src/IconButton.tsx"],"names":[],"mappings":"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"}
@@ -1,9 +1,10 @@
1
1
  import React, { FocusEvent } from 'react';
2
2
  import { TextFieldExtraProps } from './TextField';
3
3
  import { ExtractKeysOfValueType } from './utils/types';
4
+ import { FieldHeaderProps } from './FieldHeader';
4
5
  export declare type InteractiveListExtraProps = {
5
6
  children?: React.ReactNode | React.ReactNode[];
6
- } & Pick<TextFieldExtraProps<'text'>, 'label' | 'helperText' | 'inputIcon' | 'type' | 'placeholder'>;
7
+ } & Pick<TextFieldExtraProps<'text'>, 'inputIcon' | 'type' | 'placeholder'> & Omit<FieldHeaderProps, 'id'>;
7
8
  export declare type InteractiveListCoreProps<V> = {
8
9
  name: ExtractKeysOfValueType<V, string[]>;
9
10
  value: string[];
@@ -1 +1 @@
1
- {"version":3,"file":"InteractiveList.js","sourceRoot":"","sources":["../src/InteractiveList.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"InteractiveList.js","sourceRoot":"","sources":["../src/InteractiveList.tsx"],"names":[],"mappings":"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"}
package/lib/Link.js CHANGED
@@ -18,7 +18,7 @@ const sizes = {
18
18
  * - Link can be used as a stand-alone component with right chevron icon.
19
19
  * - You can change underlying semantics with a component property. Typescript will guard you on providing other properties related to the component type.
20
20
  */
21
- export const Link = forwardRef(({ component = 'a', kind = 'primary', size = 'normal', bold = false, icon, ariaLabel, iconClassName, href, rel = 'noopener', target = '_self', type, onClick, className, children, }, ref) => {
21
+ export const Link = forwardRef(({ component = 'a', kind = 'primary', size = 'normal', bold = false, icon, ariaLabel, iconClassName, href, rel = 'noopener', target = '_self', type = 'button', onClick, className, children, }, ref) => {
22
22
  const relFinal = Array.isArray(rel) ? rel.join(' ') : rel;
23
23
  const commonProps = {
24
24
  className: cn(styles[size], {
@@ -30,12 +30,11 @@ export const Link = forwardRef(({ component = 'a', kind = 'primary', size = 'nor
30
30
  }, className),
31
31
  href: href,
32
32
  onClick: onClick,
33
- type: type,
34
33
  };
35
34
  const iconComponent = icon && ariaLabel ? (React.createElement(Icon, { bold: bold, icon: icon, ariaLabel: ariaLabel, size: size === 'normal' ? 'medium' : 'small', className: iconClassName })) : undefined;
36
35
  return component === 'a' ? (React.createElement("a", Object.assign({}, commonProps, { rel: relFinal, target: target, ref: ref }),
37
36
  children,
38
- iconComponent)) : (React.createElement("button", Object.assign({}, commonProps, { ref: ref }),
37
+ iconComponent)) : (React.createElement("button", Object.assign({}, commonProps, { type: type, ref: ref }),
39
38
  children,
40
39
  iconComponent));
41
40
  });
package/lib/Link.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Link.js","sourceRoot":"","sources":["../src/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA8C,UAAU,EAAkD,MAAM,OAAO,CAAA;AAErI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAIvC,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,MAAM,CAAC,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC,KAAK;CACpB,CAAA;AA6DD;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EACE,SAAS,GAAG,GAAG,EACf,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,KAAK,EACZ,IAAI,EACJ,SAAS,EACT,aAAa,EACb,IAAI,EACJ,GAAG,GAAG,UAAU,EAChB,MAAM,GAAG,OAAO,EAChB,IAAI,EACJ,OAAO,EACP,SAAS,EACT,QAAQ,GACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAA;IAEzD,MAAM,WAAW,GAAG;QAClB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,IAAI,CAAC,EACZ;YACE,OAAO;YACP,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,KAAK,WAAW;YACxC,OAAO;YACP,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI;SACpB,EACD,SAAS,CACV;QACD,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,OAAO;QAChB,IAAI,EAAE,IAAI;KACX,CAAA;IAED,MAAM,aAAa,GACjB,IAAI,IAAI,SAAS,CAAC,CAAC,CAAC,CAClB,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAAE,SAAS,EAAE,aAAa,GAAI,CAC/H,CAAC,CAAC,CAAC,SAAS,CAAA;IAEf,OAAO,SAAS,KAAK,GAAG,CAAC,CAAC,CAAC,CACzB,2CAAO,WAAW,IAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAA0C;QAC/F,QAAQ;QACR,aAAa,CACZ,CACL,CAAC,CAAC,CAAC,CACF,gDAAY,WAAW,IAAE,GAAG,EAAE,GAA0C;QACrE,QAAQ;QACR,aAAa,CACP,CACV,CAAA;AACH,CAAC,CACF,CAAA;AACD,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}
1
+ {"version":3,"file":"Link.js","sourceRoot":"","sources":["../src/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA8C,UAAU,EAAkD,MAAM,OAAO,CAAA;AAErI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAIvC,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,MAAM,CAAC,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC,KAAK;CACpB,CAAA;AA6DD;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EACE,SAAS,GAAG,GAAG,EACf,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,KAAK,EACZ,IAAI,EACJ,SAAS,EACT,aAAa,EACb,IAAI,EACJ,GAAG,GAAG,UAAU,EAChB,MAAM,GAAG,OAAO,EAChB,IAAI,GAAG,QAAQ,EACf,OAAO,EACP,SAAS,EACT,QAAQ,GACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAA;IAEzD,MAAM,WAAW,GAAG;QAClB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,IAAI,CAAC,EACZ;YACE,OAAO;YACP,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,KAAK,WAAW;YACxC,OAAO;YACP,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI;SACpB,EACD,SAAS,CACV;QACD,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,OAAO;KACjB,CAAA;IAED,MAAM,aAAa,GACjB,IAAI,IAAI,SAAS,CAAC,CAAC,CAAC,CAClB,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAAE,SAAS,EAAE,aAAa,GAAI,CAC/H,CAAC,CAAC,CAAC,SAAS,CAAA;IAEf,OAAO,SAAS,KAAK,GAAG,CAAC,CAAC,CAAC,CACzB,2CAAO,WAAW,IAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAA0C;QAC/F,QAAQ;QACR,aAAa,CACZ,CACL,CAAC,CAAC,CAAC,CACF,gDAAY,WAAW,IAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAA0C;QACjF,QAAQ;QACR,aAAa,CACP,CACV,CAAA;AACH,CAAC,CACF,CAAA;AACD,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}