@dxc-technology/halstack-react 0.0.0-228c4cf → 0.0.0-2509c58

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 (226) hide show
  1. package/BackgroundColorContext.js +50 -0
  2. package/ThemeContext.js +246 -0
  3. package/{dist/V3Select → V3Select}/V3Select.js +33 -127
  4. package/V3Select/index.d.ts +27 -0
  5. package/{dist/V3Textarea → V3Textarea}/V3Textarea.js +10 -14
  6. package/V3Textarea/index.d.ts +27 -0
  7. package/accordion/Accordion.d.ts +4 -0
  8. package/{dist/accordion → accordion}/Accordion.js +35 -130
  9. package/accordion/types.d.ts +68 -0
  10. package/accordion/types.js +5 -0
  11. package/accordion-group/AccordionGroup.d.ts +7 -0
  12. package/accordion-group/AccordionGroup.js +170 -0
  13. package/accordion-group/types.d.ts +72 -0
  14. package/accordion-group/types.js +5 -0
  15. package/alert/Alert.d.ts +4 -0
  16. package/{dist/alert → alert}/Alert.js +38 -151
  17. package/alert/types.d.ts +49 -0
  18. package/alert/types.js +5 -0
  19. package/badge/Badge.js +59 -0
  20. package/{dist/box → box}/Box.js +9 -13
  21. package/box/Box.stories.jsx +132 -0
  22. package/box/index.d.ts +25 -0
  23. package/button/Button.d.ts +4 -0
  24. package/{dist/button → button}/Button.js +15 -71
  25. package/button/Button.stories.tsx +293 -0
  26. package/button/types.d.ts +57 -0
  27. package/button/types.js +5 -0
  28. package/card/Card.d.ts +4 -0
  29. package/{dist/card → card}/Card.js +32 -121
  30. package/card/types.d.ts +69 -0
  31. package/card/types.js +5 -0
  32. package/checkbox/Checkbox.d.ts +4 -0
  33. package/{dist/checkbox → checkbox}/Checkbox.js +13 -59
  34. package/checkbox/Checkbox.stories.tsx +192 -0
  35. package/checkbox/types.d.ts +60 -0
  36. package/checkbox/types.js +5 -0
  37. package/{dist/chip → chip}/Chip.js +17 -61
  38. package/chip/index.d.ts +22 -0
  39. package/{dist/common → common}/OpenSans.css +0 -0
  40. package/{dist/common → common}/RequiredComponent.js +3 -11
  41. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  42. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  43. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  44. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  45. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  46. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  47. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  48. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  49. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  50. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  51. package/{dist/common → common}/utils.js +0 -0
  52. package/{dist/common → common}/variables.js +40 -45
  53. package/{dist/date → date}/Date.js +21 -27
  54. package/date/index.d.ts +27 -0
  55. package/date-input/DateInput.d.ts +4 -0
  56. package/{dist/date-input → date-input}/DateInput.js +22 -61
  57. package/date-input/types.d.ts +100 -0
  58. package/date-input/types.js +5 -0
  59. package/dialog/Dialog.d.ts +4 -0
  60. package/{dist/dialog → dialog}/Dialog.js +20 -73
  61. package/dialog/types.d.ts +43 -0
  62. package/dialog/types.js +5 -0
  63. package/dropdown/Dropdown.d.ts +4 -0
  64. package/{dist/dropdown → dropdown}/Dropdown.js +44 -171
  65. package/dropdown/types.d.ts +89 -0
  66. package/dropdown/types.js +5 -0
  67. package/{dist/file-input → file-input}/FileInput.js +49 -161
  68. package/{dist/file-input → file-input}/FileItem.js +29 -123
  69. package/{dist/file-input → file-input}/index.d.ts +1 -1
  70. package/footer/Footer.d.ts +4 -0
  71. package/{dist/footer → footer}/Footer.js +38 -193
  72. package/footer/Footer.stories.jsx +151 -0
  73. package/{dist/footer → footer}/Icons.js +13 -13
  74. package/footer/types.d.ts +61 -0
  75. package/footer/types.js +5 -0
  76. package/header/Header.d.ts +7 -0
  77. package/{dist/header → header}/Header.js +60 -206
  78. package/{dist/header → header}/Icons.js +7 -32
  79. package/header/types.d.ts +45 -0
  80. package/header/types.js +5 -0
  81. package/{dist/heading → heading}/Heading.js +18 -72
  82. package/heading/index.d.ts +17 -0
  83. package/{dist/input-text → input-text}/Icons.js +2 -2
  84. package/{dist/input-text → input-text}/InputText.js +36 -130
  85. package/input-text/index.d.ts +36 -0
  86. package/{dist/layout → layout}/ApplicationLayout.js +31 -123
  87. package/{dist/layout → layout}/Icons.js +7 -7
  88. package/{dist/link → link}/Link.js +18 -72
  89. package/link/index.d.ts +23 -0
  90. package/main.d.ts +44 -0
  91. package/{dist/main.js → main.js} +91 -87
  92. package/{dist/number-input → number-input}/NumberInput.js +5 -13
  93. package/number-input/NumberInput.stories.jsx +115 -0
  94. package/{dist/number-input → number-input}/NumberInputContext.js +1 -1
  95. package/{dist/number-input → number-input}/index.d.ts +0 -0
  96. package/package.json +28 -17
  97. package/{dist/paginator → paginator}/Icons.js +9 -9
  98. package/paginator/Paginator.d.ts +4 -0
  99. package/paginator/Paginator.js +198 -0
  100. package/paginator/Paginator.stories.tsx +63 -0
  101. package/paginator/types.d.ts +38 -0
  102. package/paginator/types.js +5 -0
  103. package/{dist/password-input → password-input}/PasswordInput.js +17 -21
  104. package/password-input/PasswordInput.stories.jsx +131 -0
  105. package/{dist/password-input → password-input}/index.d.ts +0 -0
  106. package/progress-bar/ProgressBar.d.ts +4 -0
  107. package/{dist/progress-bar → progress-bar}/ProgressBar.js +20 -92
  108. package/progress-bar/types.d.ts +37 -0
  109. package/progress-bar/types.js +5 -0
  110. package/radio/Radio.d.ts +4 -0
  111. package/{dist/radio → radio}/Radio.js +15 -50
  112. package/radio/Radio.stories.tsx +192 -0
  113. package/radio/types.d.ts +54 -0
  114. package/radio/types.js +5 -0
  115. package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +35 -119
  116. package/resultsetTable/index.d.ts +19 -0
  117. package/{dist/select → select}/Select.js +261 -465
  118. package/select/index.d.ts +131 -0
  119. package/{dist/sidenav → sidenav}/Sidenav.js +15 -49
  120. package/sidenav/index.d.ts +13 -0
  121. package/slider/Slider.d.ts +4 -0
  122. package/{dist/slider → slider}/Slider.js +45 -143
  123. package/slider/types.d.ts +83 -0
  124. package/slider/types.js +5 -0
  125. package/spinner/Spinner.d.ts +4 -0
  126. package/spinner/Spinner.js +250 -0
  127. package/spinner/Spinner.stories.jsx +102 -0
  128. package/spinner/types.d.ts +32 -0
  129. package/spinner/types.js +5 -0
  130. package/switch/Switch.d.ts +4 -0
  131. package/{dist/switch → switch}/Switch.js +26 -69
  132. package/switch/types.d.ts +58 -0
  133. package/switch/types.js +5 -0
  134. package/table/Table.d.ts +4 -0
  135. package/{dist/table → table}/Table.js +10 -24
  136. package/table/Table.stories.jsx +276 -0
  137. package/table/types.d.ts +21 -0
  138. package/table/types.js +5 -0
  139. package/tabs/Tabs.d.ts +4 -0
  140. package/tabs/Tabs.js +211 -0
  141. package/tabs/types.d.ts +71 -0
  142. package/tabs/types.js +5 -0
  143. package/{dist/tag → tag}/Tag.js +22 -96
  144. package/tag/index.d.ts +24 -0
  145. package/{dist/text-input → text-input}/TextInput.js +241 -390
  146. package/{dist/text-input → text-input}/index.d.ts +2 -2
  147. package/{dist/textarea → textarea}/Textarea.js +20 -72
  148. package/textarea/Textarea.stories.jsx +135 -0
  149. package/{dist/textarea → textarea}/index.d.ts +0 -0
  150. package/{dist/toggle → toggle}/Toggle.js +15 -49
  151. package/toggle/index.d.ts +21 -0
  152. package/{dist/toggle-group → toggle-group}/ToggleGroup.js +23 -107
  153. package/toggle-group/index.d.ts +21 -0
  154. package/{dist/upload → upload}/Upload.js +14 -18
  155. package/{dist/upload → upload}/buttons-upload/ButtonsUpload.js +13 -37
  156. package/{dist/upload → upload}/buttons-upload/Icons.js +7 -7
  157. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  158. package/{dist/upload → upload}/dragAndDropArea/Icons.js +6 -6
  159. package/upload/file-upload/FileToUpload.js +115 -0
  160. package/{dist/upload → upload}/file-upload/Icons.js +13 -13
  161. package/{dist/upload → upload}/files-upload/FilesToUpload.js +12 -26
  162. package/upload/index.d.ts +15 -0
  163. package/{dist/upload → upload}/transaction/Icons.js +31 -31
  164. package/upload/transaction/Transaction.js +104 -0
  165. package/upload/transactions/Transactions.js +94 -0
  166. package/{dist/useTheme.js → useTheme.js} +0 -0
  167. package/{dist/wizard → wizard}/Icons.js +8 -8
  168. package/{dist/wizard → wizard}/Wizard.js +31 -165
  169. package/wizard/index.d.ts +18 -0
  170. package/README.md +0 -66
  171. package/babel.config.js +0 -8
  172. package/dist/BackgroundColorContext.js +0 -46
  173. package/dist/ThemeContext.js +0 -250
  174. package/dist/accordion-group/AccordionGroup.js +0 -186
  175. package/dist/alert/index.d.ts +0 -51
  176. package/dist/badge/Badge.js +0 -63
  177. package/dist/date-input/index.d.ts +0 -95
  178. package/dist/main.d.ts +0 -8
  179. package/dist/paginator/Paginator.js +0 -283
  180. package/dist/select/index.d.ts +0 -53
  181. package/dist/spinner/Spinner.js +0 -381
  182. package/dist/tabs/Tabs.js +0 -343
  183. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  184. package/dist/upload/file-upload/FileToUpload.js +0 -189
  185. package/dist/upload/transaction/Transaction.js +0 -148
  186. package/dist/upload/transactions/Transactions.js +0 -138
  187. package/test/Accordion.test.js +0 -33
  188. package/test/AccordionGroup.test.js +0 -125
  189. package/test/Alert.test.js +0 -53
  190. package/test/Box.test.js +0 -10
  191. package/test/Button.test.js +0 -18
  192. package/test/Card.test.js +0 -30
  193. package/test/Checkbox.test.js +0 -45
  194. package/test/Chip.test.js +0 -25
  195. package/test/Date.test.js +0 -397
  196. package/test/DateInput.test.js +0 -242
  197. package/test/Dialog.test.js +0 -23
  198. package/test/Dropdown.test.js +0 -145
  199. package/test/FileInput.test.js +0 -201
  200. package/test/Footer.test.js +0 -94
  201. package/test/Header.test.js +0 -34
  202. package/test/Heading.test.js +0 -83
  203. package/test/InputText.test.js +0 -248
  204. package/test/Link.test.js +0 -43
  205. package/test/NumberInput.test.js +0 -259
  206. package/test/Paginator.test.js +0 -177
  207. package/test/PasswordInput.test.js +0 -83
  208. package/test/ProgressBar.test.js +0 -35
  209. package/test/Radio.test.js +0 -37
  210. package/test/ResultsetTable.test.js +0 -329
  211. package/test/Sidenav.test.js +0 -45
  212. package/test/Slider.test.js +0 -74
  213. package/test/Spinner.test.js +0 -32
  214. package/test/Switch.test.js +0 -45
  215. package/test/Table.test.js +0 -36
  216. package/test/Tabs.test.js +0 -109
  217. package/test/Tag.test.js +0 -32
  218. package/test/TextInput.test.js +0 -732
  219. package/test/Textarea.test.js +0 -193
  220. package/test/ToggleGroup.test.js +0 -85
  221. package/test/Upload.test.js +0 -60
  222. package/test/V3Select.test.js +0 -212
  223. package/test/V3TextArea.test.js +0 -51
  224. package/test/Wizard.test.js +0 -130
  225. package/test/mocks/pngMock.js +0 -1
  226. package/test/mocks/svgMock.js +0 -1
