@dxc-technology/halstack-react 0.0.0-40fd4e3 → 0.0.0-4254e6c

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 (305) hide show
  1. package/BackgroundColorContext.js +50 -0
  2. package/ThemeContext.js +246 -0
  3. package/V3Select/V3Select.js +455 -0
  4. package/V3Select/index.d.ts +27 -0
  5. package/V3Textarea/V3Textarea.js +260 -0
  6. package/V3Textarea/index.d.ts +27 -0
  7. package/accordion/Accordion.js +289 -0
  8. package/accordion/index.d.ts +28 -0
  9. package/{dist/accordion-group → accordion-group}/AccordionGroup.js +50 -25
  10. package/accordion-group/index.d.ts +16 -0
  11. package/alert/Alert.d.ts +4 -0
  12. package/alert/Alert.js +290 -0
  13. package/alert/types.d.ts +49 -0
  14. package/alert/types.js +5 -0
  15. package/badge/Badge.js +59 -0
  16. package/{dist/box → box}/Box.js +38 -34
  17. package/box/index.d.ts +25 -0
  18. package/button/Button.d.ts +4 -0
  19. package/button/Button.js +182 -0
  20. package/button/Button.stories.tsx +293 -0
  21. package/button/types.d.ts +57 -0
  22. package/button/types.js +5 -0
  23. package/card/Card.js +200 -0
  24. package/card/index.d.ts +22 -0
  25. package/checkbox/Checkbox.d.ts +4 -0
  26. package/checkbox/Checkbox.js +253 -0
  27. package/checkbox/types.d.ts +61 -0
  28. package/checkbox/types.js +5 -0
  29. package/chip/Chip.js +221 -0
  30. package/chip/index.d.ts +22 -0
  31. package/{dist/common → common}/OpenSans.css +0 -0
  32. package/{dist/common → common}/RequiredComponent.js +5 -19
  33. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  34. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  35. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  36. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  37. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  38. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  39. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  40. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  41. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  42. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  43. package/common/utils.js +22 -0
  44. package/common/variables.js +1569 -0
  45. package/{dist/date → date}/Date.js +87 -70
  46. package/date/index.d.ts +27 -0
  47. package/date-input/DateInput.d.ts +4 -0
  48. package/date-input/DateInput.js +361 -0
  49. package/date-input/types.d.ts +100 -0
  50. package/date-input/types.js +5 -0
  51. package/dialog/Dialog.js +184 -0
  52. package/dialog/index.d.ts +18 -0
  53. package/dropdown/Dropdown.js +450 -0
  54. package/dropdown/index.d.ts +26 -0
  55. package/file-input/FileInput.js +532 -0
  56. package/file-input/FileItem.js +193 -0
  57. package/file-input/index.d.ts +81 -0
  58. package/footer/Footer.js +297 -0
  59. package/footer/Icons.js +77 -0
  60. package/footer/index.d.ts +25 -0
  61. package/header/Header.js +326 -0
  62. package/header/Icons.js +59 -0
  63. package/header/index.d.ts +25 -0
  64. package/heading/Heading.js +176 -0
  65. package/heading/index.d.ts +17 -0
  66. package/input-text/Icons.js +22 -0
  67. package/input-text/InputText.js +611 -0
  68. package/input-text/index.d.ts +36 -0
  69. package/{dist/layout → layout}/ApplicationLayout.js +42 -142
  70. package/layout/Icons.js +55 -0
  71. package/link/Link.js +183 -0
  72. package/link/index.d.ts +23 -0
  73. package/main.d.ts +44 -0
  74. package/{dist/main.js → main.js} +131 -55
  75. package/number-input/NumberInput.js +128 -0
  76. package/{dist/ThemeContext.js → number-input/NumberInputContext.js} +3 -2
  77. package/number-input/index.d.ts +113 -0
  78. package/package.json +35 -22
  79. package/paginator/Icons.js +66 -0
  80. package/paginator/Paginator.d.ts +4 -0
  81. package/paginator/Paginator.js +198 -0
  82. package/paginator/types.d.ts +38 -0
  83. package/paginator/types.js +5 -0
  84. package/password-input/PasswordInput.js +199 -0
  85. package/password-input/PasswordInput.stories.jsx +131 -0
  86. package/password-input/index.d.ts +94 -0
  87. package/progress-bar/ProgressBar.js +188 -0
  88. package/progress-bar/index.d.ts +18 -0
  89. package/radio/Radio.d.ts +4 -0
  90. package/radio/Radio.js +174 -0
  91. package/radio/types.d.ts +54 -0
  92. package/radio/types.js +5 -0
  93. package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +95 -162
  94. package/resultsetTable/index.d.ts +19 -0
  95. package/select/Select.js +865 -0
  96. package/select/index.d.ts +131 -0
  97. package/sidenav/Sidenav.js +145 -0
  98. package/sidenav/index.d.ts +13 -0
  99. package/slider/Slider.js +340 -0
  100. package/slider/index.d.ts +29 -0
  101. package/spinner/Spinner.js +267 -0
  102. package/spinner/index.d.ts +17 -0
  103. package/switch/Switch.d.ts +4 -0
  104. package/switch/Switch.js +179 -0
  105. package/switch/types.d.ts +58 -0
  106. package/switch/types.js +5 -0
  107. package/table/Table.js +118 -0
  108. package/table/index.d.ts +13 -0
  109. package/tabs/Tabs.js +259 -0
  110. package/tabs/index.d.ts +19 -0
  111. package/tag/Tag.js +208 -0
  112. package/tag/index.d.ts +24 -0
  113. package/text-input/TextInput.js +825 -0
  114. package/text-input/index.d.ts +135 -0
  115. package/textarea/Textarea.js +317 -0
  116. package/textarea/index.d.ts +117 -0
  117. package/{dist/toggle → toggle}/Toggle.js +30 -67
  118. package/toggle/index.d.ts +21 -0
  119. package/toggle-group/ToggleGroup.js +243 -0
  120. package/toggle-group/index.d.ts +21 -0
  121. package/{dist/upload → upload}/Upload.js +23 -22
  122. package/upload/buttons-upload/ButtonsUpload.js +111 -0
  123. package/upload/buttons-upload/Icons.js +40 -0
  124. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  125. package/upload/dragAndDropArea/Icons.js +39 -0
  126. package/upload/file-upload/FileToUpload.js +115 -0
  127. package/upload/file-upload/Icons.js +66 -0
  128. package/upload/files-upload/FilesToUpload.js +109 -0
  129. package/upload/index.d.ts +15 -0
  130. package/upload/transaction/Icons.js +160 -0
  131. package/upload/transaction/Transaction.js +104 -0
  132. package/upload/transactions/Transactions.js +94 -0
  133. package/useTheme.js +22 -0
  134. package/wizard/Icons.js +65 -0
  135. package/wizard/Wizard.js +271 -0
  136. package/wizard/index.d.ts +18 -0
  137. package/README.md +0 -66
  138. package/babel.config.js +0 -4
  139. package/dist/accordion/Accordion.js +0 -268
  140. package/dist/accordion/Accordion.stories.js +0 -207
  141. package/dist/accordion/readme.md +0 -96
  142. package/dist/accordion-group/AccordionGroup.stories.js +0 -207
  143. package/dist/accordion-group/readme.md +0 -70
  144. package/dist/alert/Alert.js +0 -304
  145. package/dist/alert/Alert.stories.js +0 -158
  146. package/dist/alert/close.svg +0 -4
  147. package/dist/alert/error.svg +0 -4
  148. package/dist/alert/info.svg +0 -4
  149. package/dist/alert/readme.md +0 -43
  150. package/dist/alert/success.svg +0 -4
  151. package/dist/alert/warning.svg +0 -4
  152. package/dist/button/Button.js +0 -202
  153. package/dist/button/Button.stories.js +0 -224
  154. package/dist/button/readme.md +0 -93
  155. package/dist/card/Card.js +0 -217
  156. package/dist/checkbox/Checkbox.js +0 -240
  157. package/dist/checkbox/Checkbox.stories.js +0 -144
  158. package/dist/checkbox/readme.md +0 -116
  159. package/dist/chip/Chip.js +0 -208
  160. package/dist/common/services/example-service.js +0 -10
  161. package/dist/common/services/example-service.test.js +0 -12
  162. package/dist/common/utils.js +0 -42
  163. package/dist/common/variables.js +0 -434
  164. package/dist/date/Date.stories.js +0 -205
  165. package/dist/date/calendar.svg +0 -1
  166. package/dist/date/calendar_dark.svg +0 -1
  167. package/dist/date/readme.md +0 -73
  168. package/dist/dialog/Dialog.js +0 -197
  169. package/dist/dialog/Dialog.stories.js +0 -217
  170. package/dist/dialog/readme.md +0 -32
  171. package/dist/dropdown/Dropdown.js +0 -449
  172. package/dist/dropdown/Dropdown.stories.js +0 -249
  173. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  174. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  175. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  176. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  177. package/dist/dropdown/readme.md +0 -69
  178. package/dist/footer/Footer.js +0 -371
  179. package/dist/footer/Footer.stories.js +0 -94
  180. package/dist/footer/dxc_logo_wht.png +0 -0
  181. package/dist/footer/readme.md +0 -41
  182. package/dist/header/Header.js +0 -373
  183. package/dist/header/Header.stories.js +0 -176
  184. package/dist/header/close_icon.svg +0 -1
  185. package/dist/header/dxc_logo_black.png +0 -0
  186. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  187. package/dist/header/dxc_logo_white.png +0 -0
  188. package/dist/header/hamb_menu_black.svg +0 -1
  189. package/dist/header/hamb_menu_white.svg +0 -1
  190. package/dist/header/readme.md +0 -33
  191. package/dist/heading/Heading.js +0 -153
  192. package/dist/input-text/InputText.js +0 -570
  193. package/dist/input-text/InputText.stories.js +0 -209
  194. package/dist/input-text/error.svg +0 -1
  195. package/dist/input-text/readme.md +0 -91
  196. package/dist/layout/facebook.svg +0 -45
  197. package/dist/layout/linkedin.svg +0 -50
  198. package/dist/layout/twitter.svg +0 -53
  199. package/dist/link/Link.js +0 -192
  200. package/dist/link/readme.md +0 -51
  201. package/dist/paginator/Paginator.js +0 -232
  202. package/dist/paginator/images/next.svg +0 -3
  203. package/dist/paginator/images/nextPage.svg +0 -3
  204. package/dist/paginator/images/previous.svg +0 -3
  205. package/dist/paginator/images/previousPage.svg +0 -3
  206. package/dist/paginator/readme.md +0 -50
  207. package/dist/progress-bar/ProgressBar.js +0 -185
  208. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  209. package/dist/progress-bar/readme.md +0 -63
  210. package/dist/radio/Radio.js +0 -195
  211. package/dist/radio/Radio.stories.js +0 -166
  212. package/dist/radio/readme.md +0 -70
  213. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  214. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  215. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  216. package/dist/select/Select.js +0 -473
  217. package/dist/select/Select.stories.js +0 -235
  218. package/dist/select/readme.md +0 -72
  219. package/dist/sidenav/Sidenav.js +0 -128
  220. package/dist/slider/Slider.js +0 -266
  221. package/dist/slider/Slider.stories.js +0 -241
  222. package/dist/slider/readme.md +0 -64
  223. package/dist/spinner/Spinner.js +0 -193
  224. package/dist/spinner/Spinner.stories.js +0 -183
  225. package/dist/spinner/readme.md +0 -65
  226. package/dist/switch/Switch.js +0 -199
  227. package/dist/switch/Switch.stories.js +0 -134
  228. package/dist/switch/readme.md +0 -133
  229. package/dist/table/Table.js +0 -105
  230. package/dist/tabs/Tabs.js +0 -185
  231. package/dist/tabs/Tabs.stories.js +0 -130
  232. package/dist/tabs/readme.md +0 -78
  233. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  234. package/dist/tabs-for-sections/readme.md +0 -78
  235. package/dist/tag/Tag.js +0 -249
  236. package/dist/textarea/Textarea.js +0 -227
  237. package/dist/toggle/Toggle.stories.js +0 -297
  238. package/dist/toggle/readme.md +0 -80
  239. package/dist/toggle-group/ToggleGroup.js +0 -226
  240. package/dist/toggle-group/readme.md +0 -82
  241. package/dist/upload/Upload.stories.js +0 -72
  242. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -122
  243. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  244. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  245. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -279
  246. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  247. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  248. package/dist/upload/file-upload/FileToUpload.js +0 -158
  249. package/dist/upload/file-upload/audio-icon.svg +0 -4
  250. package/dist/upload/file-upload/close.svg +0 -4
  251. package/dist/upload/file-upload/file-icon.svg +0 -4
  252. package/dist/upload/file-upload/video-icon.svg +0 -4
  253. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  254. package/dist/upload/readme.md +0 -37
  255. package/dist/upload/transaction/Transaction.js +0 -155
  256. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  257. package/dist/upload/transaction/audio-icon.svg +0 -4
  258. package/dist/upload/transaction/error-icon.svg +0 -4
  259. package/dist/upload/transaction/file-icon-err.svg +0 -4
  260. package/dist/upload/transaction/file-icon.svg +0 -4
  261. package/dist/upload/transaction/image-icon-err.svg +0 -4
  262. package/dist/upload/transaction/image-icon.svg +0 -4
  263. package/dist/upload/transaction/success-icon.svg +0 -4
  264. package/dist/upload/transaction/video-icon-err.svg +0 -4
  265. package/dist/upload/transaction/video-icon.svg +0 -4
  266. package/dist/upload/transactions/Transactions.js +0 -120
  267. package/dist/wizard/Wizard.js +0 -340
  268. package/dist/wizard/invalid_icon.svg +0 -6
  269. package/dist/wizard/valid_icon.svg +0 -6
  270. package/dist/wizard/validation-wrong.svg +0 -6
  271. package/test/Accordion.test.js +0 -33
  272. package/test/AccordionGroup.test.js +0 -111
  273. package/test/Alert.test.js +0 -53
  274. package/test/Box.test.js +0 -10
  275. package/test/Button.test.js +0 -18
  276. package/test/Card.test.js +0 -30
  277. package/test/Checkbox.test.js +0 -45
  278. package/test/Chip.test.js +0 -25
  279. package/test/Date.test.js +0 -393
  280. package/test/Dialog.test.js +0 -23
  281. package/test/Dropdown.test.js +0 -130
  282. package/test/Footer.test.js +0 -99
  283. package/test/Header.test.js +0 -39
  284. package/test/Heading.test.js +0 -35
  285. package/test/InputText.test.js +0 -240
  286. package/test/Link.test.js +0 -42
  287. package/test/Paginator.test.js +0 -194
  288. package/test/ProgressBar.test.js +0 -35
  289. package/test/Radio.test.js +0 -37
  290. package/test/ResultsetTable.test.js +0 -304
  291. package/test/Select.test.js +0 -192
  292. package/test/Sidenav.test.js +0 -45
  293. package/test/Slider.test.js +0 -82
  294. package/test/Spinner.test.js +0 -27
  295. package/test/Switch.test.js +0 -45
  296. package/test/Table.test.js +0 -36
  297. package/test/Tabs.test.js +0 -88
  298. package/test/TabsForSections.test.js +0 -34
  299. package/test/Tag.test.js +0 -32
  300. package/test/TextArea.test.js +0 -52
  301. package/test/ToggleGroup.test.js +0 -81
  302. package/test/Upload.test.js +0 -60
  303. package/test/Wizard.test.js +0 -130
  304. package/test/mocks/pngMock.js +0 -1
  305. package/test/mocks/svgMock.js +0 -1
