@dxc-technology/halstack-react 0.0.0-e2d44ba → 0.0.0-e2fae80

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 (180) hide show
  1. package/README.md +27 -47
  2. package/dist/index.d.mts +6734 -0
  3. package/dist/index.d.ts +6734 -0
  4. package/dist/index.js +14243 -0
  5. package/dist/index.mjs +14154 -0
  6. package/package.json +76 -67
  7. package/babel.config.js +0 -8
  8. package/dist/BackgroundColorContext.js +0 -46
  9. package/dist/ThemeContext.js +0 -240
  10. package/dist/accordion/Accordion.js +0 -353
  11. package/dist/accordion-group/AccordionGroup.js +0 -186
  12. package/dist/alert/Alert.js +0 -403
  13. package/dist/badge/Badge.js +0 -63
  14. package/dist/box/Box.js +0 -156
  15. package/dist/button/Button.js +0 -238
  16. package/dist/card/Card.js +0 -254
  17. package/dist/checkbox/Checkbox.js +0 -300
  18. package/dist/checkbox/Checkbox.stories.js +0 -144
  19. package/dist/checkbox/readme.md +0 -116
  20. package/dist/chip/Chip.js +0 -265
  21. package/dist/common/OpenSans.css +0 -81
  22. package/dist/common/RequiredComponent.js +0 -40
  23. package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
  24. package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  25. package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  26. package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  27. package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
  28. package/dist/common/fonts/OpenSans-Light.ttf +0 -0
  29. package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
  30. package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
  31. package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
  32. package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  33. package/dist/common/utils.js +0 -22
  34. package/dist/common/variables.js +0 -1365
  35. package/dist/date/Date.js +0 -381
  36. package/dist/date/Date.stories.js +0 -205
  37. package/dist/date/readme.md +0 -73
  38. package/dist/dialog/Dialog.js +0 -218
  39. package/dist/dropdown/Dropdown.js +0 -544
  40. package/dist/footer/Footer.js +0 -395
  41. package/dist/footer/Footer.stories.js +0 -94
  42. package/dist/footer/dxc_logo.svg +0 -15
  43. package/dist/footer/readme.md +0 -41
  44. package/dist/header/Header.js +0 -403
  45. package/dist/header/Header.stories.js +0 -176
  46. package/dist/header/close_icon.svg +0 -1
  47. package/dist/header/dxc_logo_black.svg +0 -8
  48. package/dist/header/hamb_menu_black.svg +0 -1
  49. package/dist/header/hamb_menu_white.svg +0 -1
  50. package/dist/header/readme.md +0 -33
  51. package/dist/heading/Heading.js +0 -218
  52. package/dist/input-text/InputText.js +0 -707
  53. package/dist/input-text/InputText.stories.js +0 -209
  54. package/dist/input-text/error.svg +0 -1
  55. package/dist/input-text/readme.md +0 -91
  56. package/dist/layout/ApplicationLayout.js +0 -331
  57. package/dist/layout/facebook.svg +0 -45
  58. package/dist/layout/linkedin.svg +0 -50
  59. package/dist/layout/twitter.svg +0 -53
  60. package/dist/link/Link.js +0 -241
  61. package/dist/link/readme.md +0 -51
  62. package/dist/main.js +0 -351
  63. package/dist/new-date/NewDate.js +0 -403
  64. package/dist/new-input-text/NewInputText.js +0 -961
  65. package/dist/new-textarea/NewTextarea.js +0 -346
  66. package/dist/number/Number.js +0 -138
  67. package/dist/number/NumberContext.js +0 -16
  68. package/dist/paginator/Paginator.js +0 -289
  69. package/dist/paginator/images/next.svg +0 -3
  70. package/dist/paginator/images/nextPage.svg +0 -3
  71. package/dist/paginator/images/previous.svg +0 -3
  72. package/dist/paginator/images/previousPage.svg +0 -3
  73. package/dist/paginator/readme.md +0 -50
  74. package/dist/password/Password.js +0 -200
  75. package/dist/password/styles.css +0 -3
  76. package/dist/progress-bar/ProgressBar.js +0 -242
  77. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  78. package/dist/progress-bar/readme.md +0 -63
  79. package/dist/radio/Radio.js +0 -209
  80. package/dist/radio/Radio.stories.js +0 -166
  81. package/dist/radio/readme.md +0 -70
  82. package/dist/resultsetTable/ResultsetTable.js +0 -358
  83. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  84. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  85. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  86. package/dist/select/Select.js +0 -549
  87. package/dist/sidenav/Sidenav.js +0 -177
  88. package/dist/slider/Slider.js +0 -319
  89. package/dist/slider/Slider.stories.js +0 -241
  90. package/dist/slider/readme.md +0 -64
  91. package/dist/spinner/Spinner.js +0 -381
  92. package/dist/spinner/Spinner.stories.js +0 -183
  93. package/dist/spinner/readme.md +0 -65
  94. package/dist/switch/Switch.js +0 -222
  95. package/dist/switch/Switch.stories.js +0 -134
  96. package/dist/switch/readme.md +0 -133
  97. package/dist/table/Table.js +0 -132
  98. package/dist/tabs/Tabs.js +0 -343
  99. package/dist/tabs/Tabs.stories.js +0 -130
  100. package/dist/tabs/readme.md +0 -78
  101. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  102. package/dist/tabs-for-sections/readme.md +0 -78
  103. package/dist/tag/Tag.js +0 -288
  104. package/dist/textarea/Textarea.js +0 -264
  105. package/dist/toggle/Toggle.js +0 -220
  106. package/dist/toggle/Toggle.stories.js +0 -297
  107. package/dist/toggle/readme.md +0 -80
  108. package/dist/toggle-group/ToggleGroup.js +0 -223
  109. package/dist/upload/Upload.js +0 -205
  110. package/dist/upload/Upload.stories.js +0 -72
  111. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  112. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  113. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  114. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  115. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  116. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  117. package/dist/upload/file-upload/FileToUpload.js +0 -184
  118. package/dist/upload/file-upload/audio-icon.svg +0 -4
  119. package/dist/upload/file-upload/close.svg +0 -4
  120. package/dist/upload/file-upload/file-icon.svg +0 -4
  121. package/dist/upload/file-upload/video-icon.svg +0 -4
  122. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  123. package/dist/upload/readme.md +0 -37
  124. package/dist/upload/transaction/Transaction.js +0 -175
  125. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  126. package/dist/upload/transaction/audio-icon.svg +0 -4
  127. package/dist/upload/transaction/error-icon.svg +0 -4
  128. package/dist/upload/transaction/file-icon-err.svg +0 -4
  129. package/dist/upload/transaction/file-icon.svg +0 -4
  130. package/dist/upload/transaction/image-icon-err.svg +0 -4
  131. package/dist/upload/transaction/image-icon.svg +0 -4
  132. package/dist/upload/transaction/success-icon.svg +0 -4
  133. package/dist/upload/transaction/video-icon-err.svg +0 -4
  134. package/dist/upload/transaction/video-icon.svg +0 -4
  135. package/dist/upload/transactions/Transactions.js +0 -138
  136. package/dist/useTheme.js +0 -22
  137. package/dist/wizard/Wizard.js +0 -411
  138. package/dist/wizard/invalid_icon.svg +0 -5
  139. package/dist/wizard/valid_icon.svg +0 -5
  140. package/dist/wizard/validation-wrong.svg +0 -6
  141. package/test/Accordion.test.js +0 -33
  142. package/test/AccordionGroup.test.js +0 -125
  143. package/test/Alert.test.js +0 -53
  144. package/test/Box.test.js +0 -10
  145. package/test/Button.test.js +0 -18
  146. package/test/Card.test.js +0 -30
  147. package/test/Checkbox.test.js +0 -45
  148. package/test/Chip.test.js +0 -25
  149. package/test/Date.test.js +0 -393
  150. package/test/Dialog.test.js +0 -23
  151. package/test/Dropdown.test.js +0 -145
  152. package/test/Footer.test.js +0 -99
  153. package/test/Header.test.js +0 -39
  154. package/test/Heading.test.js +0 -35
  155. package/test/InputText.test.js +0 -240
  156. package/test/Link.test.js +0 -43
  157. package/test/NewDate.test.js +0 -203
  158. package/test/NewInputText.test.js +0 -817
  159. package/test/NewTextarea.test.js +0 -201
  160. package/test/Number.test.js +0 -241
  161. package/test/Paginator.test.js +0 -177
  162. package/test/Password.test.js +0 -76
  163. package/test/ProgressBar.test.js +0 -35
  164. package/test/Radio.test.js +0 -37
  165. package/test/ResultsetTable.test.js +0 -329
  166. package/test/Select.test.js +0 -212
  167. package/test/Sidenav.test.js +0 -45
  168. package/test/Slider.test.js +0 -82
  169. package/test/Spinner.test.js +0 -32
  170. package/test/Switch.test.js +0 -45
  171. package/test/Table.test.js +0 -36
  172. package/test/Tabs.test.js +0 -109
  173. package/test/TabsForSections.test.js +0 -34
  174. package/test/Tag.test.js +0 -32
  175. package/test/TextArea.test.js +0 -52
  176. package/test/ToggleGroup.test.js +0 -81
  177. package/test/Upload.test.js +0 -60
  178. package/test/Wizard.test.js +0 -130
  179. package/test/mocks/pngMock.js +0 -1
  180. package/test/mocks/svgMock.js +0 -1
