@dxc-technology/halstack-react 0.0.0-eb2a4cc → 0.0.0-ebb089f
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.
- package/README.md +2 -2
- package/babel.config.js +5 -2
- package/dist/BackgroundColorContext.js +46 -0
- package/dist/ThemeContext.js +237 -2
- package/dist/V3Select/V3Select.js +549 -0
- package/dist/V3Select/index.d.ts +27 -0
- package/dist/V3Textarea/V3Textarea.js +264 -0
- package/dist/V3Textarea/index.d.ts +27 -0
- package/dist/accordion/Accordion.js +170 -81
- package/dist/accordion/index.d.ts +28 -0
- package/dist/accordion-group/AccordionGroup.js +186 -0
- package/dist/accordion-group/index.d.ts +16 -0
- package/dist/alert/Alert.js +184 -83
- package/dist/alert/index.d.ts +51 -0
- package/dist/badge/Badge.js +63 -0
- package/dist/box/Box.js +31 -23
- package/dist/box/index.d.ts +25 -0
- package/dist/button/Button.js +84 -29
- package/dist/button/Button.stories.js +14 -211
- package/dist/button/index.d.ts +24 -0
- package/dist/card/Card.js +72 -35
- package/dist/card/index.d.ts +22 -0
- package/dist/checkbox/Checkbox.js +107 -32
- package/dist/checkbox/index.d.ts +24 -0
- package/dist/chip/Chip.js +135 -40
- package/dist/chip/index.d.ts +22 -0
- package/dist/common/RequiredComponent.js +2 -8
- package/dist/common/utils.js +2 -22
- package/dist/common/variables.js +1472 -159
- package/dist/date/Date.js +81 -59
- package/dist/date/index.d.ts +27 -0
- package/dist/date-input/DateInput.js +400 -0
- package/dist/date-input/index.d.ts +95 -0
- package/dist/dialog/Dialog.js +61 -36
- package/dist/dialog/index.d.ts +18 -0
- package/dist/dropdown/Dropdown.js +226 -94
- package/dist/dropdown/index.d.ts +26 -0
- package/dist/file-input/FileInput.js +644 -0
- package/dist/file-input/FileItem.js +287 -0
- package/dist/file-input/index.d.ts +81 -0
- package/dist/footer/Footer.js +122 -47
- package/dist/footer/Icons.js +77 -0
- package/dist/footer/index.d.ts +25 -0
- package/dist/header/Header.js +211 -91
- package/dist/header/Icons.js +59 -0
- package/dist/header/index.d.ts +25 -0
- package/dist/heading/Heading.js +93 -22
- package/dist/heading/index.d.ts +17 -0
- package/dist/input-text/Icons.js +22 -0
- package/dist/input-text/InputText.js +290 -104
- package/dist/input-text/index.d.ts +36 -0
- package/dist/layout/ApplicationLayout.js +327 -0
- package/dist/layout/Icons.js +55 -0
- package/dist/link/Link.js +136 -35
- package/dist/link/index.d.ts +23 -0
- package/dist/main.d.ts +40 -0
- package/dist/main.js +112 -16
- package/dist/number-input/NumberInput.js +136 -0
- package/dist/number-input/NumberInputContext.js +16 -0
- package/dist/number-input/index.d.ts +113 -0
- package/dist/paginator/Icons.js +66 -0
- package/dist/paginator/Paginator.js +184 -57
- package/dist/paginator/index.d.ts +20 -0
- package/dist/password-input/PasswordInput.js +203 -0
- package/dist/password-input/index.d.ts +94 -0
- package/dist/progress-bar/ProgressBar.js +97 -44
- package/dist/progress-bar/index.d.ts +18 -0
- package/dist/radio/Radio.js +39 -21
- package/dist/radio/index.d.ts +23 -0
- package/dist/resultsetTable/ResultsetTable.js +93 -69
- package/dist/resultsetTable/index.d.ts +19 -0
- package/dist/select/Select.js +957 -262
- package/dist/select/index.d.ts +131 -0
- package/dist/sidenav/Sidenav.js +87 -125
- package/dist/sidenav/index.d.ts +13 -0
- package/dist/slider/Slider.js +219 -73
- package/dist/slider/index.d.ts +29 -0
- package/dist/spinner/Spinner.js +249 -64
- package/dist/spinner/index.d.ts +17 -0
- package/dist/switch/Switch.js +51 -26
- package/dist/switch/index.d.ts +24 -0
- package/dist/table/Table.js +63 -15
- package/dist/table/index.d.ts +13 -0
- package/dist/tabs/Tabs.js +208 -35
- package/dist/tabs/index.d.ts +19 -0
- package/dist/tag/Tag.js +100 -35
- package/dist/tag/index.d.ts +24 -0
- package/dist/text-input/TextInput.js +974 -0
- package/dist/text-input/index.d.ts +135 -0
- package/dist/textarea/Textarea.js +250 -107
- package/dist/textarea/index.d.ts +117 -0
- package/dist/toggle/Toggle.js +16 -19
- package/dist/toggle/index.d.ts +21 -0
- package/dist/toggle-group/ToggleGroup.js +327 -0
- package/dist/toggle-group/index.d.ts +21 -0
- package/dist/upload/Upload.js +13 -8
- package/dist/upload/buttons-upload/ButtonsUpload.js +35 -25
- package/dist/upload/buttons-upload/Icons.js +40 -0
- package/dist/upload/dragAndDropArea/DragAndDropArea.js +84 -37
- package/dist/upload/dragAndDropArea/Icons.js +39 -0
- package/dist/upload/file-upload/FileToUpload.js +64 -33
- package/dist/upload/file-upload/Icons.js +66 -0
- package/dist/upload/files-upload/FilesToUpload.js +16 -16
- package/dist/upload/index.d.ts +15 -0
- package/dist/upload/transaction/Icons.js +160 -0
- package/dist/upload/transaction/Transaction.js +42 -49
- package/dist/upload/transactions/Transactions.js +38 -20
- package/dist/useTheme.js +22 -0
- package/dist/wizard/Icons.js +65 -0
- package/dist/wizard/Wizard.js +156 -61
- package/dist/wizard/index.d.ts +18 -0
- package/package.json +26 -14
- package/test/AccordionGroup.test.js +125 -0
- package/test/Date.test.js +15 -13
- package/test/DateInput.test.js +242 -0
- package/test/Dropdown.test.js +19 -4
- package/test/FileInput.test.js +201 -0
- package/test/Footer.test.js +2 -7
- package/test/Header.test.js +5 -10
- package/test/Heading.test.js +60 -12
- package/test/InputText.test.js +31 -28
- package/test/Link.test.js +25 -7
- package/test/NumberInput.test.js +259 -0
- package/test/Paginator.test.js +76 -60
- package/test/PasswordInput.test.js +83 -0
- package/test/ResultsetTable.test.js +65 -17
- package/test/Select.test.js +869 -132
- package/test/Sidenav.test.js +22 -64
- package/test/Slider.test.js +24 -15
- package/test/Spinner.test.js +5 -0
- package/test/Tabs.test.js +21 -0
- package/test/TextInput.test.js +731 -0
- package/test/Textarea.test.js +193 -0
- package/test/ToggleGroup.test.js +85 -0
- package/test/Upload.test.js +1 -1
- package/test/V3Select.test.js +212 -0
- package/test/{TextArea.test.js → V3TextArea.test.js} +6 -7
- package/dist/accordion/Accordion.stories.js +0 -207
- package/dist/accordion/readme.md +0 -96
- package/dist/alert/Alert.stories.js +0 -158
- package/dist/alert/close.svg +0 -4
- package/dist/alert/error.svg +0 -4
- package/dist/alert/info.svg +0 -4
- package/dist/alert/readme.md +0 -43
- package/dist/alert/success.svg +0 -4
- package/dist/alert/warning.svg +0 -4
- package/dist/button/readme.md +0 -93
- package/dist/checkbox/Checkbox.stories.js +0 -144
- package/dist/checkbox/readme.md +0 -116
- package/dist/common/services/example-service.js +0 -10
- package/dist/common/services/example-service.test.js +0 -12
- package/dist/date/Date.stories.js +0 -205
- package/dist/date/calendar.svg +0 -1
- package/dist/date/calendar_dark.svg +0 -1
- package/dist/date/readme.md +0 -73
- package/dist/dialog/Dialog.stories.js +0 -217
- package/dist/dialog/readme.md +0 -32
- package/dist/dropdown/Dropdown.stories.js +0 -249
- package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
- package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
- package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
- package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
- package/dist/dropdown/readme.md +0 -69
- package/dist/footer/Footer.stories.js +0 -94
- package/dist/footer/dxc_logo_wht.png +0 -0
- package/dist/footer/readme.md +0 -41
- package/dist/header/Header.stories.js +0 -176
- package/dist/header/close_icon.svg +0 -1
- package/dist/header/dxc_logo_black.png +0 -0
- package/dist/header/dxc_logo_white.png +0 -0
- package/dist/header/hamb_menu_black.svg +0 -1
- package/dist/header/hamb_menu_white.svg +0 -1
- package/dist/header/readme.md +0 -33
- package/dist/input-text/InputText.stories.js +0 -209
- package/dist/input-text/error.svg +0 -1
- package/dist/input-text/readme.md +0 -91
- package/dist/link/readme.md +0 -51
- package/dist/paginator/images/next.svg +0 -3
- package/dist/paginator/images/nextPage.svg +0 -3
- package/dist/paginator/images/previous.svg +0 -3
- package/dist/paginator/images/previousPage.svg +0 -3
- package/dist/paginator/readme.md +0 -50
- package/dist/progress-bar/ProgressBar.stories.js +0 -280
- package/dist/progress-bar/readme.md +0 -63
- package/dist/radio/Radio.stories.js +0 -166
- package/dist/radio/readme.md +0 -70
- package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
- package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
- package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
- package/dist/select/Select.stories.js +0 -235
- package/dist/select/readme.md +0 -72
- package/dist/sidenav/arrow_icon.svg +0 -3
- package/dist/slider/Slider.stories.js +0 -241
- package/dist/slider/readme.md +0 -64
- package/dist/spinner/Spinner.stories.js +0 -183
- package/dist/spinner/readme.md +0 -65
- package/dist/switch/Switch.stories.js +0 -134
- package/dist/switch/readme.md +0 -133
- package/dist/tabs/Tabs.stories.js +0 -130
- package/dist/tabs/readme.md +0 -78
- package/dist/tabs-for-sections/TabsForSections.js +0 -107
- package/dist/tabs-for-sections/readme.md +0 -78
- package/dist/toggle/Toggle.stories.js +0 -297
- package/dist/toggle/readme.md +0 -80
- package/dist/upload/Upload.stories.js +0 -72
- package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
- package/dist/upload/buttons-upload/upload-button.svg +0 -1
- package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
- package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
- package/dist/upload/file-upload/audio-icon.svg +0 -4
- package/dist/upload/file-upload/close.svg +0 -4
- package/dist/upload/file-upload/file-icon.svg +0 -4
- package/dist/upload/file-upload/video-icon.svg +0 -4
- package/dist/upload/readme.md +0 -37
- package/dist/upload/transaction/audio-icon-err.svg +0 -4
- package/dist/upload/transaction/audio-icon.svg +0 -4
- package/dist/upload/transaction/error-icon.svg +0 -4
- package/dist/upload/transaction/file-icon-err.svg +0 -4
- package/dist/upload/transaction/file-icon.svg +0 -4
- package/dist/upload/transaction/image-icon-err.svg +0 -4
- package/dist/upload/transaction/image-icon.svg +0 -4
- package/dist/upload/transaction/success-icon.svg +0 -4
- package/dist/upload/transaction/video-icon-err.svg +0 -4
- package/dist/upload/transaction/video-icon.svg +0 -4
- package/dist/wizard/invalid_icon.svg +0 -6
- package/dist/wizard/valid_icon.svg +0 -6
- package/dist/wizard/validation-wrong.svg +0 -6
- package/test/TabsForSections.test.js +0 -34
- package/test/Toggle.test.js +0 -43
package/dist/footer/Footer.js
CHANGED
|
@@ -11,10 +11,10 @@ exports["default"] = void 0;
|
|
|
11
11
|
|
|
12
12
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
13
13
|
|
|
14
|
-
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
15
|
-
|
|
16
14
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
17
15
|
|
|
16
|
+
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
17
|
+
|
|
18
18
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
19
19
|
|
|
20
20
|
var _react = _interopRequireWildcard(require("react"));
|
|
@@ -23,18 +23,36 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
|
23
23
|
|
|
24
24
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
25
25
|
|
|
26
|
-
var
|
|
26
|
+
var _variables = require("../common/variables.js");
|
|
27
27
|
|
|
28
|
-
require("../
|
|
28
|
+
var _useTheme = _interopRequireDefault(require("../useTheme.js"));
|
|
29
29
|
|
|
30
|
-
var
|
|
30
|
+
var _BackgroundColorContext = require("../BackgroundColorContext.js");
|
|
31
|
+
|
|
32
|
+
var _Icons = _interopRequireDefault(require("./Icons"));
|
|
33
|
+
|
|
34
|
+
function _templateObject13() {
|
|
35
|
+
var data = (0, _taggedTemplateLiteral2["default"])(["\n text-decoration: ", ";\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n"]);
|
|
36
|
+
|
|
37
|
+
_templateObject13 = function _templateObject13() {
|
|
38
|
+
return data;
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
return data;
|
|
42
|
+
}
|
|
31
43
|
|
|
32
|
-
|
|
44
|
+
function _templateObject12() {
|
|
45
|
+
var data = (0, _taggedTemplateLiteral2["default"])(["\n margin: 0px 10px;\n color: ", ";\n"]);
|
|
33
46
|
|
|
34
|
-
|
|
47
|
+
_templateObject12 = function _templateObject12() {
|
|
48
|
+
return data;
|
|
49
|
+
};
|
|
50
|
+
|
|
51
|
+
return data;
|
|
52
|
+
}
|
|
35
53
|
|
|
36
54
|
function _templateObject11() {
|
|
37
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n
|
|
55
|
+
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"]);
|
|
38
56
|
|
|
39
57
|
_templateObject11 = function _templateObject11() {
|
|
40
58
|
return data;
|
|
@@ -44,7 +62,7 @@ function _templateObject11() {
|
|
|
44
62
|
}
|
|
45
63
|
|
|
46
64
|
function _templateObject10() {
|
|
47
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n
|
|
65
|
+
var data = (0, _taggedTemplateLiteral2["default"])(["\n & {\n display: inline-flex;\n height: ", ";\n width: ", ";\n fill: ", ";\n }\n"]);
|
|
48
66
|
|
|
49
67
|
_templateObject10 = function _templateObject10() {
|
|
50
68
|
return data;
|
|
@@ -54,7 +72,7 @@ function _templateObject10() {
|
|
|
54
72
|
}
|
|
55
73
|
|
|
56
74
|
function _templateObject9() {
|
|
57
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n & {\n display: inline-flex;\n
|
|
75
|
+
var data = (0, _taggedTemplateLiteral2["default"])(["\n & {\n display: inline-flex;\n margin-left: ", ";\n }\n"]);
|
|
58
76
|
|
|
59
77
|
_templateObject9 = function _templateObject9() {
|
|
60
78
|
return data;
|
|
@@ -64,7 +82,7 @@ function _templateObject9() {
|
|
|
64
82
|
}
|
|
65
83
|
|
|
66
84
|
function _templateObject8() {
|
|
67
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n
|
|
85
|
+
var data = (0, _taggedTemplateLiteral2["default"])(["\n max-height: ", ";\n width: ", ";\n"]);
|
|
68
86
|
|
|
69
87
|
_templateObject8 = function _templateObject8() {
|
|
70
88
|
return data;
|
|
@@ -74,7 +92,7 @@ function _templateObject8() {
|
|
|
74
92
|
}
|
|
75
93
|
|
|
76
94
|
function _templateObject7() {
|
|
77
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n height:
|
|
95
|
+
var data = (0, _taggedTemplateLiteral2["default"])(["\n max-height: ", ";\n width: ", ";\n"]);
|
|
78
96
|
|
|
79
97
|
_templateObject7 = function _templateObject7() {
|
|
80
98
|
return data;
|
|
@@ -84,7 +102,7 @@ function _templateObject7() {
|
|
|
84
102
|
}
|
|
85
103
|
|
|
86
104
|
function _templateObject6() {
|
|
87
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n font-size:
|
|
105
|
+
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"]);
|
|
88
106
|
|
|
89
107
|
_templateObject6 = function _templateObject6() {
|
|
90
108
|
return data;
|
|
@@ -94,7 +112,7 @@ function _templateObject6() {
|
|
|
94
112
|
}
|
|
95
113
|
|
|
96
114
|
function _templateObject5() {
|
|
97
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n min-height: 15px;\n padding: ", ";\n padding-top: ", ";\n padding-right: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n
|
|
115
|
+
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"]);
|
|
98
116
|
|
|
99
117
|
_templateObject5 = function _templateObject5() {
|
|
100
118
|
return data;
|
|
@@ -104,7 +122,7 @@ function _templateObject5() {
|
|
|
104
122
|
}
|
|
105
123
|
|
|
106
124
|
function _templateObject4() {
|
|
107
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n padding-top:
|
|
125
|
+
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"]);
|
|
108
126
|
|
|
109
127
|
_templateObject4 = function _templateObject4() {
|
|
110
128
|
return data;
|
|
@@ -114,7 +132,7 @@ function _templateObject4() {
|
|
|
114
132
|
}
|
|
115
133
|
|
|
116
134
|
function _templateObject3() {
|
|
117
|
-
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"]);
|
|
135
|
+
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"]);
|
|
118
136
|
|
|
119
137
|
_templateObject3 = function _templateObject3() {
|
|
120
138
|
return data;
|
|
@@ -134,7 +152,7 @@ function _templateObject2() {
|
|
|
134
152
|
}
|
|
135
153
|
|
|
136
154
|
function _templateObject() {
|
|
137
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n
|
|
155
|
+
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"]);
|
|
138
156
|
|
|
139
157
|
_templateObject = function _templateObject() {
|
|
140
158
|
return data;
|
|
@@ -150,11 +168,11 @@ var DxcFooter = function DxcFooter(_ref) {
|
|
|
150
168
|
bottomLinks = _ref$bottomLinks === void 0 ? [] : _ref$bottomLinks,
|
|
151
169
|
_ref$copyright = _ref.copyright,
|
|
152
170
|
copyright = _ref$copyright === void 0 ? "" : _ref$copyright,
|
|
153
|
-
_ref$logoSrc = _ref.logoSrc,
|
|
154
|
-
logoSrc = _ref$logoSrc === void 0 ? "default" : _ref$logoSrc,
|
|
155
171
|
children = _ref.children,
|
|
156
172
|
padding = _ref.padding,
|
|
157
|
-
margin = _ref.margin
|
|
173
|
+
margin = _ref.margin,
|
|
174
|
+
_ref$tabIndex = _ref.tabIndex,
|
|
175
|
+
tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
|
|
158
176
|
var ref = (0, _react.useRef)(null);
|
|
159
177
|
|
|
160
178
|
var _useState = (0, _react.useState)(),
|
|
@@ -172,10 +190,21 @@ var DxcFooter = function DxcFooter(_ref) {
|
|
|
172
190
|
isResponsivePhone = _useState6[0],
|
|
173
191
|
setIsResponsivePhone = _useState6[1];
|
|
174
192
|
|
|
175
|
-
var
|
|
176
|
-
var
|
|
177
|
-
|
|
178
|
-
|
|
193
|
+
var colorsTheme = (0, _useTheme["default"])();
|
|
194
|
+
var footerLogo = (0, _react.useMemo)(function () {
|
|
195
|
+
if (!colorsTheme.footer.logo) {
|
|
196
|
+
return _Icons["default"];
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
if (typeof colorsTheme.footer.logo === "string") {
|
|
200
|
+
return _react["default"].createElement(LogoImg, {
|
|
201
|
+
alt: "Logo",
|
|
202
|
+
src: colorsTheme.footer.logo
|
|
203
|
+
});
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
return colorsTheme.footer.logo;
|
|
207
|
+
}, [colorsTheme.footer.logo]);
|
|
179
208
|
|
|
180
209
|
var handleResize = function handleResize(refWidth) {
|
|
181
210
|
if (ref.current) {
|
|
@@ -207,10 +236,11 @@ var DxcFooter = function DxcFooter(_ref) {
|
|
|
207
236
|
}, []);
|
|
208
237
|
var socialLink = socialLinks.map(function (link, index) {
|
|
209
238
|
return _react["default"].createElement(SocialAnchor, {
|
|
239
|
+
tabIndex: tabIndex,
|
|
210
240
|
key: "social".concat(index).concat(link.href),
|
|
211
241
|
index: index,
|
|
212
242
|
href: link && link.href ? link.href : ""
|
|
213
|
-
}, link && link.logoSrc && _react["default"].createElement(SocialIcon, {
|
|
243
|
+
}, 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, {
|
|
214
244
|
src: link.logoSrc
|
|
215
245
|
}));
|
|
216
246
|
});
|
|
@@ -218,6 +248,7 @@ var DxcFooter = function DxcFooter(_ref) {
|
|
|
218
248
|
return _react["default"].createElement("span", {
|
|
219
249
|
key: "bottom".concat(index).concat(link.text)
|
|
220
250
|
}, _react["default"].createElement(BottomLink, {
|
|
251
|
+
tabIndex: tabIndex,
|
|
221
252
|
href: link && link.href ? link.href : ""
|
|
222
253
|
}, link && link.text ? link.text : ""), _react["default"].createElement(Point, {
|
|
223
254
|
index: index
|
|
@@ -229,10 +260,7 @@ var DxcFooter = function DxcFooter(_ref) {
|
|
|
229
260
|
margin: margin,
|
|
230
261
|
refSize: refSize,
|
|
231
262
|
ref: ref
|
|
232
|
-
}, _react["default"].createElement(FooterHeader, null, _react["default"].createElement(
|
|
233
|
-
logoSrc: logoSrc,
|
|
234
|
-
src: logoSrc === "default" ? _dxc_logo_wht["default"] : logoSrc
|
|
235
|
-
}), _react["default"].createElement("div", null, socialLink)), isResponsivePhone && _react["default"].createElement("div", null, _react["default"].createElement(FooterFooter, {
|
|
263
|
+
}, _react["default"].createElement(FooterHeader, null, _react["default"].createElement(LogoContainer, null, footerLogo), _react["default"].createElement("div", null, socialLink)), isResponsivePhone && _react["default"].createElement("div", null, _react["default"].createElement(FooterFooter, {
|
|
236
264
|
className: "footerFooter",
|
|
237
265
|
refSize: refSize
|
|
238
266
|
}, _react["default"].createElement(BottomLinks, {
|
|
@@ -241,7 +269,9 @@ var DxcFooter = function DxcFooter(_ref) {
|
|
|
241
269
|
refSize: refSize
|
|
242
270
|
}, copyright))), (!isResponsiveTablet && !isResponsivePhone || isResponsiveTablet) && _react["default"].createElement("div", null, _react["default"].createElement(ChildComponents, {
|
|
243
271
|
padding: padding
|
|
244
|
-
},
|
|
272
|
+
}, _react["default"].createElement(_BackgroundColorContext.BackgroundColorProvider, {
|
|
273
|
+
color: colorsTheme.footer.backgroundColor
|
|
274
|
+
}, children)), _react["default"].createElement(FooterFooter, {
|
|
245
275
|
className: "footerFooter"
|
|
246
276
|
}, _react["default"].createElement(BottomLinks, {
|
|
247
277
|
refSize: refSize
|
|
@@ -250,12 +280,14 @@ var DxcFooter = function DxcFooter(_ref) {
|
|
|
250
280
|
}, copyright)))));
|
|
251
281
|
};
|
|
252
282
|
|
|
253
|
-
var FooterContainer = _styledComponents["default"].
|
|
254
|
-
return props.refSize <= _variables.responsiveSizes.mobileLarge ? "20px 20px 20px 20px" : "
|
|
283
|
+
var FooterContainer = _styledComponents["default"].footer(_templateObject(), function (props) {
|
|
284
|
+
return props.refSize <= _variables.responsiveSizes.mobileLarge ? "20px 20px 20px 20px" : "24px 36px 24px 36px";
|
|
255
285
|
}, function (props) {
|
|
256
286
|
return props.theme.backgroundColor;
|
|
257
287
|
}, function (props) {
|
|
258
288
|
return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
|
|
289
|
+
}, function (props) {
|
|
290
|
+
return props.theme.height;
|
|
259
291
|
});
|
|
260
292
|
|
|
261
293
|
var FooterHeader = _styledComponents["default"].div(_templateObject2());
|
|
@@ -264,10 +296,12 @@ var FooterFooter = _styledComponents["default"].div(_templateObject3(), function
|
|
|
264
296
|
return props.refSize <= _variables.responsiveSizes.mobileLarge ? "column" : "row";
|
|
265
297
|
}, function (props) {
|
|
266
298
|
return props.refSize <= _variables.responsiveSizes.mobileLarge ? "center" : "";
|
|
299
|
+
}, function (props) {
|
|
300
|
+
return "".concat(props.theme.bottomLinksDividerThickness, " ").concat(props.theme.bottomLinksDividerStyle, " ").concat(props.theme.bottomLinksDividerColor);
|
|
267
301
|
});
|
|
268
302
|
|
|
269
303
|
var BottomLinks = _styledComponents["default"].div(_templateObject4(), function (props) {
|
|
270
|
-
return props.theme.
|
|
304
|
+
return props.theme.bottomLinksDividerSpacing;
|
|
271
305
|
}, function (props) {
|
|
272
306
|
return props.refSize <= _variables.responsiveSizes.mobileLarge ? "100%" : "60%";
|
|
273
307
|
}, function (props) {
|
|
@@ -286,41 +320,81 @@ var ChildComponents = _styledComponents["default"].div(_templateObject5(), funct
|
|
|
286
320
|
return props.padding && (0, _typeof2["default"])(props.padding) === "object" && props.padding.bottom ? _variables.spaces[props.padding.bottom] : "";
|
|
287
321
|
}, function (props) {
|
|
288
322
|
return props.padding && (0, _typeof2["default"])(props.padding) === "object" && props.padding.left ? _variables.spaces[props.padding.left] : "";
|
|
289
|
-
}, function (props) {
|
|
290
|
-
return props.theme.fontColor;
|
|
291
323
|
});
|
|
292
324
|
|
|
293
325
|
var Copyright = _styledComponents["default"].div(_templateObject6(), function (props) {
|
|
294
|
-
return props.theme.
|
|
326
|
+
return props.theme.copyrightFontFamily;
|
|
327
|
+
}, function (props) {
|
|
328
|
+
return props.theme.copyrightFontSize;
|
|
329
|
+
}, function (props) {
|
|
330
|
+
return props.theme.copyrightFontStyle;
|
|
331
|
+
}, function (props) {
|
|
332
|
+
return props.theme.copyrightFontWeight;
|
|
333
|
+
}, function (props) {
|
|
334
|
+
return props.theme.copyrightFontColor;
|
|
295
335
|
}, function (props) {
|
|
296
336
|
return props.refSize <= _variables.responsiveSizes.mobileLarge ? "100%" : "40%";
|
|
297
337
|
}, function (props) {
|
|
298
338
|
return props.refSize <= _variables.responsiveSizes.mobileLarge ? "100%" : "";
|
|
299
339
|
}, function (props) {
|
|
300
340
|
return props.refSize <= _variables.responsiveSizes.mobileLarge ? "center" : "right";
|
|
341
|
+
}, function (props) {
|
|
342
|
+
return props.theme.bottomLinksDividerSpacing;
|
|
343
|
+
});
|
|
344
|
+
|
|
345
|
+
var LogoContainer = _styledComponents["default"].div(_templateObject7(), function (props) {
|
|
346
|
+
return props.theme.logoHeight;
|
|
347
|
+
}, function (props) {
|
|
348
|
+
return props.theme.logoWidth;
|
|
349
|
+
});
|
|
350
|
+
|
|
351
|
+
var LogoImg = _styledComponents["default"].img(_templateObject8(), function (props) {
|
|
352
|
+
return props.theme.logoHeight;
|
|
353
|
+
}, function (props) {
|
|
354
|
+
return props.theme.logoWidth;
|
|
301
355
|
});
|
|
302
356
|
|
|
303
|
-
var
|
|
357
|
+
var SocialAnchor = _styledComponents["default"].a(_templateObject9(), function (props) {
|
|
358
|
+
return props.index === 0 ? "0px" : props.theme.socialLinksGutter;
|
|
359
|
+
});
|
|
304
360
|
|
|
305
|
-
var
|
|
306
|
-
return props.
|
|
361
|
+
var SocialIcon = _styledComponents["default"].img(_templateObject10(), function (props) {
|
|
362
|
+
return props.theme.socialLinksSize;
|
|
363
|
+
}, function (props) {
|
|
364
|
+
return props.theme.socialLinksSize;
|
|
365
|
+
}, function (props) {
|
|
366
|
+
return props.theme.socialLinksColor;
|
|
307
367
|
});
|
|
308
368
|
|
|
309
|
-
var
|
|
310
|
-
return props.theme.
|
|
369
|
+
var SocialIconContainer = _styledComponents["default"].div(_templateObject11(), function (props) {
|
|
370
|
+
return props.theme.socialLinksSize;
|
|
371
|
+
}, function (props) {
|
|
372
|
+
return props.theme.socialLinksSize;
|
|
373
|
+
}, function (props) {
|
|
374
|
+
return props.theme.socialLinksColor;
|
|
311
375
|
});
|
|
312
376
|
|
|
313
|
-
var Point = _styledComponents["default"].span(
|
|
314
|
-
return props.theme.
|
|
377
|
+
var Point = _styledComponents["default"].span(_templateObject12(), function (props) {
|
|
378
|
+
return props.theme.bottomLinksFontColor;
|
|
315
379
|
});
|
|
316
380
|
|
|
317
|
-
var BottomLink = _styledComponents["default"].a(
|
|
318
|
-
return props.theme.
|
|
381
|
+
var BottomLink = _styledComponents["default"].a(_templateObject13(), function (props) {
|
|
382
|
+
return props.theme.bottomLinksTextDecoration;
|
|
383
|
+
}, function (props) {
|
|
384
|
+
return props.theme.bottomLinksFontColor;
|
|
385
|
+
}, function (props) {
|
|
386
|
+
return props.theme.bottomLinksFontFamily;
|
|
387
|
+
}, function (props) {
|
|
388
|
+
return props.theme.bottomLinksFontSize;
|
|
389
|
+
}, function (props) {
|
|
390
|
+
return props.theme.bottomLinksFontStyle;
|
|
391
|
+
}, function (props) {
|
|
392
|
+
return props.theme.bottomLinksFontWeight;
|
|
319
393
|
});
|
|
320
394
|
|
|
321
395
|
DxcFooter.propTypes = {
|
|
322
|
-
logoSrc: _propTypes["default"].string,
|
|
323
396
|
socialLinks: _propTypes["default"].arrayOf(_propTypes["default"].shape({
|
|
397
|
+
logo: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
|
|
324
398
|
logoSrc: _propTypes["default"].string.isRequired,
|
|
325
399
|
href: _propTypes["default"].string
|
|
326
400
|
})),
|
|
@@ -340,7 +414,8 @@ DxcFooter.propTypes = {
|
|
|
340
414
|
bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
341
415
|
left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
342
416
|
right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
|
|
343
|
-
}), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])
|
|
417
|
+
}), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
|
|
418
|
+
tabIndex: _propTypes["default"].number
|
|
344
419
|
};
|
|
345
420
|
var _default = DxcFooter;
|
|
346
421
|
exports["default"] = _default;
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports["default"] = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
var _default = _react["default"].createElement("svg", {
|
|
13
|
+
id: "g10",
|
|
14
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
15
|
+
width: "280.781",
|
|
16
|
+
height: "32",
|
|
17
|
+
viewBox: "0 0 280.781 32"
|
|
18
|
+
}, _react["default"].createElement("title", null, "DXC Logo"), _react["default"].createElement("g", {
|
|
19
|
+
id: "g12"
|
|
20
|
+
}, _react["default"].createElement("path", {
|
|
21
|
+
id: "path14",
|
|
22
|
+
d: "M171.5-54.124v12.539h-3.6V-54.124h-4.973v-3.191h13.54v3.191H171.5",
|
|
23
|
+
transform: "translate(-68.528 65.45)",
|
|
24
|
+
fill: "#fff"
|
|
25
|
+
}), _react["default"].createElement("path", {
|
|
26
|
+
id: "path16",
|
|
27
|
+
d: "M189.96-41.585V-57.315h12.326v3.079h-8.753v3.191h7.7v3.078h-7.7v3.3h8.87v3.078H189.96",
|
|
28
|
+
transform: "translate(-77.56 65.45)",
|
|
29
|
+
fill: "#fff"
|
|
30
|
+
}), _react["default"].createElement("path", {
|
|
31
|
+
id: "path18",
|
|
32
|
+
d: "M223.558-41.438a8.1,8.1,0,0,1-8.382-8.1v-.045a8.161,8.161,0,0,1,8.522-8.146,8.6,8.6,0,0,1,6.444,2.431l-2.289,2.543a6.133,6.133,0,0,0-4.178-1.778,4.743,4.743,0,0,0-4.738,4.905v.045a4.752,4.752,0,0,0,4.738,4.95,6,6,0,0,0,4.295-1.845l2.288,2.228a8.491,8.491,0,0,1-6.7,2.813",
|
|
33
|
+
transform: "translate(-86.019 65.583)",
|
|
34
|
+
fill: "#fff"
|
|
35
|
+
}), _react["default"].createElement("path", {
|
|
36
|
+
id: "path20",
|
|
37
|
+
d: "M254.988-41.585V-47.9h-6.63v6.315h-3.6V-57.315h3.6v6.225h6.63v-6.225h3.594v15.731h-3.594",
|
|
38
|
+
transform: "translate(-95.903 65.45)",
|
|
39
|
+
fill: "#fff"
|
|
40
|
+
}), _react["default"].createElement("path", {
|
|
41
|
+
id: "path22",
|
|
42
|
+
d: "M285.991-41.585l-7.914-10v10h-3.549V-57.315h3.316l7.657,9.685v-9.685h3.549v15.731h-3.058",
|
|
43
|
+
transform: "translate(-105.869 65.45)",
|
|
44
|
+
fill: "#fff"
|
|
45
|
+
}), _react["default"].createElement("path", {
|
|
46
|
+
id: "path24",
|
|
47
|
+
d: "M317.2-49.583a4.869,4.869,0,0,0-4.949-4.95,4.793,4.793,0,0,0-4.9,4.905v.045a4.869,4.869,0,0,0,4.949,4.95,4.793,4.793,0,0,0,4.9-4.905Zm-4.949,8.145c-5.043,0-8.661-3.623-8.661-8.1v-.045c0-4.478,3.666-8.146,8.708-8.146s8.66,3.623,8.66,8.1v.045c0,4.477-3.664,8.145-8.708,8.145",
|
|
48
|
+
transform: "translate(-115.631 65.583)",
|
|
49
|
+
fill: "#fff"
|
|
50
|
+
}), _react["default"].createElement("path", {
|
|
51
|
+
id: "path26",
|
|
52
|
+
d: "M336.786-41.585V-57.315h3.6v12.584h8.148v3.146H336.786",
|
|
53
|
+
transform: "translate(-126.654 65.45)",
|
|
54
|
+
fill: "#fff"
|
|
55
|
+
}), _react["default"].createElement("path", {
|
|
56
|
+
id: "path28",
|
|
57
|
+
d: "M372.78-49.583a4.87,4.87,0,0,0-4.949-4.95,4.794,4.794,0,0,0-4.9,4.905v.045a4.869,4.869,0,0,0,4.949,4.95,4.794,4.794,0,0,0,4.9-4.905Zm-4.949,8.145c-5.043,0-8.662-3.623-8.662-8.1v-.045c0-4.478,3.666-8.146,8.708-8.146s8.661,3.623,8.661,8.1v.045c0,4.477-3.666,8.145-8.708,8.145",
|
|
58
|
+
transform: "translate(-135.016 65.583)",
|
|
59
|
+
fill: "#fff"
|
|
60
|
+
}), _react["default"].createElement("path", {
|
|
61
|
+
id: "path30",
|
|
62
|
+
d: "M399.735-41.438c-5.09,0-8.592-3.443-8.592-8.1v-.045a8.243,8.243,0,0,1,8.568-8.146,9.18,9.18,0,0,1,6.42,2.16l-2.265,2.634a6.141,6.141,0,0,0-4.272-1.6,4.807,4.807,0,0,0-4.692,4.905v.045a4.8,4.8,0,0,0,4.949,4.995,5.89,5.89,0,0,0,3.384-.945v-2.25h-3.618v-2.992h7.1v6.841a10.837,10.837,0,0,1-6.98,2.5",
|
|
63
|
+
transform: "translate(-145.284 65.583)",
|
|
64
|
+
fill: "#fff"
|
|
65
|
+
}), _react["default"].createElement("path", {
|
|
66
|
+
id: "path32",
|
|
67
|
+
d: "M428.664-47.855v6.27h-3.6v-6.2l-6.28-9.528h4.2L426.89-51l3.968-6.315h4.085l-6.28,9.46",
|
|
68
|
+
transform: "translate(-154.162 65.45)",
|
|
69
|
+
fill: "#fff"
|
|
70
|
+
}), _react["default"].createElement("path", {
|
|
71
|
+
id: "path34",
|
|
72
|
+
d: "M84.218-55.737a10.063,10.063,0,0,1,2.589-4.4,9.792,9.792,0,0,1,6.985-2.77h11.328V-69.3H93.792a17.041,17.041,0,0,0-11.8,4.759,16.344,16.344,0,0,0-3.547,5.115,13.247,13.247,0,0,0-1.122,3.688Zm0,4.877a10.065,10.065,0,0,0,2.589,4.4,9.793,9.793,0,0,0,6.985,2.77h11.328V-37.3H93.792a17.042,17.042,0,0,1-11.8-4.759,16.339,16.339,0,0,1-3.547-5.114,13.251,13.251,0,0,1-1.122-3.688ZM63.1-47.98,54.45-37.3H45.873l12.957-16-12.957-16H54.45L63.1-58.619l8.65-10.68h8.578l-12.957,16,12.957,16H71.749ZM48.875-55.737a13.212,13.212,0,0,0-1.122-3.688,16.359,16.359,0,0,0-3.546-5.115,17.043,17.043,0,0,0-11.8-4.759H21.08v6.393H32.408a9.79,9.79,0,0,1,6.985,2.77,10.072,10.072,0,0,1,2.59,4.4Zm0,4.877a13.215,13.215,0,0,1-1.122,3.688,16.353,16.353,0,0,1-3.546,5.114,17.044,17.044,0,0,1-11.8,4.759H21.08v-6.393H32.408a9.791,9.791,0,0,0,6.985-2.77,10.074,10.074,0,0,0,2.59-4.4h6.892",
|
|
73
|
+
transform: "translate(-21.08 69.298)",
|
|
74
|
+
fill: "#fff"
|
|
75
|
+
})));
|
|
76
|
+
|
|
77
|
+
exports["default"] = _default;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
|
|
2
|
+
type Margin = {
|
|
3
|
+
top?: Space;
|
|
4
|
+
bottom?: Space;
|
|
5
|
+
left?: Space;
|
|
6
|
+
right?: Space;
|
|
7
|
+
};
|
|
8
|
+
type Padding = {
|
|
9
|
+
top?: Space;
|
|
10
|
+
bottom?: Space;
|
|
11
|
+
left?: Space;
|
|
12
|
+
right?: Space;
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
type Props = {
|
|
16
|
+
socialLinks?: any;
|
|
17
|
+
bottomLinks?: any;
|
|
18
|
+
copyright?: string;
|
|
19
|
+
padding?: Space | Padding;
|
|
20
|
+
margin?: Space | Margin;
|
|
21
|
+
tabIndex?: number;
|
|
22
|
+
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export default function DxcFooter(props: Props): JSX.Element;
|