@x15ventures/x15-ui-library 3.15.0 → 3.16.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 (145) hide show
  1. package/dist/cjs/autoGenerated/libraryThemes.js +12 -12
  2. package/dist/cjs/autoGenerated/libraryThemes.js.map +1 -1
  3. package/dist/cjs/autoGenerated/libraryThemes.json +12 -12
  4. package/dist/cjs/components/design/dialog/Dialog.js +1 -1
  5. package/dist/cjs/components/design/dialog/Dialog.js.map +1 -1
  6. package/dist/cjs/components/design/headerBar/HeaderBar.js +3 -1
  7. package/dist/cjs/components/design/headerBar/HeaderBar.js.map +1 -1
  8. package/dist/cjs/components/design/headerBar/headerBar.css +6 -1
  9. package/dist/cjs/components/design/tooltip/Tooltip.js +67 -15
  10. package/dist/cjs/components/design/tooltip/Tooltip.js.map +1 -1
  11. package/dist/cjs/components/design/tooltip/tooltip.css +1 -1
  12. package/dist/cjs/components/form/formFields/formFieldWrapper/FormField.js +8 -5
  13. package/dist/cjs/components/form/formFields/formFieldWrapper/FormField.js.map +1 -1
  14. package/dist/cjs/components/form/formFields/formFieldWrapper/formFieldProps.js.map +1 -1
  15. package/dist/cjs/components/form/formFields/subComponents/inputs/autocomplete/Autocomplete.js +15 -11
  16. package/dist/cjs/components/form/formFields/subComponents/inputs/autocomplete/Autocomplete.js.map +1 -1
  17. package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.js +37 -15
  18. package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.js.map +1 -1
  19. package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/inputCheckbox.css +4 -4
  20. package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.js.map +1 -1
  21. package/dist/cjs/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js +9 -9
  22. package/dist/cjs/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js.map +1 -1
  23. package/dist/cjs/components/form/formFields/subComponents/inputs/radio/styled/StyledRadioGroup.js +14 -4
  24. package/dist/cjs/components/form/formFields/subComponents/inputs/radio/styled/StyledRadioGroup.js.map +1 -1
  25. package/dist/cjs/components/form/formFields/subComponents/inputs/text/InputText.js +23 -17
  26. package/dist/cjs/components/form/formFields/subComponents/inputs/text/InputText.js.map +1 -1
  27. package/dist/cjs/components/form/formFields/subComponents/select/Select.js +6 -5
  28. package/dist/cjs/components/form/formFields/subComponents/select/Select.js.map +1 -1
  29. package/dist/cjs/components/form/formFields/subComponents/textarea/Textarea.js +55 -83
  30. package/dist/cjs/components/form/formFields/subComponents/textarea/Textarea.js.map +1 -1
  31. package/dist/cjs/components/form/formFields/subComponents/textarea/textarea.css +20 -0
  32. package/dist/cjs/components/form/hookFormWrapper/HookFormWrapper.js +22 -5
  33. package/dist/cjs/components/form/hookFormWrapper/HookFormWrapper.js.map +1 -1
  34. package/dist/cjs/components/form/validation/ValidationMessages.js +36 -38
  35. package/dist/cjs/components/form/validation/ValidationMessages.js.map +1 -1
  36. package/dist/cjs/exampleUIs/exampleComponents/DemoContactForm.js +1 -2
  37. package/dist/cjs/exampleUIs/exampleComponents/DemoContactForm.js.map +1 -1
  38. package/dist/cjs/helpers/index.js +12 -0
  39. package/dist/cjs/helpers/index.js.map +1 -1
  40. package/dist/cjs/helpers/stringHelpers.js +48 -2
  41. package/dist/cjs/helpers/stringHelpers.js.map +1 -1
  42. package/dist/cjs/hooks/EdgeProximityDetect.js +18 -10
  43. package/dist/cjs/hooks/EdgeProximityDetect.js.map +1 -1
  44. package/dist/cjs/interfaces/headerText.interface.js.map +1 -1
  45. package/dist/cjs/package.json +137 -151
  46. package/dist/cjs/styles/index.css +22 -25
  47. package/dist/cjs/styles/shared/_allPartials.css +22 -25
  48. package/dist/cjs/styles/shared/forms/_forms.css +22 -25
  49. package/dist/components/design/dialog/Dialog.d.ts.map +1 -1
  50. package/dist/components/design/dialog/Dialog.test.d.ts +5 -0
  51. package/dist/components/design/dialog/Dialog.test.d.ts.map +1 -0
  52. package/dist/components/design/headerBar/HeaderBar.d.ts.map +1 -1
  53. package/dist/components/design/tooltip/Tooltip.d.ts +2 -0
  54. package/dist/components/design/tooltip/Tooltip.d.ts.map +1 -1
  55. package/dist/components/design/tooltip/Tooltip.test.d.ts +2 -0
  56. package/dist/components/design/tooltip/Tooltip.test.d.ts.map +1 -0
  57. package/dist/components/form/formFields/formFieldWrapper/FormField.d.ts.map +1 -1
  58. package/dist/components/form/formFields/formFieldWrapper/formFieldProps.d.ts +7 -2
  59. package/dist/components/form/formFields/formFieldWrapper/formFieldProps.d.ts.map +1 -1
  60. package/dist/components/form/formFields/subComponents/inputs/autocomplete/Autocomplete.d.ts.map +1 -1
  61. package/dist/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.d.ts.map +1 -1
  62. package/dist/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.test.d.ts +5 -0
  63. package/dist/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.test.d.ts.map +1 -0
  64. package/dist/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.d.ts +8 -6
  65. package/dist/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.d.ts.map +1 -1
  66. package/dist/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.d.ts.map +1 -1
  67. package/dist/components/form/formFields/subComponents/inputs/radio/styled/StyledRadioGroup.d.ts.map +1 -1
  68. package/dist/components/form/formFields/subComponents/inputs/text/InputText.d.ts.map +1 -1
  69. package/dist/components/form/formFields/subComponents/nestedFormContext.test.d.ts +5 -0
  70. package/dist/components/form/formFields/subComponents/nestedFormContext.test.d.ts.map +1 -0
  71. package/dist/components/form/formFields/subComponents/select/Select.d.ts.map +1 -1
  72. package/dist/components/form/formFields/subComponents/textarea/Textarea.d.ts +4 -3
  73. package/dist/components/form/formFields/subComponents/textarea/Textarea.d.ts.map +1 -1
  74. package/dist/components/form/hookFormWrapper/HookFormWrapper.d.ts +3 -0
  75. package/dist/components/form/hookFormWrapper/HookFormWrapper.d.ts.map +1 -1
  76. package/dist/components/form/hookFormWrapper/HookFormWrapper.test.d.ts +5 -0
  77. package/dist/components/form/hookFormWrapper/HookFormWrapper.test.d.ts.map +1 -0
  78. package/dist/components/form/validation/ValidationMessages.d.ts +8 -1
  79. package/dist/components/form/validation/ValidationMessages.d.ts.map +1 -1
  80. package/dist/components/form/validation/ValidationMessages.test.d.ts +5 -0
  81. package/dist/components/form/validation/ValidationMessages.test.d.ts.map +1 -0
  82. package/dist/esm/autoGenerated/libraryThemes.js +12 -12
  83. package/dist/esm/autoGenerated/libraryThemes.js.map +1 -1
  84. package/dist/esm/autoGenerated/libraryThemes.json +12 -12
  85. package/dist/esm/components/design/dialog/Dialog.js +1 -1
  86. package/dist/esm/components/design/dialog/Dialog.js.map +1 -1
  87. package/dist/esm/components/design/headerBar/HeaderBar.js +3 -1
  88. package/dist/esm/components/design/headerBar/HeaderBar.js.map +1 -1
  89. package/dist/esm/components/design/headerBar/headerBar.css +6 -1
  90. package/dist/esm/components/design/tooltip/Tooltip.js +67 -15
  91. package/dist/esm/components/design/tooltip/Tooltip.js.map +1 -1
  92. package/dist/esm/components/design/tooltip/tooltip.css +1 -1
  93. package/dist/esm/components/form/formFields/formFieldWrapper/FormField.js +8 -5
  94. package/dist/esm/components/form/formFields/formFieldWrapper/FormField.js.map +1 -1
  95. package/dist/esm/components/form/formFields/formFieldWrapper/formFieldProps.js.map +1 -1
  96. package/dist/esm/components/form/formFields/subComponents/inputs/autocomplete/Autocomplete.js +16 -12
  97. package/dist/esm/components/form/formFields/subComponents/inputs/autocomplete/Autocomplete.js.map +1 -1
  98. package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.js +37 -15
  99. package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.js.map +1 -1
  100. package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/inputCheckbox.css +4 -4
  101. package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.js.map +1 -1
  102. package/dist/esm/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js +8 -8
  103. package/dist/esm/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js.map +1 -1
  104. package/dist/esm/components/form/formFields/subComponents/inputs/radio/styled/StyledRadioGroup.js +16 -6
  105. package/dist/esm/components/form/formFields/subComponents/inputs/radio/styled/StyledRadioGroup.js.map +1 -1
  106. package/dist/esm/components/form/formFields/subComponents/inputs/text/InputText.js +23 -17
  107. package/dist/esm/components/form/formFields/subComponents/inputs/text/InputText.js.map +1 -1
  108. package/dist/esm/components/form/formFields/subComponents/select/Select.js +6 -5
  109. package/dist/esm/components/form/formFields/subComponents/select/Select.js.map +1 -1
  110. package/dist/esm/components/form/formFields/subComponents/textarea/Textarea.js +50 -78
  111. package/dist/esm/components/form/formFields/subComponents/textarea/Textarea.js.map +1 -1
  112. package/dist/esm/components/form/formFields/subComponents/textarea/textarea.css +20 -0
  113. package/dist/esm/components/form/hookFormWrapper/HookFormWrapper.js +22 -5
  114. package/dist/esm/components/form/hookFormWrapper/HookFormWrapper.js.map +1 -1
  115. package/dist/esm/components/form/validation/ValidationMessages.js +36 -38
  116. package/dist/esm/components/form/validation/ValidationMessages.js.map +1 -1
  117. package/dist/esm/exampleUIs/exampleComponents/DemoContactForm.js +1 -2
  118. package/dist/esm/exampleUIs/exampleComponents/DemoContactForm.js.map +1 -1
  119. package/dist/esm/helpers/index.js +1 -1
  120. package/dist/esm/helpers/index.js.map +1 -1
  121. package/dist/esm/helpers/stringHelpers.js +44 -0
  122. package/dist/esm/helpers/stringHelpers.js.map +1 -1
  123. package/dist/esm/hooks/EdgeProximityDetect.js +19 -11
  124. package/dist/esm/hooks/EdgeProximityDetect.js.map +1 -1
  125. package/dist/esm/interfaces/headerText.interface.js.map +1 -1
  126. package/dist/esm/package.json +137 -151
  127. package/dist/esm/styles/index.css +22 -25
  128. package/dist/esm/styles/shared/_allPartials.css +22 -25
  129. package/dist/esm/styles/shared/forms/_forms.css +22 -25
  130. package/dist/exampleUIs/exampleComponents/DemoContactForm.d.ts.map +1 -1
  131. package/dist/helpers/index.d.ts +1 -1
  132. package/dist/helpers/index.d.ts.map +1 -1
  133. package/dist/helpers/stringHelpers.d.ts +17 -0
  134. package/dist/helpers/stringHelpers.d.ts.map +1 -1
  135. package/dist/hooks/EdgeProximityDetect.d.ts.map +1 -1
  136. package/dist/interfaces/headerText.interface.d.ts +1 -0
  137. package/dist/interfaces/headerText.interface.d.ts.map +1 -1
  138. package/dist/package.json +137 -151
  139. package/package.json +137 -151
  140. package/dist/cjs/components/form/formFields/utilities/formUtilities.js +0 -22
  141. package/dist/cjs/components/form/formFields/utilities/formUtilities.js.map +0 -1
  142. package/dist/components/form/formFields/utilities/formUtilities.d.ts +0 -18
  143. package/dist/components/form/formFields/utilities/formUtilities.d.ts.map +0 -1
  144. package/dist/esm/components/form/formFields/utilities/formUtilities.js +0 -16
  145. package/dist/esm/components/form/formFields/utilities/formUtilities.js.map +0 -1
