@dxc-technology/halstack-react 0.0.0-a678636 → 0.0.0-a9c6846

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 (125) hide show
  1. package/babel.config.js +6 -2
  2. package/dist/BackgroundColorContext.js +46 -0
  3. package/dist/ThemeContext.js +235 -2
  4. package/dist/accordion/Accordion.js +170 -65
  5. package/dist/accordion-group/AccordionGroup.js +186 -0
  6. package/dist/alert/Alert.js +180 -81
  7. package/dist/alert/index.d.ts +51 -0
  8. package/dist/badge/Badge.js +63 -0
  9. package/dist/box/Box.js +31 -23
  10. package/dist/button/Button.js +83 -26
  11. package/dist/card/Card.js +72 -35
  12. package/dist/checkbox/Checkbox.js +98 -38
  13. package/dist/chip/Chip.js +128 -36
  14. package/dist/common/RequiredComponent.js +2 -8
  15. package/dist/common/utils.js +2 -22
  16. package/dist/common/variables.js +1311 -304
  17. package/dist/date/Date.js +75 -52
  18. package/dist/dialog/Dialog.js +58 -37
  19. package/dist/dropdown/Dropdown.js +199 -71
  20. package/dist/file-input/FileInput.js +641 -0
  21. package/dist/file-input/FileItem.js +280 -0
  22. package/dist/file-input/index.d.ts +81 -0
  23. package/dist/footer/Footer.js +85 -36
  24. package/dist/footer/dxc_logo.svg +15 -0
  25. package/dist/header/Header.js +111 -68
  26. package/dist/header/dxc_logo_black.svg +8 -0
  27. package/dist/heading/Heading.js +81 -16
  28. package/dist/input-text/InputText.js +288 -100
  29. package/dist/layout/ApplicationLayout.js +331 -0
  30. package/dist/layout/facebook.svg +45 -0
  31. package/dist/layout/linkedin.svg +50 -0
  32. package/dist/layout/twitter.svg +53 -0
  33. package/dist/link/Link.js +136 -35
  34. package/dist/main.d.ts +7 -0
  35. package/dist/main.js +89 -1
  36. package/dist/new-date/NewDate.js +400 -0
  37. package/dist/new-date/index.d.ts +95 -0
  38. package/dist/new-input-text/NewInputText.js +982 -0
  39. package/dist/new-input-text/index.d.ts +135 -0
  40. package/dist/new-textarea/NewTextarea.js +362 -0
  41. package/dist/new-textarea/index.d.ts +117 -0
  42. package/dist/number/Number.js +138 -0
  43. package/dist/number/NumberContext.js +16 -0
  44. package/dist/number/index.d.ts +113 -0
  45. package/dist/paginator/Paginator.js +149 -56
  46. package/dist/password/Password.js +200 -0
  47. package/dist/password/index.d.ts +94 -0
  48. package/dist/password/styles.css +3 -0
  49. package/dist/progress-bar/ProgressBar.js +95 -38
  50. package/dist/radio/Radio.js +31 -17
  51. package/dist/resultsetTable/ResultsetTable.js +93 -68
  52. package/dist/select/Select.js +244 -146
  53. package/dist/sidenav/Sidenav.js +86 -129
  54. package/dist/slider/Slider.js +125 -64
  55. package/dist/spinner/Spinner.js +247 -59
  56. package/dist/switch/Switch.js +50 -27
  57. package/dist/table/Table.js +52 -13
  58. package/dist/tabs/Tabs.js +206 -35
  59. package/dist/tabs-for-sections/TabsForSections.js +1 -16
  60. package/dist/tag/Tag.js +100 -35
  61. package/dist/textarea/Textarea.js +77 -40
  62. package/dist/toggle/Toggle.js +16 -19
  63. package/dist/toggle-group/ToggleGroup.js +64 -58
  64. package/dist/upload/Upload.js +13 -8
  65. package/dist/upload/buttons-upload/ButtonsUpload.js +31 -14
  66. package/dist/upload/dragAndDropArea/DragAndDropArea.js +78 -28
  67. package/dist/upload/file-upload/FileToUpload.js +50 -24
  68. package/dist/upload/files-upload/FilesToUpload.js +16 -16
  69. package/dist/upload/transaction/Transaction.js +44 -24
  70. package/dist/upload/transactions/Transactions.js +38 -20
  71. package/dist/useTheme.js +22 -0
  72. package/dist/wizard/Wizard.js +139 -55
  73. package/dist/wizard/invalid_icon.svg +4 -5
  74. package/dist/wizard/valid_icon.svg +4 -5
  75. package/package.json +13 -5
  76. package/test/AccordionGroup.test.js +125 -0
  77. package/test/Date.test.js +13 -13
  78. package/test/Dropdown.test.js +15 -0
  79. package/test/FileInput.test.js +201 -0
  80. package/test/InputText.test.js +30 -26
  81. package/test/Link.test.js +25 -7
  82. package/test/NewDate.test.js +232 -0
  83. package/test/NewInputText.test.js +734 -0
  84. package/test/NewTextarea.test.js +195 -0
  85. package/test/Number.test.js +257 -0
  86. package/test/Paginator.test.js +72 -60
  87. package/test/Password.test.js +83 -0
  88. package/test/ResultsetTable.test.js +66 -19
  89. package/test/Select.test.js +55 -34
  90. package/test/Sidenav.test.js +22 -64
  91. package/test/Slider.test.js +17 -0
  92. package/test/Spinner.test.js +5 -0
  93. package/test/Tabs.test.js +21 -0
  94. package/dist/accordion/Accordion.stories.js +0 -207
  95. package/dist/accordion/readme.md +0 -96
  96. package/dist/alert/Alert.stories.js +0 -158
  97. package/dist/alert/close.svg +0 -4
  98. package/dist/alert/error.svg +0 -4
  99. package/dist/alert/info.svg +0 -4
  100. package/dist/alert/readme.md +0 -43
  101. package/dist/alert/success.svg +0 -4
  102. package/dist/alert/warning.svg +0 -4
  103. package/dist/button/Button.stories.js +0 -224
  104. package/dist/button/readme.md +0 -93
  105. package/dist/common/services/example-service.js +0 -10
  106. package/dist/common/services/example-service.test.js +0 -12
  107. package/dist/date/calendar.svg +0 -1
  108. package/dist/date/calendar_dark.svg +0 -1
  109. package/dist/dialog/Dialog.stories.js +0 -217
  110. package/dist/dialog/readme.md +0 -32
  111. package/dist/dropdown/Dropdown.stories.js +0 -249
  112. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  113. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  114. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  115. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  116. package/dist/dropdown/readme.md +0 -69
  117. package/dist/footer/dxc_logo_wht.png +0 -0
  118. package/dist/header/dxc_logo_black.png +0 -0
  119. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  120. package/dist/header/dxc_logo_white.png +0 -0
  121. package/dist/select/Select.stories.js +0 -235
  122. package/dist/select/readme.md +0 -72
  123. package/dist/sidenav/arrow_icon.svg +0 -3
  124. package/dist/toggle-group/readme.md +0 -82
  125. package/test/Toggle.test.js +0 -43