@@ -1,289 +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 _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
15
-
16
- var _react = _interopRequireDefault(require("react"));
17
-
18
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
19
-
20
- var _propTypes = _interopRequireDefault(require("prop-types"));
21
-
22
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
23
-
24
- var _Button = _interopRequireDefault(require("../button/Button"));
25
-
26
- var _Select = _interopRequireDefault(require("../select/Select"));
27
-
28
- var _previousPage = _interopRequireDefault(require("./images/previousPage.svg"));
29
-
30
- var _previous = _interopRequireDefault(require("./images/previous.svg"));
31
-
32
- var _next = _interopRequireDefault(require("./images/next.svg"));
33
-
34
- var _nextPage = _interopRequireDefault(require("./images/nextPage.svg"));
35
-
36
- var _BackgroundColorContext = require("../BackgroundColorContext.js");
37
-
38
- function _templateObject8() {
39
- var data = (0, _taggedTemplateLiteral2["default"])([""]);
40
-
41
- _templateObject8 = function _templateObject8() {
42
- return data;
43
- };
44
-
45
- return data;
46
- }
47
-
48
- function _templateObject7() {
49
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n margin-right: ", ";\n margin-left: ", ";\n\n label {\n height: 0px;\n }\n label + .MuiInput-formControl {\n margin-top: 0px;\n }\n"]);
50
-
51
- _templateObject7 = function _templateObject7() {
52
- return data;
53
- };
54
-
55
- return data;
56
- }
57
-
58
- function _templateObject6() {
59
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n width: 100%;\n justify-content: flex-end;\n align-items: center;\n margin: 0 ", " 0 ", ";\n"]);
60
-
61
- _templateObject6 = function _templateObject6() {
62
- return data;
63
- };
64
-
65
- return data;
66
- }
67
-
68
- function _templateObject5() {
69
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin-right: ", ";\n margin-left: ", ";\n"]);
70
-
71
- _templateObject5 = function _templateObject5() {
72
- return data;
73
- };
74
-
75
- return data;
76
- }
77
-
78
- function _templateObject4() {
79
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin-right: 10px;\n margin-left: 10px;\n"]);
80
-
81
- _templateObject4 = function _templateObject4() {
82
- return data;
83
- };
84
-
85
- return data;
86
- }
87
-
88
- function _templateObject3() {
89
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin-right: 15px;\n"]);
90
-
91
- _templateObject3 = function _templateObject3() {
92
- return data;
93
- };
94
-
95
- return data;
96
- }
97
-
98
- function _templateObject2() {
99
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n margin-right: ", ";\n margin-left: ", ";\n\n label {\n height: 0px;\n }\n label + .MuiInput-formControl {\n margin-top: 0px;\n }\n"]);
100
-
101
- _templateObject2 = function _templateObject2() {
102
- return data;
103
- };
104
-
105
- return data;
106
- }
107
-
108
- function _templateObject() {
109
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n height: ", ";\n width: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: ", ";\n text-transform: ", ";\n background-color: ", ";\n color: ", ";\n\n button {\n &:disabled {\n background-color: transparent !important;\n opacity: 0.3 !important;\n }\n }\n"]);
110
-
111
- _templateObject = function _templateObject() {
112
- return data;
113
- };
114
-
115
- return data;
116
- }
117
-
118
- var DxcPaginator = function DxcPaginator(_ref) {
119
- var _ref$currentPage = _ref.currentPage,
120
- currentPage = _ref$currentPage === void 0 ? 1 : _ref$currentPage,
121
- _ref$itemsPerPage = _ref.itemsPerPage,
122
- itemsPerPage = _ref$itemsPerPage === void 0 ? 5 : _ref$itemsPerPage,
123
- itemsPerPageOptions = _ref.itemsPerPageOptions,
124
- _ref$totalItems = _ref.totalItems,
125
- totalItems = _ref$totalItems === void 0 ? 1 : _ref$totalItems,
126
- showGoToPage = _ref.showGoToPage,
127
- onPageChange = _ref.onPageChange,
128
- itemsPerPageFunction = _ref.itemsPerPageFunction,
129
- _ref$tabIndex = _ref.tabIndex,
130
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
131
- var totalPages = Math.ceil(totalItems / itemsPerPage);
132
- var currentPageInternal = currentPage === -1 ? totalPages : currentPage;
133
- var minItemsPerPage = currentPageInternal === 1 || currentPageInternal === 0 ? currentPageInternal : (currentPageInternal - 1) * itemsPerPage + 1;
134
- var maxItemsPerPage = minItemsPerPage - 1 + itemsPerPage > totalItems ? totalItems : minItemsPerPage - 1 + itemsPerPage;
135
- var colorsTheme = (0, _useTheme["default"])();
136
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
137
- theme: colorsTheme.paginator
138
- }, _react["default"].createElement(_BackgroundColorContext.BackgroundColorProvider, {
139
- color: colorsTheme.paginator.backgroundColor
140
- }, _react["default"].createElement(DxcPaginatorContainer, {
141
- disabled: currentPageInternal === 1
142
- }, _react["default"].createElement(LabelsContainer, null, itemsPerPageOptions && _react["default"].createElement(ItemsPageContainer, null, _react["default"].createElement(ItemsLabel, null, "Items per page "), _react["default"].createElement(_Select["default"], {
143
- options: itemsPerPageOptions.map(function (num) {
144
- return {
145
- label: num,
146
- value: num
147
- };
148
- }),
149
- onChange: itemsPerPageFunction,
150
- value: itemsPerPage,
151
- size: "small",
152
- tabIndex: tabIndex
153
- })), _react["default"].createElement(TotalItemsContainer, null, minItemsPerPage, " to ", maxItemsPerPage, " of ", totalItems), onPageChange && _react["default"].createElement(_Button["default"], {
154
- size: "small",
155
- mode: "secondary",
156
- disabled: currentPageInternal === 1 || currentPageInternal === 0,
157
- margin: {
158
- left: "xxsmall",
159
- right: "xxsmall"
160
- },
161
- iconSrc: _previousPage["default"],
162
- tabIndex: tabIndex,
163
- onClick: function onClick() {
164
- onPageChange(1);
165
- }
166
- }), onPageChange && _react["default"].createElement(_Button["default"], {
167
- size: "small",
168
- mode: "secondary",
169
- disabled: currentPageInternal === 1 || currentPageInternal === 0,
170
- margin: {
171
- left: "xxsmall",
172
- right: "xxsmall"
173
- },
174
- iconSrc: _previous["default"],
175
- tabIndex: tabIndex,
176
- onClick: function onClick() {
177
- onPageChange(currentPage - 1);
178
- }
179
- }), showGoToPage && _react["default"].createElement(PageToSelectContainer, null, _react["default"].createElement(GoToLabel, null, "Go to page: "), _react["default"].createElement(_Select["default"], {
180
- options: (0, _toConsumableArray2["default"])(Array(totalPages).keys()).map(function (num) {
181
- return {
182
- label: num + 1,
183
- value: num + 1
184
- };
185
- }),
186
- onChange: onPageChange,
187
- value: currentPage,
188
- size: "small",
189
- tabIndex: tabIndex
190
- })) || _react["default"].createElement(TextContainer, null, "Page: ", currentPageInternal, " of ", totalPages), onPageChange && _react["default"].createElement(_Button["default"], {
191
- size: "small",
192
- mode: "secondary",
193
- disabled: currentPageInternal === totalPages,
194
- margin: {
195
- left: "xxsmall",
196
- right: "xxsmall"
197
- },
198
- iconSrc: _next["default"],
199
- tabIndex: tabIndex,
200
- onClick: function onClick() {
201
- onPageChange(currentPage + 1);
202
- }
203
- }), onPageChange && _react["default"].createElement(_Button["default"], {
204
- size: "small",
205
- mode: "secondary",
206
- disabled: currentPageInternal === totalPages,
207
- margin: {
208
- left: "xxsmall",
209
- right: "xxsmall"
210
- },
211
- iconSrc: _nextPage["default"],
212
- tabIndex: tabIndex,
213
- onClick: function onClick() {
214
- onPageChange(totalPages);
215
- }
216
- })))));
217
- };
218
-
219
- var DxcPaginatorContainer = _styledComponents["default"].div(_templateObject(), function (props) {
220
- return props.theme.height;
221
- }, function (props) {
222
- return props.theme.width;
223
- }, function (props) {
224
- return props.theme.fontFamily;
225
- }, function (props) {
226
- return props.theme.fontSize;
227
- }, function (props) {
228
- return props.theme.fontWeight;
229
- }, function (props) {
230
- return props.theme.fontStyle;
231
- }, function (props) {
232
- return props.theme.fontTextTransform;
233
- }, function (props) {
234
- return props.theme.backgroundColor;
235
- }, function (props) {
236
- return props.theme.fontColor;
237
- });
238
-
239
- var ItemsPageContainer = _styledComponents["default"].span(_templateObject2(), function (props) {
240
- return props.theme.itemsPerPageSelectorMarginRight;
241
- }, function (props) {
242
- return props.theme.itemsPerPageSelectorMarginLeft;
243
- });
244
-
245
- var ItemsLabel = _styledComponents["default"].span(_templateObject3());
246
-
247
- var GoToLabel = _styledComponents["default"].span(_templateObject4());
248
-
249
- var TotalItemsContainer = _styledComponents["default"].span(_templateObject5(), function (props) {
250
- return props.theme.totalItemsContainerMarginRight;
251
- }, function (props) {
252
- return props.theme.totalItemsContainerMarginLeft;
253
- });
254
-
255
- var LabelsContainer = _styledComponents["default"].div(_templateObject6(), function (props) {
256
- return props.theme.marginRight;
257
- }, function (props) {
258
- return props.theme.marginLeft;
259
- });
260
-
261
- var PageToSelectContainer = _styledComponents["default"].span(_templateObject7(), function (props) {
262
- return props.theme.pageSelectorMarginRight;
263
- }, function (props) {
264
- return props.theme.pageSelectorMarginLeft;
265
- });
266
-
267
- var TextContainer = _styledComponents["default"].span(_templateObject8());
268
-
269
- DxcPaginator.propTypes = {
270
- currentPage: _propTypes["default"].number,
271
- itemsPerPage: _propTypes["default"].number,
272
- itemsPerPageOptions: _propTypes["default"].arrayOf(_propTypes["default"].number),
273
- totalItems: _propTypes["default"].number.isRequired,
274
- showGoToPage: _propTypes["default"].bool,
275
- onPageChange: _propTypes["default"].func,
276
- itemsPerPageFunction: _propTypes["default"].func,
277
- tabIndex: _propTypes["default"].number
278
- };
279
- DxcPaginator.defaultProps = {
280
- currentPage: 1,
281
- itemsPerPage: 5,
282
- itemsPerPageOptions: null,
283
- showGoToPage: false,
284
- onPageChange: null,
285
- itemsPerPageFunction: null,
286
- tabIndex: 0
287
- };
288
- var _default = DxcPaginator;
289
- exports["default"] = _default;
@@ -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,200 +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 _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
15
-
16
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
-
18
- var _react = _interopRequireWildcard(require("react"));
19
-
20
- var _styledComponents = _interopRequireDefault(require("styled-components"));
21
-
22
- var _propTypes = _interopRequireDefault(require("prop-types"));
23
-
24
- var _NewInputText = _interopRequireDefault(require("../new-input-text/NewInputText"));
25
-
26
- var _variables = require("../common/variables.js");
27
-
28
- require("./styles.css");
29
-
30
- function _templateObject() {
31
- var data = (0, _taggedTemplateLiteral2["default"])([""]);
32
-
33
- _templateObject = function _templateObject() {
34
- return data;
35
- };
36
-
37
- return data;
38
- }
39
-
40
- var DxcPassword = _react["default"].forwardRef(function (_ref, ref) {
41
- var _ref$label = _ref.label,
42
- label = _ref$label === void 0 ? "" : _ref$label,
43
- _ref$name = _ref.name,
44
- name = _ref$name === void 0 ? "" : _ref$name,
45
- value = _ref.value,
46
- _ref$helperText = _ref.helperText,
47
- helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
48
- _ref$error = _ref.error,
49
- error = _ref$error === void 0 ? "" : _ref$error,
50
- _ref$clearable = _ref.clearable,
51
- clearable = _ref$clearable === void 0 ? false : _ref$clearable,
52
- onChange = _ref.onChange,
53
- onBlur = _ref.onBlur,
54
- margin = _ref.margin,
55
- pattern = _ref.pattern,
56
- length = _ref.length,
57
- _ref$autocomplete = _ref.autocomplete,
58
- autocomplete = _ref$autocomplete === void 0 ? "off" : _ref$autocomplete,
59
- _ref$size = _ref.size,
60
- size = _ref$size === void 0 ? "medium" : _ref$size,
61
- _ref$tabIndex = _ref.tabIndex,
62
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
63
-
64
- var _useState = (0, _react.useState)(false),
65
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
66
- isPasswordVisible = _useState2[0],
67
- setIsPasswordVisible = _useState2[1];
68
-
69
- var inputRef = (0, _react.useRef)(null);
70
-
71
- var setInputType = function setInputType(type) {
72
- var _inputRef$current, _inputRef$current$chi;
73
-
74
- inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : (_inputRef$current$chi = _inputRef$current.children[2]) === null || _inputRef$current$chi === void 0 ? void 0 : _inputRef$current$chi.children[0].setAttribute("type", type);
75
- };
76
-
77
- var setAriaAttributes = function setAriaAttributes(ariaExpanded, ariaLabel) {
78
- if (error && clearable && value) {
79
- var _inputRef$current2, _inputRef$current2$ch, _inputRef$current2$ch2, _inputRef$current3, _inputRef$current3$ch, _inputRef$current3$ch2;
80
-
81
- inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : (_inputRef$current2$ch = _inputRef$current2.children[2]) === null || _inputRef$current2$ch === void 0 ? void 0 : (_inputRef$current2$ch2 = _inputRef$current2$ch.children[3]) === null || _inputRef$current2$ch2 === void 0 ? void 0 : _inputRef$current2$ch2.setAttribute("aria-expanded", ariaExpanded);
82
- inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : (_inputRef$current3$ch = _inputRef$current3.children[2]) === null || _inputRef$current3$ch === void 0 ? void 0 : (_inputRef$current3$ch2 = _inputRef$current3$ch.children[3]) === null || _inputRef$current3$ch2 === void 0 ? void 0 : _inputRef$current3$ch2.setAttribute("aria-label", ariaLabel);
83
- } else if (error || clearable && !value) {
84
- var _inputRef$current4, _inputRef$current4$ch, _inputRef$current4$ch2, _inputRef$current5, _inputRef$current5$ch, _inputRef$current5$ch2;
85
-
86
- inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : (_inputRef$current4$ch = _inputRef$current4.children[2]) === null || _inputRef$current4$ch === void 0 ? void 0 : (_inputRef$current4$ch2 = _inputRef$current4$ch.children[2]) === null || _inputRef$current4$ch2 === void 0 ? void 0 : _inputRef$current4$ch2.setAttribute("aria-expanded", ariaExpanded);
87
- inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current5 = inputRef.current) === null || _inputRef$current5 === void 0 ? void 0 : (_inputRef$current5$ch = _inputRef$current5.children[2]) === null || _inputRef$current5$ch === void 0 ? void 0 : (_inputRef$current5$ch2 = _inputRef$current5$ch.children[2]) === null || _inputRef$current5$ch2 === void 0 ? void 0 : _inputRef$current5$ch2.setAttribute("aria-label", ariaLabel);
88
- } else {
89
- var _inputRef$current6, _inputRef$current6$ch, _inputRef$current6$ch2, _inputRef$current7, _inputRef$current7$ch, _inputRef$current7$ch2;
90
-
91
- inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current6 = inputRef.current) === null || _inputRef$current6 === void 0 ? void 0 : (_inputRef$current6$ch = _inputRef$current6.children[2]) === null || _inputRef$current6$ch === void 0 ? void 0 : (_inputRef$current6$ch2 = _inputRef$current6$ch.children[1]) === null || _inputRef$current6$ch2 === void 0 ? void 0 : _inputRef$current6$ch2.setAttribute("aria-expanded", ariaExpanded);
92
- inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current7 = inputRef.current) === null || _inputRef$current7 === void 0 ? void 0 : (_inputRef$current7$ch = _inputRef$current7.children[2]) === null || _inputRef$current7$ch === void 0 ? void 0 : (_inputRef$current7$ch2 = _inputRef$current7$ch.children[1]) === null || _inputRef$current7$ch2 === void 0 ? void 0 : _inputRef$current7$ch2.setAttribute("aria-label", ariaLabel);
93
- }
94
- };
95
-
96
- (0, _react.useEffect)(function () {
97
- setAriaAttributes(false, "Show");
98
-
99
- if (isPasswordVisible) {
100
- setInputType("text");
101
- setAriaAttributes(true, "Hide");
102
- } else {
103
- setInputType("password");
104
- setAriaAttributes(false, "Show");
105
- }
106
- }, [isPasswordVisible]);
107
-
108
- var viewPassword = function viewPassword() {
109
- setInputType("text");
110
- setIsPasswordVisible(true);
111
- };
112
-
113
- var hidePassword = function hidePassword() {
114
- setInputType("password");
115
- setIsPasswordVisible(false);
116
- };
117
-
118
- var action = {
119
- onClick: isPasswordVisible ? hidePassword : viewPassword,
120
- icon: isPasswordVisible ? _react["default"].createElement("svg", {
121
- xmlns: "http://www.w3.org/2000/svg",
122
- height: "24px",
123
- viewBox: "0 0 24 24",
124
- width: "24px",
125
- fill: "#000000"
126
- }, _react["default"].createElement("path", {
127
- d: "M0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0z",
128
- fill: "none"
129
- }), _react["default"].createElement("path", {
130
- 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"
131
- })) : _react["default"].createElement("svg", {
132
- xmlns: "http://www.w3.org/2000/svg",
133
- height: "24px",
134
- viewBox: "0 0 24 24",
135
- width: "24px",
136
- fill: "#000000"
137
- }, _react["default"].createElement("path", {
138
- d: "M0 0h24v24H0V0z",
139
- fill: "none"
140
- }), _react["default"].createElement("path", {
141
- 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"
142
- }))
143
- };
144
- return _react["default"].createElement(DXCPassword, {
145
- ref: ref
146
- }, _react["default"].createElement(_NewInputText["default"], {
147
- ref: inputRef,
148
- label: label,
149
- name: name,
150
- value: value,
151
- helperText: helperText,
152
- action: action,
153
- error: error,
154
- clearable: clearable,
155
- onChange: onChange,
156
- onBlur: onBlur,
157
- margin: margin,
158
- size: size,
159
- pattern: pattern,
160
- length: length,
161
- autocomplete: autocomplete,
162
- tabIndex: tabIndex
163
- }));
164
- });
165
-
166
- var sizes = {
167
- small: "240px",
168
- medium: "360px",
169
- large: "480px",
170
- fillParent: "100%"
171
- };
172
-
173
- var DXCPassword = _styledComponents["default"].div(_templateObject());
174
-
175
- DxcPassword.propTypes = {
176
- label: _propTypes["default"].string,
177
- name: _propTypes["default"].string,
178
- value: _propTypes["default"].string,
179
- helperText: _propTypes["default"].string,
180
- error: _propTypes["default"].string,
181
- clearable: _propTypes["default"].bool,
182
- onChange: _propTypes["default"].func,
183
- onBlur: _propTypes["default"].func,
184
- autocomplete: _propTypes["default"].string,
185
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
186
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
187
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
188
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
189
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
190
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
191
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
192
- pattern: _propTypes["default"].string,
193
- length: _propTypes["default"].shape({
194
- min: _propTypes["default"].number,
195
- max: _propTypes["default"].number
196
- }),
197
- tabIndex: _propTypes["default"].number
198
- };
199
- var _default = DxcPassword;
200
- exports["default"] = _default;
@@ -1,3 +0,0 @@
1
- ::-ms-reveal {
2
- display: none;
3
- }