@dxc-technology/halstack-react 0.0.0-8d633bd → 0.0.0-8d998c7

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 (282) hide show
  1. package/BackgroundColorContext.js +50 -0
  2. package/ThemeContext.js +246 -0
  3. package/{dist/select/Select.js → V3Select/V3Select.js} +38 -132
  4. package/V3Select/index.d.ts +27 -0
  5. package/{dist/textarea/Textarea.js → V3Textarea/V3Textarea.js} +14 -18
  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 +41 -154
  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 +16 -72
  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 +16 -63
  34. package/checkbox/types.d.ts +60 -0
  35. package/checkbox/types.js +5 -0
  36. package/{dist/chip → chip}/Chip.js +17 -61
  37. package/chip/index.d.ts +22 -0
  38. package/{dist/common → common}/OpenSans.css +0 -0
  39. package/{dist/common → common}/RequiredComponent.js +3 -11
  40. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  41. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  42. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  43. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  44. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  45. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  46. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  47. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  48. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  49. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  50. package/{dist/common → common}/utils.js +0 -0
  51. package/{dist/common → common}/variables.js +250 -98
  52. package/{dist/date → date}/Date.js +20 -28
  53. package/date/index.d.ts +27 -0
  54. package/date-input/DateInput.d.ts +4 -0
  55. package/{dist/new-date/NewDate.js → date-input/DateInput.js} +88 -130
  56. package/date-input/types.d.ts +100 -0
  57. package/date-input/types.js +5 -0
  58. package/{dist/dialog → dialog}/Dialog.js +16 -50
  59. package/dialog/index.d.ts +18 -0
  60. package/dropdown/Dropdown.d.ts +4 -0
  61. package/{dist/dropdown → dropdown}/Dropdown.js +44 -171
  62. package/dropdown/types.d.ts +89 -0
  63. package/dropdown/types.js +5 -0
  64. package/{dist/file-input → file-input}/FileInput.js +57 -166
  65. package/file-input/FileItem.js +193 -0
  66. package/file-input/index.d.ts +81 -0
  67. package/footer/Footer.d.ts +4 -0
  68. package/footer/Footer.js +266 -0
  69. package/footer/Icons.js +77 -0
  70. package/footer/types.d.ts +61 -0
  71. package/footer/types.js +5 -0
  72. package/header/Header.js +326 -0
  73. package/header/Icons.js +59 -0
  74. package/header/index.d.ts +25 -0
  75. package/{dist/heading → heading}/Heading.js +30 -72
  76. package/heading/index.d.ts +17 -0
  77. package/input-text/Icons.js +22 -0
  78. package/{dist/input-text → input-text}/InputText.js +37 -133
  79. package/input-text/index.d.ts +36 -0
  80. package/{dist/layout → layout}/ApplicationLayout.js +35 -131
  81. package/layout/Icons.js +55 -0
  82. package/{dist/link → link}/Link.js +18 -72
  83. package/link/index.d.ts +23 -0
  84. package/main.d.ts +44 -0
  85. package/{dist/main.js → main.js} +100 -96
  86. package/{dist/number/Number.js → number-input/NumberInput.js} +10 -20
  87. package/{dist/number/NumberContext.js → number-input/NumberInputContext.js} +2 -2
  88. package/number-input/index.d.ts +113 -0
  89. package/package.json +32 -25
  90. package/paginator/Icons.js +66 -0
  91. package/paginator/Paginator.d.ts +4 -0
  92. package/paginator/Paginator.js +198 -0
  93. package/paginator/types.d.ts +38 -0
  94. package/paginator/types.js +5 -0
  95. package/{dist/password/Password.js → password-input/PasswordInput.js} +29 -30
  96. package/password-input/PasswordInput.stories.jsx +131 -0
  97. package/password-input/index.d.ts +94 -0
  98. package/progress-bar/ProgressBar.d.ts +4 -0
  99. package/{dist/progress-bar → progress-bar}/ProgressBar.js +19 -91
  100. package/progress-bar/types.d.ts +37 -0
  101. package/progress-bar/types.js +5 -0
  102. package/radio/Radio.d.ts +4 -0
  103. package/{dist/radio → radio}/Radio.js +15 -50
  104. package/radio/types.d.ts +54 -0
  105. package/radio/types.js +5 -0
  106. package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +35 -119
  107. package/resultsetTable/index.d.ts +19 -0
  108. package/select/Select.js +865 -0
  109. package/select/index.d.ts +131 -0
  110. package/{dist/sidenav → sidenav}/Sidenav.js +15 -49
  111. package/sidenav/index.d.ts +13 -0
  112. package/slider/Slider.d.ts +4 -0
  113. package/{dist/slider → slider}/Slider.js +90 -103
  114. package/slider/types.d.ts +83 -0
  115. package/slider/types.js +5 -0
  116. package/{dist/spinner → spinner}/Spinner.js +38 -152
  117. package/spinner/index.d.ts +17 -0
  118. package/switch/Switch.d.ts +4 -0
  119. package/{dist/switch → switch}/Switch.js +26 -69
  120. package/switch/types.d.ts +58 -0
  121. package/switch/types.js +5 -0
  122. package/{dist/table → table}/Table.js +10 -24
  123. package/table/index.d.ts +13 -0
  124. package/tabs/Tabs.d.ts +4 -0
  125. package/tabs/Tabs.js +211 -0
  126. package/tabs/types.d.ts +71 -0
  127. package/tabs/types.js +5 -0
  128. package/{dist/tag → tag}/Tag.js +22 -96
  129. package/{dist/alert → tag}/index.d.ts +9 -11
  130. package/text-input/TextInput.js +825 -0
  131. package/text-input/index.d.ts +135 -0
  132. package/{dist/new-textarea/NewTextarea.js → textarea/Textarea.js} +73 -121
  133. package/textarea/Textarea.stories.jsx +135 -0
  134. package/textarea/index.d.ts +117 -0
  135. package/{dist/toggle → toggle}/Toggle.js +15 -49
  136. package/toggle/index.d.ts +21 -0
  137. package/toggle-group/ToggleGroup.js +243 -0
  138. package/toggle-group/index.d.ts +21 -0
  139. package/{dist/upload → upload}/Upload.js +11 -15
  140. package/upload/buttons-upload/ButtonsUpload.js +111 -0
  141. package/upload/buttons-upload/Icons.js +40 -0
  142. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  143. package/upload/dragAndDropArea/Icons.js +39 -0
  144. package/upload/file-upload/FileToUpload.js +115 -0
  145. package/upload/file-upload/Icons.js +66 -0
  146. package/{dist/upload → upload}/files-upload/FilesToUpload.js +12 -26
  147. package/upload/index.d.ts +15 -0
  148. package/upload/transaction/Icons.js +160 -0
  149. package/upload/transaction/Transaction.js +104 -0
  150. package/upload/transactions/Transactions.js +94 -0
  151. package/{dist/useTheme.js → useTheme.js} +0 -0
  152. package/wizard/Icons.js +65 -0
  153. package/{dist/wizard → wizard}/Wizard.js +32 -172
  154. package/wizard/index.d.ts +18 -0
  155. package/README.md +0 -66
  156. package/babel.config.js +0 -8
  157. package/dist/BackgroundColorContext.js +0 -46
  158. package/dist/ThemeContext.js +0 -240
  159. package/dist/accordion-group/AccordionGroup.js +0 -186
  160. package/dist/badge/Badge.js +0 -63
  161. package/dist/checkbox/Checkbox.stories.js +0 -144
  162. package/dist/checkbox/readme.md +0 -116
  163. package/dist/date/Date.stories.js +0 -205
  164. package/dist/date/readme.md +0 -73
  165. package/dist/file-input/FileItem.js +0 -263
  166. package/dist/footer/Footer.js +0 -395
  167. package/dist/footer/Footer.stories.js +0 -94
  168. package/dist/footer/dxc_logo.svg +0 -15
  169. package/dist/footer/readme.md +0 -41
  170. package/dist/header/Header.js +0 -403
  171. package/dist/header/Header.stories.js +0 -176
  172. package/dist/header/close_icon.svg +0 -1
  173. package/dist/header/dxc_logo_black.svg +0 -8
  174. package/dist/header/hamb_menu_black.svg +0 -1
  175. package/dist/header/hamb_menu_white.svg +0 -1
  176. package/dist/header/readme.md +0 -33
  177. package/dist/input-text/InputText.stories.js +0 -209
  178. package/dist/input-text/error.svg +0 -1
  179. package/dist/input-text/readme.md +0 -91
  180. package/dist/layout/facebook.svg +0 -45
  181. package/dist/layout/linkedin.svg +0 -50
  182. package/dist/layout/twitter.svg +0 -53
  183. package/dist/link/readme.md +0 -51
  184. package/dist/main.d.ts +0 -2
  185. package/dist/new-input-text/NewInputText.js +0 -977
  186. package/dist/paginator/Paginator.js +0 -289
  187. package/dist/paginator/images/next.svg +0 -3
  188. package/dist/paginator/images/nextPage.svg +0 -3
  189. package/dist/paginator/images/previous.svg +0 -3
  190. package/dist/paginator/images/previousPage.svg +0 -3
  191. package/dist/paginator/readme.md +0 -50
  192. package/dist/password/styles.css +0 -3
  193. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  194. package/dist/progress-bar/readme.md +0 -63
  195. package/dist/radio/Radio.stories.js +0 -166
  196. package/dist/radio/readme.md +0 -70
  197. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  198. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  199. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  200. package/dist/slider/Slider.stories.js +0 -241
  201. package/dist/slider/readme.md +0 -64
  202. package/dist/spinner/Spinner.stories.js +0 -183
  203. package/dist/spinner/readme.md +0 -65
  204. package/dist/switch/Switch.stories.js +0 -134
  205. package/dist/switch/readme.md +0 -133
  206. package/dist/tabs/Tabs.js +0 -343
  207. package/dist/tabs/Tabs.stories.js +0 -130
  208. package/dist/tabs/readme.md +0 -78
  209. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  210. package/dist/tabs-for-sections/readme.md +0 -78
  211. package/dist/toggle/Toggle.stories.js +0 -297
  212. package/dist/toggle/readme.md +0 -80
  213. package/dist/toggle-group/ToggleGroup.js +0 -223
  214. package/dist/upload/Upload.stories.js +0 -72
  215. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  216. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  217. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  218. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  219. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  220. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  221. package/dist/upload/file-upload/FileToUpload.js +0 -184
  222. package/dist/upload/file-upload/audio-icon.svg +0 -4
  223. package/dist/upload/file-upload/close.svg +0 -4
  224. package/dist/upload/file-upload/file-icon.svg +0 -4
  225. package/dist/upload/file-upload/video-icon.svg +0 -4
  226. package/dist/upload/readme.md +0 -37
  227. package/dist/upload/transaction/Transaction.js +0 -175
  228. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  229. package/dist/upload/transaction/audio-icon.svg +0 -4
  230. package/dist/upload/transaction/error-icon.svg +0 -4
  231. package/dist/upload/transaction/file-icon-err.svg +0 -4
  232. package/dist/upload/transaction/file-icon.svg +0 -4
  233. package/dist/upload/transaction/image-icon-err.svg +0 -4
  234. package/dist/upload/transaction/image-icon.svg +0 -4
  235. package/dist/upload/transaction/success-icon.svg +0 -4
  236. package/dist/upload/transaction/video-icon-err.svg +0 -4
  237. package/dist/upload/transaction/video-icon.svg +0 -4
  238. package/dist/upload/transactions/Transactions.js +0 -138
  239. package/dist/wizard/invalid_icon.svg +0 -5
  240. package/dist/wizard/valid_icon.svg +0 -5
  241. package/dist/wizard/validation-wrong.svg +0 -6
  242. package/test/Accordion.test.js +0 -33
  243. package/test/AccordionGroup.test.js +0 -125
  244. package/test/Alert.test.js +0 -53
  245. package/test/Box.test.js +0 -10
  246. package/test/Button.test.js +0 -18
  247. package/test/Card.test.js +0 -30
  248. package/test/Checkbox.test.js +0 -45
  249. package/test/Chip.test.js +0 -25
  250. package/test/Date.test.js +0 -393
  251. package/test/Dialog.test.js +0 -23
  252. package/test/Dropdown.test.js +0 -145
  253. package/test/FileInput.test.js +0 -39
  254. package/test/Footer.test.js +0 -99
  255. package/test/Header.test.js +0 -39
  256. package/test/Heading.test.js +0 -35
  257. package/test/InputText.test.js +0 -240
  258. package/test/Link.test.js +0 -43
  259. package/test/NewDate.test.js +0 -203
  260. package/test/NewInputText.test.js +0 -866
  261. package/test/NewTextarea.test.js +0 -252
  262. package/test/Number.test.js +0 -241
  263. package/test/Paginator.test.js +0 -177
  264. package/test/Password.test.js +0 -76
  265. package/test/ProgressBar.test.js +0 -35
  266. package/test/Radio.test.js +0 -37
  267. package/test/ResultsetTable.test.js +0 -329
  268. package/test/Select.test.js +0 -212
  269. package/test/Sidenav.test.js +0 -45
  270. package/test/Slider.test.js +0 -82
  271. package/test/Spinner.test.js +0 -32
  272. package/test/Switch.test.js +0 -45
  273. package/test/Table.test.js +0 -36
  274. package/test/Tabs.test.js +0 -109
  275. package/test/TabsForSections.test.js +0 -34
  276. package/test/Tag.test.js +0 -32
  277. package/test/TextArea.test.js +0 -52
  278. package/test/ToggleGroup.test.js +0 -81
  279. package/test/Upload.test.js +0 -60
  280. package/test/Wizard.test.js +0 -130
  281. package/test/mocks/pngMock.js +0 -1
  282. package/test/mocks/svgMock.js +0 -1