@@ -1,95 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- /**
12
- * Text to be placed above the date.
13
- */
14
- label?: string;
15
- /**
16
- * Name attribute of the input element.
17
- */
18
- name?: string;
19
- /**
20
- * Value of the input element. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
21
- */
22
- value?: string;
23
- /**
24
- * The format in which the date value will be displayed. User must use this format when editing the value or it will be considered as an invalid date.
25
- */
26
- format?: string;
27
- /**
28
- * Helper text to be placed above the date.
29
- */
30
- helperText?: string;
31
- /**
32
- * If true, the date format will appear as placeholder in the field.
33
- */
34
- placeholder?: boolean;
35
- /**
36
- * If true, the date input will have an action to clear the entered value.
37
- */
38
- clearable?: boolean;
39
- /**
40
- * If true, the component will be disabled.
41
- */
42
- disabled?: boolean;
43
- /**
44
- * If true, the date will be optional, showing '(Optional)'
45
- * next to the label. Otherwise, the field will be considered required and an error will be
46
- * passed as a parameter to the OnBlur and onChange functions when it has
47
- * not been filled.
48
- */
49
- optional?: boolean;
50
- /**
51
- * This function will be called when the user types within the input
52
- * element of the component. An object including the string value, the
53
- * error and the date value will be passed to this function.
54
- * If the string value is a valid date, error will
55
- * be null. Also, if the string value is not a valid date, date will be null.
56
- */
57
- onChange?: (val: { value: string; error: string; date: Date }) => void;
58
- /**
59
- * This function will be called when the input element loses the focus.
60
- * An object including the string value, the error and the date value
61
- * will be passed to this function. If the string value is a valid date, error will
62
- * be null. Also, if the string value is not a valid date, date will be null.
63
- */
64
- onBlur?: (val: { value: string; error: string; date: Date }) => void;
65
- /**
66
- * If it is defined, the component will change its appearance, showing
67
- * the error below the date input component. If it is not defined, the error
68
- * messages will be managed internally, but never displayed on its own.
69
- */
70
- error?: string;
71
- /**
72
- * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the input value.
73
- * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
74
- */
75
- autocomplete?: string;
76
- /**
77
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
78
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
79
- */
80
- margin?: Space | Margin;
81
- /**
82
- * Size of the component ('medium' | 'large' | 'fillParent').
83
- */
84
- size?: Size;
85
- /**
86
- * Value of the tabindex attribute.
87
- */
88
- tabIndex?: number;
89
- /**
90
- * Reference to the component.
91
- */
92
- ref?: React.RefObject<HTMLDivElement>;
93
- };
94
-
95
- export default function DxcDateInput(props: Props): JSX.Element;
package/dist/main.d.ts DELETED
@@ -1,8 +0,0 @@
1
- export { default as DxcAlert } from "./alert/index";
2
- export { default as DxcSelect } from "./select/index";
3
- export { default as DxcTextInput } from "./text-input/index";
4
- export { default as DxcDateInput } from "./date-input/index";
5
- export { default as DxcTextarea } from "./textarea/index";
6
- export { default as DxcNumberInput } from "./number-input/index";
7
- export { default as DxcPasswordInput } from "./password-input/index";
8
- export { default as DxcFileInput } from "./file-input/index";
@@ -1,283 +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 _V3Select = _interopRequireDefault(require("../V3Select/V3Select"));
27
-
28
- var _Icons = require("./Icons");
29
-
30
- var _BackgroundColorContext = require("../BackgroundColorContext.js");
31
-
32
- function _templateObject8() {
33
- var data = (0, _taggedTemplateLiteral2["default"])([""]);
34
-
35
- _templateObject8 = function _templateObject8() {
36
- return data;
37
- };
38
-
39
- return data;
40
- }
41
-
42
- function _templateObject7() {
43
- 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"]);
44
-
45
- _templateObject7 = function _templateObject7() {
46
- return data;
47
- };
48
-
49
- return data;
50
- }
51
-
52
- function _templateObject6() {
53
- 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"]);
54
-
55
- _templateObject6 = function _templateObject6() {
56
- return data;
57
- };
58
-
59
- return data;
60
- }
61
-
62
- function _templateObject5() {
63
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin-right: ", ";\n margin-left: ", ";\n"]);
64
-
65
- _templateObject5 = function _templateObject5() {
66
- return data;
67
- };
68
-
69
- return data;
70
- }
71
-
72
- function _templateObject4() {
73
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin-right: 10px;\n margin-left: 10px;\n"]);
74
-
75
- _templateObject4 = function _templateObject4() {
76
- return data;
77
- };
78
-
79
- return data;
80
- }
81
-
82
- function _templateObject3() {
83
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin-right: 15px;\n"]);
84
-
85
- _templateObject3 = function _templateObject3() {
86
- return data;
87
- };
88
-
89
- return data;
90
- }
91
-
92
- function _templateObject2() {
93
- 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"]);
94
-
95
- _templateObject2 = function _templateObject2() {
96
- return data;
97
- };
98
-
99
- return data;
100
- }
101
-
102
- function _templateObject() {
103
- 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"]);
104
-
105
- _templateObject = function _templateObject() {
106
- return data;
107
- };
108
-
109
- return data;
110
- }
111
-
112
- var DxcPaginator = function DxcPaginator(_ref) {
113
- var _ref$currentPage = _ref.currentPage,
114
- currentPage = _ref$currentPage === void 0 ? 1 : _ref$currentPage,
115
- _ref$itemsPerPage = _ref.itemsPerPage,
116
- itemsPerPage = _ref$itemsPerPage === void 0 ? 5 : _ref$itemsPerPage,
117
- itemsPerPageOptions = _ref.itemsPerPageOptions,
118
- _ref$totalItems = _ref.totalItems,
119
- totalItems = _ref$totalItems === void 0 ? 1 : _ref$totalItems,
120
- showGoToPage = _ref.showGoToPage,
121
- onPageChange = _ref.onPageChange,
122
- itemsPerPageFunction = _ref.itemsPerPageFunction,
123
- _ref$tabIndex = _ref.tabIndex,
124
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
125
- var totalPages = Math.ceil(totalItems / itemsPerPage);
126
- var currentPageInternal = currentPage === -1 ? totalPages : currentPage;
127
- var minItemsPerPage = currentPageInternal === 1 || currentPageInternal === 0 ? currentPageInternal : (currentPageInternal - 1) * itemsPerPage + 1;
128
- var maxItemsPerPage = minItemsPerPage - 1 + itemsPerPage > totalItems ? totalItems : minItemsPerPage - 1 + itemsPerPage;
129
- var colorsTheme = (0, _useTheme["default"])();
130
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
131
- theme: colorsTheme.paginator
132
- }, _react["default"].createElement(_BackgroundColorContext.BackgroundColorProvider, {
133
- color: colorsTheme.paginator.backgroundColor
134
- }, _react["default"].createElement(DxcPaginatorContainer, {
135
- disabled: currentPageInternal === 1
136
- }, _react["default"].createElement(LabelsContainer, null, itemsPerPageOptions && _react["default"].createElement(ItemsPageContainer, null, _react["default"].createElement(ItemsLabel, null, "Items per page "), _react["default"].createElement(_V3Select["default"], {
137
- options: itemsPerPageOptions.map(function (num) {
138
- return {
139
- label: num,
140
- value: num
141
- };
142
- }),
143
- onChange: itemsPerPageFunction,
144
- value: itemsPerPage,
145
- size: "small",
146
- tabIndex: tabIndex
147
- })), _react["default"].createElement(TotalItemsContainer, null, minItemsPerPage, " to ", maxItemsPerPage, " of ", totalItems), onPageChange && _react["default"].createElement(_Button["default"], {
148
- size: "small",
149
- mode: "secondary",
150
- disabled: currentPageInternal === 1 || currentPageInternal === 0,
151
- margin: {
152
- left: "xxsmall",
153
- right: "xxsmall"
154
- },
155
- icon: _Icons.firstIcon,
156
- tabIndex: tabIndex,
157
- onClick: function onClick() {
158
- onPageChange(1);
159
- }
160
- }), onPageChange && _react["default"].createElement(_Button["default"], {
161
- size: "small",
162
- mode: "secondary",
163
- disabled: currentPageInternal === 1 || currentPageInternal === 0,
164
- margin: {
165
- left: "xxsmall",
166
- right: "xxsmall"
167
- },
168
- icon: _Icons.previousIcon,
169
- tabIndex: tabIndex,
170
- onClick: function onClick() {
171
- onPageChange(currentPage - 1);
172
- }
173
- }), showGoToPage && _react["default"].createElement(PageToSelectContainer, null, _react["default"].createElement(GoToLabel, null, "Go to page: "), _react["default"].createElement(_V3Select["default"], {
174
- options: (0, _toConsumableArray2["default"])(Array(totalPages).keys()).map(function (num) {
175
- return {
176
- label: num + 1,
177
- value: num + 1
178
- };
179
- }),
180
- onChange: onPageChange,
181
- value: currentPage,
182
- size: "small",
183
- tabIndex: tabIndex
184
- })) || _react["default"].createElement(TextContainer, null, "Page: ", currentPageInternal, " of ", totalPages), onPageChange && _react["default"].createElement(_Button["default"], {
185
- size: "small",
186
- mode: "secondary",
187
- disabled: currentPageInternal === totalPages,
188
- margin: {
189
- left: "xxsmall",
190
- right: "xxsmall"
191
- },
192
- icon: _Icons.nextIcon,
193
- tabIndex: tabIndex,
194
- onClick: function onClick() {
195
- onPageChange(currentPage + 1);
196
- }
197
- }), onPageChange && _react["default"].createElement(_Button["default"], {
198
- size: "small",
199
- mode: "secondary",
200
- disabled: currentPageInternal === totalPages,
201
- margin: {
202
- left: "xxsmall",
203
- right: "xxsmall"
204
- },
205
- icon: _Icons.lastIcon,
206
- tabIndex: tabIndex,
207
- onClick: function onClick() {
208
- onPageChange(totalPages);
209
- }
210
- })))));
211
- };
212
-
213
- var DxcPaginatorContainer = _styledComponents["default"].div(_templateObject(), function (props) {
214
- return props.theme.height;
215
- }, function (props) {
216
- return props.theme.width;
217
- }, function (props) {
218
- return props.theme.fontFamily;
219
- }, function (props) {
220
- return props.theme.fontSize;
221
- }, function (props) {
222
- return props.theme.fontWeight;
223
- }, function (props) {
224
- return props.theme.fontStyle;
225
- }, function (props) {
226
- return props.theme.fontTextTransform;
227
- }, function (props) {
228
- return props.theme.backgroundColor;
229
- }, function (props) {
230
- return props.theme.fontColor;
231
- });
232
-
233
- var ItemsPageContainer = _styledComponents["default"].span(_templateObject2(), function (props) {
234
- return props.theme.itemsPerPageSelectorMarginRight;
235
- }, function (props) {
236
- return props.theme.itemsPerPageSelectorMarginLeft;
237
- });
238
-
239
- var ItemsLabel = _styledComponents["default"].span(_templateObject3());
240
-
241
- var GoToLabel = _styledComponents["default"].span(_templateObject4());
242
-
243
- var TotalItemsContainer = _styledComponents["default"].span(_templateObject5(), function (props) {
244
- return props.theme.totalItemsContainerMarginRight;
245
- }, function (props) {
246
- return props.theme.totalItemsContainerMarginLeft;
247
- });
248
-
249
- var LabelsContainer = _styledComponents["default"].div(_templateObject6(), function (props) {
250
- return props.theme.marginRight;
251
- }, function (props) {
252
- return props.theme.marginLeft;
253
- });
254
-
255
- var PageToSelectContainer = _styledComponents["default"].span(_templateObject7(), function (props) {
256
- return props.theme.pageSelectorMarginRight;
257
- }, function (props) {
258
- return props.theme.pageSelectorMarginLeft;
259
- });
260
-
261
- var TextContainer = _styledComponents["default"].span(_templateObject8());
262
-
263
- DxcPaginator.propTypes = {
264
- currentPage: _propTypes["default"].number,
265
- itemsPerPage: _propTypes["default"].number,
266
- itemsPerPageOptions: _propTypes["default"].arrayOf(_propTypes["default"].number),
267
- totalItems: _propTypes["default"].number.isRequired,
268
- showGoToPage: _propTypes["default"].bool,
269
- onPageChange: _propTypes["default"].func,
270
- itemsPerPageFunction: _propTypes["default"].func,
271
- tabIndex: _propTypes["default"].number
272
- };
273
- DxcPaginator.defaultProps = {
274
- currentPage: 1,
275
- itemsPerPage: 5,
276
- itemsPerPageOptions: null,
277
- showGoToPage: false,
278
- onPageChange: null,
279
- itemsPerPageFunction: null,
280
- tabIndex: 0
281
- };
282
- var _default = DxcPaginator;
283
- exports["default"] = _default;
@@ -1,53 +0,0 @@
1
- type SVG = string | (HTMLElement & SVGElement);
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type OptionGroup = {
11
- label: string;
12
- options: Option[];
13
- };
14
- type Option = {
15
- icon?: string | SVG;
16
- label: string;
17
- value: string;
18
- };
19
-
20
- type Props = {
21
- label?: string;
22
- name?: string;
23
- value?: string | string[];
24
- options?: Option[] | OptionGroup[];
25
- helperText?: string;
26
- placeholder?: string;
27
- disabled?: boolean;
28
- optional?: boolean;
29
- searchable?: boolean;
30
- multiple?: boolean;
31
- onChange?: (value: string | string[]) => void;
32
- onBlur?: (val: { value: string | string[]; error: string }) => void;
33
- error?: string;
34
- /**
35
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
36
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
37
- */
38
- margin?: Space | Margin;
39
- /**
40
- * Size of the component ('small' | 'medium' | 'large' | 'fillParent').
41
- */
42
- size?: "small" | "medium" | "large" | "fillParent";
43
- /**
44
- * Value of the tabindex attribute.
45
- */
46
- tabIndex?: number;
47
- /**
48
- * Reference to the component.
49
- */
50
- ref?: React.RefObject<HTMLDivElement>;
51
- };
52
-
53
- export default function DxcSelect(props: Props): JSX.Element;