@@ -1,6 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="496" height="496" viewBox="0 0 496 496">
2
- <g id="Group_2913" data-name="Group 2913" transform="translate(5286 3925)">
3
- <path id="Path_2821" data-name="Path 2821" d="M240,0C372.548,0,480,107.452,480,240S372.548,480,240,480,0,372.548,0,240,107.452,0,240,0Z" transform="translate(-5278 -3917)" fill="#f9cfcf"/>
4
- <path id="times-circle-regular" d="M256,8C119,8,8,119,8,256S119,504,256,504,504,393,504,256,393,8,256,8Zm0,448A200,200,0,1,1,456,256,199.945,199.945,0,0,1,256,456ZM357.8,193.8,295.6,256l62.2,62.2a12.011,12.011,0,0,1,0,17l-22.6,22.6a12.011,12.011,0,0,1-17,0L256,295.6l-62.2,62.2a12.011,12.011,0,0,1-17,0l-22.6-22.6a12.011,12.011,0,0,1,0-17L216.4,256l-62.2-62.2a12.011,12.011,0,0,1,0-17l22.6-22.6a12.011,12.011,0,0,1,17,0L256,216.4l62.2-62.2a12.011,12.011,0,0,1,17,0l22.6,22.6a12.011,12.011,0,0,1,0,17Z" transform="translate(-5294 -3933)" fill="#e22"/>
5
- </g>
6
- </svg>
@@ -1,6 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="496" height="496" viewBox="0 0 496 496">
2
- <g id="Group_2914" data-name="Group 2914" transform="translate(4677 3925)">
3
- <path id="Path_2822" data-name="Path 2822" d="M240,0C372.548,0,480,107.452,480,240S372.548,480,240,480,0,372.548,0,240,107.452,0,240,0Z" transform="translate(-4669 -3917)" fill="#dbf1c4"/>
4
- <path id="check-circle-regular" d="M256,8C119.033,8,8,119.033,8,256S119.033,504,256,504,504,392.967,504,256,392.967,8,256,8Zm0,48A200,200,0,1,1,56,256,199.893,199.893,0,0,1,256,56M396.2,186.267l-22.536-22.718a12,12,0,0,0-16.97-.068L215.346,303.7,155.554,243.42a12,12,0,0,0-16.97-.069l-22.719,22.536a12,12,0,0,0-.068,16.971l90.781,91.516a12,12,0,0,0,16.97.068l172.589-171.2a12,12,0,0,0,.067-16.971Z" transform="translate(-4685 -3933)" fill="#7ed321"/>
5
- </g>
6
- </svg>
@@ -1,6 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="496" height="496" viewBox="0 0 496 496">
2
- <g id="Group_2913" data-name="Group 2913" transform="translate(5286 3925)">
3
- <path id="Path_2821" data-name="Path 2821" d="M240,0C372.548,0,480,107.452,480,240S372.548,480,240,480,0,372.548,0,240,107.452,0,240,0Z" transform="translate(-5278 -3917)" fill="#f9cfcf"/>
4
- <path id="times-circle-regular" d="M256,8C119,8,8,119,8,256S119,504,256,504,504,393,504,256,393,8,256,8Zm0,448A200,200,0,1,1,456,256,199.945,199.945,0,0,1,256,456ZM357.8,193.8,295.6,256l62.2,62.2a12.011,12.011,0,0,1,0,17l-22.6,22.6a12.011,12.011,0,0,1-17,0L256,295.6l-62.2,62.2a12.011,12.011,0,0,1-17,0l-22.6-22.6a12.011,12.011,0,0,1,0-17L216.4,256l-62.2-62.2a12.011,12.011,0,0,1,0-17l22.6-22.6a12.011,12.011,0,0,1,17,0L256,216.4l62.2-62.2a12.011,12.011,0,0,1,17,0l22.6,22.6a12.011,12.011,0,0,1,0,17Z" transform="translate(-5294 -3933)" fill="#e22"/>
5
- </g>
6
- </svg>
@@ -1,33 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcAccordion from "../src/accordion/Accordion";
4
-
5
- describe("Accordion component tests", () => {
6
- test("Accordion renders with correct text", () => {
7
- const onChange = jest.fn();
8
- const { getByText } = render(<DxcAccordion label="Accordion" onChange={onChange} />);
9
-
10
- expect(getByText("Accordion")).toBeTruthy();
11
- });
12
-
13
- test("Calls correct function on click", () => {
14
- const onChange = jest.fn();
15
- const { getByText } = render(<DxcAccordion label="Accordion" onChange={onChange} />);
16
-
17
- fireEvent.click(getByText("Accordion"));
18
- expect(onChange).toHaveBeenCalled();
19
- });
20
-
21
- test("Controlled accordion", () => {
22
- const onChange = jest.fn();
23
- const { getByText } = render(<DxcAccordion label="Accordion" onChange={onChange} isExpanded={true} />);
24
-
25
- fireEvent.click(getByText("Accordion"));
26
- fireEvent.click(getByText("Accordion"));
27
- fireEvent.click(getByText("Accordion"));
28
- expect(onChange).toHaveBeenCalledTimes(3);
29
- expect(onChange.mock.calls[0][0]).toBe(false);
30
- expect(onChange.mock.calls[1][0]).toBe(false);
31
- expect(onChange.mock.calls[2][0]).toBe(false);
32
- });
33
- });
@@ -1,111 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcAccordionGroup from "../src/accordion-group/AccordionGroup";
4
-
5
- describe("Accordion component tests", () => {
6
- test("Uncontrolled accordion group renders with children", () => {
7
- const { getByText } = render(
8
- <DxcAccordionGroup>
9
- <DxcAccordionGroup.Accordion label="Accordion1" padding="medium">
10
- <div>
11
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
12
- Suspendisse malesuada lacus ex, sit amet blandit leo lobortis
13
- eget.
14
- </div>
15
- </DxcAccordionGroup.Accordion>
16
- <DxcAccordionGroup.Accordion label="Accordion2" padding="medium">
17
- <div>
18
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
19
- Suspendisse malesuada lacus ex, sit amet blandit leo lobortis
20
- eget.
21
- </div>
22
- </DxcAccordionGroup.Accordion>
23
- </DxcAccordionGroup>
24
- );
25
-
26
- expect(getByText("Accordion1")).toBeTruthy();
27
- expect(getByText("Accordion2")).toBeTruthy();
28
- });
29
-
30
- test("Uncontrolled accordion group calls correct function on click", () => {
31
- const onActiveChange = jest.fn();
32
- const { getByText } = render(
33
- <DxcAccordionGroup
34
- margin="large"
35
- onActiveChange={onActiveChange}
36
- >
37
- <DxcAccordionGroup.Accordion label="Accordion1" padding="medium" margin="large">
38
- <div>
39
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
40
- Suspendisse malesuada lacus ex, sit amet blandit leo lobortis
41
- eget.
42
- </div>
43
- </DxcAccordionGroup.Accordion>
44
- <DxcAccordionGroup.Accordion label="Accordion2" padding="medium">
45
- <div>
46
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
47
- Suspendisse malesuada lacus ex, sit amet blandit leo lobortis
48
- eget.
49
- </div>
50
- </DxcAccordionGroup.Accordion>
51
- </DxcAccordionGroup>
52
- );
53
-
54
- fireEvent.click(getByText("Accordion1"));
55
- expect(onActiveChange).toHaveBeenCalled();
56
- });
57
-
58
- test("Controlled accordion", () => {
59
- const onActiveChange = jest.fn();
60
- const { getByText } = render(
61
- <DxcAccordionGroup
62
- margin="large"
63
- indexActive={1}
64
- onActiveChange={onActiveChange}
65
- >
66
- <DxcAccordionGroup.Accordion label="Accordion1" padding="medium" margin="large">
67
- <div>
68
- Text1
69
- </div>
70
- </DxcAccordionGroup.Accordion>
71
- <DxcAccordionGroup.Accordion label="Accordion2" padding="medium">
72
- <div>
73
- Text2
74
- </div>
75
- </DxcAccordionGroup.Accordion>
76
- </DxcAccordionGroup>
77
- );
78
- expect(getByText("Text1")).toBeTruthy();
79
- expect(getByText("Text2")).toBeTruthy();
80
- fireEvent.click(getByText("Accordion1"));
81
- fireEvent.click(getByText("Accordion2"));
82
- expect(onActiveChange).toHaveBeenCalledTimes(2);
83
- expect(onActiveChange.mock.calls[0][0]).toBe(0);
84
- expect(onActiveChange.mock.calls[1][0]).toBe(1);
85
- });
86
-
87
- test("Disabled uncontrolled accordion group", () => {
88
- const onActiveChange = jest.fn();
89
- const { getByText } = render(
90
- <DxcAccordionGroup
91
- margin="large"
92
- onActiveChange={onActiveChange}
93
- disabled={true}
94
- >
95
- <DxcAccordionGroup.Accordion label="Accordion1" padding="medium" margin="large">
96
- <div>
97
- Text1
98
- </div>
99
- </DxcAccordionGroup.Accordion>
100
- <DxcAccordionGroup.Accordion label="Accordion2" padding="medium">
101
- <div>
102
- Text2
103
- </div>
104
- </DxcAccordionGroup.Accordion>
105
- </DxcAccordionGroup>
106
- );
107
- fireEvent.click(getByText("Accordion1"));
108
- fireEvent.click(getByText("Accordion2"));
109
- expect(onActiveChange).toHaveBeenCalledTimes(0);
110
- });
111
- });
@@ -1,53 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcAlert from "../src/alert/Alert";
4
-
5
- describe("Alert component tests", () => {
6
- test("Info alert renders with correct text", () => {
7
- const { getByText } = render(<DxcAlert type="info" inlineText="info-alert-text" />);
8
- expect(getByText("information")).toBeTruthy();
9
- expect(getByText("info-alert-text")).toBeTruthy();
10
- });
11
-
12
- test("Confirm alert renders with correct text", () => {
13
- const { getByText } = render(<DxcAlert type="confirm" inlineText="confirm-alert-text" />);
14
- expect(getByText("success")).toBeTruthy();
15
- expect(getByText("confirm-alert-text")).toBeTruthy();
16
- });
17
-
18
- test("Warning alert renders with correct text", () => {
19
- const { getByText } = render(<DxcAlert type="warning" inlineText="warning-alert-text" />);
20
- expect(getByText("warning")).toBeTruthy();
21
- expect(getByText("warning-alert-text")).toBeTruthy();
22
- });
23
-
24
- test("Error alert renders with correct text", () => {
25
- const { getByText } = render(<DxcAlert type="error" inlineText="error-alert-text" />);
26
- expect(getByText("error")).toBeTruthy();
27
- expect(getByText("error-alert-text")).toBeTruthy();
28
- });
29
-
30
- test("Alert renders with correct children", () => {
31
- const { getByText } = render(<DxcAlert inlineText="alert-text"><p>sample-children</p></DxcAlert>);
32
- expect(getByText("alert-text")).toBeTruthy();
33
- expect(getByText("sample-children")).toBeTruthy();
34
- });
35
-
36
- test("Calls correct function on close", () => {
37
- const onClose = jest.fn();
38
- const { getByRole } = render(<DxcAlert onClose={onClose} inlineText="info-alert-text" />);
39
-
40
- const closeButton = getByRole("button");
41
- fireEvent.click(closeButton);
42
- expect(onClose).toHaveBeenCalled();
43
- });
44
-
45
- test("Modal alert calls correct function on close", () => {
46
- const onClose = jest.fn();
47
- const { getByRole } = render(<DxcAlert onClose={onClose} mode="modal" inlineText="info-alert-text" />);
48
-
49
- const closeButton = getByRole("button");
50
- fireEvent.click(closeButton);
51
- expect(onClose).toHaveBeenCalled();
52
- });
53
- });
package/test/Box.test.js DELETED
@@ -1,10 +0,0 @@
1
- import React from "react";
2
- import { render } from "@testing-library/react";
3
- import DxcBox from "../src/card/Card";
4
-
5
- describe("Box component tests", () => {
6
- test("Box renders with correct text", () => {
7
- const { getByText } = render(<DxcBox>test-box</DxcBox>);
8
- expect(getByText("test-box")).toBeTruthy();
9
- });
10
- });
@@ -1,18 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcButton from "../src/button/Button";
4
-
5
- describe("Button component tests", () => {
6
- test("Button renders with correct text", () => {
7
- const { getByText } = render(<DxcButton label="Button" />);
8
- expect(getByText("Button")).toBeTruthy();
9
- });
10
- test("Calls correct function on click", () => {
11
- const onClick = jest.fn();
12
- const { getByText } = render(<DxcButton label="Button" onClick={onClick} />);
13
-
14
- const button = getByText("Button");
15
- fireEvent.click(button);
16
- expect(onClick).toHaveBeenCalled();
17
- });
18
- });
package/test/Card.test.js DELETED
@@ -1,30 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcCard from "../src/card/Card";
4
-
5
- describe("Card component tests", () => {
6
- test("Card renders with correct content", () => {
7
- const { getByText } = render(<DxcCard>test-card</DxcCard>);
8
- expect(getByText("test-card")).toBeTruthy();
9
- });
10
-
11
- test("Card renders with correct href", () => {
12
- const { getByRole } = render(<DxcCard linkHref="/testPage">test-card</DxcCard>);
13
- const card = getByRole("link");
14
- expect(card.getAttribute("href")).toEqual("/testPage");
15
- });
16
-
17
- test("Card renders with correct image", () => {
18
- const { getByRole } = render(<DxcCard imageSrc="/testImage">test-card</DxcCard>);
19
- const card = getByRole("img");
20
- expect(card.getAttribute("src")).toEqual("/testImage");
21
- });
22
-
23
- test("OnClick function is called", () => {
24
- const onClick = jest.fn();
25
- const { getByText } = render(<DxcCard onClick={onClick}>test-card</DxcCard>);
26
- const card = getByText("test-card");
27
- fireEvent.click(card);
28
- expect(onClick).toHaveBeenCalled();
29
- });
30
- });
@@ -1,45 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
-
4
- import DxcCheckbox from "../src/checkbox/Checkbox";
5
-
6
- describe("Checkbox component tests", () => {
7
- test("Checkbox renders with correct text", () => {
8
- const { getByText } = render(<DxcCheckbox label="Checkbox" />);
9
-
10
- expect(getByText("Checkbox")).toBeTruthy();
11
- });
12
-
13
- test("Calls correct function on click", () => {
14
- const onChange = jest.fn();
15
- const { getByText } = render(<DxcCheckbox label="Checkbox" onChange={onChange} />);
16
-
17
- fireEvent.click(getByText("Checkbox"));
18
- expect(onChange).toHaveBeenCalled();
19
- });
20
-
21
- test("Uncontrolled checkbox", () => {
22
- const onChange = jest.fn();
23
- const component = render(<DxcCheckbox label="Checkbox" onChange={onChange} />);
24
- const visibleCheckbox = component.getByText("Checkbox");
25
- const input = component.getByRole("checkbox");
26
- expect(input.checked).toBe(false);
27
- fireEvent.click(visibleCheckbox);
28
- expect(onChange).toHaveBeenCalled();
29
- expect(onChange).toHaveBeenCalledWith(true);
30
- expect(input.checked).toBe(true);
31
- });
32
-
33
- test("Controlled checkbox", () => {
34
- const onChange = jest.fn();
35
- const component = render(<DxcCheckbox label="Checkbox" checked={false} onChange={onChange} />);
36
-
37
- const input = component.getByRole("checkbox");
38
- const visibleCheckbox = component.getByText("Checkbox");
39
-
40
- fireEvent.click(visibleCheckbox);
41
- expect(onChange).toHaveBeenCalled();
42
- expect(onChange).toHaveBeenCalledWith(true);
43
- expect(input.checked).toBe(false);
44
- });
45
- });
package/test/Chip.test.js DELETED
@@ -1,25 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcChip from "../src/chip/Chip";
4
- import icon from "../../app/src/images/invision.svg";
5
-
6
- describe("Chip component tests", () => {
7
- test("Chip renders with correct text", () => {
8
- const { getByText } = render(<DxcChip label="Chip" />);
9
- expect(getByText("Chip")).toBeTruthy();
10
- });
11
- test("Calls correct function when clicking on prefix icon", () => {
12
- const onClick = jest.fn();
13
- const { getByText, getByRole } = render(<DxcChip label="Chip" prefixIconSrc={icon} onClickPrefix={onClick} />);
14
- expect(getByText("Chip")).toBeTruthy();
15
- fireEvent.click(getByRole("img"));
16
- expect(onClick).toHaveBeenCalled();
17
- });
18
- test("Calls correct function when clicking on suffix icon", () => {
19
- const onClick = jest.fn();
20
- const { getByText, getByRole } = render(<DxcChip label="Chip" suffixIconSrc={icon} onClickSuffix={onClick} />);
21
- expect(getByText("Chip")).toBeTruthy();
22
- fireEvent.click(getByRole("img"));
23
- expect(onClick).toHaveBeenCalled();
24
- });
25
- });