@dxc-technology/halstack-react 0.0.0-fce22b8 → 0.0.0-ff99b25
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/BackgroundColorContext.js +50 -0
- package/ThemeContext.js +246 -0
- package/V3Select/V3Select.js +455 -0
- package/V3Select/index.d.ts +27 -0
- package/{dist/textarea/Textarea.js → V3Textarea/V3Textarea.js} +39 -39
- package/V3Textarea/index.d.ts +27 -0
- package/accordion/Accordion.d.ts +4 -0
- package/accordion/Accordion.js +258 -0
- package/accordion/types.d.ts +68 -0
- package/accordion/types.js +5 -0
- package/accordion-group/AccordionGroup.d.ts +7 -0
- package/accordion-group/AccordionGroup.js +170 -0
- package/accordion-group/types.d.ts +72 -0
- package/accordion-group/types.js +5 -0
- package/alert/Alert.d.ts +4 -0
- package/alert/Alert.js +290 -0
- package/alert/types.d.ts +49 -0
- package/alert/types.js +5 -0
- package/badge/Badge.js +59 -0
- package/{dist/box → box}/Box.js +9 -21
- package/box/Box.stories.jsx +132 -0
- package/box/index.d.ts +25 -0
- package/button/Button.d.ts +4 -0
- package/button/Button.js +182 -0
- package/button/Button.stories.tsx +293 -0
- package/button/types.d.ts +57 -0
- package/button/types.js +5 -0
- package/card/Card.d.ts +4 -0
- package/{dist/card → card}/Card.js +32 -123
- package/card/types.d.ts +69 -0
- package/card/types.js +5 -0
- package/checkbox/Checkbox.d.ts +4 -0
- package/{dist/checkbox → checkbox}/Checkbox.js +44 -82
- package/checkbox/types.d.ts +60 -0
- package/checkbox/types.js +5 -0
- package/{dist/chip → chip}/Chip.js +42 -84
- package/chip/index.d.ts +22 -0
- package/{dist/common → common}/OpenSans.css +0 -0
- package/{dist/common → common}/RequiredComponent.js +3 -11
- package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
- package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
- package/{dist/common → common}/utils.js +0 -0
- package/common/variables.js +1569 -0
- package/{dist/date → date}/Date.js +33 -51
- package/date/index.d.ts +27 -0
- package/date-input/DateInput.d.ts +4 -0
- package/date-input/DateInput.js +361 -0
- package/date-input/types.d.ts +100 -0
- package/date-input/types.js +5 -0
- package/dialog/Dialog.d.ts +4 -0
- package/{dist/dialog → dialog}/Dialog.js +29 -100
- package/dialog/types.d.ts +43 -0
- package/dialog/types.js +5 -0
- package/dropdown/Dropdown.d.ts +4 -0
- package/dropdown/Dropdown.js +417 -0
- package/dropdown/types.d.ts +89 -0
- package/dropdown/types.js +5 -0
- package/file-input/FileInput.js +532 -0
- package/file-input/FileItem.js +193 -0
- package/file-input/index.d.ts +81 -0
- package/footer/Footer.d.ts +4 -0
- package/footer/Footer.js +266 -0
- package/footer/Footer.stories.jsx +151 -0
- package/footer/Icons.js +77 -0
- package/footer/types.d.ts +61 -0
- package/footer/types.js +5 -0
- package/header/Header.js +326 -0
- package/header/Icons.js +59 -0
- package/header/index.d.ts +25 -0
- package/{dist/heading → heading}/Heading.js +30 -76
- package/heading/index.d.ts +17 -0
- package/input-text/Icons.js +22 -0
- package/{dist/input-text → input-text}/InputText.js +120 -178
- package/input-text/index.d.ts +36 -0
- package/{dist/layout → layout}/ApplicationLayout.js +35 -131
- package/layout/Icons.js +55 -0
- package/link/Link.js +183 -0
- package/link/index.d.ts +23 -0
- package/main.d.ts +44 -0
- package/{dist/main.js → main.js} +121 -69
- package/number-input/NumberInput.js +128 -0
- package/number-input/NumberInput.stories.jsx +115 -0
- package/number-input/NumberInputContext.js +16 -0
- package/number-input/index.d.ts +113 -0
- package/package.json +34 -25
- package/paginator/Icons.js +66 -0
- package/paginator/Paginator.d.ts +4 -0
- package/paginator/Paginator.js +198 -0
- package/paginator/types.d.ts +38 -0
- package/paginator/types.js +5 -0
- package/password-input/PasswordInput.js +199 -0
- package/password-input/PasswordInput.stories.jsx +131 -0
- package/password-input/index.d.ts +94 -0
- package/progress-bar/ProgressBar.d.ts +4 -0
- package/progress-bar/ProgressBar.js +170 -0
- package/progress-bar/types.d.ts +37 -0
- package/progress-bar/types.js +5 -0
- package/radio/Radio.d.ts +4 -0
- package/{dist/radio → radio}/Radio.js +15 -50
- package/radio/types.d.ts +54 -0
- package/radio/types.js +5 -0
- package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +35 -136
- package/resultsetTable/index.d.ts +19 -0
- package/select/Select.js +865 -0
- package/select/index.d.ts +131 -0
- package/{dist/sidenav → sidenav}/Sidenav.js +20 -58
- package/sidenav/index.d.ts +13 -0
- package/slider/Slider.d.ts +4 -0
- package/slider/Slider.js +306 -0
- package/slider/types.d.ts +83 -0
- package/slider/types.js +5 -0
- package/spinner/Spinner.js +267 -0
- package/spinner/index.d.ts +17 -0
- package/switch/Switch.d.ts +4 -0
- package/{dist/switch → switch}/Switch.js +28 -71
- package/switch/types.d.ts +58 -0
- package/switch/types.js +5 -0
- package/table/Table.js +118 -0
- package/table/index.d.ts +13 -0
- package/tabs/Tabs.d.ts +4 -0
- package/tabs/Tabs.js +211 -0
- package/tabs/types.d.ts +71 -0
- package/tabs/types.js +5 -0
- package/{dist/tag → tag}/Tag.js +50 -122
- package/tag/index.d.ts +24 -0
- package/text-input/TextInput.js +825 -0
- package/text-input/index.d.ts +135 -0
- package/textarea/Textarea.js +317 -0
- package/textarea/Textarea.stories.jsx +135 -0
- package/textarea/index.d.ts +117 -0
- package/{dist/toggle → toggle}/Toggle.js +15 -49
- package/toggle/index.d.ts +21 -0
- package/toggle-group/ToggleGroup.js +243 -0
- package/toggle-group/index.d.ts +21 -0
- package/{dist/upload → upload}/Upload.js +11 -15
- package/upload/buttons-upload/ButtonsUpload.js +111 -0
- package/upload/buttons-upload/Icons.js +40 -0
- package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
- package/upload/dragAndDropArea/Icons.js +39 -0
- package/upload/file-upload/FileToUpload.js +115 -0
- package/upload/file-upload/Icons.js +66 -0
- package/{dist/upload → upload}/files-upload/FilesToUpload.js +12 -26
- package/upload/index.d.ts +15 -0
- package/upload/transaction/Icons.js +160 -0
- package/upload/transaction/Transaction.js +104 -0
- package/upload/transactions/Transactions.js +94 -0
- package/{dist/useTheme.js → useTheme.js} +0 -0
- package/wizard/Icons.js +65 -0
- package/wizard/Wizard.js +271 -0
- package/wizard/index.d.ts +18 -0
- package/README.md +0 -66
- package/babel.config.js +0 -8
- package/dist/BackgroundColorContext.js +0 -46
- package/dist/ThemeContext.js +0 -216
- package/dist/accordion/Accordion.js +0 -340
- package/dist/accordion/Accordion.stories.js +0 -207
- package/dist/accordion/readme.md +0 -96
- package/dist/accordion-group/AccordionGroup.js +0 -188
- package/dist/accordion-group/AccordionGroup.stories.js +0 -207
- package/dist/accordion-group/readme.md +0 -70
- package/dist/alert/Alert.js +0 -388
- 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/badge/Badge.js +0 -61
- package/dist/button/Button.js +0 -228
- package/dist/button/Button.stories.js +0 -224
- 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/variables.js +0 -1154
- 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.js +0 -492
- 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.js +0 -405
- 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.js +0 -431
- 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_blk_rgb.svg +0 -6
- 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/layout/facebook.svg +0 -45
- package/dist/layout/linkedin.svg +0 -50
- package/dist/layout/twitter.svg +0 -53
- package/dist/link/Link.js +0 -212
- package/dist/link/readme.md +0 -51
- package/dist/paginator/Paginator.js +0 -283
- 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.js +0 -206
- 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.js +0 -525
- package/dist/select/Select.stories.js +0 -235
- package/dist/select/readme.md +0 -72
- package/dist/slider/Slider.js +0 -315
- package/dist/slider/Slider.stories.js +0 -241
- package/dist/slider/readme.md +0 -64
- package/dist/spinner/Spinner.js +0 -214
- 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/table/Table.js +0 -122
- package/dist/tabs/Tabs.js +0 -347
- package/dist/tabs/Tabs.stories.js +0 -130
- package/dist/tabs/readme.md +0 -78
- package/dist/tabs-for-sections/TabsForSections.js +0 -92
- 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/toggle-group/ToggleGroup.js +0 -241
- package/dist/toggle-group/readme.md +0 -82
- package/dist/upload/Upload.stories.js +0 -72
- package/dist/upload/buttons-upload/ButtonsUpload.js +0 -135
- 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/DragAndDropArea.js +0 -325
- package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
- package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
- package/dist/upload/file-upload/FileToUpload.js +0 -184
- 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/Transaction.js +0 -171
- 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/upload/transactions/Transactions.js +0 -138
- package/dist/wizard/Wizard.js +0 -383
- 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/Accordion.test.js +0 -33
- package/test/AccordionGroup.test.js +0 -125
- package/test/Alert.test.js +0 -53
- package/test/Box.test.js +0 -10
- package/test/Button.test.js +0 -18
- package/test/Card.test.js +0 -30
- package/test/Checkbox.test.js +0 -45
- package/test/Chip.test.js +0 -25
- package/test/Date.test.js +0 -393
- package/test/Dialog.test.js +0 -23
- package/test/Dropdown.test.js +0 -130
- package/test/Footer.test.js +0 -99
- package/test/Header.test.js +0 -39
- package/test/Heading.test.js +0 -35
- package/test/InputText.test.js +0 -240
- package/test/Link.test.js +0 -42
- package/test/Paginator.test.js +0 -177
- package/test/ProgressBar.test.js +0 -35
- package/test/Radio.test.js +0 -37
- package/test/ResultsetTable.test.js +0 -330
- package/test/Select.test.js +0 -192
- package/test/Sidenav.test.js +0 -45
- package/test/Slider.test.js +0 -82
- package/test/Spinner.test.js +0 -27
- package/test/Switch.test.js +0 -45
- package/test/Table.test.js +0 -36
- package/test/Tabs.test.js +0 -109
- package/test/TabsForSections.test.js +0 -34
- package/test/Tag.test.js +0 -32
- package/test/TextArea.test.js +0 -52
- package/test/ToggleGroup.test.js +0 -81
- package/test/Upload.test.js +0 -60
- package/test/Wizard.test.js +0 -130
- package/test/mocks/pngMock.js +0 -1
- package/test/mocks/svgMock.js +0 -1
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
4
|
-
|
|
5
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
6
4
|
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
@@ -25,136 +25,40 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
25
25
|
|
|
26
26
|
var _variables = require("../common/variables.js");
|
|
27
27
|
|
|
28
|
-
var
|
|
29
|
-
|
|
30
|
-
var _twitter = _interopRequireDefault(require("./twitter.svg"));
|
|
31
|
-
|
|
32
|
-
var _facebook = _interopRequireDefault(require("./facebook.svg"));
|
|
28
|
+
var _Icons = require("./Icons");
|
|
33
29
|
|
|
34
30
|
var _useTheme = _interopRequireDefault(require("../useTheme.js"));
|
|
35
31
|
|
|
36
|
-
|
|
37
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n justify-content: center;\n position: sticky;\n top: 45vh;\n width: 42px;\n min-height: 42px;\n background-color: ", ";\n border-radius: 50%;\n transform: ", ";\n transition: transform 0.4s ease-in-out;\n z-index: 1250;\n cursor: pointer;\n & > svg {\n fill: ", ";\n }\n"]);
|
|
38
|
-
|
|
39
|
-
_templateObject10 = function _templateObject10() {
|
|
40
|
-
return data;
|
|
41
|
-
};
|
|
42
|
-
|
|
43
|
-
return data;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
function _templateObject9() {
|
|
47
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n position: absolute;\n height: calc(100vh - 64px);\n left: 279px;\n"]);
|
|
48
|
-
|
|
49
|
-
_templateObject9 = function _templateObject9() {
|
|
50
|
-
return data;
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
return data;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
function _templateObject8() {
|
|
57
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: row;\n z-index: 1200;\n transform: ", ";\n transition: transform 0.4s ease-in-out;\n height: calc(100vh - 64px);\n position: sticky;\n top: 64px;\n"]);
|
|
58
|
-
|
|
59
|
-
_templateObject8 = function _templateObject8() {
|
|
60
|
-
return data;
|
|
61
|
-
};
|
|
62
|
-
|
|
63
|
-
return data;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
function _templateObject7() {
|
|
67
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n flex-grow: 1;\n position: relative;\n min-height: calc(100vh - 184px);\n margin-left: ", ";\n transition: margin 0.4s ease-in-out;\n"]);
|
|
68
|
-
|
|
69
|
-
_templateObject7 = function _templateObject7() {
|
|
70
|
-
return data;
|
|
71
|
-
};
|
|
72
|
-
|
|
73
|
-
return data;
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
function _templateObject6() {
|
|
77
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n margin-left: ", ";\n transition: margin 0.4s ease-in-out;\n"]);
|
|
32
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
|
|
78
33
|
|
|
79
|
-
|
|
80
|
-
return data;
|
|
81
|
-
};
|
|
82
|
-
|
|
83
|
-
return data;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
function _templateObject5() {
|
|
87
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n width: 100%;\n min-width: 0;\n display: flex;\n flex-direction: column;\n"]);
|
|
88
|
-
|
|
89
|
-
_templateObject5 = function _templateObject5() {
|
|
90
|
-
return data;
|
|
91
|
-
};
|
|
92
|
-
|
|
93
|
-
return data;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
function _templateObject4() {
|
|
97
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex: 1 1 auto;\n align-items: flex-start;\n"]);
|
|
98
|
-
|
|
99
|
-
_templateObject4 = function _templateObject4() {
|
|
100
|
-
return data;
|
|
101
|
-
};
|
|
102
|
-
|
|
103
|
-
return data;
|
|
104
|
-
}
|
|
34
|
+
var _excluded = ["displayArrow", "mode"];
|
|
105
35
|
|
|
106
|
-
function
|
|
107
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n flex: 1;\n display: flex;\n flex-direction: column;\n"]);
|
|
108
|
-
|
|
109
|
-
_templateObject3 = function _templateObject3() {
|
|
110
|
-
return data;
|
|
111
|
-
};
|
|
112
|
-
|
|
113
|
-
return data;
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
function _templateObject2() {
|
|
117
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n z-index: 1250;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n"]);
|
|
118
|
-
|
|
119
|
-
_templateObject2 = function _templateObject2() {
|
|
120
|
-
return data;
|
|
121
|
-
};
|
|
122
|
-
|
|
123
|
-
return data;
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
function _templateObject() {
|
|
127
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 64px;\n bottom: 0;\n left: 0;\n right:0;\n"]);
|
|
128
|
-
|
|
129
|
-
_templateObject = function _templateObject() {
|
|
130
|
-
return data;
|
|
131
|
-
};
|
|
36
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
132
37
|
|
|
133
|
-
|
|
134
|
-
}
|
|
38
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
135
39
|
|
|
136
40
|
var year = new Date().getFullYear();
|
|
137
41
|
|
|
138
42
|
var Header = function Header(_ref) {
|
|
139
43
|
var children = _ref.children;
|
|
140
|
-
return _react["default"].createElement(_react["default"].Fragment, null, children);
|
|
44
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, children);
|
|
141
45
|
};
|
|
142
46
|
|
|
143
47
|
var Main = function Main(_ref2) {
|
|
144
48
|
var children = _ref2.children;
|
|
145
|
-
return _react["default"].createElement(_react["default"].Fragment, null, children);
|
|
49
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, children);
|
|
146
50
|
};
|
|
147
51
|
|
|
148
52
|
var Footer = function Footer(_ref3) {
|
|
149
53
|
var children = _ref3.children;
|
|
150
|
-
return _react["default"].createElement(_react["default"].Fragment, null, children);
|
|
54
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, children);
|
|
151
55
|
};
|
|
152
56
|
|
|
153
57
|
var SideNav = function SideNav(props) {
|
|
154
58
|
var displayArrow = props.displayArrow,
|
|
155
59
|
mode = props.mode,
|
|
156
|
-
childProps = (0, _objectWithoutProperties2["default"])(props,
|
|
157
|
-
return _react["default"].createElement(_main.DxcSidenav, childProps, childProps.children);
|
|
60
|
+
childProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
|
|
61
|
+
return /*#__PURE__*/_react["default"].createElement(_main.DxcSidenav, childProps, childProps.children);
|
|
158
62
|
};
|
|
159
63
|
|
|
160
64
|
SideNav.propTypes = {
|
|
@@ -169,7 +73,7 @@ SideNav.propTypes = {
|
|
|
169
73
|
};
|
|
170
74
|
|
|
171
75
|
var defaultFooter = function defaultFooter() {
|
|
172
|
-
return _react["default"].createElement(_main.DxcFooter, {
|
|
76
|
+
return /*#__PURE__*/_react["default"].createElement(_main.DxcFooter, {
|
|
173
77
|
copyright: "\xA9 DXC Technology ".concat(year, "\u200B\u200B\u200B\u200B. All rights reserved."),
|
|
174
78
|
bottomLinks: [{
|
|
175
79
|
href: "https://www.linkedin.com/company/dxctechnology",
|
|
@@ -183,19 +87,19 @@ var defaultFooter = function defaultFooter() {
|
|
|
183
87
|
}],
|
|
184
88
|
socialLinks: [{
|
|
185
89
|
href: "https://www.linkedin.com/company/dxctechnology",
|
|
186
|
-
|
|
90
|
+
logo: _Icons.linkedinLogo
|
|
187
91
|
}, {
|
|
188
92
|
href: "https://twitter.com/dxctechnology",
|
|
189
|
-
|
|
93
|
+
logo: _Icons.twitterLogo
|
|
190
94
|
}, {
|
|
191
95
|
href: "https://www.facebook.com/DXCTechnology/",
|
|
192
|
-
|
|
96
|
+
logo: _Icons.facebookLogo
|
|
193
97
|
}]
|
|
194
98
|
});
|
|
195
99
|
};
|
|
196
100
|
|
|
197
101
|
var defaultHeader = function defaultHeader() {
|
|
198
|
-
return _react["default"].createElement(_main.DxcHeader, {
|
|
102
|
+
return /*#__PURE__*/_react["default"].createElement(_main.DxcHeader, {
|
|
199
103
|
underlined: true
|
|
200
104
|
});
|
|
201
105
|
};
|
|
@@ -231,12 +135,12 @@ var DxcApplicationLayout = function DxcApplicationLayout(_ref4) {
|
|
|
231
135
|
var sideNavMode = sideNav && sideNav.props && sideNav.props.mode;
|
|
232
136
|
|
|
233
137
|
var ArrowIcon = function ArrowIcon() {
|
|
234
|
-
return _react["default"].createElement("svg", {
|
|
138
|
+
return /*#__PURE__*/_react["default"].createElement("svg", {
|
|
235
139
|
xmlns: "http://www.w3.org/2000/svg",
|
|
236
140
|
width: "15.995",
|
|
237
141
|
height: "10.01",
|
|
238
142
|
viewBox: "0 0 15.995 10.01"
|
|
239
|
-
}, _react["default"].createElement("path", {
|
|
143
|
+
}, /*#__PURE__*/_react["default"].createElement("path", {
|
|
240
144
|
"data-testid": "arrow-to-right",
|
|
241
145
|
d: "M17.71,11.29l-4-4a1,1,0,0,0-1.42,1.42L14.59,11H3a1,1,0,0,0,0,2H14.59l-2.3,2.29a1,1,0,1,0,1.42,1.42l4-4a1.034,1.034,0,0,0,0-1.42Z",
|
|
242
146
|
transform: "translate(-2 -6.996)"
|
|
@@ -269,21 +173,21 @@ var DxcApplicationLayout = function DxcApplicationLayout(_ref4) {
|
|
|
269
173
|
setIsSideNavVisible(!isSideNavVisible);
|
|
270
174
|
};
|
|
271
175
|
|
|
272
|
-
return _react["default"].createElement(_styledComponents.ThemeProvider, {
|
|
176
|
+
return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
|
|
273
177
|
theme: colorsTheme.sidenav
|
|
274
|
-
}, _react["default"].createElement(ApplicationLayoutContainer, {
|
|
178
|
+
}, /*#__PURE__*/_react["default"].createElement(ApplicationLayoutContainer, {
|
|
275
179
|
ref: ref
|
|
276
|
-
}, _react["default"].createElement(HeaderContainer, null, header), _react["default"].createElement(BodyContainer, null, _react["default"].createElement(ContentContainer, null, _react["default"].createElement(SideNavArrowContainer, {
|
|
180
|
+
}, /*#__PURE__*/_react["default"].createElement(HeaderContainer, null, header), /*#__PURE__*/_react["default"].createElement(BodyContainer, null, /*#__PURE__*/_react["default"].createElement(ContentContainer, null, /*#__PURE__*/_react["default"].createElement(SideNavArrowContainer, {
|
|
277
181
|
isSideNavVisible: isSideNavVisible
|
|
278
|
-
}, sideNav, _react["default"].createElement(ArrowContainer, null, sideNav && (displayArrow || isResponsive) && _react["default"].createElement(ArrowTrigger, {
|
|
182
|
+
}, sideNav, /*#__PURE__*/_react["default"].createElement(ArrowContainer, null, sideNav && (displayArrow || isResponsive) && /*#__PURE__*/_react["default"].createElement(ArrowTrigger, {
|
|
279
183
|
tabIndex: 0,
|
|
280
184
|
onClick: handleSidenav,
|
|
281
185
|
isSideNavVisible: isSideNavVisible
|
|
282
|
-
}, _react["default"].createElement(ArrowIcon, null)))), _react["default"].createElement(MainBodyContainer, null, _react["default"].createElement(MainContent, {
|
|
186
|
+
}, /*#__PURE__*/_react["default"].createElement(ArrowIcon, null)))), /*#__PURE__*/_react["default"].createElement(MainBodyContainer, null, /*#__PURE__*/_react["default"].createElement(MainContent, {
|
|
283
187
|
sideNav: sideNav,
|
|
284
188
|
mode: isResponsive ? "overlay" : sideNavMode,
|
|
285
189
|
isSideNavVisible: isSideNavVisible
|
|
286
|
-
}, main), _react["default"].createElement(FooterContainer, {
|
|
190
|
+
}, main), /*#__PURE__*/_react["default"].createElement(FooterContainer, {
|
|
287
191
|
sideNav: sideNav,
|
|
288
192
|
mode: isResponsive ? "overlay" : sideNavMode,
|
|
289
193
|
isSideNavVisible: isSideNavVisible
|
|
@@ -295,31 +199,31 @@ DxcApplicationLayout.Main = Main;
|
|
|
295
199
|
DxcApplicationLayout.Footer = Footer;
|
|
296
200
|
DxcApplicationLayout.SideNav = SideNav;
|
|
297
201
|
|
|
298
|
-
var ApplicationLayoutContainer = _styledComponents["default"].div(_templateObject());
|
|
202
|
+
var ApplicationLayoutContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 64px;\n bottom: 0;\n left: 0;\n right: 0;\n"])));
|
|
299
203
|
|
|
300
|
-
var HeaderContainer = _styledComponents["default"].div(_templateObject2());
|
|
204
|
+
var HeaderContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n z-index: 1250;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n"])));
|
|
301
205
|
|
|
302
|
-
var BodyContainer = _styledComponents["default"].div(_templateObject3());
|
|
206
|
+
var BodyContainer = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n flex: 1;\n display: flex;\n flex-direction: column;\n"])));
|
|
303
207
|
|
|
304
|
-
var ContentContainer = _styledComponents["default"].div(_templateObject4());
|
|
208
|
+
var ContentContainer = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex: 1 1 auto;\n align-items: flex-start;\n"])));
|
|
305
209
|
|
|
306
|
-
var MainBodyContainer = _styledComponents["default"].div(_templateObject5());
|
|
210
|
+
var MainBodyContainer = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n width: 100%;\n min-width: 0;\n display: flex;\n flex-direction: column;\n"])));
|
|
307
211
|
|
|
308
|
-
var FooterContainer = _styledComponents["default"].div(_templateObject6(), function (props) {
|
|
212
|
+
var FooterContainer = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n margin-left: ", ";\n transition: margin 0.4s ease-in-out;\n"])), function (props) {
|
|
309
213
|
return props.sideNav ? props.mode === "push" && !props.isSideNavVisible || props.mode === "overlay" ? "-300px" : "" : "";
|
|
310
214
|
});
|
|
311
215
|
|
|
312
|
-
var MainContent = _styledComponents["default"].div(_templateObject7(), function (props) {
|
|
216
|
+
var MainContent = _styledComponents["default"].div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n flex-grow: 1;\n position: relative;\n min-height: calc(100vh - 184px);\n margin-left: ", ";\n transition: margin 0.4s ease-in-out;\n"])), function (props) {
|
|
313
217
|
return props.sideNav ? props.mode === "push" && props.isSideNavVisible ? "" : "-297px" : "";
|
|
314
218
|
});
|
|
315
219
|
|
|
316
|
-
var SideNavArrowContainer = _styledComponents["default"].div(_templateObject8(), function (props) {
|
|
220
|
+
var SideNavArrowContainer = _styledComponents["default"].div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: row;\n z-index: 1200;\n transform: ", ";\n transition: transform 0.4s ease-in-out;\n height: calc(100vh - 64px);\n position: sticky;\n top: 64px;\n"])), function (props) {
|
|
317
221
|
return props.isSideNavVisible ? "translateX(0)" : !props.isSideNavVisible ? "translateX(-100%)" : "";
|
|
318
222
|
});
|
|
319
223
|
|
|
320
|
-
var ArrowContainer = _styledComponents["default"].div(_templateObject9());
|
|
224
|
+
var ArrowContainer = _styledComponents["default"].div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["\n position: absolute;\n height: calc(100vh - 64px);\n left: 279px;\n"])));
|
|
321
225
|
|
|
322
|
-
var ArrowTrigger = _styledComponents["default"].div(_templateObject10(), function (props) {
|
|
226
|
+
var ArrowTrigger = _styledComponents["default"].div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n justify-content: center;\n position: sticky;\n top: 45vh;\n width: 42px;\n min-height: 42px;\n background-color: ", ";\n border-radius: 50%;\n transform: ", ";\n transition: transform 0.4s ease-in-out;\n z-index: 1250;\n cursor: pointer;\n & > svg {\n fill: ", ";\n }\n"])), function (props) {
|
|
323
227
|
return "".concat(props.theme.arrowContainerColor);
|
|
324
228
|
}, function (props) {
|
|
325
229
|
return props.isSideNavVisible ? "rotate(-180deg)" : "rotate(0deg)";
|
package/layout/Icons.js
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.twitterLogo = exports.linkedinLogo = exports.facebookLogo = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
var facebookLogo = /*#__PURE__*/_react["default"].createElement("svg", {
|
|
13
|
+
version: "1.1",
|
|
14
|
+
id: "Capa_1",
|
|
15
|
+
x: "0px",
|
|
16
|
+
y: "0px",
|
|
17
|
+
width: "438.536px",
|
|
18
|
+
height: "438.536px",
|
|
19
|
+
viewBox: "0 0 438.536 438.536",
|
|
20
|
+
fill: "#FFFFFF"
|
|
21
|
+
}, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
|
|
22
|
+
d: "M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123 C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126 h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225 C438.532,59.576,430.49,40.204,414.41,24.123z M373.155,225.548h-49.963V406.84h-74.802V225.548H210.99V163.02h37.401v-37.402 c0-26.838,6.283-47.107,18.843-60.813c12.559-13.706,33.304-20.555,62.242-20.555h49.963v62.526h-31.401 c-10.663,0-17.467,1.853-20.417,5.568c-2.949,3.711-4.428,10.23-4.428,19.558v31.119h56.534L373.155,225.548z"
|
|
23
|
+
})));
|
|
24
|
+
|
|
25
|
+
exports.facebookLogo = facebookLogo;
|
|
26
|
+
|
|
27
|
+
var twitterLogo = /*#__PURE__*/_react["default"].createElement("svg", {
|
|
28
|
+
version: "1.1",
|
|
29
|
+
id: "Capa_1",
|
|
30
|
+
x: "0px",
|
|
31
|
+
y: "0px",
|
|
32
|
+
width: "438.536px",
|
|
33
|
+
height: "438.536px",
|
|
34
|
+
viewBox: "0 0 438.536 438.536",
|
|
35
|
+
fill: "#FFFFFF"
|
|
36
|
+
}, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
|
|
37
|
+
d: "M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123 C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126 h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225 C438.532,59.576,430.49,40.204,414.41,24.123z M335.471,168.735c0.191,1.713,0.288,4.278,0.288,7.71 c0,15.989-2.334,32.025-6.995,48.104c-4.661,16.087-11.8,31.504-21.416,46.254c-9.606,14.749-21.074,27.791-34.396,39.115 c-13.325,11.32-29.311,20.365-47.968,27.117c-18.648,6.762-38.637,10.143-59.953,10.143c-33.116,0-63.76-8.952-91.931-26.836 c4.568,0.568,9.329,0.855,14.275,0.855c27.6,0,52.439-8.565,74.519-25.7c-12.941-0.185-24.506-4.179-34.688-11.991 c-10.185-7.803-17.273-17.699-21.271-29.691c4.947,0.76,8.658,1.137,11.132,1.137c4.187,0,9.042-0.76,14.56-2.279 c-13.894-2.669-25.598-9.562-35.115-20.697c-9.519-11.136-14.277-23.84-14.277-38.114v-0.571 c10.085,4.755,19.602,7.229,28.549,7.422c-17.321-11.613-25.981-28.265-25.981-49.963c0-10.66,2.758-20.747,8.278-30.264 c15.035,18.464,33.311,33.213,54.816,44.252c21.507,11.038,44.54,17.227,69.092,18.558c-0.95-3.616-1.427-8.186-1.427-13.704 c0-16.562,5.853-30.692,17.56-42.399c11.703-11.706,25.837-17.561,42.394-17.561c17.515,0,32.079,6.283,43.688,18.846 c13.134-2.474,25.892-7.33,38.26-14.56c-4.757,14.652-13.613,25.788-26.55,33.402c12.368-1.716,23.88-4.95,34.537-9.708 C357.458,149.793,347.462,160.166,335.471,168.735z"
|
|
38
|
+
})));
|
|
39
|
+
|
|
40
|
+
exports.twitterLogo = twitterLogo;
|
|
41
|
+
|
|
42
|
+
var linkedinLogo = /*#__PURE__*/_react["default"].createElement("svg", {
|
|
43
|
+
version: "1.1",
|
|
44
|
+
id: "Capa_1",
|
|
45
|
+
x: "0px",
|
|
46
|
+
y: "0px",
|
|
47
|
+
width: "438.536px",
|
|
48
|
+
height: "438.536px",
|
|
49
|
+
viewBox: "0 0 438.536 438.536",
|
|
50
|
+
fill: "#FFFFFF"
|
|
51
|
+
}, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
|
|
52
|
+
d: "M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123 C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126 h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225 C438.532,59.576,430.49,40.204,414.41,24.123z M133.618,367.157H67.666V169.016h65.952V367.157z M127.626,132.332 c-6.851,6.567-15.893,9.851-27.124,9.851h-0.288c-10.848,0-19.648-3.284-26.407-9.851c-6.76-6.567-10.138-14.703-10.138-24.41 c0-9.897,3.476-18.083,10.421-24.556c6.95-6.471,15.942-9.708,26.98-9.708c11.039,0,19.89,3.237,26.553,9.708 c6.661,6.473,10.088,14.659,10.277,24.556C137.899,117.625,134.477,125.761,127.626,132.332z M370.873,367.157h-65.952v-105.92 c0-29.879-11.036-44.823-33.116-44.823c-8.374,0-15.42,2.331-21.128,6.995c-5.715,4.661-9.996,10.324-12.847,16.991 c-1.335,3.422-1.999,8.75-1.999,15.981v110.775h-65.952c0.571-119.529,0.571-185.579,0-198.142h65.952v27.974 c13.867-21.681,33.558-32.544,59.101-32.544c22.84,0,41.21,7.52,55.104,22.554c13.895,15.037,20.841,37.214,20.841,66.519v113.64 H370.873z"
|
|
53
|
+
})));
|
|
54
|
+
|
|
55
|
+
exports.linkedinLogo = linkedinLogo;
|
package/link/Link.js
ADDED
|
@@ -0,0 +1,183 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _typeof3 = require("@babel/runtime/helpers/typeof");
|
|
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 _react = _interopRequireDefault(require("react"));
|
|
19
|
+
|
|
20
|
+
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
21
|
+
|
|
22
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
23
|
+
|
|
24
|
+
var _variables = require("../common/variables.js");
|
|
25
|
+
|
|
26
|
+
var _useTheme = _interopRequireDefault(require("../useTheme.js"));
|
|
27
|
+
|
|
28
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
29
|
+
|
|
30
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
31
|
+
|
|
32
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
33
|
+
|
|
34
|
+
var DxcLink = function DxcLink(_ref) {
|
|
35
|
+
var _ref$inheritColor = _ref.inheritColor,
|
|
36
|
+
inheritColor = _ref$inheritColor === void 0 ? false : _ref$inheritColor,
|
|
37
|
+
_ref$disabled = _ref.disabled,
|
|
38
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
39
|
+
iconSrc = _ref.iconSrc,
|
|
40
|
+
icon = _ref.icon,
|
|
41
|
+
_ref$iconPosition = _ref.iconPosition,
|
|
42
|
+
iconPosition = _ref$iconPosition === void 0 ? "before" : _ref$iconPosition,
|
|
43
|
+
_ref$href = _ref.href,
|
|
44
|
+
href = _ref$href === void 0 ? "" : _ref$href,
|
|
45
|
+
_ref$newWindow = _ref.newWindow,
|
|
46
|
+
newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
|
|
47
|
+
onClick = _ref.onClick,
|
|
48
|
+
_ref$text = _ref.text,
|
|
49
|
+
text = _ref$text === void 0 ? "" : _ref$text,
|
|
50
|
+
margin = _ref.margin,
|
|
51
|
+
_ref$tabIndex = _ref.tabIndex,
|
|
52
|
+
tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
|
|
53
|
+
var colorsTheme = (0, _useTheme["default"])();
|
|
54
|
+
|
|
55
|
+
var linkContent = /*#__PURE__*/_react["default"].createElement(LinkText, {
|
|
56
|
+
iconPosition: iconPosition
|
|
57
|
+
}, text, icon ? /*#__PURE__*/_react["default"].createElement(LinkIconContainer, {
|
|
58
|
+
iconPosition: iconPosition
|
|
59
|
+
}, (0, _typeof2["default"])(icon) === "object" ? icon : /*#__PURE__*/_react["default"].createElement(icon)) : iconSrc && /*#__PURE__*/_react["default"].createElement(LinkIcon, {
|
|
60
|
+
src: iconSrc,
|
|
61
|
+
iconPosition: iconPosition
|
|
62
|
+
}));
|
|
63
|
+
|
|
64
|
+
return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
|
|
65
|
+
theme: colorsTheme.link
|
|
66
|
+
}, /*#__PURE__*/_react["default"].createElement(DxcLinkContainer, {
|
|
67
|
+
margin: margin
|
|
68
|
+
}, onClick ? /*#__PURE__*/_react["default"].createElement(StyledButton, {
|
|
69
|
+
type: "button",
|
|
70
|
+
onClick: !disabled && onClick,
|
|
71
|
+
margin: margin,
|
|
72
|
+
disabled: disabled,
|
|
73
|
+
inheritColor: inheritColor
|
|
74
|
+
}, linkContent) : /*#__PURE__*/_react["default"].createElement(StyledLink, {
|
|
75
|
+
tabIndex: tabIndex,
|
|
76
|
+
href: !disabled && href,
|
|
77
|
+
target: newWindow ? "_blank" : "_self",
|
|
78
|
+
margin: margin,
|
|
79
|
+
disabled: disabled,
|
|
80
|
+
inheritColor: inheritColor
|
|
81
|
+
}, linkContent)));
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
var DxcLinkContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n display: inline-flex;\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"])), function (props) {
|
|
85
|
+
return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
|
|
86
|
+
}, function (props) {
|
|
87
|
+
return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
|
|
88
|
+
}, function (props) {
|
|
89
|
+
return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
|
|
90
|
+
}, function (props) {
|
|
91
|
+
return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
|
|
92
|
+
}, function (props) {
|
|
93
|
+
return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
|
|
94
|
+
});
|
|
95
|
+
|
|
96
|
+
var StyledLink = _styledComponents["default"].a(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n ", "\n\n text-decoration-color: transparent;\n ", "\n\n &:visited {\n color: ", ";\n &:hover {\n ", "\n }\n }\n &:hover {\n ", "\n }\n &:focus {\n outline-color: ", ";\n outline-width: 2px;\n ", "\n }\n &:active {\n ", "\n }\n"])), function (props) {
|
|
97
|
+
return props.inheritColor ? "inherit" : !props.disabled ? props.theme.fontColor : props.theme.disabledColor;
|
|
98
|
+
}, function (props) {
|
|
99
|
+
return props.disabled ? "pointer-events: none;" : "";
|
|
100
|
+
}, function (props) {
|
|
101
|
+
return "padding-bottom: ".concat(props.theme.underlineSpacing, ";\n border-bottom: ").concat(props.theme.underlineThickness, " ").concat(props.theme.underlineStyle, " transparent;");
|
|
102
|
+
}, function (props) {
|
|
103
|
+
return !props.inheritColor ? props.theme.visitedFontColor : "";
|
|
104
|
+
}, function (props) {
|
|
105
|
+
return "color: ".concat(props.theme.visitedFontColor, ";\n border-bottom-color: ").concat(props.theme.visitedUnderlineColor, ";");
|
|
106
|
+
}, function (props) {
|
|
107
|
+
return "color: ".concat(props.theme.hoverFontColor, ";\n border-bottom-color: ").concat(props.theme.hoverUnderlineColor, ";\n cursor: pointer;");
|
|
108
|
+
}, function (props) {
|
|
109
|
+
return props.theme.focusColor;
|
|
110
|
+
}, function (props) {
|
|
111
|
+
return props.disabled && "outline: none";
|
|
112
|
+
}, function (props) {
|
|
113
|
+
return "color: ".concat(props.theme.activeFontColor, " !important;\n border-bottom-color: ").concat(props.theme.activeUnderlineColor, " !important;");
|
|
114
|
+
});
|
|
115
|
+
|
|
116
|
+
var StyledButton = _styledComponents["default"].button(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n background: none;\n border: none;\n padding: 0;\n cursor: pointer;\n font-family: inherit;\n text-decoration-color: transparent;\n\n ", "\n ", "\n color: ", ";\n ", "\n\n &:hover {\n ", "\n }\n &:focus {\n outline-color: ", ";\n outline-width: 2px;\n outline-offset: 1px;\n ", "\n }\n &:active {\n ", "\n }\n"])), function (props) {
|
|
117
|
+
return "padding-bottom: ".concat(props.theme.underlineSpacing, ";\n border-bottom: ").concat(props.theme.underlineThickness, " ").concat(props.theme.underlineStyle, " transparent;");
|
|
118
|
+
}, function (props) {
|
|
119
|
+
return props.disabled && "cursor: default;";
|
|
120
|
+
}, function (props) {
|
|
121
|
+
return props.inheritColor ? "inherit" : !props.disabled ? props.theme.fontColor : props.theme.disabledColor;
|
|
122
|
+
}, function (props) {
|
|
123
|
+
return props.disabled ? "pointer-events: none;" : "";
|
|
124
|
+
}, function (props) {
|
|
125
|
+
return "color: ".concat(props.theme.hoverFontColor, ";\n border-bottom-color: ").concat(props.theme.hoverUnderlineColor, ";\n cursor: pointer;");
|
|
126
|
+
}, function (props) {
|
|
127
|
+
return props.theme.focusColor;
|
|
128
|
+
}, function (props) {
|
|
129
|
+
return props.disabled && "outline: none";
|
|
130
|
+
}, function (props) {
|
|
131
|
+
return "color: ".concat(props.theme.activeFontColor, " !important;\n border-bottom-color: ").concat(props.theme.activeUnderlineColor, " !important;");
|
|
132
|
+
});
|
|
133
|
+
|
|
134
|
+
var LinkText = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n font-size: ", ";\n font-weight: ", ";\n font-style: ", ";\n font-family: ", ";\n display: inline-flex;\n flex-direction: ", ";\n justify-content: ", ";\n align-items: center;\n max-width: 100%;\n"])), function (props) {
|
|
135
|
+
return props.theme.fontSize;
|
|
136
|
+
}, function (props) {
|
|
137
|
+
return props.theme.fontWeight;
|
|
138
|
+
}, function (props) {
|
|
139
|
+
return props.theme.fontStyle;
|
|
140
|
+
}, function (props) {
|
|
141
|
+
return props.theme.fontFamily;
|
|
142
|
+
}, function (props) {
|
|
143
|
+
return props.iconPosition === "after" ? "row" : "row-reverse";
|
|
144
|
+
}, function (props) {
|
|
145
|
+
return props.iconPosition === "after" ? "flex-start" : "flex-end";
|
|
146
|
+
});
|
|
147
|
+
|
|
148
|
+
var LinkIcon = _styledComponents["default"].img(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n width: ", ";\n height: ", ";\n ", ";\n"])), function (props) {
|
|
149
|
+
return props.theme.iconSize;
|
|
150
|
+
}, function (props) {
|
|
151
|
+
return props.theme.iconSize;
|
|
152
|
+
}, function (props) {
|
|
153
|
+
return "".concat(props.iconPosition === "before" ? "margin-right" : "margin-left", ": ").concat(props.theme.iconSpacing);
|
|
154
|
+
});
|
|
155
|
+
|
|
156
|
+
var LinkIconContainer = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n width: ", ";\n height: ", ";\n ", ";\n overflow: hidden;\n \n img,\n svg {\n height: 100%;\n width: 100%;\n }\n"])), function (props) {
|
|
157
|
+
return props.theme.iconSize;
|
|
158
|
+
}, function (props) {
|
|
159
|
+
return props.theme.iconSize;
|
|
160
|
+
}, function (props) {
|
|
161
|
+
return "".concat(props.iconPosition === "before" ? "margin-right" : "margin-left", ": ").concat(props.theme.iconSpacing);
|
|
162
|
+
});
|
|
163
|
+
|
|
164
|
+
DxcLink.propTypes = {
|
|
165
|
+
inheritColor: _propTypes["default"].bool,
|
|
166
|
+
disabled: _propTypes["default"].bool,
|
|
167
|
+
icon: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
|
|
168
|
+
iconSrc: _propTypes["default"].string,
|
|
169
|
+
iconPosition: _propTypes["default"].oneOf(["after", "before"]),
|
|
170
|
+
href: _propTypes["default"].string,
|
|
171
|
+
onClick: _propTypes["default"].func,
|
|
172
|
+
margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
|
|
173
|
+
top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
174
|
+
bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
175
|
+
left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
176
|
+
right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
|
|
177
|
+
}), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
|
|
178
|
+
newWindow: _propTypes["default"].bool,
|
|
179
|
+
text: _propTypes["default"].string,
|
|
180
|
+
tabIndex: _propTypes["default"].number
|
|
181
|
+
};
|
|
182
|
+
var _default = DxcLink;
|
|
183
|
+
exports["default"] = _default;
|
package/link/index.d.ts
ADDED
|
@@ -0,0 +1,23 @@
|
|
|
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
|
+
|
|
9
|
+
type Props = {
|
|
10
|
+
inheritColor?: boolean;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
iconSrc?: string;
|
|
13
|
+
icon?: any;
|
|
14
|
+
iconPosition?: "before" | "after";
|
|
15
|
+
href?: string;
|
|
16
|
+
newWindow?: boolean;
|
|
17
|
+
onClick?: void;
|
|
18
|
+
text?: string;
|
|
19
|
+
margin?: Space | Margin;
|
|
20
|
+
tabIndex?: number;
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
export default function DxcLink(props: Props): JSX.Element;
|
package/main.d.ts
ADDED
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import DxcAlert from "./alert/Alert";
|
|
2
|
+
import DxcAccordion from "./accordion/Accordion";
|
|
3
|
+
import DxcButton from "./button/Button";
|
|
4
|
+
import DxcCard from "./card/Card";
|
|
5
|
+
import DxcCheckbox from "./checkbox/Checkbox";
|
|
6
|
+
import DxcDate from "./date/Date";
|
|
7
|
+
import DxcDialog from "./dialog/Dialog";
|
|
8
|
+
import DxcDropdown from "./dropdown/Dropdown";
|
|
9
|
+
import DxcFooter from "./footer/Footer";
|
|
10
|
+
import DxcHeader from "./header/Header";
|
|
11
|
+
import DxcInput from "./input-text/InputText";
|
|
12
|
+
import DxcRadio from "./radio/Radio";
|
|
13
|
+
import V3DxcSelect from "./V3Select/V3Select";
|
|
14
|
+
import DxcSlider from "./slider/Slider";
|
|
15
|
+
import DxcSwitch from "./switch/Switch";
|
|
16
|
+
import DxcTabs from "./tabs/Tabs";
|
|
17
|
+
import DxcProgressBar from "./progress-bar/ProgressBar";
|
|
18
|
+
import DxcSpinner from "./spinner/Spinner";
|
|
19
|
+
import DxcUpload from "./upload/Upload";
|
|
20
|
+
import DxcTable from "./table/Table";
|
|
21
|
+
import DxcBox from "./box/Box";
|
|
22
|
+
import DxcTag from "./tag/Tag";
|
|
23
|
+
import DxcPaginator from "./paginator/Paginator";
|
|
24
|
+
import DxcSidenav from "./sidenav/Sidenav";
|
|
25
|
+
import DxcWizard from "./wizard/Wizard";
|
|
26
|
+
import DxcLink from "./link/Link";
|
|
27
|
+
import DxcHeading from "./heading/Heading";
|
|
28
|
+
import V3DxcTextarea from "./V3Textarea/V3Textarea";
|
|
29
|
+
import DxcResultsetTable from "./resultsetTable/ResultsetTable";
|
|
30
|
+
import DxcChip from "./chip/Chip";
|
|
31
|
+
import DxcApplicationLayout from "./layout/ApplicationLayout";
|
|
32
|
+
import DxcToggleGroup from "./toggle-group/ToggleGroup";
|
|
33
|
+
import DxcAccordionGroup from "./accordion-group/AccordionGroup";
|
|
34
|
+
import DxcBadge from "./badge/Badge";
|
|
35
|
+
import DxcTextInput from "./text-input/TextInput";
|
|
36
|
+
import DxcPasswordInput from "./password-input/PasswordInput";
|
|
37
|
+
import DxcDateInput from "./date-input/DateInput";
|
|
38
|
+
import DxcNumberInput from "./number-input/NumberInput";
|
|
39
|
+
import DxcTextarea from "./textarea/Textarea";
|
|
40
|
+
import DxcSelect from "./select/Select";
|
|
41
|
+
import DxcFileInput from "./file-input/FileInput";
|
|
42
|
+
import ThemeContext, { ThemeProvider } from "./ThemeContext.js";
|
|
43
|
+
import { BackgroundColorProvider } from "./BackgroundColorContext.js";
|
|
44
|
+
export { DxcAlert, DxcButton, DxcFooter, DxcCheckbox, V3DxcSelect, DxcInput, DxcTextInput, DxcDropdown, DxcSwitch, DxcSlider, DxcRadio, DxcDate, DxcHeader, DxcTable, DxcTabs, DxcToggleGroup, DxcDialog, DxcCard, DxcProgressBar, DxcAccordion, DxcSpinner, DxcUpload, DxcBox, DxcTag, DxcPaginator, DxcSidenav, DxcWizard, DxcLink, DxcHeading, V3DxcTextarea, DxcResultsetTable, DxcChip, DxcApplicationLayout, ThemeContext, ThemeProvider, BackgroundColorProvider, DxcAccordionGroup, DxcBadge, DxcPasswordInput, DxcDateInput, DxcNumberInput, DxcTextarea, DxcSelect, DxcFileInput, };
|