@@ -1,263 +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 _react = _interopRequireDefault(require("react"));
15
-
16
- var _propTypes = _interopRequireDefault(require("prop-types"));
17
-
18
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
19
-
20
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
21
-
22
- function _templateObject10() {
23
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n"]);
24
-
25
- _templateObject10 = function _templateObject10() {
26
- return data;
27
- };
28
-
29
- return data;
30
- }
31
-
32
- function _templateObject9() {
33
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n height: 24px;\n width: 24px;\n font-size: 1rem;\n font-family: ", ";\n border: 1px solid transparent;\n border-radius: 4px;\n margin-left: 4px;\n background-color: transparent;\n padding: 3px;\n cursor: pointer;\n svg {\n line-height: 18px;\n }\n"]);
34
-
35
- _templateObject9 = function _templateObject9() {
36
- return data;
37
- };
38
-
39
- return data;
40
- }
41
-
42
- function _templateObject8() {
43
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n padding: 3px;\n height: 18px;\n width: 18px;\n color: #d0011b;\n"]);
44
-
45
- _templateObject8 = function _templateObject8() {
46
- return data;
47
- };
48
-
49
- return data;
50
- }
51
-
52
- function _templateObject7() {
53
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n width: ", ";\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n"]);
54
-
55
- _templateObject7 = function _templateObject7() {
56
- return data;
57
- };
58
-
59
- return data;
60
- }
61
-
62
- function _templateObject6() {
63
- var data = (0, _taggedTemplateLiteral2["default"])([""]);
64
-
65
- _templateObject6 = function _templateObject6() {
66
- return data;
67
- };
68
-
69
- return data;
70
- }
71
-
72
- function _templateObject5() {
73
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 12px;\n background-color: ", ";\n width: 48px;\n height: 48px;\n border-radius: 2px;\n color: ", ";\n"]);
74
-
75
- _templateObject5 = function _templateObject5() {
76
- return data;
77
- };
78
-
79
- return data;
80
- }
81
-
82
- function _templateObject4() {
83
- var data = (0, _taggedTemplateLiteral2["default"])(["\n width: 48px;\n height: 48px;\n object-fit: contain;\n margin-right: 12px;\n border-radius: 2px;\n"]);
84
-
85
- _templateObject4 = function _templateObject4() {
86
- return data;
87
- };
88
-
89
- return data;
90
- }
91
-
92
- function _templateObject3() {
93
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: row;\n"]);
94
-
95
- _templateObject3 = function _templateObject3() {
96
- return data;
97
- };
98
-
99
- return data;
100
- }
101
-
102
- function _templateObject2() {
103
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: column;\n"]);
104
-
105
- _templateObject2 = function _templateObject2() {
106
- return data;
107
- };
108
-
109
- return data;
110
- }
111
-
112
- function _templateObject() {
113
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: row;\n padding: ", ";\n background-color: ", ";\n border-radius: ", ";\n width: ", ";\n height: ", ";\n border: ", "\n ", ";\n"]);
114
-
115
- _templateObject = function _templateObject() {
116
- return data;
117
- };
118
-
119
- return data;
120
- }
121
-
122
- var deleteIcon = _react["default"].createElement("svg", {
123
- xmlns: "http://www.w3.org/2000/svg",
124
- width: "24",
125
- height: "24",
126
- viewBox: "0 0 24 24",
127
- fill: "currentColor"
128
- }, _react["default"].createElement("path", {
129
- d: "M0 0h24v24H0V0z",
130
- fill: "none"
131
- }), _react["default"].createElement("path", {
132
- d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
133
- }));
134
-
135
- var errorIcon = _react["default"].createElement("svg", {
136
- xmlns: "http://www.w3.org/2000/svg",
137
- height: "24px",
138
- viewBox: "0 0 24 24",
139
- width: "24px",
140
- fill: "currentColor"
141
- }, _react["default"].createElement("path", {
142
- d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"
143
- }));
144
-
145
- var FileItem = function FileItem(_ref) {
146
- var mode = _ref.mode,
147
- multiple = _ref.multiple,
148
- _ref$name = _ref.name,
149
- name = _ref$name === void 0 ? "" : _ref$name,
150
- _ref$error = _ref.error,
151
- error = _ref$error === void 0 ? "" : _ref$error,
152
- showPreview = _ref.showPreview,
153
- preview = _ref.preview,
154
- type = _ref.type,
155
- numFiles = _ref.numFiles,
156
- onDelete = _ref.onDelete;
157
- var colorsTheme = (0, _useTheme["default"])();
158
- var isImage = type.includes("image");
159
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
160
- theme: colorsTheme.fileInput
161
- }, _react["default"].createElement(Container, {
162
- mode: mode,
163
- multiple: multiple,
164
- error: error,
165
- showPreview: showPreview,
166
- numFiles: numFiles
167
- }, showPreview && (isImage ? _react["default"].createElement(ImagePreview, {
168
- src: preview
169
- }) : _react["default"].createElement(IconPreviewContainer, {
170
- error: error
171
- }, _react["default"].createElement(IconPreview, {
172
- error: error
173
- }, preview))), _react["default"].createElement(FileItemContent, null, _react["default"].createElement(FileItemContainer, null, _react["default"].createElement(FileName, {
174
- mode: mode,
175
- multiple: multiple,
176
- error: error,
177
- showPreview: showPreview,
178
- numFiles: numFiles
179
- }, name), error && _react["default"].createElement(ErrorIcon, {
180
- "aria-label": "Error"
181
- }, errorIcon), _react["default"].createElement(DeleteIcon, {
182
- onClick: function onClick() {
183
- return onDelete(name);
184
- },
185
- "aria-label": "Remove"
186
- }, deleteIcon)), error && (multiple || numFiles > 1) && _react["default"].createElement(ErrorMessage, null, error))));
187
- };
188
-
189
- var Container = _styledComponents["default"].div(_templateObject(), function (props) {
190
- return props.showPreview ? "8px" : "8px 8px 8px 16px";
191
- }, function (props) {
192
- return props.error && props.theme.errorFileItemBackgroundColor;
193
- }, function (props) {
194
- return props.theme.fileItemBorderRadius;
195
- }, function (props) {
196
- return props.mode === "file" && !props.multiple && props.numFiles === 1 ? "calc(230px - 26px)" : !props.showPreview ? "calc(320px - 26px)" : props.showPreview && "calc(320px - 18px)";
197
- }, function (props) {
198
- return props.mode === "file" && !props.multiple && props.numFiles === 1 || !props.showPreview && !props.error ? "calc(40px - 18px)" : !props.showPreview && props.error ? "calc(59px - 18px)" : "calc(64px - 18px)";
199
- }, function (props) {
200
- return props.error ? props.theme.errorFileItemBorderColor : props.theme.fileItemBorderColor;
201
- }, function (props) {
202
- return props.theme.fileItemBorder;
203
- });
204
-
205
- var FileItemContent = _styledComponents["default"].div(_templateObject2());
206
-
207
- var FileItemContainer = _styledComponents["default"].div(_templateObject3());
208
-
209
- var ImagePreview = _styledComponents["default"].img(_templateObject4());
210
-
211
- var IconPreviewContainer = _styledComponents["default"].div(_templateObject5(), function (props) {
212
- return props.error ? "#ffccd3" : "#f2f2f2";
213
- }, function (props) {
214
- return props.error ? "#d0011b" : "#808080";
215
- });
216
-
217
- var IconPreview = _styledComponents["default"].div(_templateObject6());
218
-
219
- var FileName = _styledComponents["default"].span(_templateObject7(), function (props) {
220
- return props.theme.fileNameFontColor;
221
- }, function (props) {
222
- return props.mode === "file" && !props.multiple && props.error && props.numFiles === 1 ? "calc(230px - 76px)" : props.mode === "file" && !props.multiple && !props.error && props.numFiles === 1 ? "calc(230px - 50px)" : !props.showPreview && !props.error ? "calc(320px - 52px)" : !props.showPreview && props.error ? "calc(320px - 76px)" : props.showPreview && props.error ? "calc(320px - 128px)" : props.showPreview && !props.error && "calc(320px - 102px)";
223
- }, function (props) {
224
- return props.theme.fileItemFontFamily;
225
- }, function (props) {
226
- return props.theme.fileItemFontSize;
227
- }, function (props) {
228
- return props.theme.fileItemFontWeight;
229
- }, function (props) {
230
- return props.theme.fileItemLineHeight;
231
- });
232
-
233
- var ErrorIcon = _styledComponents["default"].span(_templateObject8());
234
-
235
- var DeleteIcon = _styledComponents["default"].button(_templateObject9(), function (props) {
236
- return props.theme.fontFamily;
237
- });
238
-
239
- var ErrorMessage = _styledComponents["default"].span(_templateObject10(), function (props) {
240
- return props.theme.errorMessageFontColor;
241
- }, function (props) {
242
- return props.theme.errorMessageFontFamily;
243
- }, function (props) {
244
- return props.theme.errorMessageFontSize;
245
- }, function (props) {
246
- return props.theme.errorMessageFontWeight;
247
- }, function (props) {
248
- return props.theme.errorMessageLineHeight;
249
- });
250
-
251
- FileItem.propTypes = {
252
- mode: _propTypes["default"].string,
253
- multiple: _propTypes["default"].bool,
254
- name: _propTypes["default"].string,
255
- type: _propTypes["default"].string,
256
- showPreview: _propTypes["default"]["boolean"],
257
- numFiles: _propTypes["default"].number,
258
- preview: _propTypes["default"].string,
259
- error: _propTypes["default"].string,
260
- onDelete: _propTypes["default"].func
261
- };
262
- var _default = FileItem;
263
- exports["default"] = _default;
@@ -1,395 +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 _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
17
-
18
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
19
-
20
- var _react = _interopRequireWildcard(require("react"));
21
-
22
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
23
-
24
- var _propTypes = _interopRequireDefault(require("prop-types"));
25
-
26
- var _variables = require("../common/variables.js");
27
-
28
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
29
-
30
- var _BackgroundColorContext = require("../BackgroundColorContext.js");
31
-
32
- function _templateObject12() {
33
- var data = (0, _taggedTemplateLiteral2["default"])(["\n text-decoration: ", ";\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n"]);
34
-
35
- _templateObject12 = function _templateObject12() {
36
- return data;
37
- };
38
-
39
- return data;
40
- }
41
-
42
- function _templateObject11() {
43
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin: 0px 10px;\n color: ", ";\n"]);
44
-
45
- _templateObject11 = function _templateObject11() {
46
- return data;
47
- };
48
-
49
- return data;
50
- }
51
-
52
- function _templateObject10() {
53
- var data = (0, _taggedTemplateLiteral2["default"])(["\n & {\n display: inline-flex;\n height: ", ";\n width: ", ";\n color: ", ";\n }\n\n overflow: hidden;\n\n img,\n svg {\n height: 100%;\n width: 100%;\n }\n"]);
54
-
55
- _templateObject10 = function _templateObject10() {
56
- return data;
57
- };
58
-
59
- return data;
60
- }
61
-
62
- function _templateObject9() {
63
- var data = (0, _taggedTemplateLiteral2["default"])(["\n & {\n display: inline-flex;\n height: ", ";\n width: ", ";\n fill: ", ";\n }\n"]);
64
-
65
- _templateObject9 = function _templateObject9() {
66
- return data;
67
- };
68
-
69
- return data;
70
- }
71
-
72
- function _templateObject8() {
73
- var data = (0, _taggedTemplateLiteral2["default"])(["\n & {\n display: inline-flex;\n margin-left: ", ";\n }\n"]);
74
-
75
- _templateObject8 = function _templateObject8() {
76
- return data;
77
- };
78
-
79
- return data;
80
- }
81
-
82
- function _templateObject7() {
83
- var data = (0, _taggedTemplateLiteral2["default"])(["\n max-height: ", ";\n width: ", ";\n"]);
84
-
85
- _templateObject7 = function _templateObject7() {
86
- return data;
87
- };
88
-
89
- return data;
90
- }
91
-
92
- function _templateObject6() {
93
- var data = (0, _taggedTemplateLiteral2["default"])(["\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n color: ", ";\n max-width: ", ";\n width: ", ";\n text-align: ", ";\n padding-top: ", ";\n"]);
94
-
95
- _templateObject6 = function _templateObject6() {
96
- return data;
97
- };
98
-
99
- return data;
100
- }
101
-
102
- function _templateObject5() {
103
- var data = (0, _taggedTemplateLiteral2["default"])(["\n min-height: 15px;\n padding: ", ";\n padding-top: ", ";\n padding-right: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n overflow: hidden;\n"]);
104
-
105
- _templateObject5 = function _templateObject5() {
106
- return data;
107
- };
108
-
109
- return data;
110
- }
111
-
112
- function _templateObject4() {
113
- var data = (0, _taggedTemplateLiteral2["default"])(["\n padding-top: ", ";\n display: inline-flex;\n flex-wrap: wrap;\n max-width: ", ";\n width: ", ";\n & > span:last-child span {\n display: none;\n }\n margin: ", ";\n"]);
114
-
115
- _templateObject4 = function _templateObject4() {
116
- return data;
117
- };
118
-
119
- return data;
120
- }
121
-
122
- function _templateObject3() {
123
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n justify-content: space-between;\n align-items: flex-end;\n flex-direction: ", ";\n align-items: ", ";\n border-top: ", ";\n"]);
124
-
125
- _templateObject3 = function _templateObject3() {
126
- return data;
127
- };
128
-
129
- return data;
130
- }
131
-
132
- function _templateObject2() {
133
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n justify-content: space-between;\n"]);
134
-
135
- _templateObject2 = function _templateObject2() {
136
- return data;
137
- };
138
-
139
- return data;
140
- }
141
-
142
- function _templateObject() {
143
- var data = (0, _taggedTemplateLiteral2["default"])(["\n padding: ", ";\n background-color: ", ";\n margin-top: ", ";\n width: 100%;\n box-sizing: border-box;\n min-height: ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n"]);
144
-
145
- _templateObject = function _templateObject() {
146
- return data;
147
- };
148
-
149
- return data;
150
- }
151
-
152
- var DxcFooter = function DxcFooter(_ref) {
153
- var _ref$socialLinks = _ref.socialLinks,
154
- socialLinks = _ref$socialLinks === void 0 ? [] : _ref$socialLinks,
155
- _ref$bottomLinks = _ref.bottomLinks,
156
- bottomLinks = _ref$bottomLinks === void 0 ? [] : _ref$bottomLinks,
157
- _ref$copyright = _ref.copyright,
158
- copyright = _ref$copyright === void 0 ? "" : _ref$copyright,
159
- _ref$logoSrc = _ref.logoSrc,
160
- logoSrc = _ref$logoSrc === void 0 ? "default" : _ref$logoSrc,
161
- children = _ref.children,
162
- padding = _ref.padding,
163
- margin = _ref.margin,
164
- _ref$tabIndex = _ref.tabIndex,
165
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
166
- var ref = (0, _react.useRef)(null);
167
-
168
- var _useState = (0, _react.useState)(),
169
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
170
- refSize = _useState2[0],
171
- setRefSize = _useState2[1];
172
-
173
- var _useState3 = (0, _react.useState)(false),
174
- _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
175
- isResponsiveTablet = _useState4[0],
176
- setIsResponsiveTablet = _useState4[1];
177
-
178
- var _useState5 = (0, _react.useState)(false),
179
- _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
180
- isResponsivePhone = _useState6[0],
181
- setIsResponsivePhone = _useState6[1];
182
-
183
- var colorsTheme = (0, _useTheme["default"])();
184
-
185
- var handleResize = function handleResize(refWidth) {
186
- if (ref.current) {
187
- setRefSize(refWidth);
188
-
189
- if (refWidth <= _variables.responsiveSizes.tablet && refWidth > _variables.responsiveSizes.mobileLarge) {
190
- setIsResponsiveTablet(true);
191
- setIsResponsivePhone(false);
192
- } else if (refWidth <= _variables.responsiveSizes.tablet && refWidth <= _variables.responsiveSizes.mobileLarge) {
193
- setIsResponsivePhone(true);
194
- setIsResponsiveTablet(false);
195
- } else {
196
- setIsResponsiveTablet(false);
197
- setIsResponsivePhone(false);
198
- }
199
- }
200
- };
201
-
202
- var handleEventListener = function handleEventListener() {
203
- handleResize(ref.current.offsetWidth);
204
- };
205
-
206
- (0, _react.useEffect)(function () {
207
- window.addEventListener("resize", handleEventListener);
208
- handleResize(ref.current.offsetWidth);
209
- return function () {
210
- window.removeEventListener("resize", handleEventListener);
211
- };
212
- }, []);
213
- var socialLink = socialLinks.map(function (link, index) {
214
- return _react["default"].createElement(SocialAnchor, {
215
- tabIndex: tabIndex,
216
- key: "social".concat(index).concat(link.href),
217
- index: index,
218
- href: link && link.href ? link.href : ""
219
- }, link.logo ? _react["default"].createElement(SocialIconContainer, null, (0, _typeof2["default"])(link.logo) === "object" ? link.logo : _react["default"].createElement(link.logo)) : link && link.logoSrc && _react["default"].createElement(SocialIcon, {
220
- src: link.logoSrc
221
- }));
222
- });
223
- var bottomLink = bottomLinks.map(function (link, index) {
224
- return _react["default"].createElement("span", {
225
- key: "bottom".concat(index).concat(link.text)
226
- }, _react["default"].createElement(BottomLink, {
227
- tabIndex: tabIndex,
228
- href: link && link.href ? link.href : ""
229
- }, link && link.text ? link.text : ""), _react["default"].createElement(Point, {
230
- index: index
231
- }, "\xB7"));
232
- });
233
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
234
- theme: colorsTheme.footer
235
- }, _react["default"].createElement(FooterContainer, {
236
- margin: margin,
237
- refSize: refSize,
238
- ref: ref
239
- }, _react["default"].createElement(FooterHeader, null, _react["default"].createElement(LogoIcon, {
240
- logoSrc: logoSrc,
241
- src: logoSrc === "default" ? colorsTheme.footer.logo : logoSrc
242
- }), _react["default"].createElement("div", null, socialLink)), isResponsivePhone && _react["default"].createElement("div", null, _react["default"].createElement(FooterFooter, {
243
- className: "footerFooter",
244
- refSize: refSize
245
- }, _react["default"].createElement(BottomLinks, {
246
- refSize: refSize
247
- }, bottomLink), _react["default"].createElement(Copyright, {
248
- refSize: refSize
249
- }, copyright))), (!isResponsiveTablet && !isResponsivePhone || isResponsiveTablet) && _react["default"].createElement("div", null, _react["default"].createElement(ChildComponents, {
250
- padding: padding
251
- }, _react["default"].createElement(_BackgroundColorContext.BackgroundColorProvider, {
252
- color: colorsTheme.footer.backgroundColor
253
- }, children)), _react["default"].createElement(FooterFooter, {
254
- className: "footerFooter"
255
- }, _react["default"].createElement(BottomLinks, {
256
- refSize: refSize
257
- }, bottomLink), _react["default"].createElement(Copyright, {
258
- refSize: refSize
259
- }, copyright)))));
260
- };
261
-
262
- var FooterContainer = _styledComponents["default"].footer(_templateObject(), function (props) {
263
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "20px 20px 20px 20px" : "24px 36px 24px 36px";
264
- }, function (props) {
265
- return props.theme.backgroundColor;
266
- }, function (props) {
267
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
268
- }, function (props) {
269
- return props.theme.height;
270
- });
271
-
272
- var FooterHeader = _styledComponents["default"].div(_templateObject2());
273
-
274
- var FooterFooter = _styledComponents["default"].div(_templateObject3(), function (props) {
275
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "column" : "row";
276
- }, function (props) {
277
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "center" : "";
278
- }, function (props) {
279
- return "".concat(props.theme.bottomLinksDividerThickness, " ").concat(props.theme.bottomLinksDividerStyle, " ").concat(props.theme.bottomLinksDividerColor);
280
- });
281
-
282
- var BottomLinks = _styledComponents["default"].div(_templateObject4(), function (props) {
283
- return props.theme.bottomLinksDividerSpacing;
284
- }, function (props) {
285
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "100%" : "60%";
286
- }, function (props) {
287
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "100%" : "";
288
- }, function (props) {
289
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "40px 0 40px 0" : "";
290
- });
291
-
292
- var ChildComponents = _styledComponents["default"].div(_templateObject5(), function (props) {
293
- return props.padding && (0, _typeof2["default"])(props.padding) !== "object" ? _variables.spaces[props.padding] : "0px";
294
- }, function (props) {
295
- return props.padding && (0, _typeof2["default"])(props.padding) === "object" && props.padding.top ? _variables.spaces[props.padding.top] : "";
296
- }, function (props) {
297
- return props.padding && (0, _typeof2["default"])(props.padding) === "object" && props.padding.right ? _variables.spaces[props.padding.right] : "";
298
- }, function (props) {
299
- return props.padding && (0, _typeof2["default"])(props.padding) === "object" && props.padding.bottom ? _variables.spaces[props.padding.bottom] : "";
300
- }, function (props) {
301
- return props.padding && (0, _typeof2["default"])(props.padding) === "object" && props.padding.left ? _variables.spaces[props.padding.left] : "";
302
- });
303
-
304
- var Copyright = _styledComponents["default"].div(_templateObject6(), function (props) {
305
- return props.theme.copyrightFontFamily;
306
- }, function (props) {
307
- return props.theme.copyrightFontSize;
308
- }, function (props) {
309
- return props.theme.copyrightFontStyle;
310
- }, function (props) {
311
- return props.theme.copyrightFontWeight;
312
- }, function (props) {
313
- return props.theme.copyrightFontColor;
314
- }, function (props) {
315
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "100%" : "40%";
316
- }, function (props) {
317
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "100%" : "";
318
- }, function (props) {
319
- return props.refSize <= _variables.responsiveSizes.mobileLarge ? "center" : "right";
320
- }, function (props) {
321
- return props.theme.bottomLinksDividerSpacing;
322
- });
323
-
324
- var LogoIcon = _styledComponents["default"].img(_templateObject7(), function (props) {
325
- return props.theme.logoHeight;
326
- }, function (props) {
327
- return props.theme.logoWidth;
328
- });
329
-
330
- var SocialAnchor = _styledComponents["default"].a(_templateObject8(), function (props) {
331
- return props.index === 0 ? "0px" : props.theme.socialLinksGutter;
332
- });
333
-
334
- var SocialIcon = _styledComponents["default"].img(_templateObject9(), function (props) {
335
- return props.theme.socialLinksSize;
336
- }, function (props) {
337
- return props.theme.socialLinksSize;
338
- }, function (props) {
339
- return props.theme.socialLinksColor;
340
- });
341
-
342
- var SocialIconContainer = _styledComponents["default"].div(_templateObject10(), function (props) {
343
- return props.theme.socialLinksSize;
344
- }, function (props) {
345
- return props.theme.socialLinksSize;
346
- }, function (props) {
347
- return props.theme.socialLinksColor;
348
- });
349
-
350
- var Point = _styledComponents["default"].span(_templateObject11(), function (props) {
351
- return props.theme.bottomLinksFontColor;
352
- });
353
-
354
- var BottomLink = _styledComponents["default"].a(_templateObject12(), function (props) {
355
- return props.theme.bottomLinksTextDecoration;
356
- }, function (props) {
357
- return props.theme.bottomLinksFontColor;
358
- }, function (props) {
359
- return props.theme.bottomLinksFontFamily;
360
- }, function (props) {
361
- return props.theme.bottomLinksFontSize;
362
- }, function (props) {
363
- return props.theme.bottomLinksFontStyle;
364
- }, function (props) {
365
- return props.theme.bottomLinksFontWeight;
366
- });
367
-
368
- DxcFooter.propTypes = {
369
- logoSrc: _propTypes["default"].string,
370
- socialLinks: _propTypes["default"].arrayOf(_propTypes["default"].shape({
371
- logo: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
372
- logoSrc: _propTypes["default"].string.isRequired,
373
- href: _propTypes["default"].string
374
- })),
375
- bottomLinks: _propTypes["default"].arrayOf(_propTypes["default"].shape({
376
- text: _propTypes["default"].string.isRequired,
377
- href: _propTypes["default"].string
378
- })),
379
- copyright: _propTypes["default"].string,
380
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
381
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
382
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
383
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
384
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
385
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
386
- padding: _propTypes["default"].oneOfType([_propTypes["default"].shape({
387
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
388
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
389
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
390
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
391
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
392
- tabIndex: _propTypes["default"].number
393
- };
394
- var _default = DxcFooter;
395
- exports["default"] = _default;