@dxc-technology/halstack-react 0.0.0-ebb089f → 0.0.0-ebe476f
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 +27 -47
- package/dist/index.d.mts +6683 -0
- package/dist/index.d.ts +6683 -0
- package/dist/index.js +1 -0
- package/dist/index.mjs +1 -0
- package/package.json +77 -71
- package/babel.config.js +0 -7
- package/dist/BackgroundColorContext.js +0 -46
- package/dist/ThemeContext.js +0 -250
- package/dist/V3Select/V3Select.js +0 -549
- package/dist/V3Select/index.d.ts +0 -27
- package/dist/V3Textarea/V3Textarea.js +0 -264
- package/dist/V3Textarea/index.d.ts +0 -27
- package/dist/accordion/Accordion.js +0 -353
- package/dist/accordion/index.d.ts +0 -28
- package/dist/accordion-group/AccordionGroup.js +0 -186
- package/dist/accordion-group/index.d.ts +0 -16
- package/dist/alert/Alert.js +0 -403
- package/dist/alert/index.d.ts +0 -51
- package/dist/badge/Badge.js +0 -63
- package/dist/box/Box.js +0 -156
- package/dist/box/index.d.ts +0 -25
- package/dist/button/Button.js +0 -238
- package/dist/button/Button.stories.js +0 -27
- package/dist/button/index.d.ts +0 -24
- package/dist/card/Card.js +0 -254
- package/dist/card/index.d.ts +0 -22
- package/dist/checkbox/Checkbox.js +0 -299
- package/dist/checkbox/index.d.ts +0 -24
- package/dist/chip/Chip.js +0 -265
- package/dist/chip/index.d.ts +0 -22
- package/dist/common/OpenSans.css +0 -81
- package/dist/common/RequiredComponent.js +0 -40
- package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
- package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
- package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
- package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
- package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
- package/dist/common/fonts/OpenSans-Light.ttf +0 -0
- package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
- package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
- package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
- package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
- package/dist/common/utils.js +0 -22
- package/dist/common/variables.js +0 -1574
- package/dist/date/Date.js +0 -379
- package/dist/date/index.d.ts +0 -27
- package/dist/date-input/DateInput.js +0 -400
- package/dist/date-input/index.d.ts +0 -95
- package/dist/dialog/Dialog.js +0 -218
- package/dist/dialog/index.d.ts +0 -18
- package/dist/dropdown/Dropdown.js +0 -544
- package/dist/dropdown/index.d.ts +0 -26
- package/dist/file-input/FileInput.js +0 -644
- package/dist/file-input/FileItem.js +0 -287
- package/dist/file-input/index.d.ts +0 -81
- package/dist/footer/Footer.js +0 -421
- package/dist/footer/Icons.js +0 -77
- package/dist/footer/index.d.ts +0 -25
- package/dist/header/Header.js +0 -470
- package/dist/header/Icons.js +0 -59
- package/dist/header/index.d.ts +0 -25
- package/dist/heading/Heading.js +0 -230
- package/dist/heading/index.d.ts +0 -17
- package/dist/input-text/Icons.js +0 -22
- package/dist/input-text/InputText.js +0 -705
- package/dist/input-text/index.d.ts +0 -36
- package/dist/layout/ApplicationLayout.js +0 -327
- package/dist/layout/Icons.js +0 -55
- package/dist/link/Link.js +0 -237
- package/dist/link/index.d.ts +0 -23
- package/dist/main.d.ts +0 -40
- package/dist/main.js +0 -359
- package/dist/number-input/NumberInput.js +0 -136
- package/dist/number-input/NumberInputContext.js +0 -16
- package/dist/number-input/index.d.ts +0 -113
- package/dist/paginator/Icons.js +0 -66
- package/dist/paginator/Paginator.js +0 -305
- package/dist/paginator/index.d.ts +0 -20
- package/dist/password-input/PasswordInput.js +0 -203
- package/dist/password-input/index.d.ts +0 -94
- package/dist/progress-bar/ProgressBar.js +0 -242
- package/dist/progress-bar/index.d.ts +0 -18
- package/dist/radio/Radio.js +0 -209
- package/dist/radio/index.d.ts +0 -23
- package/dist/resultsetTable/ResultsetTable.js +0 -358
- package/dist/resultsetTable/index.d.ts +0 -19
- package/dist/select/Select.js +0 -1137
- package/dist/select/index.d.ts +0 -131
- package/dist/sidenav/Sidenav.js +0 -179
- package/dist/sidenav/index.d.ts +0 -13
- package/dist/slider/Slider.js +0 -404
- package/dist/slider/index.d.ts +0 -29
- package/dist/spinner/Spinner.js +0 -381
- package/dist/spinner/index.d.ts +0 -17
- package/dist/switch/Switch.js +0 -222
- package/dist/switch/index.d.ts +0 -24
- package/dist/table/Table.js +0 -132
- package/dist/table/index.d.ts +0 -13
- package/dist/tabs/Tabs.js +0 -343
- package/dist/tabs/index.d.ts +0 -19
- package/dist/tag/Tag.js +0 -282
- package/dist/tag/index.d.ts +0 -24
- package/dist/text-input/TextInput.js +0 -974
- package/dist/text-input/index.d.ts +0 -135
- package/dist/textarea/Textarea.js +0 -369
- package/dist/textarea/index.d.ts +0 -117
- package/dist/toggle/Toggle.js +0 -220
- package/dist/toggle/index.d.ts +0 -21
- package/dist/toggle-group/ToggleGroup.js +0 -327
- package/dist/toggle-group/index.d.ts +0 -21
- package/dist/upload/Upload.js +0 -205
- package/dist/upload/buttons-upload/ButtonsUpload.js +0 -135
- package/dist/upload/buttons-upload/Icons.js +0 -40
- package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
- package/dist/upload/dragAndDropArea/Icons.js +0 -39
- package/dist/upload/file-upload/FileToUpload.js +0 -189
- package/dist/upload/file-upload/Icons.js +0 -66
- package/dist/upload/files-upload/FilesToUpload.js +0 -123
- package/dist/upload/index.d.ts +0 -15
- package/dist/upload/transaction/Icons.js +0 -160
- package/dist/upload/transaction/Transaction.js +0 -148
- package/dist/upload/transactions/Transactions.js +0 -138
- package/dist/useTheme.js +0 -22
- package/dist/wizard/Icons.js +0 -65
- package/dist/wizard/Wizard.js +0 -405
- package/dist/wizard/index.d.ts +0 -18
- 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 -395
- package/test/DateInput.test.js +0 -242
- package/test/Dialog.test.js +0 -23
- package/test/Dropdown.test.js +0 -145
- package/test/FileInput.test.js +0 -201
- package/test/Footer.test.js +0 -94
- package/test/Header.test.js +0 -34
- package/test/Heading.test.js +0 -83
- package/test/InputText.test.js +0 -239
- package/test/Link.test.js +0 -43
- package/test/NumberInput.test.js +0 -259
- package/test/Paginator.test.js +0 -181
- package/test/PasswordInput.test.js +0 -83
- 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 -928
- package/test/Sidenav.test.js +0 -45
- package/test/Slider.test.js +0 -74
- package/test/Spinner.test.js +0 -32
- package/test/Switch.test.js +0 -45
- package/test/Table.test.js +0 -36
- package/test/Tabs.test.js +0 -109
- package/test/Tag.test.js +0 -32
- package/test/TextInput.test.js +0 -731
- package/test/Textarea.test.js +0 -193
- package/test/ToggleGroup.test.js +0 -85
- package/test/Upload.test.js +0 -60
- package/test/V3Select.test.js +0 -212
- package/test/V3TextArea.test.js +0 -51
- package/test/Wizard.test.js +0 -130
- package/test/mocks/pngMock.js +0 -1
- package/test/mocks/svgMock.js +0 -1
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
type Size = "small" | "medium" | "large" | "fillParent";
|
|
2
|
-
type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
|
|
3
|
-
type Margin = {
|
|
4
|
-
top?: Space;
|
|
5
|
-
bottom?: Space;
|
|
6
|
-
left?: Space;
|
|
7
|
-
right?: Space;
|
|
8
|
-
};
|
|
9
|
-
|
|
10
|
-
type Props = {
|
|
11
|
-
label?: string;
|
|
12
|
-
name?: string;
|
|
13
|
-
value?: string;
|
|
14
|
-
assistiveText?: string;
|
|
15
|
-
disabled?: boolean;
|
|
16
|
-
prefix?: string;
|
|
17
|
-
suffix?: string;
|
|
18
|
-
prefixIcon?: any;
|
|
19
|
-
suffixIcon?: any;
|
|
20
|
-
prefixIconSrc?: string;
|
|
21
|
-
suffixIconSrc?: string;
|
|
22
|
-
onClickPrefix?: void;
|
|
23
|
-
onClickSuffix?: void;
|
|
24
|
-
onChange?: void;
|
|
25
|
-
onBlur?: void;
|
|
26
|
-
invalid?: boolean;
|
|
27
|
-
required?: void;
|
|
28
|
-
isMasked?: boolean;
|
|
29
|
-
placeholder?: string;
|
|
30
|
-
autocompleteOptions?: any;
|
|
31
|
-
margin?: Space | Margin;
|
|
32
|
-
size?: Size;
|
|
33
|
-
tabIndex?: number;
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
export default function DxcInputText(props: Props): JSX.Element;
|
|
@@ -1,327 +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 _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
-
|
|
16
|
-
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
17
|
-
|
|
18
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
19
|
-
|
|
20
|
-
var _main = require("../main");
|
|
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 _Icons = require("./Icons");
|
|
29
|
-
|
|
30
|
-
var _useTheme = _interopRequireDefault(require("../useTheme.js"));
|
|
31
|
-
|
|
32
|
-
function _templateObject10() {
|
|
33
|
-
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"]);
|
|
34
|
-
|
|
35
|
-
_templateObject10 = function _templateObject10() {
|
|
36
|
-
return data;
|
|
37
|
-
};
|
|
38
|
-
|
|
39
|
-
return data;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
function _templateObject9() {
|
|
43
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n position: absolute;\n height: calc(100vh - 64px);\n left: 279px;\n"]);
|
|
44
|
-
|
|
45
|
-
_templateObject9 = function _templateObject9() {
|
|
46
|
-
return data;
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
return data;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
function _templateObject8() {
|
|
53
|
-
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"]);
|
|
54
|
-
|
|
55
|
-
_templateObject8 = function _templateObject8() {
|
|
56
|
-
return data;
|
|
57
|
-
};
|
|
58
|
-
|
|
59
|
-
return data;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
function _templateObject7() {
|
|
63
|
-
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"]);
|
|
64
|
-
|
|
65
|
-
_templateObject7 = function _templateObject7() {
|
|
66
|
-
return data;
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
return data;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
function _templateObject6() {
|
|
73
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n margin-left: ", ";\n transition: margin 0.4s ease-in-out;\n"]);
|
|
74
|
-
|
|
75
|
-
_templateObject6 = function _templateObject6() {
|
|
76
|
-
return data;
|
|
77
|
-
};
|
|
78
|
-
|
|
79
|
-
return data;
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
function _templateObject5() {
|
|
83
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n width: 100%;\n min-width: 0;\n display: flex;\n flex-direction: column;\n"]);
|
|
84
|
-
|
|
85
|
-
_templateObject5 = function _templateObject5() {
|
|
86
|
-
return data;
|
|
87
|
-
};
|
|
88
|
-
|
|
89
|
-
return data;
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
function _templateObject4() {
|
|
93
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex: 1 1 auto;\n align-items: flex-start;\n"]);
|
|
94
|
-
|
|
95
|
-
_templateObject4 = function _templateObject4() {
|
|
96
|
-
return data;
|
|
97
|
-
};
|
|
98
|
-
|
|
99
|
-
return data;
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
function _templateObject3() {
|
|
103
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n flex: 1;\n display: flex;\n flex-direction: column;\n"]);
|
|
104
|
-
|
|
105
|
-
_templateObject3 = function _templateObject3() {
|
|
106
|
-
return data;
|
|
107
|
-
};
|
|
108
|
-
|
|
109
|
-
return data;
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
function _templateObject2() {
|
|
113
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n z-index: 1250;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n"]);
|
|
114
|
-
|
|
115
|
-
_templateObject2 = function _templateObject2() {
|
|
116
|
-
return data;
|
|
117
|
-
};
|
|
118
|
-
|
|
119
|
-
return data;
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
function _templateObject() {
|
|
123
|
-
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"]);
|
|
124
|
-
|
|
125
|
-
_templateObject = function _templateObject() {
|
|
126
|
-
return data;
|
|
127
|
-
};
|
|
128
|
-
|
|
129
|
-
return data;
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
var year = new Date().getFullYear();
|
|
133
|
-
|
|
134
|
-
var Header = function Header(_ref) {
|
|
135
|
-
var children = _ref.children;
|
|
136
|
-
return _react["default"].createElement(_react["default"].Fragment, null, children);
|
|
137
|
-
};
|
|
138
|
-
|
|
139
|
-
var Main = function Main(_ref2) {
|
|
140
|
-
var children = _ref2.children;
|
|
141
|
-
return _react["default"].createElement(_react["default"].Fragment, null, children);
|
|
142
|
-
};
|
|
143
|
-
|
|
144
|
-
var Footer = function Footer(_ref3) {
|
|
145
|
-
var children = _ref3.children;
|
|
146
|
-
return _react["default"].createElement(_react["default"].Fragment, null, children);
|
|
147
|
-
};
|
|
148
|
-
|
|
149
|
-
var SideNav = function SideNav(props) {
|
|
150
|
-
var displayArrow = props.displayArrow,
|
|
151
|
-
mode = props.mode,
|
|
152
|
-
childProps = (0, _objectWithoutProperties2["default"])(props, ["displayArrow", "mode"]);
|
|
153
|
-
return _react["default"].createElement(_main.DxcSidenav, childProps, childProps.children);
|
|
154
|
-
};
|
|
155
|
-
|
|
156
|
-
SideNav.propTypes = {
|
|
157
|
-
mode: _propTypes["default"].oneOf(["overlay", "push", ""]),
|
|
158
|
-
displayArrow: _propTypes["default"].bool,
|
|
159
|
-
padding: _propTypes["default"].oneOfType([_propTypes["default"].shape({
|
|
160
|
-
top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
161
|
-
bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
162
|
-
left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
163
|
-
right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
|
|
164
|
-
})])
|
|
165
|
-
};
|
|
166
|
-
|
|
167
|
-
var defaultFooter = function defaultFooter() {
|
|
168
|
-
return _react["default"].createElement(_main.DxcFooter, {
|
|
169
|
-
copyright: "\xA9 DXC Technology ".concat(year, "\u200B\u200B\u200B\u200B. All rights reserved."),
|
|
170
|
-
bottomLinks: [{
|
|
171
|
-
href: "https://www.linkedin.com/company/dxctechnology",
|
|
172
|
-
text: "Linkedin"
|
|
173
|
-
}, {
|
|
174
|
-
href: "https://twitter.com/dxctechnology",
|
|
175
|
-
text: "Twitter"
|
|
176
|
-
}, {
|
|
177
|
-
href: "https://www.facebook.com/DXCTechnology/",
|
|
178
|
-
text: "Facebook"
|
|
179
|
-
}],
|
|
180
|
-
socialLinks: [{
|
|
181
|
-
href: "https://www.linkedin.com/company/dxctechnology",
|
|
182
|
-
logo: _Icons.linkedinLogo
|
|
183
|
-
}, {
|
|
184
|
-
href: "https://twitter.com/dxctechnology",
|
|
185
|
-
logo: _Icons.twitterLogo
|
|
186
|
-
}, {
|
|
187
|
-
href: "https://www.facebook.com/DXCTechnology/",
|
|
188
|
-
logo: _Icons.facebookLogo
|
|
189
|
-
}]
|
|
190
|
-
});
|
|
191
|
-
};
|
|
192
|
-
|
|
193
|
-
var defaultHeader = function defaultHeader() {
|
|
194
|
-
return _react["default"].createElement(_main.DxcHeader, {
|
|
195
|
-
underlined: true
|
|
196
|
-
});
|
|
197
|
-
};
|
|
198
|
-
|
|
199
|
-
var childTypeExists = function childTypeExists(children, childType) {
|
|
200
|
-
return children.find(function (child) {
|
|
201
|
-
return child && child.type && child.type === childType;
|
|
202
|
-
});
|
|
203
|
-
};
|
|
204
|
-
|
|
205
|
-
var DxcApplicationLayout = function DxcApplicationLayout(_ref4) {
|
|
206
|
-
var children = _ref4.children;
|
|
207
|
-
var ref = (0, _react.useRef)(null);
|
|
208
|
-
var colorsTheme = (0, _useTheme["default"])();
|
|
209
|
-
|
|
210
|
-
var _useState = (0, _react.useState)(true),
|
|
211
|
-
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
212
|
-
isSideNavVisible = _useState2[0],
|
|
213
|
-
setIsSideNavVisible = _useState2[1];
|
|
214
|
-
|
|
215
|
-
var _useState3 = (0, _react.useState)(),
|
|
216
|
-
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
|
|
217
|
-
isResponsive = _useState4[0],
|
|
218
|
-
setIsResponsive = _useState4[1];
|
|
219
|
-
|
|
220
|
-
var childrenArray = _react["default"].Children.toArray(children);
|
|
221
|
-
|
|
222
|
-
var header = childTypeExists(childrenArray, _main.DxcHeader) || childTypeExists(childrenArray, Header) || defaultHeader();
|
|
223
|
-
var footer = childTypeExists(childrenArray, _main.DxcFooter) || childTypeExists(childrenArray, Footer) || defaultFooter();
|
|
224
|
-
var sideNav = childTypeExists(childrenArray, SideNav);
|
|
225
|
-
var main = childTypeExists(childrenArray, Main);
|
|
226
|
-
var displayArrow = sideNav && sideNav.props && sideNav.props.displayArrow;
|
|
227
|
-
var sideNavMode = sideNav && sideNav.props && sideNav.props.mode;
|
|
228
|
-
|
|
229
|
-
var ArrowIcon = function ArrowIcon() {
|
|
230
|
-
return _react["default"].createElement("svg", {
|
|
231
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
232
|
-
width: "15.995",
|
|
233
|
-
height: "10.01",
|
|
234
|
-
viewBox: "0 0 15.995 10.01"
|
|
235
|
-
}, _react["default"].createElement("path", {
|
|
236
|
-
"data-testid": "arrow-to-right",
|
|
237
|
-
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",
|
|
238
|
-
transform: "translate(-2 -6.996)"
|
|
239
|
-
}));
|
|
240
|
-
};
|
|
241
|
-
|
|
242
|
-
var handleResize = function handleResize(width) {
|
|
243
|
-
if (width) {
|
|
244
|
-
if (width <= _variables.responsiveSizes.tablet ? setIsResponsive(true) : setIsResponsive(false)) ;
|
|
245
|
-
setIsSideNavVisible(true);
|
|
246
|
-
}
|
|
247
|
-
};
|
|
248
|
-
|
|
249
|
-
var handleEventListener = function handleEventListener() {
|
|
250
|
-
handleResize(ref.current.offsetWidth);
|
|
251
|
-
};
|
|
252
|
-
|
|
253
|
-
(0, _react.useEffect)(function () {
|
|
254
|
-
if (ref.current) {
|
|
255
|
-
window.addEventListener("resize", handleEventListener);
|
|
256
|
-
handleResize(ref.current.offsetWidth);
|
|
257
|
-
}
|
|
258
|
-
|
|
259
|
-
return function () {
|
|
260
|
-
window.removeEventListener("resize", handleEventListener);
|
|
261
|
-
};
|
|
262
|
-
}, []);
|
|
263
|
-
|
|
264
|
-
var handleSidenav = function handleSidenav() {
|
|
265
|
-
setIsSideNavVisible(!isSideNavVisible);
|
|
266
|
-
};
|
|
267
|
-
|
|
268
|
-
return _react["default"].createElement(_styledComponents.ThemeProvider, {
|
|
269
|
-
theme: colorsTheme.sidenav
|
|
270
|
-
}, _react["default"].createElement(ApplicationLayoutContainer, {
|
|
271
|
-
ref: ref
|
|
272
|
-
}, _react["default"].createElement(HeaderContainer, null, header), _react["default"].createElement(BodyContainer, null, _react["default"].createElement(ContentContainer, null, _react["default"].createElement(SideNavArrowContainer, {
|
|
273
|
-
isSideNavVisible: isSideNavVisible
|
|
274
|
-
}, sideNav, _react["default"].createElement(ArrowContainer, null, sideNav && (displayArrow || isResponsive) && _react["default"].createElement(ArrowTrigger, {
|
|
275
|
-
tabIndex: 0,
|
|
276
|
-
onClick: handleSidenav,
|
|
277
|
-
isSideNavVisible: isSideNavVisible
|
|
278
|
-
}, _react["default"].createElement(ArrowIcon, null)))), _react["default"].createElement(MainBodyContainer, null, _react["default"].createElement(MainContent, {
|
|
279
|
-
sideNav: sideNav,
|
|
280
|
-
mode: isResponsive ? "overlay" : sideNavMode,
|
|
281
|
-
isSideNavVisible: isSideNavVisible
|
|
282
|
-
}, main), _react["default"].createElement(FooterContainer, {
|
|
283
|
-
sideNav: sideNav,
|
|
284
|
-
mode: isResponsive ? "overlay" : sideNavMode,
|
|
285
|
-
isSideNavVisible: isSideNavVisible
|
|
286
|
-
}, footer))))));
|
|
287
|
-
};
|
|
288
|
-
|
|
289
|
-
DxcApplicationLayout.Header = Header;
|
|
290
|
-
DxcApplicationLayout.Main = Main;
|
|
291
|
-
DxcApplicationLayout.Footer = Footer;
|
|
292
|
-
DxcApplicationLayout.SideNav = SideNav;
|
|
293
|
-
|
|
294
|
-
var ApplicationLayoutContainer = _styledComponents["default"].div(_templateObject());
|
|
295
|
-
|
|
296
|
-
var HeaderContainer = _styledComponents["default"].div(_templateObject2());
|
|
297
|
-
|
|
298
|
-
var BodyContainer = _styledComponents["default"].div(_templateObject3());
|
|
299
|
-
|
|
300
|
-
var ContentContainer = _styledComponents["default"].div(_templateObject4());
|
|
301
|
-
|
|
302
|
-
var MainBodyContainer = _styledComponents["default"].div(_templateObject5());
|
|
303
|
-
|
|
304
|
-
var FooterContainer = _styledComponents["default"].div(_templateObject6(), function (props) {
|
|
305
|
-
return props.sideNav ? props.mode === "push" && !props.isSideNavVisible || props.mode === "overlay" ? "-300px" : "" : "";
|
|
306
|
-
});
|
|
307
|
-
|
|
308
|
-
var MainContent = _styledComponents["default"].div(_templateObject7(), function (props) {
|
|
309
|
-
return props.sideNav ? props.mode === "push" && props.isSideNavVisible ? "" : "-297px" : "";
|
|
310
|
-
});
|
|
311
|
-
|
|
312
|
-
var SideNavArrowContainer = _styledComponents["default"].div(_templateObject8(), function (props) {
|
|
313
|
-
return props.isSideNavVisible ? "translateX(0)" : !props.isSideNavVisible ? "translateX(-100%)" : "";
|
|
314
|
-
});
|
|
315
|
-
|
|
316
|
-
var ArrowContainer = _styledComponents["default"].div(_templateObject9());
|
|
317
|
-
|
|
318
|
-
var ArrowTrigger = _styledComponents["default"].div(_templateObject10(), function (props) {
|
|
319
|
-
return "".concat(props.theme.arrowContainerColor);
|
|
320
|
-
}, function (props) {
|
|
321
|
-
return props.isSideNavVisible ? "rotate(-180deg)" : "rotate(0deg)";
|
|
322
|
-
}, function (props) {
|
|
323
|
-
return props.theme.arrowColor;
|
|
324
|
-
});
|
|
325
|
-
|
|
326
|
-
var _default = DxcApplicationLayout;
|
|
327
|
-
exports["default"] = _default;
|
package/dist/layout/Icons.js
DELETED
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.linkedinLogo = exports.twitterLogo = exports.facebookLogo = void 0;
|
|
9
|
-
|
|
10
|
-
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
|
|
12
|
-
var facebookLogo = _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
|
-
}, _react["default"].createElement("g", null, _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 = _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
|
-
}, _react["default"].createElement("g", null, _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 = _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
|
-
}, _react["default"].createElement("g", null, _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/dist/link/Link.js
DELETED
|
@@ -1,237 +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 _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
|
-
function _templateObject6() {
|
|
29
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n width: ", ";\n height: ", ";\n ", ";\n overflow: hidden;\n \n img,\n svg {\n height: 100%;\n width: 100%;\n }\n"]);
|
|
30
|
-
|
|
31
|
-
_templateObject6 = function _templateObject6() {
|
|
32
|
-
return data;
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
return data;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
function _templateObject5() {
|
|
39
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n width: ", ";\n height: ", ";\n ", ";\n"]);
|
|
40
|
-
|
|
41
|
-
_templateObject5 = function _templateObject5() {
|
|
42
|
-
return data;
|
|
43
|
-
};
|
|
44
|
-
|
|
45
|
-
return data;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
function _templateObject4() {
|
|
49
|
-
var data = (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"]);
|
|
50
|
-
|
|
51
|
-
_templateObject4 = function _templateObject4() {
|
|
52
|
-
return data;
|
|
53
|
-
};
|
|
54
|
-
|
|
55
|
-
return data;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
function _templateObject3() {
|
|
59
|
-
var data = (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"]);
|
|
60
|
-
|
|
61
|
-
_templateObject3 = function _templateObject3() {
|
|
62
|
-
return data;
|
|
63
|
-
};
|
|
64
|
-
|
|
65
|
-
return data;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
function _templateObject2() {
|
|
69
|
-
var data = (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"]);
|
|
70
|
-
|
|
71
|
-
_templateObject2 = function _templateObject2() {
|
|
72
|
-
return data;
|
|
73
|
-
};
|
|
74
|
-
|
|
75
|
-
return data;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
function _templateObject() {
|
|
79
|
-
var data = (0, _taggedTemplateLiteral2["default"])(["\n display: inline-flex;\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"]);
|
|
80
|
-
|
|
81
|
-
_templateObject = function _templateObject() {
|
|
82
|
-
return data;
|
|
83
|
-
};
|
|
84
|
-
|
|
85
|
-
return data;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
var DxcLink = function DxcLink(_ref) {
|
|
89
|
-
var _ref$inheritColor = _ref.inheritColor,
|
|
90
|
-
inheritColor = _ref$inheritColor === void 0 ? false : _ref$inheritColor,
|
|
91
|
-
_ref$disabled = _ref.disabled,
|
|
92
|
-
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
93
|
-
iconSrc = _ref.iconSrc,
|
|
94
|
-
icon = _ref.icon,
|
|
95
|
-
_ref$iconPosition = _ref.iconPosition,
|
|
96
|
-
iconPosition = _ref$iconPosition === void 0 ? "before" : _ref$iconPosition,
|
|
97
|
-
_ref$href = _ref.href,
|
|
98
|
-
href = _ref$href === void 0 ? "" : _ref$href,
|
|
99
|
-
_ref$newWindow = _ref.newWindow,
|
|
100
|
-
newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
|
|
101
|
-
onClick = _ref.onClick,
|
|
102
|
-
_ref$text = _ref.text,
|
|
103
|
-
text = _ref$text === void 0 ? "" : _ref$text,
|
|
104
|
-
margin = _ref.margin,
|
|
105
|
-
_ref$tabIndex = _ref.tabIndex,
|
|
106
|
-
tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
|
|
107
|
-
var colorsTheme = (0, _useTheme["default"])();
|
|
108
|
-
|
|
109
|
-
var linkContent = _react["default"].createElement(LinkText, {
|
|
110
|
-
iconPosition: iconPosition
|
|
111
|
-
}, text, icon ? _react["default"].createElement(LinkIconContainer, {
|
|
112
|
-
iconPosition: iconPosition
|
|
113
|
-
}, (0, _typeof2["default"])(icon) === "object" ? icon : _react["default"].createElement(icon)) : iconSrc && _react["default"].createElement(LinkIcon, {
|
|
114
|
-
src: iconSrc,
|
|
115
|
-
iconPosition: iconPosition
|
|
116
|
-
}));
|
|
117
|
-
|
|
118
|
-
return _react["default"].createElement(_styledComponents.ThemeProvider, {
|
|
119
|
-
theme: colorsTheme.link
|
|
120
|
-
}, _react["default"].createElement(DxcLinkContainer, {
|
|
121
|
-
margin: margin
|
|
122
|
-
}, onClick ? _react["default"].createElement(StyledButton, {
|
|
123
|
-
type: "button",
|
|
124
|
-
onClick: !disabled && onClick,
|
|
125
|
-
margin: margin,
|
|
126
|
-
disabled: disabled,
|
|
127
|
-
inheritColor: inheritColor
|
|
128
|
-
}, linkContent) : _react["default"].createElement(StyledLink, {
|
|
129
|
-
tabIndex: tabIndex,
|
|
130
|
-
href: !disabled && href,
|
|
131
|
-
target: newWindow ? "_blank" : "_self",
|
|
132
|
-
margin: margin,
|
|
133
|
-
disabled: disabled,
|
|
134
|
-
inheritColor: inheritColor
|
|
135
|
-
}, linkContent)));
|
|
136
|
-
};
|
|
137
|
-
|
|
138
|
-
var DxcLinkContainer = _styledComponents["default"].div(_templateObject(), function (props) {
|
|
139
|
-
return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
|
|
140
|
-
}, function (props) {
|
|
141
|
-
return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
|
|
142
|
-
}, function (props) {
|
|
143
|
-
return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
|
|
144
|
-
}, function (props) {
|
|
145
|
-
return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
|
|
146
|
-
}, function (props) {
|
|
147
|
-
return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
|
|
148
|
-
});
|
|
149
|
-
|
|
150
|
-
var StyledLink = _styledComponents["default"].a(_templateObject2(), function (props) {
|
|
151
|
-
return props.inheritColor ? "inherit" : !props.disabled ? props.theme.fontColor : props.theme.disabledColor;
|
|
152
|
-
}, function (props) {
|
|
153
|
-
return props.disabled ? "pointer-events: none;" : "";
|
|
154
|
-
}, function (props) {
|
|
155
|
-
return "padding-bottom: ".concat(props.theme.underlineSpacing, ";\n border-bottom: ").concat(props.theme.underlineThickness, " ").concat(props.theme.underlineStyle, " transparent;");
|
|
156
|
-
}, function (props) {
|
|
157
|
-
return !props.inheritColor ? props.theme.visitedFontColor : "";
|
|
158
|
-
}, function (props) {
|
|
159
|
-
return "color: ".concat(props.theme.visitedFontColor, ";\n border-bottom-color: ").concat(props.theme.visitedUnderlineColor, ";");
|
|
160
|
-
}, function (props) {
|
|
161
|
-
return "color: ".concat(props.theme.hoverFontColor, ";\n border-bottom-color: ").concat(props.theme.hoverUnderlineColor, ";\n cursor: pointer;");
|
|
162
|
-
}, function (props) {
|
|
163
|
-
return props.theme.focusColor;
|
|
164
|
-
}, function (props) {
|
|
165
|
-
return props.disabled && "outline: none";
|
|
166
|
-
}, function (props) {
|
|
167
|
-
return "color: ".concat(props.theme.activeFontColor, " !important;\n border-bottom-color: ").concat(props.theme.activeUnderlineColor, " !important;");
|
|
168
|
-
});
|
|
169
|
-
|
|
170
|
-
var StyledButton = _styledComponents["default"].button(_templateObject3(), function (props) {
|
|
171
|
-
return "padding-bottom: ".concat(props.theme.underlineSpacing, ";\n border-bottom: ").concat(props.theme.underlineThickness, " ").concat(props.theme.underlineStyle, " transparent;");
|
|
172
|
-
}, function (props) {
|
|
173
|
-
return props.disabled && "cursor: default;";
|
|
174
|
-
}, function (props) {
|
|
175
|
-
return props.inheritColor ? "inherit" : !props.disabled ? props.theme.fontColor : props.theme.disabledColor;
|
|
176
|
-
}, function (props) {
|
|
177
|
-
return props.disabled ? "pointer-events: none;" : "";
|
|
178
|
-
}, function (props) {
|
|
179
|
-
return "color: ".concat(props.theme.hoverFontColor, ";\n border-bottom-color: ").concat(props.theme.hoverUnderlineColor, ";\n cursor: pointer;");
|
|
180
|
-
}, function (props) {
|
|
181
|
-
return props.theme.focusColor;
|
|
182
|
-
}, function (props) {
|
|
183
|
-
return props.disabled && "outline: none";
|
|
184
|
-
}, function (props) {
|
|
185
|
-
return "color: ".concat(props.theme.activeFontColor, " !important;\n border-bottom-color: ").concat(props.theme.activeUnderlineColor, " !important;");
|
|
186
|
-
});
|
|
187
|
-
|
|
188
|
-
var LinkText = _styledComponents["default"].div(_templateObject4(), function (props) {
|
|
189
|
-
return props.theme.fontSize;
|
|
190
|
-
}, function (props) {
|
|
191
|
-
return props.theme.fontWeight;
|
|
192
|
-
}, function (props) {
|
|
193
|
-
return props.theme.fontStyle;
|
|
194
|
-
}, function (props) {
|
|
195
|
-
return props.theme.fontFamily;
|
|
196
|
-
}, function (props) {
|
|
197
|
-
return props.iconPosition === "after" ? "row" : "row-reverse";
|
|
198
|
-
}, function (props) {
|
|
199
|
-
return props.iconPosition === "after" ? "flex-start" : "flex-end";
|
|
200
|
-
});
|
|
201
|
-
|
|
202
|
-
var LinkIcon = _styledComponents["default"].img(_templateObject5(), function (props) {
|
|
203
|
-
return props.theme.iconSize;
|
|
204
|
-
}, function (props) {
|
|
205
|
-
return props.theme.iconSize;
|
|
206
|
-
}, function (props) {
|
|
207
|
-
return "".concat(props.iconPosition === "before" ? "margin-right" : "margin-left", ": ").concat(props.theme.iconSpacing);
|
|
208
|
-
});
|
|
209
|
-
|
|
210
|
-
var LinkIconContainer = _styledComponents["default"].div(_templateObject6(), function (props) {
|
|
211
|
-
return props.theme.iconSize;
|
|
212
|
-
}, function (props) {
|
|
213
|
-
return props.theme.iconSize;
|
|
214
|
-
}, function (props) {
|
|
215
|
-
return "".concat(props.iconPosition === "before" ? "margin-right" : "margin-left", ": ").concat(props.theme.iconSpacing);
|
|
216
|
-
});
|
|
217
|
-
|
|
218
|
-
DxcLink.propTypes = {
|
|
219
|
-
inheritColor: _propTypes["default"].bool,
|
|
220
|
-
disabled: _propTypes["default"].bool,
|
|
221
|
-
icon: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
|
|
222
|
-
iconSrc: _propTypes["default"].string,
|
|
223
|
-
iconPosition: _propTypes["default"].oneOf(["after", "before"]),
|
|
224
|
-
href: _propTypes["default"].string,
|
|
225
|
-
onClick: _propTypes["default"].func,
|
|
226
|
-
margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
|
|
227
|
-
top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
228
|
-
bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
229
|
-
left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
230
|
-
right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
|
|
231
|
-
}), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
|
|
232
|
-
newWindow: _propTypes["default"].bool,
|
|
233
|
-
text: _propTypes["default"].string,
|
|
234
|
-
tabIndex: _propTypes["default"].number
|
|
235
|
-
};
|
|
236
|
-
var _default = DxcLink;
|
|
237
|
-
exports["default"] = _default;
|
package/dist/link/index.d.ts
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
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;
|