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

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 (288) 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/dialog/Dialog.d.ts +4 -0
  59. package/{dist/dialog → dialog}/Dialog.js +20 -73
  60. package/dialog/types.d.ts +43 -0
  61. package/dialog/types.js +5 -0
  62. package/dropdown/Dropdown.d.ts +4 -0
  63. package/{dist/dropdown → dropdown}/Dropdown.js +44 -171
  64. package/dropdown/types.d.ts +89 -0
  65. package/dropdown/types.js +5 -0
  66. package/{dist/file-input → file-input}/FileInput.js +57 -166
  67. package/file-input/FileItem.js +193 -0
  68. package/file-input/index.d.ts +81 -0
  69. package/footer/Footer.d.ts +4 -0
  70. package/footer/Footer.js +266 -0
  71. package/footer/Footer.stories.jsx +151 -0
  72. package/footer/Icons.js +77 -0
  73. package/footer/types.d.ts +61 -0
  74. package/footer/types.js +5 -0
  75. package/header/Header.js +326 -0
  76. package/header/Icons.js +59 -0
  77. package/header/index.d.ts +25 -0
  78. package/{dist/heading → heading}/Heading.js +30 -72
  79. package/heading/index.d.ts +17 -0
  80. package/input-text/Icons.js +22 -0
  81. package/{dist/input-text → input-text}/InputText.js +37 -133
  82. package/input-text/index.d.ts +36 -0
  83. package/{dist/layout → layout}/ApplicationLayout.js +35 -131
  84. package/layout/Icons.js +55 -0
  85. package/{dist/link → link}/Link.js +18 -72
  86. package/link/index.d.ts +23 -0
  87. package/main.d.ts +44 -0
  88. package/{dist/main.js → main.js} +100 -96
  89. package/{dist/number/Number.js → number-input/NumberInput.js} +10 -20
  90. package/number-input/NumberInput.stories.jsx +115 -0
  91. package/{dist/number/NumberContext.js → number-input/NumberInputContext.js} +2 -2
  92. package/number-input/index.d.ts +113 -0
  93. package/package.json +32 -25
  94. package/paginator/Icons.js +66 -0
  95. package/paginator/Paginator.d.ts +4 -0
  96. package/paginator/Paginator.js +198 -0
  97. package/paginator/Paginator.stories.tsx +63 -0
  98. package/paginator/types.d.ts +38 -0
  99. package/paginator/types.js +5 -0
  100. package/{dist/password/Password.js → password-input/PasswordInput.js} +29 -30
  101. package/password-input/PasswordInput.stories.jsx +131 -0
  102. package/password-input/index.d.ts +94 -0
  103. package/progress-bar/ProgressBar.d.ts +4 -0
  104. package/{dist/progress-bar → progress-bar}/ProgressBar.js +20 -92
  105. package/progress-bar/types.d.ts +37 -0
  106. package/progress-bar/types.js +5 -0
  107. package/radio/Radio.d.ts +4 -0
  108. package/{dist/radio → radio}/Radio.js +15 -50
  109. package/radio/types.d.ts +54 -0
  110. package/radio/types.js +5 -0
  111. package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +35 -119
  112. package/resultsetTable/index.d.ts +19 -0
  113. package/select/Select.js +865 -0
  114. package/select/index.d.ts +131 -0
  115. package/{dist/sidenav → sidenav}/Sidenav.js +15 -49
  116. package/sidenav/index.d.ts +13 -0
  117. package/slider/Slider.d.ts +4 -0
  118. package/{dist/slider → slider}/Slider.js +90 -103
  119. package/slider/types.d.ts +83 -0
  120. package/slider/types.js +5 -0
  121. package/{dist/spinner → spinner}/Spinner.js +43 -157
  122. package/spinner/index.d.ts +17 -0
  123. package/switch/Switch.d.ts +4 -0
  124. package/{dist/switch → switch}/Switch.js +26 -69
  125. package/switch/types.d.ts +58 -0
  126. package/switch/types.js +5 -0
  127. package/{dist/table → table}/Table.js +10 -24
  128. package/table/Table.stories.jsx +276 -0
  129. package/table/index.d.ts +13 -0
  130. package/tabs/Tabs.d.ts +4 -0
  131. package/tabs/Tabs.js +211 -0
  132. package/tabs/types.d.ts +71 -0
  133. package/tabs/types.js +5 -0
  134. package/{dist/tag → tag}/Tag.js +22 -96
  135. package/{dist/alert → tag}/index.d.ts +9 -11
  136. package/text-input/TextInput.js +825 -0
  137. package/text-input/index.d.ts +135 -0
  138. package/{dist/new-textarea/NewTextarea.js → textarea/Textarea.js} +73 -121
  139. package/textarea/Textarea.stories.jsx +135 -0
  140. package/textarea/index.d.ts +117 -0
  141. package/{dist/toggle → toggle}/Toggle.js +15 -49
  142. package/toggle/index.d.ts +21 -0
  143. package/toggle-group/ToggleGroup.js +243 -0
  144. package/toggle-group/index.d.ts +21 -0
  145. package/{dist/upload → upload}/Upload.js +11 -15
  146. package/upload/buttons-upload/ButtonsUpload.js +111 -0
  147. package/upload/buttons-upload/Icons.js +40 -0
  148. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  149. package/upload/dragAndDropArea/Icons.js +39 -0
  150. package/upload/file-upload/FileToUpload.js +115 -0
  151. package/upload/file-upload/Icons.js +66 -0
  152. package/{dist/upload → upload}/files-upload/FilesToUpload.js +12 -26
  153. package/upload/index.d.ts +15 -0
  154. package/upload/transaction/Icons.js +160 -0
  155. package/upload/transaction/Transaction.js +104 -0
  156. package/upload/transactions/Transactions.js +94 -0
  157. package/{dist/useTheme.js → useTheme.js} +0 -0
  158. package/wizard/Icons.js +65 -0
  159. package/{dist/wizard → wizard}/Wizard.js +32 -172
  160. package/wizard/index.d.ts +18 -0
  161. package/README.md +0 -66
  162. package/babel.config.js +0 -8
  163. package/dist/BackgroundColorContext.js +0 -46
  164. package/dist/ThemeContext.js +0 -240
  165. package/dist/accordion-group/AccordionGroup.js +0 -186
  166. package/dist/badge/Badge.js +0 -63
  167. package/dist/checkbox/Checkbox.stories.js +0 -144
  168. package/dist/checkbox/readme.md +0 -116
  169. package/dist/date/Date.stories.js +0 -205
  170. package/dist/date/readme.md +0 -73
  171. package/dist/file-input/FileItem.js +0 -263
  172. package/dist/footer/Footer.js +0 -395
  173. package/dist/footer/Footer.stories.js +0 -94
  174. package/dist/footer/dxc_logo.svg +0 -15
  175. package/dist/footer/readme.md +0 -41
  176. package/dist/header/Header.js +0 -403
  177. package/dist/header/Header.stories.js +0 -176
  178. package/dist/header/close_icon.svg +0 -1
  179. package/dist/header/dxc_logo_black.svg +0 -8
  180. package/dist/header/hamb_menu_black.svg +0 -1
  181. package/dist/header/hamb_menu_white.svg +0 -1
  182. package/dist/header/readme.md +0 -33
  183. package/dist/input-text/InputText.stories.js +0 -209
  184. package/dist/input-text/error.svg +0 -1
  185. package/dist/input-text/readme.md +0 -91
  186. package/dist/layout/facebook.svg +0 -45
  187. package/dist/layout/linkedin.svg +0 -50
  188. package/dist/layout/twitter.svg +0 -53
  189. package/dist/link/readme.md +0 -51
  190. package/dist/main.d.ts +0 -2
  191. package/dist/new-input-text/NewInputText.js +0 -977
  192. package/dist/paginator/Paginator.js +0 -289
  193. package/dist/paginator/images/next.svg +0 -3
  194. package/dist/paginator/images/nextPage.svg +0 -3
  195. package/dist/paginator/images/previous.svg +0 -3
  196. package/dist/paginator/images/previousPage.svg +0 -3
  197. package/dist/paginator/readme.md +0 -50
  198. package/dist/password/styles.css +0 -3
  199. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  200. package/dist/progress-bar/readme.md +0 -63
  201. package/dist/radio/Radio.stories.js +0 -166
  202. package/dist/radio/readme.md +0 -70
  203. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  204. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  205. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  206. package/dist/slider/Slider.stories.js +0 -241
  207. package/dist/slider/readme.md +0 -64
  208. package/dist/spinner/Spinner.stories.js +0 -183
  209. package/dist/spinner/readme.md +0 -65
  210. package/dist/switch/Switch.stories.js +0 -134
  211. package/dist/switch/readme.md +0 -133
  212. package/dist/tabs/Tabs.js +0 -343
  213. package/dist/tabs/Tabs.stories.js +0 -130
  214. package/dist/tabs/readme.md +0 -78
  215. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  216. package/dist/tabs-for-sections/readme.md +0 -78
  217. package/dist/toggle/Toggle.stories.js +0 -297
  218. package/dist/toggle/readme.md +0 -80
  219. package/dist/toggle-group/ToggleGroup.js +0 -223
  220. package/dist/upload/Upload.stories.js +0 -72
  221. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  222. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  223. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  224. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  225. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  226. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  227. package/dist/upload/file-upload/FileToUpload.js +0 -184
  228. package/dist/upload/file-upload/audio-icon.svg +0 -4
  229. package/dist/upload/file-upload/close.svg +0 -4
  230. package/dist/upload/file-upload/file-icon.svg +0 -4
  231. package/dist/upload/file-upload/video-icon.svg +0 -4
  232. package/dist/upload/readme.md +0 -37
  233. package/dist/upload/transaction/Transaction.js +0 -175
  234. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  235. package/dist/upload/transaction/audio-icon.svg +0 -4
  236. package/dist/upload/transaction/error-icon.svg +0 -4
  237. package/dist/upload/transaction/file-icon-err.svg +0 -4
  238. package/dist/upload/transaction/file-icon.svg +0 -4
  239. package/dist/upload/transaction/image-icon-err.svg +0 -4
  240. package/dist/upload/transaction/image-icon.svg +0 -4
  241. package/dist/upload/transaction/success-icon.svg +0 -4
  242. package/dist/upload/transaction/video-icon-err.svg +0 -4
  243. package/dist/upload/transaction/video-icon.svg +0 -4
  244. package/dist/upload/transactions/Transactions.js +0 -138
  245. package/dist/wizard/invalid_icon.svg +0 -5
  246. package/dist/wizard/valid_icon.svg +0 -5
  247. package/dist/wizard/validation-wrong.svg +0 -6
  248. package/test/Accordion.test.js +0 -33
  249. package/test/AccordionGroup.test.js +0 -125
  250. package/test/Alert.test.js +0 -53
  251. package/test/Box.test.js +0 -10
  252. package/test/Button.test.js +0 -18
  253. package/test/Card.test.js +0 -30
  254. package/test/Checkbox.test.js +0 -45
  255. package/test/Chip.test.js +0 -25
  256. package/test/Date.test.js +0 -393
  257. package/test/Dialog.test.js +0 -23
  258. package/test/Dropdown.test.js +0 -145
  259. package/test/FileInput.test.js +0 -39
  260. package/test/Footer.test.js +0 -99
  261. package/test/Header.test.js +0 -39
  262. package/test/Heading.test.js +0 -35
  263. package/test/InputText.test.js +0 -240
  264. package/test/Link.test.js +0 -43
  265. package/test/NewDate.test.js +0 -203
  266. package/test/NewInputText.test.js +0 -866
  267. package/test/NewTextarea.test.js +0 -252
  268. package/test/Number.test.js +0 -241
  269. package/test/Paginator.test.js +0 -177
  270. package/test/Password.test.js +0 -76
  271. package/test/ProgressBar.test.js +0 -35
  272. package/test/Radio.test.js +0 -37
  273. package/test/ResultsetTable.test.js +0 -329
  274. package/test/Select.test.js +0 -212
  275. package/test/Sidenav.test.js +0 -45
  276. package/test/Slider.test.js +0 -82
  277. package/test/Spinner.test.js +0 -32
  278. package/test/Switch.test.js +0 -45
  279. package/test/Table.test.js +0 -36
  280. package/test/Tabs.test.js +0 -109
  281. package/test/TabsForSections.test.js +0 -34
  282. package/test/Tag.test.js +0 -32
  283. package/test/TextArea.test.js +0 -52
  284. package/test/ToggleGroup.test.js +0 -81
  285. package/test/Upload.test.js +0 -60
  286. package/test/Wizard.test.js +0 -130
  287. package/test/mocks/pngMock.js +0 -1
  288. 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;