@@ -17,8 +17,8 @@ const libraryThemes = exports.libraryThemes = {
17
17
  "map": "index.min.css.map"
18
18
  },
19
19
  "versioned": {
20
- "css": "index.min.3.15.0.css",
21
- "map": "index.min.3.15.0.css.map"
20
+ "css": "index.min.3.16.0.css",
21
+ "map": "index.min.3.16.0.css.map"
22
22
  }
23
23
  },
24
24
  "cba": {
@@ -32,8 +32,8 @@ const libraryThemes = exports.libraryThemes = {
32
32
  "map": "cba.min.css.map"
33
33
  },
34
34
  "versioned": {
35
- "css": "cba.min.3.15.0.css",
36
- "map": "cba.min.3.15.0.css.map"
35
+ "css": "cba.min.3.16.0.css",
36
+ "map": "cba.min.3.16.0.css.map"
37
37
  }
38
38
  },
39
39
  "creditSavvy": {
@@ -47,8 +47,8 @@ const libraryThemes = exports.libraryThemes = {
47
47
  "map": "creditSavvy.min.css.map"
48
48
  },
49
49
  "versioned": {
50
- "css": "creditSavvy.min.3.15.0.css",
51
- "map": "creditSavvy.min.3.15.0.css.map"
50
+ "css": "creditSavvy.min.3.16.0.css",
51
+ "map": "creditSavvy.min.3.16.0.css.map"
52
52
  }
53
53
  },
54
54
  "doshii": {
@@ -62,8 +62,8 @@ const libraryThemes = exports.libraryThemes = {
62
62
  "map": "doshii.min.css.map"
63
63
  },
64
64
  "versioned": {
65
- "css": "doshii.min.3.15.0.css",
66
- "map": "doshii.min.3.15.0.css.map"
65
+ "css": "doshii.min.3.16.0.css",
66
+ "map": "doshii.min.3.16.0.css.map"
67
67
  }
68
68
  },
69
69
  "homeIn": {
@@ -77,8 +77,8 @@ const libraryThemes = exports.libraryThemes = {
77
77
  "map": "homeIn.min.css.map"
78
78
  },
79
79
  "versioned": {
80
- "css": "homeIn.min.3.15.0.css",
81
- "map": "homeIn.min.3.15.0.css.map"
80
+ "css": "homeIn.min.3.16.0.css",
81
+ "map": "homeIn.min.3.16.0.css.map"
82
82
  }
83
83
  },
84
84
  "x15Core": {
@@ -92,8 +92,8 @@ const libraryThemes = exports.libraryThemes = {
92
92
  "map": "x15Core.min.css.map"
93
93
  },
94
94
  "versioned": {
95
- "css": "x15Core.min.3.15.0.css",
96
- "map": "x15Core.min.3.15.0.css.map"
95
+ "css": "x15Core.min.3.16.0.css",
96
+ "map": "x15Core.min.3.16.0.css.map"
97
97
  }
98
98
  }
99
99
  };
@@ -1 +1 @@
1
- {"version":3,"file":"libraryThemes.js","names":["libraryThemes","exports","_default","default"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n \"base\": {\n \"buildPath\": \"styles\",\n \"dev\": {\n \"css\": \"index.css\",\n \"map\": \"index.css.map\"\n },\n \"min\": {\n \"css\": \"index.min.css\",\n \"map\": \"index.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"index.min.3.15.0.css\",\n \"map\": \"index.min.3.15.0.css.map\"\n }\n },\n \"cba\": {\n \"buildPath\": \"styles/themes/cba\",\n \"dev\": {\n \"css\": \"cba.css\",\n \"map\": \"cba.css.map\"\n },\n \"min\": {\n \"css\": \"cba.min.css\",\n \"map\": \"cba.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"cba.min.3.15.0.css\",\n \"map\": \"cba.min.3.15.0.css.map\"\n }\n },\n \"creditSavvy\": {\n \"buildPath\": \"styles/themes/creditSavvy\",\n \"dev\": {\n \"css\": \"creditSavvy.css\",\n \"map\": \"creditSavvy.css.map\"\n },\n \"min\": {\n \"css\": \"creditSavvy.min.css\",\n \"map\": \"creditSavvy.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"creditSavvy.min.3.15.0.css\",\n \"map\": \"creditSavvy.min.3.15.0.css.map\"\n }\n },\n \"doshii\": {\n \"buildPath\": \"styles/themes/doshii\",\n \"dev\": {\n \"css\": \"doshii.css\",\n \"map\": \"doshii.css.map\"\n },\n \"min\": {\n \"css\": \"doshii.min.css\",\n \"map\": \"doshii.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"doshii.min.3.15.0.css\",\n \"map\": \"doshii.min.3.15.0.css.map\"\n }\n },\n \"homeIn\": {\n \"buildPath\": \"styles/themes/homeIn\",\n \"dev\": {\n \"css\": \"homeIn.css\",\n \"map\": \"homeIn.css.map\"\n },\n \"min\": {\n \"css\": \"homeIn.min.css\",\n \"map\": \"homeIn.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"homeIn.min.3.15.0.css\",\n \"map\": \"homeIn.min.3.15.0.css.map\"\n }\n },\n \"x15Core\": {\n \"buildPath\": \"styles/themes/x15Core\",\n \"dev\": {\n \"css\": \"x15Core.css\",\n \"map\": \"x15Core.css.map\"\n },\n \"min\": {\n \"css\": \"x15Core.min.css\",\n \"map\": \"x15Core.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"x15Core.min.3.15.0.css\",\n \"map\": \"x15Core.min.3.15.0.css.map\"\n }\n }\n}; export default libraryThemes;"],"mappings":";;;;;;AAAA;AACO,MAAMA,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAC,IAAAE,QAAA,GAAAD,OAAA,CAAAE,OAAA,GAAgBH,aAAa","ignoreList":[]}
1
+ {"version":3,"file":"libraryThemes.js","names":["libraryThemes","exports","_default","default"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n \"base\": {\n \"buildPath\": \"styles\",\n \"dev\": {\n \"css\": \"index.css\",\n \"map\": \"index.css.map\"\n },\n \"min\": {\n \"css\": \"index.min.css\",\n \"map\": \"index.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"index.min.3.16.0.css\",\n \"map\": \"index.min.3.16.0.css.map\"\n }\n },\n \"cba\": {\n \"buildPath\": \"styles/themes/cba\",\n \"dev\": {\n \"css\": \"cba.css\",\n \"map\": \"cba.css.map\"\n },\n \"min\": {\n \"css\": \"cba.min.css\",\n \"map\": \"cba.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"cba.min.3.16.0.css\",\n \"map\": \"cba.min.3.16.0.css.map\"\n }\n },\n \"creditSavvy\": {\n \"buildPath\": \"styles/themes/creditSavvy\",\n \"dev\": {\n \"css\": \"creditSavvy.css\",\n \"map\": \"creditSavvy.css.map\"\n },\n \"min\": {\n \"css\": \"creditSavvy.min.css\",\n \"map\": \"creditSavvy.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"creditSavvy.min.3.16.0.css\",\n \"map\": \"creditSavvy.min.3.16.0.css.map\"\n }\n },\n \"doshii\": {\n \"buildPath\": \"styles/themes/doshii\",\n \"dev\": {\n \"css\": \"doshii.css\",\n \"map\": \"doshii.css.map\"\n },\n \"min\": {\n \"css\": \"doshii.min.css\",\n \"map\": \"doshii.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"doshii.min.3.16.0.css\",\n \"map\": \"doshii.min.3.16.0.css.map\"\n }\n },\n \"homeIn\": {\n \"buildPath\": \"styles/themes/homeIn\",\n \"dev\": {\n \"css\": \"homeIn.css\",\n \"map\": \"homeIn.css.map\"\n },\n \"min\": {\n \"css\": \"homeIn.min.css\",\n \"map\": \"homeIn.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"homeIn.min.3.16.0.css\",\n \"map\": \"homeIn.min.3.16.0.css.map\"\n }\n },\n \"x15Core\": {\n \"buildPath\": \"styles/themes/x15Core\",\n \"dev\": {\n \"css\": \"x15Core.css\",\n \"map\": \"x15Core.css.map\"\n },\n \"min\": {\n \"css\": \"x15Core.min.css\",\n \"map\": \"x15Core.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"x15Core.min.3.16.0.css\",\n \"map\": \"x15Core.min.3.16.0.css.map\"\n }\n }\n}; export default libraryThemes;"],"mappings":";;;;;;AAAA;AACO,MAAMA,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAC,IAAAE,QAAA,GAAAD,OAAA,CAAAE,OAAA,GAAgBH,aAAa","ignoreList":[]}
@@ -10,8 +10,8 @@
10
10
  "map": "index.min.css.map"
