@dxc-technology/halstack-react 0.0.0-5908eb4 → 0.0.0-5b2ad05

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 (182) hide show
  1. package/dist/ThemeContext.js +134 -100
  2. package/dist/V3Select/V3Select.js +549 -0
  3. package/dist/V3Textarea/V3Textarea.js +264 -0
  4. package/dist/accordion/Accordion.js +66 -59
  5. package/dist/accordion-group/AccordionGroup.js +1 -3
  6. package/dist/alert/Alert.js +126 -111
  7. package/dist/alert/index.d.ts +51 -0
  8. package/dist/box/Box.js +1 -9
  9. package/dist/button/Button.js +33 -27
  10. package/dist/checkbox/Checkbox.js +26 -21
  11. package/dist/chip/Chip.js +21 -25
  12. package/dist/common/variables.js +808 -535
  13. package/dist/date/Date.js +13 -15
  14. package/dist/{new-date/NewDate.js → date-input/DateInput.js} +85 -76
  15. package/dist/date-input/index.d.ts +95 -0
  16. package/dist/dialog/Dialog.js +15 -32
  17. package/dist/dropdown/Dropdown.js +117 -66
  18. package/dist/file-input/FileInput.js +644 -0
  19. package/dist/file-input/FileItem.js +280 -0
  20. package/dist/file-input/index.d.ts +81 -0
  21. package/dist/footer/Footer.js +63 -49
  22. package/dist/footer/Icons.js +77 -0
  23. package/dist/header/Header.js +123 -84
  24. package/dist/header/Icons.js +59 -0
  25. package/dist/heading/Heading.js +13 -5
  26. package/dist/input-text/Icons.js +22 -0
  27. package/dist/input-text/InputText.js +96 -63
  28. package/dist/layout/ApplicationLayout.js +5 -9
  29. package/dist/layout/Icons.js +55 -0
  30. package/dist/link/Link.js +4 -8
  31. package/dist/main.d.ts +8 -0
  32. package/dist/main.js +45 -29
  33. package/dist/{number/Number.js → number-input/NumberInput.js} +28 -19
  34. package/dist/{number/NumberContext.js → number-input/NumberInputContext.js} +2 -2
  35. package/dist/number-input/index.d.ts +113 -0
  36. package/dist/paginator/Icons.js +66 -0
  37. package/dist/paginator/Paginator.js +17 -17
  38. package/dist/password-input/PasswordInput.js +198 -0
  39. package/dist/password-input/index.d.ts +94 -0
  40. package/dist/progress-bar/ProgressBar.js +63 -27
  41. package/dist/select/Select.js +869 -347
  42. package/dist/select/index.d.ts +53 -0
  43. package/dist/sidenav/Sidenav.js +11 -15
  44. package/dist/slider/Slider.js +155 -66
  45. package/dist/spinner/Spinner.js +225 -58
  46. package/dist/table/Table.js +5 -1
  47. package/dist/tag/Tag.js +37 -35
  48. package/dist/{new-input-text/NewInputText.js → text-input/TextInput.js} +241 -199
  49. package/dist/text-input/index.d.ts +135 -0
  50. package/dist/textarea/Textarea.js +233 -124
  51. package/dist/textarea/index.d.ts +117 -0
  52. package/dist/toggle-group/ToggleGroup.js +130 -44
  53. package/dist/upload/Upload.js +3 -3
  54. package/dist/upload/buttons-upload/ButtonsUpload.js +12 -12
  55. package/dist/upload/buttons-upload/Icons.js +40 -0
  56. package/dist/upload/dragAndDropArea/DragAndDropArea.js +23 -19
  57. package/dist/upload/dragAndDropArea/Icons.js +39 -0
  58. package/dist/upload/file-upload/FileToUpload.js +27 -22
  59. package/dist/upload/file-upload/Icons.js +66 -0
  60. package/dist/upload/transaction/Icons.js +160 -0
  61. package/dist/upload/transaction/Transaction.js +18 -41
  62. package/dist/upload/transactions/Transactions.js +11 -11
  63. package/dist/wizard/Icons.js +65 -0
  64. package/dist/wizard/Wizard.js +11 -17
  65. package/package.json +6 -9
  66. package/test/Date.test.js +48 -44
  67. package/test/{NewDate.test.js → DateInput.test.js} +86 -33
  68. package/test/Dropdown.test.js +15 -0
  69. package/test/FileInput.test.js +201 -0
  70. package/test/Footer.test.js +2 -7
  71. package/test/Header.test.js +5 -10
  72. package/test/Heading.test.js +60 -12
  73. package/test/InputText.test.js +24 -16
  74. package/test/NumberInput.test.js +259 -0
  75. package/test/Paginator.test.js +1 -1
  76. package/test/PasswordInput.test.js +83 -0
  77. package/test/ResultsetTable.test.js +1 -2
  78. package/test/Slider.test.js +9 -17
  79. package/test/Spinner.test.js +5 -0
  80. package/test/TextInput.test.js +732 -0
  81. package/test/Textarea.test.js +193 -0
  82. package/test/ToggleGroup.test.js +5 -1
  83. package/test/Upload.test.js +5 -5
  84. package/test/{Select.test.js → V3Select.test.js} +56 -36
  85. package/test/{TextArea.test.js → V3TextArea.test.js} +6 -7
  86. package/dist/accordion/Accordion.stories.js +0 -207
  87. package/dist/accordion/readme.md +0 -96
  88. package/dist/accordion-group/AccordionGroup.stories.js +0 -207
  89. package/dist/accordion-group/readme.md +0 -70
  90. package/dist/alert/Alert.stories.js +0 -158
  91. package/dist/alert/close.svg +0 -4
  92. package/dist/alert/error.svg +0 -4
  93. package/dist/alert/info.svg +0 -4
  94. package/dist/alert/readme.md +0 -43
  95. package/dist/alert/success.svg +0 -4
  96. package/dist/alert/warning.svg +0 -4
  97. package/dist/button/Button.stories.js +0 -224
  98. package/dist/button/readme.md +0 -93
  99. package/dist/checkbox/Checkbox.stories.js +0 -144
  100. package/dist/checkbox/readme.md +0 -116
  101. package/dist/date/Date.stories.js +0 -205
  102. package/dist/date/readme.md +0 -73
  103. package/dist/dialog/Dialog.stories.js +0 -217
  104. package/dist/dialog/readme.md +0 -32
  105. package/dist/dropdown/Dropdown.stories.js +0 -249
  106. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  107. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  108. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  109. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  110. package/dist/dropdown/readme.md +0 -69
  111. package/dist/footer/Footer.stories.js +0 -94
  112. package/dist/footer/dxc_logo.svg +0 -15
  113. package/dist/footer/readme.md +0 -41
  114. package/dist/header/Header.stories.js +0 -176
  115. package/dist/header/close_icon.svg +0 -1
  116. package/dist/header/dxc_logo_black.svg +0 -8
  117. package/dist/header/hamb_menu_black.svg +0 -1
  118. package/dist/header/hamb_menu_white.svg +0 -1
  119. package/dist/header/readme.md +0 -33
  120. package/dist/input-text/InputText.stories.js +0 -209
  121. package/dist/input-text/error.svg +0 -1
  122. package/dist/input-text/readme.md +0 -91
  123. package/dist/layout/facebook.svg +0 -45
  124. package/dist/layout/linkedin.svg +0 -50
  125. package/dist/layout/twitter.svg +0 -53
  126. package/dist/link/readme.md +0 -51
  127. package/dist/paginator/images/next.svg +0 -3
  128. package/dist/paginator/images/nextPage.svg +0 -3
  129. package/dist/paginator/images/previous.svg +0 -3
  130. package/dist/paginator/images/previousPage.svg +0 -3
  131. package/dist/paginator/readme.md +0 -50
  132. package/dist/password/Password.js +0 -139
  133. package/dist/password/styles.css +0 -3
  134. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  135. package/dist/progress-bar/readme.md +0 -63
  136. package/dist/radio/Radio.stories.js +0 -166
  137. package/dist/radio/readme.md +0 -70
  138. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  139. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  140. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  141. package/dist/select/Select.stories.js +0 -235
  142. package/dist/select/readme.md +0 -72
  143. package/dist/slider/Slider.stories.js +0 -241
  144. package/dist/slider/readme.md +0 -64
  145. package/dist/spinner/Spinner.stories.js +0 -183
  146. package/dist/spinner/readme.md +0 -65
  147. package/dist/switch/Switch.stories.js +0 -134
  148. package/dist/switch/readme.md +0 -133
  149. package/dist/tabs/Tabs.stories.js +0 -130
  150. package/dist/tabs/readme.md +0 -78
  151. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  152. package/dist/tabs-for-sections/readme.md +0 -78
  153. package/dist/toggle/Toggle.stories.js +0 -297
  154. package/dist/toggle/readme.md +0 -80
  155. package/dist/toggle-group/readme.md +0 -82
  156. package/dist/upload/Upload.stories.js +0 -72
  157. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  158. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  159. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  160. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  161. package/dist/upload/file-upload/audio-icon.svg +0 -4
  162. package/dist/upload/file-upload/close.svg +0 -4
  163. package/dist/upload/file-upload/file-icon.svg +0 -4
  164. package/dist/upload/file-upload/video-icon.svg +0 -4
  165. package/dist/upload/readme.md +0 -37
  166. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  167. package/dist/upload/transaction/audio-icon.svg +0 -4
  168. package/dist/upload/transaction/error-icon.svg +0 -4
  169. package/dist/upload/transaction/file-icon-err.svg +0 -4
  170. package/dist/upload/transaction/file-icon.svg +0 -4
  171. package/dist/upload/transaction/image-icon-err.svg +0 -4
  172. package/dist/upload/transaction/image-icon.svg +0 -4
  173. package/dist/upload/transaction/success-icon.svg +0 -4
  174. package/dist/upload/transaction/video-icon-err.svg +0 -4
  175. package/dist/upload/transaction/video-icon.svg +0 -4
  176. package/dist/wizard/invalid_icon.svg +0 -5
  177. package/dist/wizard/valid_icon.svg +0 -5
  178. package/dist/wizard/validation-wrong.svg +0 -6
  179. package/test/NewInputText.test.js +0 -663
  180. package/test/Number.test.js +0 -205
  181. package/test/Password.test.js +0 -63
  182. package/test/TabsForSections.test.js +0 -34