@@ -1,82 +0,0 @@
1
- # DXC Toggle Group Component
2
-
3
- ## Props
4
-
5
- <table>
6
- <tr style="background-color: grey">
7
- <td>Name</td>
8
- <td>Default</td>
9
- <td>Description</td>
10
- </tr>
11
- <tr>
12
- <td>value: any | any[]</td>
13
- <td></td>
14
- <td>
15
- The key(s) of the selected value(s). If the toggle group component
16
- doesn't allow multiple selection, it must be one unique value. If the
17
- component allows multiple selection, value must be an array. If
18
- undefined, the component will be uncontrolled and the value will be
19
- managed internally by the component.
20
- </td>
21
- </tr>
22
- <tr>
23
- <td>onChange: function</td>
24
- <td></td>
25
- <td>
26
- This function will be called every time the selection changes. The
27
- number with the key of the selected value will be passed as a
28
- parameter to this function. If multiple selection is allowed, an array
29
- of keys will be passed
30
- </td>
31
- </tr>
32
- <tr>
33
- <td>disabled: boolean</td>
34
- <td>
35
- <code>false</code>
36
- </td>
37
- <td>If true, the component will be disabled.</td>
38
- </tr>
39
- <tr>
40
- <td>multiple: boolean</td>
41
- <td>
42
- <code>false</code>
43
- </td>
44
- <td>
45
- If true, the toggle group will support multiple selection. In that
46
- case, value must be an array of numbers with the keys of the selected
47
- values.
48
- </td>
49
- </tr>
50
- <tr>
51
- <td>options: object[]</td>
52
- <td>
53
- <code>[]</code>
54
- </td>
55
- <td>
56
- An array of objects representing the selectable options. Each object
57
- has the following properties:
58
- <ul>
59
- <li>
60
- <b>value</b>: Number with the option inner value.
61
- </li>
62
- <li>
63
- <b>label</b>: String with the option display value.
64
- </li>
65
- <li>
66
- <b>iconSrc</b>: URL of the icon that will be placed. IconSrc and
67
- label can't be used at same time.
68
- </li>
69
- </ul>
70
- </td>
71
- </tr>
72
- <tr>
73
- <td>margin: string | object</td>
74
- <td></td>
75
- <td>
76
- Size of the margin to be applied to the component ('xxsmall' |
77
- 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). You
78
- can pass an object with 'top', 'bottom', 'left' and 'right' properties
79
- in order to specify different margin sizes.
80
- </td>
81
- </tr>
82
- </table>
@@ -1,43 +0,0 @@
1
- import React from "react";
2
- import { render, fireEvent } from "@testing-library/react";
3
- import DxcToggle from "../src/toggle/Toggle";
4
-
5
- describe("Toggle component tests", () => {
6
- test("Toggle renders with correct text", () => {
7
- const { getByText } = render(<DxcToggle label="Toggle" />);
8
- expect(getByText("Toggle")).toBeTruthy();
9
- });
10
-
11
- test("Calls correct function on click", () => {
12
- const onClick = jest.fn();
13
- const { getByText} = render(<DxcToggle label="ToggleTest" onClick={onClick} />);
14
- fireEvent.click(getByText("ToggleTest"));
15
- expect(onClick).toHaveBeenCalled();
16
- });
17
-
18
- test("Calls correct function on click with the correct value.", () => {
19
- const onClick = jest.fn();
20
- const { getByText, rerender } = render(<DxcToggle label="ToggleTest" onClick={onClick} />);
21
-
22
- fireEvent.click(getByText("ToggleTest"));
23
- rerender(<DxcToggle label="ToggleTest" onClick={onClick} selected={true} />);
24
- fireEvent.click(getByText("ToggleTest"));
25
- expect(onClick.mock.calls[0][0]).toBe(true);
26
- expect(onClick.mock.calls[1][0]).toBe(false);
27
- });
28
-
29
-
30
- test("Calls correct function on click with the correct value, if it´s controlled and the user doesn´t change the value the function always receives the same", () => {
31
- const onClick = jest.fn();
32
- const { getByText } = render(<DxcToggle label="ToggleTest" selected={true} onClick={onClick} />);
33
-
34
- fireEvent.click(getByText("ToggleTest"));
35
- fireEvent.click(getByText("ToggleTest"));
36
- fireEvent.click(getByText("ToggleTest"));
37
- expect(onClick).toHaveBeenCalledTimes(3);
38
- expect(onClick.mock.calls[0][0]).toBe(false);
39
- expect(onClick.mock.calls[1][0]).toBe(false);
40
- expect(onClick.mock.calls[2][0]).toBe(false);
41
- });
42
-
43
- });