11
11
  },
12
12
  "versioned": {
13
- "css": "base.min.3.15.0.css",
14
- "map": "base.min.3.15.0.css.map"
13
+ "css": "base.min.3.16.0.css",
14
+ "map": "base.min.3.16.0.css.map"
15
15
  }
16
16
  },
17
17
  "cba": {
@@ -25,8 +25,8 @@
25
25
  "map": "cba.min.css.map"
26
26
  },
27
27
  "versioned": {
28
- "css": "cba.min.3.15.0.css",
29
- "map": "cba.min.3.15.0.css.map"
28
+ "css": "cba.min.3.16.0.css",
29
+ "map": "cba.min.3.16.0.css.map"
30
30
  }
31
31
  },
32
32
  "creditSavvy": {
@@ -40,8 +40,8 @@
40
40
  "map": "creditSavvy.min.css.map"
41
41
  },
42
42
  "versioned": {
43
- "css": "creditSavvy.min.3.15.0.css",
44
- "map": "creditSavvy.min.3.15.0.css.map"
43
+ "css": "creditSavvy.min.3.16.0.css",
44
+ "map": "creditSavvy.min.3.16.0.css.map"
45
45
  }
46
46
  },
47
47
  "doshii": {
@@ -55,8 +55,8 @@
55
55
  "map": "doshii.min.css.map"
56
56
  },
57
57
  "versioned": {
58
- "css": "doshii.min.3.15.0.css",
59
- "map": "doshii.min.3.15.0.css.map"
58
+ "css": "doshii.min.3.16.0.css",
59
+ "map": "doshii.min.3.16.0.css.map"
60
60
  }
61
61
  },
62
62
  "homeIn": {
@@ -70,8 +70,8 @@
70
70
  "map": "homeIn.min.css.map"
71
71
  },
72
72
  "versioned": {
73
- "css": "homeIn.min.3.15.0.css",
74
- "map": "homeIn.min.3.15.0.css.map"
73
+ "css": "homeIn.min.3.16.0.css",
74
+ "map": "homeIn.min.3.16.0.css.map"
75
75
  }
76
76
  },
77
77
  "x15Core": {
@@ -85,8 +85,8 @@
85
85
  "map": "x15Core.min.css.map"
86
86
  },
87
87
  "versioned": {
88
- "css": "x15Core.min.3.15.0.css",
89
- "map": "x15Core.min.3.15.0.css.map"
88
+ "css": "x15Core.min.3.16.0.css",
89
+ "map": "x15Core.min.3.16.0.css.map"
90
90
  }
91
91
  }
92
92
  }