@@ -1,91 +0,0 @@
1
- # DXC Input Text 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: string</td>
13
- <td><code></code></td>
14
- <td>The value of the input element.</td>
15
- </tr>
16
- <tr>
17
- <td>label: string</td>
18
- <td></td>
19
- <td>Text to be placed next to the input.</td>
20
- </tr>
21
- <tr>
22
- <td>assistiveText: string</td>
23
- <td></td>
24
- <td>Assistive text to be placed at the bottom of the input.</td>
25
- </tr>
26
- <tr>
27
- <td>prefix: string</td>
28
- <td></td>
29
- <td>A prefix to be placed before the input value. Use prefixIconSrc in case the prefix needs to be an icon.</td>
30
- </tr>
31
- <tr>
32
- <td>suffix: string</td>
33
- <td></td>
34
- <td>A suffix to be placed after the input value. Use suffixIconSrc in case the suffix needs to be an icon.</td>
35
- </tr>
36
- <tr>
37
- <td>prefixIconSrc: string</td>
38
- <td></td>
39
- <td>The path of an icon to be placed before the input value.</td>
40
- </tr>
41
- <tr>
42
- <td>suffixIconSrc: string</td>
43
- <td></td>
44
- <td>The path of an icon to be placed after the input value.</td>
45
- </tr>
46
- <tr>
47
- <td>theme: 'light' | 'dark'</td>
48
- <td><code>'light'</code></td>
49
- <td>Uses one of the available component themes.</td>
50
- </tr>
51
- <tr>
52
- <td>name: string</td>
53
- <td></td>
54
- <td>Name attribute of the input element.</td>
55
- </tr>
56
- <tr>
57
- <td>disabled: boolean</td>
58
- <td><code>false</code></td>
59
- <td>If true, the component will be disabled.</td>
60
- </tr>
61
- <tr>
62
- <td>required: boolean</td>
63
- <td><code>false</code></td>
64
- <td>If true, the input will change its appearence, showing that the value is required.</td>
65
- </tr>
66
- <tr>
67
- <td>invalid: boolean</td>
68
- <td><code>false</code></td>
69
- <td>If true, the input will change its appearence, showing that the value is valid.</td>
70
- </tr>
71
- <tr>
72
- <td>multiline: boolean</td>
73
- <td><code>false</code></td>
74
- <td>If true, a resizable text area will be displayed.</td>
75
- </tr>
76
- <tr>
77
- <td>onChange: function</td>
78
- <td></td>
79
- <td>This function will be called when the user changes the value of the input. The new value will be passed as a parameter.</td>
80
- </tr>
81
- <tr>
82
- <td>onBlur: function</td>
83
- <td></td>
84
- <td>This function will be called when the focus moves away from the input. The input value will be passed as a parameter.</td>
85
- </tr>
86
- <tr>
87
- <td>onClickIcon: function</td>
88
- <td></td>
89
- <td>This function will be called when either of the two icons, prefixIcon or sufixIcon, is clicked.</td>
90
- </tr>
91
- </table>
@@ -1,45 +0,0 @@
1
- <?xml version="1.0" encoding="iso-8859-1"?>
2
- <!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
- <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
- <svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
- width="438.536px" height="438.536px" viewBox="0 0 438.536 438.536" style="enable-background:new 0 0 438.536 438.536;"
6
- xml:space="preserve" fill="#FFFFFF">
7
- <g>
8
- <path d="M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123
9
- C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126
10
- h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225
11
- C438.532,59.576,430.49,40.204,414.41,24.123z M373.155,225.548h-49.963V406.84h-74.802V225.548H210.99V163.02h37.401v-37.402
12
- c0-26.838,6.283-47.107,18.843-60.813c12.559-13.706,33.304-20.555,62.242-20.555h49.963v62.526h-31.401
13
- c-10.663,0-17.467,1.853-20.417,5.568c-2.949,3.711-4.428,10.23-4.428,19.558v31.119h56.534L373.155,225.548z"/>
14
- </g>
15
- <g>
16
- </g>
17
- <g>
18
- </g>
19
- <g>
20
- </g>
21
- <g>
22
- </g>
23
- <g>
24
- </g>
25
- <g>
26
- </g>
27
- <g>
28
- </g>
29
- <g>
30
- </g>
31
- <g>
32
- </g>
33
- <g>
34
- </g>
35
- <g>
36
- </g>
37
- <g>
38
- </g>
39
- <g>
40
- </g>
41
- <g>
42
- </g>
43
- <g>
44
- </g>
45
- </svg>
@@ -1,50 +0,0 @@
1
- <?xml version="1.0" encoding="iso-8859-1"?>
2
- <!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
- <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
- <svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
- width="438.536px" height="438.536px" viewBox="0 0 438.536 438.536" style="enable-background:new 0 0 438.536 438.536;"
6
- xml:space="preserve" fill="#FFFFFF">
7
- <g>
8
- <path d="M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123
9
- C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126
10
- h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225
11
- C438.532,59.576,430.49,40.204,414.41,24.123z M133.618,367.157H67.666V169.016h65.952V367.157z M127.626,132.332
12
- c-6.851,6.567-15.893,9.851-27.124,9.851h-0.288c-10.848,0-19.648-3.284-26.407-9.851c-6.76-6.567-10.138-14.703-10.138-24.41
13
- c0-9.897,3.476-18.083,10.421-24.556c6.95-6.471,15.942-9.708,26.98-9.708c11.039,0,19.89,3.237,26.553,9.708
14
- c6.661,6.473,10.088,14.659,10.277,24.556C137.899,117.625,134.477,125.761,127.626,132.332z M370.873,367.157h-65.952v-105.92
15
- c0-29.879-11.036-44.823-33.116-44.823c-8.374,0-15.42,2.331-21.128,6.995c-5.715,4.661-9.996,10.324-12.847,16.991
16
- c-1.335,3.422-1.999,8.75-1.999,15.981v110.775h-65.952c0.571-119.529,0.571-185.579,0-198.142h65.952v27.974
17
- c13.867-21.681,33.558-32.544,59.101-32.544c22.84,0,41.21,7.52,55.104,22.554c13.895,15.037,20.841,37.214,20.841,66.519v113.64
18
- H370.873z"/>
19
- </g>
20
- <g>
21
- </g>
22
- <g>
23
- </g>
24
- <g>
25
- </g>
26
- <g>
27
- </g>
28
- <g>
29
- </g>
30
- <g>
31
- </g>
32
- <g>
33
- </g>
34
- <g>
35
- </g>
36
- <g>
37
- </g>
38
- <g>
39
- </g>
40
- <g>
41
- </g>
42
- <g>
43
- </g>
44
- <g>
45
- </g>
46
- <g>
47
- </g>
48
- <g>
49
- </g>
50
- </svg>
@@ -1,53 +0,0 @@
1
- <?xml version="1.0" encoding="iso-8859-1"?>
2
- <!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
- <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
- <svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
- width="438.536px" height="438.536px" viewBox="0 0 438.536 438.536" style="enable-background:new 0 0 438.536 438.536;"
6
- xml:space="preserve" fill="#FFFFFF">
7
- <g>
8
- <path d="M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123
9
- C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126
10
- h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225
11
- C438.532,59.576,430.49,40.204,414.41,24.123z M335.471,168.735c0.191,1.713,0.288,4.278,0.288,7.71
12
- c0,15.989-2.334,32.025-6.995,48.104c-4.661,16.087-11.8,31.504-21.416,46.254c-9.606,14.749-21.074,27.791-34.396,39.115
13
- c-13.325,11.32-29.311,20.365-47.968,27.117c-18.648,6.762-38.637,10.143-59.953,10.143c-33.116,0-63.76-8.952-91.931-26.836
14
- c4.568,0.568,9.329,0.855,14.275,0.855c27.6,0,52.439-8.565,74.519-25.7c-12.941-0.185-24.506-4.179-34.688-11.991
15
- c-10.185-7.803-17.273-17.699-21.271-29.691c4.947,0.76,8.658,1.137,11.132,1.137c4.187,0,9.042-0.76,14.56-2.279
16
- c-13.894-2.669-25.598-9.562-35.115-20.697c-9.519-11.136-14.277-23.84-14.277-38.114v-0.571
17
- c10.085,4.755,19.602,7.229,28.549,7.422c-17.321-11.613-25.981-28.265-25.981-49.963c0-10.66,2.758-20.747,8.278-30.264
18
- c15.035,18.464,33.311,33.213,54.816,44.252c21.507,11.038,44.54,17.227,69.092,18.558c-0.95-3.616-1.427-8.186-1.427-13.704
19
- c0-16.562,5.853-30.692,17.56-42.399c11.703-11.706,25.837-17.561,42.394-17.561c17.515,0,32.079,6.283,43.688,18.846
20
- c13.134-2.474,25.892-7.33,38.26-14.56c-4.757,14.652-13.613,25.788-26.55,33.402c12.368-1.716,23.88-4.95,34.537-9.708
21
- C357.458,149.793,347.462,160.166,335.471,168.735z"/>
22
- </g>
23
- <g>
24
- </g>
25
- <g>
26
- </g>
27
- <g>
28
- </g>
29
- <g>
30
- </g>
31
- <g>
32
- </g>
33
- <g>
34
- </g>
35
- <g>
36
- </g>
37
- <g>
38
- </g>
39
- <g>
40
- </g>
41
- <g>
42
- </g>
43
- <g>
44
- </g>
45
- <g>
46
- </g>
47
- <g>
48
- </g>
49
- <g>
50
- </g>
51
- <g>
52
- </g>
53
- </svg>
@@ -1,51 +0,0 @@
1
- # DXC Input Text 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>underlined: 'boolean'</td>
13
- <td><code>false</code></td>
14
- <td>If true, the text is underlined.</td>
15
- </tr>
16
- <tr>
17
- <td>color: boolean</td>
18
- <td><code>false</code></td>
19
- <td>If true, the link have the default colors.</td>
20
- </tr>
21
- <tr>
22
- <td>text: string</td>
23
- <td></td>
24
- <td>Link text.</td>
25
- </tr>
26
- <tr>
27
- <td>iconSrc: string</td>
28
- <td></td>
29
- <td>Source of the icon.</td>
30
- </tr>
31
- <tr>
32
- <td>iconPosition: 'before' | 'after'</td>
33
- <td><code>before</code></td>
34
- <td>Indicates the position of the icon in the component.</td>
35
- </tr>
36
- <tr>
37
- <td>href: string</td>
38
- <td></td>
39
- <td>Page to be opened when the user clicks on the link.</td>
40
- </tr>
41
- <tr>
42
- <td>theme: 'light' | 'dark'</td>
43
- <td><code>light</code></td>
44
- <td>Theme of the component.</td>
45
- </tr>
46
- <tr>
47
- <td>newWindow: boolean</td>
48
- <td><code>false</code></td>
49
- <td>If true, the page is opened in a new browser tab.</td>
50
- </tr>
51
- </table>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="7.41" height="12" viewBox="0 0 7.41 12">
2
- <path id="Path_2461" data-name="Path 2461" d="M10,6,8.59,7.41,13.17,12,8.59,16.59,10,18l6-6Z" transform="translate(-8.59 -6)"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="12.41" height="12" viewBox="0 0 12.41 12">
2
- <path id="Path_2465" data-name="Path 2465" d="M5.59,7.41,10.18,12,5.59,16.59,7,18l6-6L7,6ZM16,6h2V18H16Z" transform="translate(-5.59 -6)"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="7.41" height="12" viewBox="0 0 7.41 12">
2
- <path id="Path_2459" data-name="Path 2459" d="M15.41,7.41,14,6,8,12l6,6,1.41-1.41L10.83,12Z" transform="translate(-8 -6)"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="12.41" height="12" viewBox="0 0 12.41 12">
2
- <path id="Path_2463" data-name="Path 2463" d="M18.41,16.59,13.82,12l4.59-4.59L17,6l-6,6,6,6ZM6,6H8V18H6Z" transform="translate(-6 -6)"/>
3
- </svg>
@@ -1,50 +0,0 @@
1
- # DXC Paginator 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>currentPage: number</td>
13
- <td><code>1</code></td>
14
- <td>Current page.</td>
15
- </tr>
16
- <tr>
17
- <td>itemsPerPage: number</td>
18
- <td><code>5</code></td>
19
- <td>Number of items to be displayed on each page.</td>
20
- </tr>
21
- <tr>
22
- <td>totalItems: number</td>
23
- <td></td>
24
- <td>Total number of items.</td>
25
- </tr>
26
- <tr>
27
- <td>nextFunction: function</td>
28
- <td></td>
29
- <td>This function will be called when the user clicks the next page button.<br>
30
- </td>
31
- </tr>
32
- <tr>
33
- <td>prevFunction: function</td>
34
- <td></td>
35
- <td>This function will be called when the user clicks the previous page button.<br>
36
- </td>
37
- </tr>
38
- <tr>
39
- <td>lastFunction: function</td>
40
- <td></td>
41
- <td>This function will be called when the user clicks the last page button.<br>
42
- </td>
43
- </tr>
44
- <tr>
45
- <td>firstFunction: function</td>
46
- <td></td>
47
- <td>This function will be called when the user clicks the first page button.<br>
48
- </td>
49
- </tr>
50
- </table>
@@ -1,139 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
-
5
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
13
-
14
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
-
16
- var _react = _interopRequireWildcard(require("react"));
17
-
18
- var _propTypes = _interopRequireDefault(require("prop-types"));
19
-
20
- var _NewInputText = _interopRequireDefault(require("../new-input-text/NewInputText"));
21
-
22
- var _variables = require("../common/variables.js");
23
-
24
- require("./styles.css");
25
-
26
- var DxcPassword = function DxcPassword(_ref) {
27
- var _ref$label = _ref.label,
28
- label = _ref$label === void 0 ? "" : _ref$label,
29
- value = _ref.value,
30
- _ref$helperText = _ref.helperText,
31
- helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
32
- _ref$error = _ref.error,
33
- error = _ref$error === void 0 ? "" : _ref$error,
34
- _ref$clearable = _ref.clearable,
35
- clearable = _ref$clearable === void 0 ? false : _ref$clearable,
36
- onChange = _ref.onChange,
37
- onBlur = _ref.onBlur,
38
- margin = _ref.margin,
39
- pattern = _ref.pattern,
40
- length = _ref.length,
41
- _ref$size = _ref.size,
42
- size = _ref$size === void 0 ? "medium" : _ref$size;
43
- var inputRef = (0, _react.useRef)(null);
44
-
45
- var _useState = (0, _react.useState)(false),
46
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
47
- isPasswordVisible = _useState2[0],
48
- setIsPasswordVisible = _useState2[1];
49
-
50
- var setInputType = function setInputType(type) {
51
- inputRef.current.children[2].children[0].setAttribute("type", type);
52
- };
53
-
54
- (0, _react.useEffect)(function () {
55
- setInputType("password");
56
- }, []);
57
-
58
- var viewPassword = function viewPassword() {
59
- setInputType("text");
60
- setIsPasswordVisible(true);
61
- };
62
-
63
- var hidePassword = function hidePassword() {
64
- setInputType("password");
65
- setIsPasswordVisible(false);
66
- };
67
-
68
- var action = {
69
- onClick: isPasswordVisible ? hidePassword : viewPassword,
70
- icon: isPasswordVisible ? _react["default"].createElement("svg", {
71
- xmlns: "http://www.w3.org/2000/svg",
72
- height: "24px",
73
- viewBox: "0 0 24 24",
74
- width: "24px",
75
- fill: "#000000"
76
- }, _react["default"].createElement("path", {
77
- d: "M0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0z",
78
- fill: "none"
79
- }), _react["default"].createElement("path", {
80
- d: "M12 6c3.79 0 7.17 2.13 8.82 5.5-.59 1.22-1.42 2.27-2.41 3.12l1.41 1.41c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l1.65 1.65C10.66 6.09 11.32 6 12 6zm-1.07 1.14L13 9.21c.57.25 1.03.71 1.28 1.28l2.07 2.07c.08-.34.14-.7.14-1.07C16.5 9.01 14.48 7 12 7c-.37 0-.72.05-1.07.14zM2.01 3.87l2.68 2.68C3.06 7.83 1.77 9.53 1 11.5 2.73 15.89 7 19 12 19c1.52 0 2.98-.29 4.32-.82l3.42 3.42 1.41-1.41L3.42 2.45 2.01 3.87zm7.5 7.5l2.61 2.61c-.04.01-.08.02-.12.02-1.38 0-2.5-1.12-2.5-2.5 0-.05.01-.08.01-.13zm-3.4-3.4l1.75 1.75c-.23.55-.36 1.15-.36 1.78 0 2.48 2.02 4.5 4.5 4.5.63 0 1.23-.13 1.77-.36l.98.98c-.88.24-1.8.38-2.75.38-3.79 0-7.17-2.13-8.82-5.5.7-1.43 1.72-2.61 2.93-3.53z"
81
- })) : _react["default"].createElement("svg", {
82
- xmlns: "http://www.w3.org/2000/svg",
83
- height: "24px",
84
- viewBox: "0 0 24 24",
85
- width: "24px",
86
- fill: "#000000"
87
- }, _react["default"].createElement("path", {
88
- d: "M0 0h24v24H0V0z",
89
- fill: "none"
90
- }), _react["default"].createElement("path", {
91
- d: "M12 6c3.79 0 7.17 2.13 8.82 5.5C19.17 14.87 15.79 17 12 17s-7.17-2.13-8.82-5.5C4.83 8.13 8.21 6 12 6m0-2C7 4 2.73 7.11 1 11.5 2.73 15.89 7 19 12 19s9.27-3.11 11-7.5C21.27 7.11 17 4 12 4zm0 5c1.38 0 2.5 1.12 2.5 2.5S13.38 14 12 14s-2.5-1.12-2.5-2.5S10.62 9 12 9m0-2c-2.48 0-4.5 2.02-4.5 4.5S9.52 16 12 16s4.5-2.02 4.5-4.5S14.48 7 12 7z"
92
- }))
93
- };
94
- return _react["default"].createElement(_NewInputText["default"], {
95
- ref: inputRef,
96
- label: label,
97
- value: value,
98
- helperText: helperText,
99
- action: action,
100
- error: error,
101
- clearable: clearable,
102
- onChange: onChange,
103
- onBlur: onBlur,
104
- margin: margin,
105
- size: size,
106
- pattern: pattern,
107
- length: length
108
- });
109
- };
110
-
111
- var sizes = {
112
- small: "60px",
113
- medium: "240px",
114
- large: "480px",
115
- fillParent: "100%"
116
- };
117
- DxcPassword.propTypes = {
118
- label: _propTypes["default"].string,
119
- value: _propTypes["default"].string,
120
- helperText: _propTypes["default"].string,
121
- error: _propTypes["default"].string,
122
- clearable: _propTypes["default"].bool,
123
- onChange: _propTypes["default"].func,
124
- onBlur: _propTypes["default"].func,
125
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
126
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
127
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
128
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
129
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
130
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
131
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
132
- pattern: _propTypes["default"].string,
133
- length: _propTypes["default"].shape({
134
- min: _propTypes["default"].number,
135
- max: _propTypes["default"].number
136
- })
137
- };
138
- var _default = DxcPassword;
139
- exports["default"] = _default;
@@ -1,3 +0,0 @@
1
- ::-ms-reveal {
2
- display: none;
3
- }