@@ -114,7 +114,7 @@ const Dialog = ({
114
114
  }, /*#__PURE__*/_react.default.createElement("section", {
115
115
  className: `dialogContent ${customCssClasses?.content || ''}`,
116
116
  tabIndex: 0
117
- }, children), /*#__PURE__*/_react.default.createElement("div", {
117
+ }, children), footer && /*#__PURE__*/_react.default.createElement("div", {
118
118
  className: `dialogFooter ${customCssClasses?.footer || ''}`,
119
119
  tabIndex: 0
120
120
  }, typeof footer === 'string' ? /*#__PURE__*/_react.default.createElement("span", {
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","names":["Object","defineProperty","exports","value","Dialog","_react","_interopRequireWildcard","require","_index","_SvgIcon","_tooltip","_DialogOverlay","_FocusTrap","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","id","size","position","animation","scrollBehaviour","onClose","open","overlay","header","footer","children","screenReaderInstruction","customCssClasses","showFocusOutline","isOpen","setIsOpen","useState","dialogElement","useRef","dialogHeaderElement","TOGGLE_TEXT","dialogCloseButton","createOverlay","removeOverlay","useDialogOverlay","useFocusTrap","HandleClose","dialogCssClass","useMemo","dialog","useCallback","HandleOpen","dialogOverlay","showOverlay","useEffect","current","focus","DialogCloseButton","createElement","ref","className","title","type","onClick","SvgIcon","svgDefinition","xmarkLarge","role","tabIndex","EllipsisTooltip","lineClamp","tooltipProps","customCssClass","content"],"sources":["../../../../../src/components/design/dialog/Dialog.tsx"],"sourcesContent":["/* eslint-disable jsxA11y/no-noninteractive-tabindex */\n'use client';\n\nimport React, { ReactNode, useCallback, useEffect, useRef, useState, useMemo } from 'react';\nimport { xmarkLarge } from '@x15ventures/x15-ui-library-icons/iconDefinitions/index';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { EllipsisTooltip } from '../tooltip';\nimport { GenericFunction } from '../../../interfaces';\nimport { useDialogOverlay } from '../../../hooks/DialogOverlay';\nimport { useFocusTrap } from '../../../hooks/FocusTrap';\n\nimport './dialog.scss';\n\nexport interface DialogInterface {\n id: string;\n size?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'dynamic';\n position?: 'left' | 'right' | 'top' | 'bottom' | 'center' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';\n animation?: 'none' | 'grow' | 'reveal';\n scrollBehaviour?: 'contentOnly' | 'contentAndFooter' | 'all';\n onClose: GenericFunction;\n open?: boolean;\n overlay?: {\n parentNode?: HTMLElement;\n customCssClass?: string;\n };\n header: string | ReactNode;\n footer?: string | ReactNode;\n children: ReactNode;\n screenReaderInstruction?: string;\n showFocusOutline?: boolean;\n customCssClasses?: {\n dialog?: string;\n content?: string;\n header?: string;\n footer?: string;\n };\n}\n\nexport const Dialog: React.FC<DialogInterface> = ({\n id,\n size = 'm',\n position = 'center',\n animation = 'none',\n scrollBehaviour = 'contentOnly',\n onClose = () => {},\n open = false,\n overlay,\n header,\n footer,\n children,\n screenReaderInstruction = `The following content is in a dialog. \n You can press the Tab key to navigate through the elements, and press Escape to close the dialog.`,\n customCssClasses,\n showFocusOutline = false,\n}) => {\n const [isOpen, setIsOpen] = useState<boolean>(open);\n const dialogElement = useRef<HTMLDivElement>(null);\n const dialogHeaderElement = useRef<HTMLDivElement>(null);\n\n const TOGGLE_TEXT = 'Open and close dialog';\n const dialogCloseButton = useRef(null);\n\n const { createOverlay, removeOverlay } = useDialogOverlay(overlay || {});\n useFocusTrap(dialogElement, () => HandleClose());\n\n const dialogCssClass = useMemo(() => {\n return `dialog \n ${ isOpen || open ? 'isOpen' : '' }\n dialogSize_${ size }\n dialogPosition_${ position }\n dialogAnimation_${ animation }\n dialogScrollBehaviour_${ scrollBehaviour }\n ${ size === 'dynamic' ? 'dialogSize_dynamic' : '' }\n ${ customCssClasses?.dialog || '' }\n ${ showFocusOutline ? 'showFocusOutline' : '' }`;\n }, [open, isOpen, size, position, animation, scrollBehaviour, customCssClasses, showFocusOutline]);\n\n const HandleClose = useCallback(() => {\n setIsOpen(false);\n removeOverlay();\n onClose();\n }, [onClose, removeOverlay]);\n\n const HandleOpen = useCallback(() => {\n const dialogOverlay = createOverlay();\n dialogOverlay.showOverlay();\n }, [createOverlay]);\n\n useEffect(() => {\n if (open || isOpen) {\n if (dialogHeaderElement.current) {\n dialogHeaderElement.current.focus();\n }\n HandleOpen();\n } else {\n HandleClose();\n }\n }, [customCssClasses, createOverlay, open, isOpen, HandleOpen, HandleClose, dialogHeaderElement]);\n\n const DialogCloseButton: React.FC = () => (\n <button\n ref={ dialogCloseButton }\n className=\"dialogClose\"\n title={ TOGGLE_TEXT }\n type=\"button\"\n onClick={ () => HandleClose() }\n >\n <SvgIcon svgDefinition={ xmarkLarge } />\n <span className=\"sr-only\">Close dialog</span>\n </button>\n );\n\n return (\n <div\n className={ dialogCssClass }\n role=\"dialog\"\n aria-labelledby={ `dialogHeader_${ id }` }\n tabIndex={ 0 }\n aria-describedby={ `dialogSRInstruction_${ id }` }\n aria-modal=\"true\"\n ref={ dialogElement }\n >\n <div className=\"dialogFullScroller\">\n <div\n ref={ dialogHeaderElement }\n id={ `dialogHeader_${ id }` }\n className={ `dialogHeader ${ customCssClasses?.header || '' }` }\n tabIndex={ 0 }\n >\n <span id={ `dialogSRInstruction_${ id }` } className=\"sr-only\">\n { screenReaderInstruction }\n </span>\n <div className=\"dialogHeaderTextWrapper\">\n <EllipsisTooltip \n lineClamp={ 2 } \n tooltipProps={ { \n customCssClass: 'shiftDown large dialogEllipsisTooltip'\n } }\n >\n { typeof header === 'string' ? <span className=\"dialogHeaderText\">{ header }</span> : header }\n </EllipsisTooltip>\n </div>\n <DialogCloseButton />\n </div>\n\n <div className=\"dialogContentAndFooterScroller\">\n <section className={ `dialogContent ${ customCssClasses?.content || '' }` } tabIndex={ 0 }>\n { children }\n </section>\n\n <div className={ `dialogFooter ${ customCssClasses?.footer || '' }` } tabIndex={ 0 }>\n { typeof footer === 'string' ? <span className=\"dialogFooterText\">{ footer }</span> : footer }\n </div>\n </div>\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Dialog.js","names":["Object","defineProperty","exports","value","Dialog","_react","_interopRequireWildcard","require","_index","_SvgIcon","_tooltip","_DialogOverlay","_FocusTrap","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","id","size","position","animation","scrollBehaviour","onClose","open","overlay","header","footer","children","screenReaderInstruction","customCssClasses","showFocusOutline","isOpen","setIsOpen","useState","dialogElement","useRef","dialogHeaderElement","TOGGLE_TEXT","dialogCloseButton","createOverlay","removeOverlay","useDialogOverlay","useFocusTrap","HandleClose","dialogCssClass","useMemo","dialog","useCallback","HandleOpen","dialogOverlay","showOverlay","useEffect","current","focus","DialogCloseButton","createElement","ref","className","title","type","onClick","SvgIcon","svgDefinition","xmarkLarge","role","tabIndex","EllipsisTooltip","lineClamp","tooltipProps","customCssClass","content"],"sources":["../../../../../src/components/design/dialog/Dialog.tsx"],"sourcesContent":["/* eslint-disable jsxA11y/no-noninteractive-tabindex */\n'use client';\n\nimport React, { ReactNode, useCallback, useEffect, useRef, useState, useMemo } from 'react';\nimport { xmarkLarge } from '@x15ventures/x15-ui-library-icons/iconDefinitions/index';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { EllipsisTooltip } from '../tooltip';\nimport { GenericFunction } from '../../../interfaces';\nimport { useDialogOverlay } from '../../../hooks/DialogOverlay';\nimport { useFocusTrap } from '../../../hooks/FocusTrap';\n\nimport './dialog.scss';\n\nexport interface DialogInterface {\n id: string;\n size?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'dynamic';\n position?: 'left' | 'right' | 'top' | 'bottom' | 'center' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';\n animation?: 'none' | 'grow' | 'reveal';\n scrollBehaviour?: 'contentOnly' | 'contentAndFooter' | 'all';\n onClose: GenericFunction;\n open?: boolean;\n overlay?: {\n parentNode?: HTMLElement;\n customCssClass?: string;\n };\n header: string | ReactNode;\n footer?: string | ReactNode;\n children: ReactNode;\n screenReaderInstruction?: string;\n showFocusOutline?: boolean;\n customCssClasses?: {\n dialog?: string;\n content?: string;\n header?: string;\n footer?: string;\n };\n}\n\nexport const Dialog: React.FC<DialogInterface> = ({\n id,\n size = 'm',\n position = 'center',\n animation = 'none',\n scrollBehaviour = 'contentOnly',\n onClose = () => {},\n open = false,\n overlay,\n header,\n footer,\n children,\n screenReaderInstruction = `The following content is in a dialog. \n You can press the Tab key to navigate through the elements, and press Escape to close the dialog.`,\n customCssClasses,\n showFocusOutline = false,\n}) => {\n const [isOpen, setIsOpen] = useState<boolean>(open);\n const dialogElement = useRef<HTMLDivElement>(null);\n const dialogHeaderElement = useRef<HTMLDivElement>(null);\n\n const TOGGLE_TEXT = 'Open and close dialog';\n const dialogCloseButton = useRef(null);\n\n const { createOverlay, removeOverlay } = useDialogOverlay(overlay || {});\n useFocusTrap(dialogElement, () => HandleClose());\n\n const dialogCssClass = useMemo(() => {\n return `dialog \n ${ isOpen || open ? 'isOpen' : '' }\n dialogSize_${ size }\n dialogPosition_${ position }\n dialogAnimation_${ animation }\n dialogScrollBehaviour_${ scrollBehaviour }\n ${ size === 'dynamic' ? 'dialogSize_dynamic' : '' }\n ${ customCssClasses?.dialog || '' }\n ${ showFocusOutline ? 'showFocusOutline' : '' }`;\n }, [open, isOpen, size, position, animation, scrollBehaviour, customCssClasses, showFocusOutline]);\n\n const HandleClose = useCallback(() => {\n setIsOpen(false);\n removeOverlay();\n onClose();\n }, [onClose, removeOverlay]);\n\n const HandleOpen = useCallback(() => {\n const dialogOverlay = createOverlay();\n dialogOverlay.showOverlay();\n }, [createOverlay]);\n\n useEffect(() => {\n if (open || isOpen) {\n if (dialogHeaderElement.current) {\n dialogHeaderElement.current.focus();\n }\n HandleOpen();\n } else {\n HandleClose();\n }\n }, [customCssClasses, createOverlay, open, isOpen, HandleOpen, HandleClose, dialogHeaderElement]);\n\n const DialogCloseButton: React.FC = () => (\n <button\n ref={ dialogCloseButton }\n className=\"dialogClose\"\n title={ TOGGLE_TEXT }\n type=\"button\"\n onClick={ () => HandleClose() }\n >\n <SvgIcon svgDefinition={ xmarkLarge } />\n <span className=\"sr-only\">Close dialog</span>\n </button>\n );\n\n return (\n <div\n className={ dialogCssClass }\n role=\"dialog\"\n aria-labelledby={ `dialogHeader_${ id }` }\n tabIndex={ 0 }\n aria-describedby={ `dialogSRInstruction_${ id }` }\n aria-modal=\"true\"\n ref={ dialogElement }\n >\n <div className=\"dialogFullScroller\">\n <div\n ref={ dialogHeaderElement }\n id={ `dialogHeader_${ id }` }\n className={ `dialogHeader ${ customCssClasses?.header || '' }` }\n tabIndex={ 0 }\n >\n <span id={ `dialogSRInstruction_${ id }` } className=\"sr-only\">\n { screenReaderInstruction }\n </span>\n <div className=\"dialogHeaderTextWrapper\">\n <EllipsisTooltip \n lineClamp={ 2 } \n tooltipProps={ { \n customCssClass: 'shiftDown large dialogEllipsisTooltip'\n } }\n >\n { typeof header === 'string' ? <span className=\"dialogHeaderText\">{ header }</span> : header }\n </EllipsisTooltip>\n </div>\n <DialogCloseButton />\n </div>\n\n <div className=\"dialogContentAndFooterScroller\">\n <section className={ `dialogContent ${ customCssClasses?.content || '' }` } tabIndex={ 0 }>\n { children }\n </section>\n\n {\n footer && (\n <div className={ `dialogFooter ${ customCssClasses?.footer || '' }` } tabIndex={ 0 }>\n { typeof footer === 'string' ? <span className=\"dialogFooterText\">{ footer }</span> : footer }\n </div>\n )\n }\n </div>\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
@@ -19,6 +19,7 @@ const HeaderBar = ({
19
19
  rightIcon,
20
20
  buttons,
21
21
  notificationIcon,
22
+ headingLevel = 2,
22
23
  children
23
24
  }) => {
24
25
  const headerCssClass = `headerBar
@@ -26,9 +27,10 @@ const HeaderBar = ({
26
27
  ${rightIcon ? 'withRightIcon' : ''}
27
28
  ${notificationIcon ? 'withNotification' : ''}
28
29
  `;
30
+ const Heading = `h${headingLevel}`;
29
31
  return /*#__PURE__*/_react.default.createElement("header", {
30
32
  className: headerCssClass
31
- }, leftIcon && /*#__PURE__*/_react.default.createElement(_Icon.Icon, leftIcon), text && /*#__PURE__*/_react.default.createElement("h2", null, text), children, buttons && /*#__PURE__*/_react.default.createElement("div", {
33
+ }, leftIcon && /*#__PURE__*/_react.default.createElement(_Icon.Icon, leftIcon), text && /*#__PURE__*/_react.default.createElement(Heading, null, text), children, buttons && /*#__PURE__*/_react.default.createElement("div", {
32
34
  className: "headerButtons"
33
35
  }, buttons.map(button => {
34
36
  if (button.kind === 'notifications') {
@@ -1 +1 @@
1
- {"version":3,"file":"HeaderBar.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","HeaderBar","_extends2","_react","_Icon","_NotificationIcon","_SimpleButton","_NotificationsButton","text","leftIcon","rightIcon","buttons","notificationIcon","children","headerCssClass","default","createElement","className","Icon","map","button","kind","NotificationsButton","key","id","SimpleButton","NotificationIcon"],"sources":["../../../../../src/components/design/headerBar/HeaderBar.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { HeaderTextInterface } from '../../../interfaces/headerText.interface';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { NotificationIcon } from '../icons/notificationIcon/NotificationIcon';\nimport { SimpleButton } from '../../form/buttons/SimpleButton';\nimport { NotificationsButton } from '../../form/buttons/notificationsButton/NotificationsButton';\nimport { ButtonProps } from '../../form/buttons/button.interface';\n\nimport './headerBar.scss';\n\nexport const HeaderBar: React.FC<HeaderTextInterface> = (\n {\n text,\n leftIcon,\n rightIcon,\n buttons,\n notificationIcon,\n children\n }\n) => {\n const headerCssClass = `headerBar \n ${ leftIcon ? 'withLeftIcon' : '' }\n ${ rightIcon ? 'withRightIcon' : '' }\n ${ notificationIcon ? 'withNotification' : '' }\n `;\n\n return (\n <header className={ headerCssClass }>\n {\n leftIcon && <Icon { ...leftIcon } />\n }\n\n {\n text && <h2>{ text }</h2>\n }\n\n { children }\n\n {\n buttons\n && (\n <div className=\"headerButtons\">\n {\n buttons.map((button) => {\n if (button.kind === 'notifications') {\n return <NotificationsButton key={ button.id } { ...button } />;\n }\n return <SimpleButton key={ button.id } { ...(button as ButtonProps) } />;\n })\n }\n </div>\n )\n }\n\n {\n rightIcon && <Icon { ...rightIcon } />\n }\n\n {\n notificationIcon && <NotificationIcon { ...notificationIcon } />\n }\n </header>\n );\n};\n"],"mappings":";AAAA,YAAY;;AAAC,IAAAA,sBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,SAAA;AAAA,IAAAC,SAAA,GAAAP,sBAAA,CAAAC,OAAA;AAEb,IAAAO,MAAA,GAAAR,sBAAA,CAAAC,OAAA;AAEA,IAAAQ,KAAA,GAAAR,OAAA;AACA,IAAAS,iBAAA,GAAAT,OAAA;AACA,IAAAU,aAAA,GAAAV,OAAA;AACA,IAAAW,oBAAA,GAAAX,OAAA;AAGAA,OAAA;AAEO,MAAMK,SAAwC,GAAGA,CACtD;EACEO,IAAI;EACJC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,gBAAgB;EAChBC;AACF,CAAC,KACE;EACH,MAAMC,cAAc,GAAG;AACzB,MAAOL,QAAQ,GAAG,cAAc,GAAG,EAAE;AACrC,MAAOC,SAAS,GAAG,eAAe,GAAG,EAAE;AACvC,MAAOE,gBAAgB,GAAG,kBAAkB,GAAG,EAAE;AACjD,KAAK;EAEH,oBACET,MAAA,CAAAY,OAAA,CAAAC,aAAA;IAAQC,SAAS,EAAGH;EAAgB,GAEhCL,QAAQ,iBAAIN,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACZ,KAAA,CAAAc,IAAI,EAAMT,QAAY,CAAC,EAIpCD,IAAI,iBAAIL,MAAA,CAAAY,OAAA,CAAAC,aAAA,aAAMR,IAAU,CAAC,EAGzBK,QAAQ,EAGRF,OAAO,iBAELR,MAAA,CAAAY,OAAA,CAAAC,aAAA;IAAKC,SAAS,EAAC;EAAe,GAE1BN,OAAO,CAACQ,GAAG,CAAEC,MAAM,IAAK;IACtB,IAAIA,MAAM,CAACC,IAAI,KAAK,eAAe,EAAE;MACnC,oBAAOlB,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACT,oBAAA,CAAAe,mBAAmB,MAAApB,SAAA,CAAAa,OAAA;QAACQ,GAAG,EAAGH,MAAM,CAACI;MAAI,GAAMJ,MAAM,CAAI,CAAC;IAChE;IACA,oBAAOjB,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACV,aAAA,CAAAmB,YAAY,MAAAvB,SAAA,CAAAa,OAAA;MAACQ,GAAG,EAAGH,MAAM,CAACI;IAAI,GAAOJ,MAAM,CAAoB,CAAC;EAC1E,CAAC,CAEA,CACN,EAIDV,SAAS,iBAAIP,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACZ,KAAA,CAAAc,IAAI,EAAMR,SAAa,CAAC,EAItCE,gBAAgB,iBAAIT,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACX,iBAAA,CAAAqB,gBAAgB,EAAMd,gBAAoB,CAE3D,CAAC;AAEb,CAAC;AAACb,OAAA,CAAAE,SAAA,GAAAA,SAAA","ignoreList":[]}
1
+ {"version":3,"file":"HeaderBar.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","HeaderBar","_extends2","_react","_Icon","_NotificationIcon","_SimpleButton","_NotificationsButton","text","leftIcon","rightIcon","buttons","notificationIcon","headingLevel","children","headerCssClass","Heading","default","createElement","className","Icon","map","button","kind","NotificationsButton","key","id","SimpleButton","NotificationIcon"],"sources":["../../../../../src/components/design/headerBar/HeaderBar.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { HeaderTextInterface } from '../../../interfaces/headerText.interface';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { NotificationIcon } from '../icons/notificationIcon/NotificationIcon';\nimport { SimpleButton } from '../../form/buttons/SimpleButton';\nimport { NotificationsButton } from '../../form/buttons/notificationsButton/NotificationsButton';\nimport { ButtonProps } from '../../form/buttons/button.interface';\n\nimport './headerBar.scss';\n\ntype HeadingLevel = NonNullable<HeaderTextInterface['headingLevel']>;\ntype HeadingTag = `h${ HeadingLevel }`;\n\nexport const HeaderBar: React.FC<HeaderTextInterface> = (\n {\n text,\n leftIcon,\n rightIcon,\n buttons,\n notificationIcon,\n headingLevel = 2,\n children\n }\n) => {\n const headerCssClass = `headerBar \n ${ leftIcon ? 'withLeftIcon' : '' }\n ${ rightIcon ? 'withRightIcon' : '' }\n ${ notificationIcon ? 'withNotification' : '' }\n `;\n const Heading: HeadingTag = `h${ headingLevel }`;\n\n return (\n <header className={ headerCssClass }>\n {\n leftIcon && <Icon { ...leftIcon } />\n }\n\n {\n text && <Heading>{ text }</Heading>\n }\n\n { children }\n\n {\n buttons\n && (\n <div className=\"headerButtons\">\n {\n buttons.map((button) => {\n if (button.kind === 'notifications') {\n return <NotificationsButton key={ button.id } { ...button } />;\n }\n return <SimpleButton key={ button.id } { ...(button as ButtonProps) } />;\n })\n }\n </div>\n )\n }\n\n {\n rightIcon && <Icon { ...rightIcon } />\n }\n\n {\n notificationIcon && <NotificationIcon { ...notificationIcon } />\n }\n </header>\n );\n};\n"],"mappings":";AAAA,YAAY;;AAAC,IAAAA,sBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,SAAA;AAAA,IAAAC,SAAA,GAAAP,sBAAA,CAAAC,OAAA;AAEb,IAAAO,MAAA,GAAAR,sBAAA,CAAAC,OAAA;AAEA,IAAAQ,KAAA,GAAAR,OAAA;AACA,IAAAS,iBAAA,GAAAT,OAAA;AACA,IAAAU,aAAA,GAAAV,OAAA;AACA,IAAAW,oBAAA,GAAAX,OAAA;AAGAA,OAAA;AAKO,MAAMK,SAAwC,GAAGA,CACtD;EACEO,IAAI;EACJC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,gBAAgB;EAChBC,YAAY,GAAG,CAAC;EAChBC;AACF,CAAC,KACE;EACH,MAAMC,cAAc,GAAG;AACzB,MAAON,QAAQ,GAAG,cAAc,GAAG,EAAE;AACrC,MAAOC,SAAS,GAAG,eAAe,GAAG,EAAE;AACvC,MAAOE,gBAAgB,GAAG,kBAAkB,GAAG,EAAE;AACjD,KAAK;EACH,MAAMI,OAAmB,GAAG,IAAKH,YAAY,EAAG;EAEhD,oBACEV,MAAA,CAAAc,OAAA,CAAAC,aAAA;IAAQC,SAAS,EAAGJ;EAAgB,GAEhCN,QAAQ,iBAAIN,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACd,KAAA,CAAAgB,IAAI,EAAMX,QAAY,CAAC,EAIpCD,IAAI,iBAAIL,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACF,OAAO,QAAGR,IAAe,CAAC,EAGnCM,QAAQ,EAGRH,OAAO,iBAELR,MAAA,CAAAc,OAAA,CAAAC,aAAA;IAAKC,SAAS,EAAC;EAAe,GAE1BR,OAAO,CAACU,GAAG,CAAEC,MAAM,IAAK;IACtB,IAAIA,MAAM,CAACC,IAAI,KAAK,eAAe,EAAE;MACnC,oBAAOpB,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACX,oBAAA,CAAAiB,mBAAmB,MAAAtB,SAAA,CAAAe,OAAA;QAACQ,GAAG,EAAGH,MAAM,CAACI;MAAI,GAAMJ,MAAM,CAAI,CAAC;IAChE;IACA,oBAAOnB,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACZ,aAAA,CAAAqB,YAAY,MAAAzB,SAAA,CAAAe,OAAA;MAACQ,GAAG,EAAGH,MAAM,CAACI;IAAI,GAAOJ,MAAM,CAAoB,CAAC;EAC1E,CAAC,CAEA,CACN,EAIDZ,SAAS,iBAAIP,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACd,KAAA,CAAAgB,IAAI,EAAMV,SAAa,CAAC,EAItCE,gBAAgB,iBAAIT,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACb,iBAAA,CAAAuB,gBAAgB,EAAMhB,gBAAoB,CAE3D,CAAC;AAEb,CAAC;AAACb,OAAA,CAAAE,SAAA,GAAAA,SAAA","ignoreList":[]}
@@ -26,7 +26,12 @@
26
26
  right: 0;
27
27
  left: auto;
28
28
  }
29
- .headerBar h2 {
29
+ .headerBar h1,
30
+ .headerBar h2,
31
+ .headerBar h3,
32
+ .headerBar h4,
33
+ .headerBar h5,
34
+ .headerBar h6 {
30
35
  text-overflow: ellipsis;
31
36
  white-space: nowrap;
32
37
  overflow: hidden;
@@ -24,7 +24,8 @@ const Tooltip = props => {
24
24
  containsBlockElements = false,
25
25
  children,
26
26
  label = 'Toggle tooltip open state',
27
- showPointer = true
27
+ showPointer = true,
28
+ hoverDelay
28
29
  // visualIndicators will be handled below
29
30
  } = props;
30
31
 
@@ -34,38 +35,89 @@ const Tooltip = props => {
34
35
  colouredText: true
35
36
  } : undefined;
36
37
  const [isOpen, setIsOpen] = (0, _react.useState)(false);
38
+ const [isHovered, setIsHovered] = (0, _react.useState)(false);
37
39
  const tooltipElement = (0, _react.useRef)(null);
38
40
  const triggerElement = (0, _react.useRef)(null);
39
41
  const contentElement = (0, _react.useRef)(null);
42
+ const hoverTimer = (0, _react.useRef)(null);
40
43
  const iconIsElement = /*#__PURE__*/_react.default.isValidElement(icon);
41
- (0, _ClickOutside.useOnClickOutside)(tooltipElement, () => setIsOpen(false));
44
+
45
+ // Hover is handled in css by default. It is only taken over by js when a delay is requested.
46
+ const hasHoverDelay = typeof hoverDelay === 'number' && hoverDelay > 0;
47
+ const isVisible = isOpen || isHovered;
48
+ const clearHoverTimer = (0, _react.useCallback)(() => {
49
+ if (hoverTimer.current) {
50
+ clearTimeout(hoverTimer.current);
51
+ hoverTimer.current = null;
52
+ }
53
+ }, []);
54
+ const handleMouseEnter = (0, _react.useCallback)(() => {
55
+ clearHoverTimer();
56
+ hoverTimer.current = setTimeout(() => setIsHovered(true), hoverDelay);
57
+ }, [clearHoverTimer, hoverDelay]);
58
+ const handleMouseLeave = (0, _react.useCallback)(() => {
59
+ clearHoverTimer();
60
+ setIsHovered(false);
61
+ }, [clearHoverTimer]);
62
+
63
+ // Single dismissal path, so every close route clears both the click and hover state
64
+ const dismiss = (0, _react.useCallback)(() => {
65
+ clearHoverTimer();
66
+ setIsHovered(false);
67
+ setIsOpen(false);
68
+ }, [clearHoverTimer]);
69
+ const handleTriggerClick = (0, _react.useCallback)(() => {
70
+ if (isVisible) {
71
+ dismiss();
72
+ return;
73
+ }
74
+ clearHoverTimer();
75
+ setIsOpen(true);
76
+ }, [isVisible, dismiss, clearHoverTimer]);
77
+
78
+ // Releasing the delay detaches the mouse handlers, so reset any hover state they left behind
79
+ (0, _react.useEffect)(() => {
80
+ if (!hasHoverDelay) {
81
+ clearHoverTimer();
82
+ setIsHovered(false);
83
+ }
84
+ }, [hasHoverDelay, clearHoverTimer]);
85
+ (0, _react.useEffect)(() => clearHoverTimer, [clearHoverTimer]);
86
+ const hoverHandlers = hasHoverDelay ? {
87
+ onMouseEnter: handleMouseEnter,
88
+ onMouseLeave: handleMouseLeave
89
+ } : {};
90
+ (0, _ClickOutside.useOnClickOutside)(tooltipElement, dismiss);
42
91
  (0, _EdgeProximityDetect.useOnEdgeProximityDetect)({
43
92
  triggerRef: triggerElement,
44
93
  wrapperRef: tooltipElement,
45
94
  contentRef: contentElement,
46
- requiresRecalc: isOpen
95
+ requiresRecalc: isVisible
47
96
  });
48
97
 
49
98
  // Handle special key presses
50
99
  const handleSpecialKeyPresses = (0, _react.useCallback)(event => {
51
100
  if (event.key === 'Escape' || event.keyCode === 27) {
52
- setIsOpen(false);
101
+ dismiss();
53
102
  }
54
- }, [setIsOpen]);
103
+ }, [dismiss]);
55
104
  (0, _react.useEffect)(() => {
56
- if (tooltipElement.current) {
57
- tooltipElement.current.addEventListener('keydown', handleSpecialKeyPresses);
105
+ const wrapper = tooltipElement.current;
106
+ if (!wrapper) {
107
+ return undefined;
58
108
  }
109
+ wrapper.addEventListener('keydown', handleSpecialKeyPresses);
110
+ return () => wrapper.removeEventListener('keydown', handleSpecialKeyPresses);
59
111
  }, [handleSpecialKeyPresses]);
60
112
  if (containsBlockElements) {
61
- return /*#__PURE__*/_react.default.createElement("div", {
113
+ return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
62
114
  role: "tooltip",
63
115
  ref: tooltipElement,
64
- className: `tooltip tooltip_block ${isOpen ? 'isOpen' : ''} ${triggerStyle === 'text' && 'textDisplay'} ${customCssClass || ''}`
65
- }, /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
116
+ className: `tooltip tooltip_block ${isVisible ? 'isOpen' : ''} ${hasHoverDelay ? 'hoverDelayed' : ''} ${triggerStyle === 'text' ? 'textDisplay' : ''} ${customCssClass || ''}`
117
+ }, hoverHandlers), /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
66
118
  ref: triggerElement,
67
119
  type: "button",
68
- onClick: () => setIsOpen(!isOpen),
120
+ onClick: handleTriggerClick,
69
121
  className: `button ${triggerStyle === 'text' ? 'text_only' : 'icon_only'} ${triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : ''} ${triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : ''}`
70
122
  }, triggerId ? {
71
123
  'id': triggerId,
@@ -83,13 +135,13 @@ const Tooltip = props => {
83
135
  id: `${triggerId}_content`
84
136
  } : {}), children));
85
137
  }
86
- return /*#__PURE__*/_react.default.createElement("span", {
138
+ return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
87
139
  ref: tooltipElement,
88
- className: `tooltip ${isOpen ? 'isOpen' : ''} ${triggerStyle === 'text' && 'textDisplay'} ${customCssClass || ''}`
89
- }, /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
140
+ className: `tooltip ${isVisible ? 'isOpen' : ''} ${hasHoverDelay ? 'hoverDelayed' : ''} ${triggerStyle === 'text' ? 'textDisplay' : ''} ${customCssClass || ''}`
141
+ }, hoverHandlers), /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
90
142
  ref: triggerElement,
91
143
  type: "button",
92
- onClick: () => setIsOpen(!isOpen),
144
+ onClick: handleTriggerClick,
93
145
  className: `button ${triggerStyle === 'text' ? 'text_only' : 'icon_only'} ${triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : ''} ${triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : ''}`
94
146
  }, triggerId ? {
95
147
  id: triggerId
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","default","Tooltip","_extends2","_react","_interopRequireWildcard","_ClickOutside","_Icon","_EdgeProximityDetect","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","props","triggerId","triggerStyle","icon","customCssClass","containsBlockElements","children","label","showPointer","visualIndicators","underline","colouredText","undefined","isOpen","setIsOpen","useState","tooltipElement","useRef","triggerElement","contentElement","iconIsElement","React","isValidElement","useOnClickOutside","useOnEdgeProximityDetect","triggerRef","wrapperRef","contentRef","requiresRecalc","handleSpecialKeyPresses","useCallback","event","key","keyCode","useEffect","current","addEventListener","createElement","role","ref","className","type","onClick","Icon","toString","id","_default"],"sources":["../../../../../src/components/design/tooltip/Tooltip.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, useRef, useEffect, useCallback, ReactNode, ReactElement } from 'react';\nimport { useOnClickOutside } from '../../../hooks/ClickOutside';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { useOnEdgeProximityDetect } from '../../../hooks/EdgeProximityDetect';\nimport './tooltip.scss';\n\n// Define the props for Tooltip\nexport type TooltipProps =\n {\n triggerId?: string;\n icon?: ReactElement | string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle?: 'icon';\n label?: string | ReactNode;\n showPointer?: boolean;\n }\n | {\n triggerId?: string;\n icon?: ReactElement | string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle: 'text';\n label?: string | ReactNode;\n showPointer?: boolean;\n visualIndicators?: { underline?: boolean; colouredText?: boolean };\n };\n\nexport const Tooltip: React.FC<TooltipProps> = (props) => {\n const {\n triggerId,\n triggerStyle = 'icon',\n icon = 'info',\n customCssClass,\n containsBlockElements = false,\n children,\n label = 'Toggle tooltip open state',\n showPointer = true,\n // visualIndicators will be handled below\n } = props as any;\n\n // Only use visualIndicators if triggerStyle is 'text'\n const visualIndicators =\n triggerStyle === 'text'\n ? (props as { visualIndicators?: { underline?: boolean; colouredText?: boolean } }).visualIndicators ?? { underline: true, colouredText: true }\n : undefined;\n const [isOpen, setIsOpen] = useState(false);\n const tooltipElement = useRef<HTMLDivElement | HTMLSpanElement>(null);\n const triggerElement = useRef<HTMLButtonElement>(null);\n const contentElement = useRef<HTMLDivElement | HTMLSpanElement>(null);\n\n const iconIsElement = React.isValidElement(icon);\n\n useOnClickOutside(tooltipElement, () => setIsOpen(false));\n\n useOnEdgeProximityDetect({\n triggerRef: triggerElement,\n wrapperRef: tooltipElement,\n contentRef: contentElement,\n requiresRecalc: isOpen,\n });\n\n // Handle special key presses\n const handleSpecialKeyPresses = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Escape' || event.keyCode === 27) {\n setIsOpen(false);\n }\n },\n [setIsOpen],\n );\n\n useEffect(() => {\n if (tooltipElement.current) {\n tooltipElement.current.addEventListener('keydown', handleSpecialKeyPresses as EventListener);\n }\n }, [handleSpecialKeyPresses]);\n\n if (containsBlockElements) {\n return (\n <div\n role=\"tooltip\"\n ref={ tooltipElement as React.RefObject<HTMLDivElement> }\n className={ `tooltip tooltip_block ${ isOpen ? 'isOpen' : '' } ${ triggerStyle === 'text' && 'textDisplay' } ${ customCssClass || '' }` }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ () => setIsOpen(!isOpen) }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { 'id': triggerId, 'aria-describedby': `${ triggerId }_content` } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <div\n ref={ contentElement as React.RefObject<HTMLDivElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </div>\n </div>\n );\n }\n\n return (\n <span\n ref={ tooltipElement as React.RefObject<HTMLSpanElement> }\n className={ `tooltip ${ isOpen ? 'isOpen' : '' } ${ triggerStyle === 'text' && 'textDisplay' } ${ customCssClass || '' }` }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ () => setIsOpen(!isOpen) }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { id: triggerId } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <span\n aria-hidden\n role=\"presentation\"\n ref={ contentElement as React.RefObject<HTMLSpanElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </span>\n </span>\n );\n};\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Tooltip.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","default","Tooltip","_extends2","_react","_interopRequireWildcard","_ClickOutside","_Icon","_EdgeProximityDetect","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","props","triggerId","triggerStyle","icon","customCssClass","containsBlockElements","children","label","showPointer","hoverDelay","visualIndicators","underline","colouredText","undefined","isOpen","setIsOpen","useState","isHovered","setIsHovered","tooltipElement","useRef","triggerElement","contentElement","hoverTimer","iconIsElement","React","isValidElement","hasHoverDelay","isVisible","clearHoverTimer","useCallback","current","clearTimeout","handleMouseEnter","setTimeout","handleMouseLeave","dismiss","handleTriggerClick","useEffect","hoverHandlers","onMouseEnter","onMouseLeave","useOnClickOutside","useOnEdgeProximityDetect","triggerRef","wrapperRef","contentRef","requiresRecalc","handleSpecialKeyPresses","event","key","keyCode","wrapper","addEventListener","removeEventListener","createElement","role","ref","className","type","onClick","Icon","toString","id","_default"],"sources":["../../../../../src/components/design/tooltip/Tooltip.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, useRef, useEffect, useCallback, ReactNode, ReactElement } from 'react';\nimport { useOnClickOutside } from '../../../hooks/ClickOutside';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { useOnEdgeProximityDetect } from '../../../hooks/EdgeProximityDetect';\nimport './tooltip.scss';\n\n// Define the props for Tooltip\nexport type TooltipProps =\n {\n triggerId?: string;\n icon?: ReactElement | string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle?: 'icon';\n label?: string | ReactNode;\n showPointer?: boolean;\n hoverDelay?: number;\n }\n | {\n triggerId?: string;\n icon?: ReactElement | string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle: 'text';\n label?: string | ReactNode;\n showPointer?: boolean;\n hoverDelay?: number;\n visualIndicators?: { underline?: boolean; colouredText?: boolean };\n };\n\nexport const Tooltip: React.FC<TooltipProps> = (props) => {\n const {\n triggerId,\n triggerStyle = 'icon',\n icon = 'info',\n customCssClass,\n containsBlockElements = false,\n children,\n label = 'Toggle tooltip open state',\n showPointer = true,\n hoverDelay,\n // visualIndicators will be handled below\n } = props as any;\n\n // Only use visualIndicators if triggerStyle is 'text'\n const visualIndicators =\n triggerStyle === 'text'\n ? (props as { visualIndicators?: { underline?: boolean; colouredText?: boolean } }).visualIndicators ?? { underline: true, colouredText: true }\n : undefined;\n const [isOpen, setIsOpen] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n const tooltipElement = useRef<HTMLDivElement | HTMLSpanElement>(null);\n const triggerElement = useRef<HTMLButtonElement>(null);\n const contentElement = useRef<HTMLDivElement | HTMLSpanElement>(null);\n const hoverTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const iconIsElement = React.isValidElement(icon);\n\n // Hover is handled in css by default. It is only taken over by js when a delay is requested.\n const hasHoverDelay = typeof hoverDelay === 'number' && hoverDelay > 0;\n const isVisible = isOpen || isHovered;\n\n const clearHoverTimer = useCallback(() => {\n if (hoverTimer.current) {\n clearTimeout(hoverTimer.current);\n hoverTimer.current = null;\n }\n }, []);\n\n const handleMouseEnter = useCallback(() => {\n clearHoverTimer();\n hoverTimer.current = setTimeout(() => setIsHovered(true), hoverDelay);\n }, [clearHoverTimer, hoverDelay]);\n\n const handleMouseLeave = useCallback(() => {\n clearHoverTimer();\n setIsHovered(false);\n }, [clearHoverTimer]);\n\n // Single dismissal path, so every close route clears both the click and hover state\n const dismiss = useCallback(() => {\n clearHoverTimer();\n setIsHovered(false);\n setIsOpen(false);\n }, [clearHoverTimer]);\n\n const handleTriggerClick = useCallback(() => {\n if (isVisible) {\n dismiss();\n return;\n }\n clearHoverTimer();\n setIsOpen(true);\n }, [isVisible, dismiss, clearHoverTimer]);\n\n // Releasing the delay detaches the mouse handlers, so reset any hover state they left behind\n useEffect(() => {\n if (!hasHoverDelay) {\n clearHoverTimer();\n setIsHovered(false);\n }\n }, [hasHoverDelay, clearHoverTimer]);\n\n useEffect(() => clearHoverTimer, [clearHoverTimer]);\n\n const hoverHandlers = hasHoverDelay\n ? { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }\n : {};\n\n useOnClickOutside(tooltipElement, dismiss);\n\n useOnEdgeProximityDetect({\n triggerRef: triggerElement,\n wrapperRef: tooltipElement,\n contentRef: contentElement,\n requiresRecalc: isVisible,\n });\n\n // Handle special key presses\n const handleSpecialKeyPresses = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Escape' || event.keyCode === 27) {\n dismiss();\n }\n },\n [dismiss],\n );\n\n useEffect(() => {\n const wrapper = tooltipElement.current;\n if (!wrapper) {\n return undefined;\n }\n wrapper.addEventListener('keydown', handleSpecialKeyPresses as EventListener);\n return () => wrapper.removeEventListener('keydown', handleSpecialKeyPresses as EventListener);\n }, [handleSpecialKeyPresses]);\n\n if (containsBlockElements) {\n return (\n <div\n role=\"tooltip\"\n ref={ tooltipElement as React.RefObject<HTMLDivElement> }\n className={ `tooltip tooltip_block ${ isVisible ? 'isOpen' : '' } ${ hasHoverDelay ? 'hoverDelayed' : '' } ${ triggerStyle === 'text' ? 'textDisplay' : '' } ${ customCssClass || '' }` }\n { ...hoverHandlers }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ handleTriggerClick }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { 'id': triggerId, 'aria-describedby': `${ triggerId }_content` } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <div\n ref={ contentElement as React.RefObject<HTMLDivElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </div>\n </div>\n );\n }\n\n return (\n <span\n ref={ tooltipElement as React.RefObject<HTMLSpanElement> }\n className={ `tooltip ${ isVisible ? 'isOpen' : '' } ${ hasHoverDelay ? 'hoverDelayed' : '' } ${ triggerStyle === 'text' ? 'textDisplay' : '' } ${ customCssClass || '' }` }\n { ...hoverHandlers }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ handleTriggerClick }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { id: triggerId } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <span\n aria-hidden\n role=\"presentation\"\n ref={ contentElement as React.RefObject<HTMLSpanElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </span>\n </span>\n );\n};\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}
@@ -93,7 +93,7 @@
93
93
  .tooltip.large .content:before {
94
94
  left: 160px;
95
95
  }
96
- .tooltip:hover .content, .tooltip.isOpen .content {
96
+ .tooltip:not(.hoverDelayed):hover .content, .tooltip.isOpen .content {
97
97
  display: block;
98
98
  }
99
99
  .tooltip.measuring .content {
@@ -25,7 +25,8 @@ const FormField = ({
25
25
  validation,
26
26
  customContent,
27
27
  customCssClasses,
28
- separateLabelAndField = false
28
+ separateLabelAndField = false,
29
+ formContext
29
30
  }) => {
30
31
  const [isTouched, setIsTouched] = (0, _react.useState)(false);
31
32
  const wrapperCssClass = `
@@ -70,9 +71,9 @@ const FormField = ({
70
71
  case 'select':
71
72
  return /*#__PURE__*/_react.default.createElement(_Select.Select, fieldProps);
72
73
  case 'checkbox':
73
- return new Error('Checkboxes require special handling. Please use the InputCheckbox component instead.');
74
+ throw new Error('Checkboxes require special handling. Please use the InputCheckbox component instead.');
74
75
  case 'file':
75
- return new Error('File inputs require special handling. Please use the DragAndDropFileUpload component instead.');
76
+ throw new Error('File inputs require special handling. Please use the DragAndDropFileUpload component instead.');
76
77
  case 'password':
77
78
  return /*#__PURE__*/_react.default.createElement(_InputText.InputText, fieldProps);
78
79
  case 'date':
@@ -91,7 +92,9 @@ const FormField = ({
91
92
  isRequired: validation && typeof validation.required !== 'undefined',
92
93
  customContent
93
94
  };
94
- return /*#__PURE__*/_react.default.createElement(_HookFormWrapper.HookFormWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
95
+ return /*#__PURE__*/_react.default.createElement(_HookFormWrapper.HookFormWrapper, {
96
+ formContext: formContext
97
+ }, /*#__PURE__*/_react.default.createElement("div", {
95
98
  className: wrapperCssClass,
96
99
  title: wrapperHoverText()
97
100
  }, /*#__PURE__*/_react.default.createElement("label", {
@@ -100,7 +103,7 @@ const FormField = ({
100
103
  htmlFor: field.id
101
104
  }, (!label?.position || label.position === 'left' || separateLabelAndField) && /*#__PURE__*/_react.default.createElement(_FormFieldLabel.FormFieldLabel, labelProps), !separateLabelAndField && /*#__PURE__*/_react.default.createElement("span", {
102
105
  className: "inputContainer"
103
- }, getFieldElement(), label?.position === 'inset' && /*#__PURE__*/_react.default.createElement(_FormFieldLabel.FormFieldLabel, labelProps)), label?.position === 'right' && /*#__PURE__*/_react.default.createElement(_FormFieldLabel.FormFieldLabel, labelProps), showSpinner && /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, null), field.type !== 'textarea' && /*#__PURE__*/_react.default.createElement(_ValidationMessages.ValidationMessages, {
106
+ }, getFieldElement(), label?.position === 'inset' && /*#__PURE__*/_react.default.createElement(_FormFieldLabel.FormFieldLabel, labelProps)), label?.position === 'right' && /*#__PURE__*/_react.default.createElement(_FormFieldLabel.FormFieldLabel, labelProps), showSpinner && /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, null), /*#__PURE__*/_react.default.createElement(_ValidationMessages.ValidationMessages, {
104
107
  name: field.name,
105
108
  validation: validation
106
109
  })), separateLabelAndField && /*#__PURE__*/_react.default.createElement("div", {
@@ -1 +1 @@
1
- {"version":3,"file":"FormField.js","names":["Object","defineProperty","exports","value","default","FormField","_react","_interopRequireWildcard","require","_HookFormWrapper","_FormFieldLabel","_InputText","_ValidationMessages","_Spinner","_InputSearch","_InputDate","_Select","_Textarea","_Autocomplete","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","label","field","layout","showSpinner","validation","customContent","customCssClasses","separateLabelAndField","isTouched","setIsTouched","useState","wrapperCssClass","type","wrapper","position","wrapperHoverText","hide","undefined","placeholder","text","getFieldElement","fieldType","toLowerCase","fieldProps","defaultValue","onTouched","createElement","Textarea","Select","Error","InputText","InputDate","InputSearch","Autocomplete","labelProps","inputId","id","isRequired","required","HookFormWrapper","className","title","labelId","htmlFor","FormFieldLabel","Spinner","ValidationMessages","name","_default"],"sources":["../../../../../../src/components/form/formFields/formFieldWrapper/FormField.tsx"],"sourcesContent":["'use client';\n\nimport React, { ReactNode, useState } from 'react';\nimport { HookFormWrapper } from '../../hookFormWrapper/HookFormWrapper';\nimport { FormFieldLabel } from '../subComponents/labels/FormFieldLabel';\nimport { FormFieldProps } from './formFieldProps';\nimport { InputText } from '../subComponents/inputs/text/InputText';\nimport { ValidationMessages } from '../../validation/ValidationMessages';\nimport { Spinner } from '../../../design/spinner/Spinner';\nimport { InputSearch } from '../subComponents/inputs/search/InputSearch';\nimport { InputDate } from '../subComponents/inputs/date/InputDate';\nimport { Select } from '../subComponents/select/Select';\nimport { Textarea } from '../subComponents/textarea/Textarea';\nimport { Autocomplete } from '../subComponents/inputs/autocomplete/Autocomplete';\n\nexport const FormField: React.FC<FormFieldProps> = (\n {\n label,\n field,\n layout = 'stacked',\n showSpinner,\n validation,\n customContent,\n customCssClasses,\n separateLabelAndField = false\n }\n) => {\n const [isTouched, setIsTouched] = useState(false);\n\n const wrapperCssClass = `\n formField \n ${ layout } \n ${ field.type }_Field \n ${ customCssClasses?.wrapper || '' } \n ${ isTouched ? 'touched' : '' } \n ${ typeof validation !== 'undefined' ? 'withValidation' : '' } \n ${ label?.position === 'inset' ? 'insetLabel' : '' }\n `;\n\n const wrapperHoverText = (): string | undefined => {\n if (!label.hide) {\n return undefined;\n }\n\n if (field.placeholder) {\n return field.placeholder;\n }\n\n if (typeof label.text === 'string') {\n return label.text;\n }\n\n return undefined;\n };\n\n const getFieldElement = () => {\n const fieldType = field.type.toLowerCase();\n const fieldProps = {\n field: {\n ...field,\n ...(fieldType !== 'checkbox' ? { defaultValue: field.defaultValue || '' } : {}),\n onTouched: () => setIsTouched(true)\n },\n label,\n showSpinner,\n validation,\n customContent\n };\n\n switch (fieldType) {\n case 'textarea':\n return <Textarea { ...fieldProps } />;\n case 'select':\n return <Select { ...fieldProps } />;\n case 'checkbox':\n return new Error('Checkboxes require special handling. Please use the InputCheckbox component instead.');\n case 'file':\n return new Error('File inputs require special handling. Please use the DragAndDropFileUpload component instead.');\n case 'password':\n return <InputText { ...fieldProps } />;\n case 'date':\n return <InputDate { ...fieldProps } />;\n case 'search':\n return <InputSearch { ...fieldProps } />;\n case 'combobox':\n return <Autocomplete { ...fieldProps } />;\n default:\n return <InputText { ...fieldProps } />;\n }\n };\n\n const labelProps = {\n ...label,\n inputId: field.id,\n isRequired: validation && typeof validation.required !== 'undefined',\n customContent\n };\n\n return (\n <HookFormWrapper>\n <div\n className={ wrapperCssClass }\n title={ wrapperHoverText() }\n >\n <label\n id={ label.labelId || `${ field.id }_label` }\n className={ `${ customCssClasses?.label || '' } ${ showSpinner ? 'withSpinner' : '' } ${ label.hide ? 'hiddenLabel' : '' }` }\n htmlFor={ field.id }\n >\n\n { (!label?.position || label.position === 'left' || separateLabelAndField)\n && <FormFieldLabel { ...labelProps } /> }\n\n {\n !separateLabelAndField && (\n <span className=\"inputContainer\">\n {\n getFieldElement() as ReactNode\n }\n { label?.position === 'inset'\n && <FormFieldLabel { ...labelProps } /> }\n </span>\n )\n }\n\n { label?.position === 'right'\n && <FormFieldLabel { ...labelProps } /> }\n\n {\n showSpinner && <Spinner />\n }\n\n { field.type !== 'textarea' && <ValidationMessages name={ field.name } validation={ validation } /> }\n </label>\n\n {\n separateLabelAndField && (\n <div className=\"inputContainer\">\n {\n getFieldElement() as ReactNode\n }\n </div>\n )\n }\n </div>\n </HookFormWrapper>\n );\n};\n\nexport default FormField;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"FormField.js","names":["Object","defineProperty","exports","value","default","FormField","_react","_interopRequireWildcard","require","_HookFormWrapper","_FormFieldLabel","_InputText","_ValidationMessages","_Spinner","_InputSearch","_InputDate","_Select","_Textarea","_Autocomplete","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","label","field","layout","showSpinner","validation","customContent","customCssClasses","separateLabelAndField","formContext","isTouched","setIsTouched","useState","wrapperCssClass","type","wrapper","position","wrapperHoverText","hide","undefined","placeholder","text","getFieldElement","fieldType","toLowerCase","fieldProps","defaultValue","onTouched","createElement","Textarea","Select","Error","InputText","InputDate","InputSearch","Autocomplete","labelProps","inputId","id","isRequired","required","HookFormWrapper","className","title","labelId","htmlFor","FormFieldLabel","Spinner","ValidationMessages","name","_default"],"sources":["../../../../../../src/components/form/formFields/formFieldWrapper/FormField.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState } from 'react';\nimport { HookFormWrapper } from '../../hookFormWrapper/HookFormWrapper';\nimport { FormFieldLabel } from '../subComponents/labels/FormFieldLabel';\nimport { FormFieldProps } from './formFieldProps';\nimport { InputText } from '../subComponents/inputs/text/InputText';\nimport { ValidationMessages } from '../../validation/ValidationMessages';\nimport { Spinner } from '../../../design/spinner/Spinner';\nimport { InputSearch } from '../subComponents/inputs/search/InputSearch';\nimport { InputDate } from '../subComponents/inputs/date/InputDate';\nimport { Select } from '../subComponents/select/Select';\nimport { Textarea } from '../subComponents/textarea/Textarea';\nimport { Autocomplete } from '../subComponents/inputs/autocomplete/Autocomplete';\n\nexport const FormField: React.FC<FormFieldProps> = (\n {\n label,\n field,\n layout = 'stacked',\n showSpinner,\n validation,\n customContent,\n customCssClasses,\n separateLabelAndField = false,\n formContext\n }\n) => {\n const [isTouched, setIsTouched] = useState(false);\n\n const wrapperCssClass = `\n formField \n ${ layout } \n ${ field.type }_Field \n ${ customCssClasses?.wrapper || '' } \n ${ isTouched ? 'touched' : '' } \n ${ typeof validation !== 'undefined' ? 'withValidation' : '' } \n ${ label?.position === 'inset' ? 'insetLabel' : '' }\n `;\n\n const wrapperHoverText = (): string | undefined => {\n if (!label.hide) {\n return undefined;\n }\n\n if (field.placeholder) {\n return field.placeholder;\n }\n\n if (typeof label.text === 'string') {\n return label.text;\n }\n\n return undefined;\n };\n\n const getFieldElement = () => {\n const fieldType = field.type.toLowerCase();\n const fieldProps = {\n field: {\n ...field,\n ...(fieldType !== 'checkbox' ? { defaultValue: field.defaultValue || '' } : {}),\n onTouched: () => setIsTouched(true)\n },\n label,\n showSpinner,\n validation,\n customContent\n };\n\n switch (fieldType) {\n case 'textarea':\n return <Textarea { ...fieldProps } />;\n case 'select':\n return <Select { ...fieldProps } />;\n case 'checkbox':\n throw new Error('Checkboxes require special handling. Please use the InputCheckbox component instead.');\n case 'file':\n throw new Error('File inputs require special handling. Please use the DragAndDropFileUpload component instead.');\n case 'password':\n return <InputText { ...fieldProps } />;\n case 'date':\n return <InputDate { ...fieldProps } />;\n case 'search':\n return <InputSearch { ...fieldProps } />;\n case 'combobox':\n return <Autocomplete { ...fieldProps } />;\n default:\n return <InputText { ...fieldProps } />;\n }\n };\n\n const labelProps = {\n ...label,\n inputId: field.id,\n isRequired: validation && typeof validation.required !== 'undefined',\n customContent\n };\n\n return (\n <HookFormWrapper formContext={ formContext }>\n <div\n className={ wrapperCssClass }\n title={ wrapperHoverText() }\n >\n <label\n id={ label.labelId || `${ field.id }_label` }\n className={ `${ customCssClasses?.label || '' } ${ showSpinner ? 'withSpinner' : '' } ${ label.hide ? 'hiddenLabel' : '' }` }\n htmlFor={ field.id }\n >\n\n { (!label?.position || label.position === 'left' || separateLabelAndField)\n && <FormFieldLabel { ...labelProps } /> }\n\n {\n !separateLabelAndField && (\n <span className=\"inputContainer\">\n {\n getFieldElement()\n }\n { label?.position === 'inset'\n && <FormFieldLabel { ...labelProps } /> }\n </span>\n )\n }\n\n { label?.position === 'right'\n && <FormFieldLabel { ...labelProps } /> }\n\n {\n showSpinner && <Spinner />\n }\n\n <ValidationMessages name={ field.name } validation={ validation } />\n </label>\n\n {\n separateLabelAndField && (\n <div className=\"inputContainer\">\n {\n getFieldElement()\n }\n </div>\n )\n }\n </div>\n </HookFormWrapper>\n );\n};\n\nexport default FormField;\n"],"mappings":"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","ignoreList":[]}