@dxc-technology/halstack-react 0.0.0-acb1a24 → 0.0.0-acc2a7e

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (167) hide show
  1. package/README.md +27 -47
  2. package/dist/index.d.mts +3862 -0
  3. package/dist/index.d.ts +3862 -0
  4. package/dist/index.js +12917 -0
  5. package/dist/index.mjs +12830 -0
  6. package/package.json +83 -64
  7. package/babel.config.js +0 -8
  8. package/dist/BackgroundColorContext.js +0 -46
  9. package/dist/ThemeContext.js +0 -250
  10. package/dist/V3Select/V3Select.js +0 -549
  11. package/dist/V3Select/index.d.ts +0 -27
  12. package/dist/V3Textarea/V3Textarea.js +0 -264
  13. package/dist/V3Textarea/index.d.ts +0 -27
  14. package/dist/accordion/Accordion.js +0 -353
  15. package/dist/accordion/index.d.ts +0 -28
  16. package/dist/accordion-group/AccordionGroup.js +0 -186
  17. package/dist/accordion-group/index.d.ts +0 -16
  18. package/dist/alert/Alert.js +0 -403
  19. package/dist/alert/index.d.ts +0 -51
  20. package/dist/badge/Badge.js +0 -63
  21. package/dist/box/Box.js +0 -156
  22. package/dist/box/index.d.ts +0 -25
  23. package/dist/button/Button.js +0 -238
  24. package/dist/button/index.d.ts +0 -24
  25. package/dist/card/Card.js +0 -254
  26. package/dist/card/index.d.ts +0 -22
  27. package/dist/checkbox/Checkbox.js +0 -299
  28. package/dist/checkbox/index.d.ts +0 -24
  29. package/dist/chip/Chip.js +0 -265
  30. package/dist/chip/index.d.ts +0 -22
  31. package/dist/common/OpenSans.css +0 -81
  32. package/dist/common/RequiredComponent.js +0 -40
  33. package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
  34. package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  35. package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  36. package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  37. package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
  38. package/dist/common/fonts/OpenSans-Light.ttf +0 -0
  39. package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
  40. package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
  41. package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
  42. package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  43. package/dist/common/utils.js +0 -22
  44. package/dist/common/variables.js +0 -1574
  45. package/dist/date/Date.js +0 -379
  46. package/dist/date/index.d.ts +0 -27
  47. package/dist/date-input/DateInput.js +0 -400
  48. package/dist/date-input/index.d.ts +0 -95
  49. package/dist/dialog/Dialog.js +0 -218
  50. package/dist/dialog/index.d.ts +0 -18
  51. package/dist/dropdown/Dropdown.js +0 -544
  52. package/dist/dropdown/index.d.ts +0 -26
  53. package/dist/file-input/FileInput.js +0 -644
  54. package/dist/file-input/FileItem.js +0 -287
  55. package/dist/file-input/index.d.ts +0 -81
  56. package/dist/footer/Footer.js +0 -421
  57. package/dist/footer/Icons.js +0 -77
  58. package/dist/footer/index.d.ts +0 -25
  59. package/dist/header/Header.js +0 -470
  60. package/dist/header/Icons.js +0 -59
  61. package/dist/header/index.d.ts +0 -25
  62. package/dist/heading/Heading.js +0 -230
  63. package/dist/heading/index.d.ts +0 -17
  64. package/dist/input-text/Icons.js +0 -22
  65. package/dist/input-text/InputText.js +0 -705
  66. package/dist/input-text/index.d.ts +0 -36
  67. package/dist/layout/ApplicationLayout.js +0 -327
  68. package/dist/layout/Icons.js +0 -55
  69. package/dist/link/Link.js +0 -237
  70. package/dist/link/index.d.ts +0 -23
  71. package/dist/main.d.ts +0 -40
  72. package/dist/main.js +0 -359
  73. package/dist/number-input/NumberInput.js +0 -136
  74. package/dist/number-input/NumberInputContext.js +0 -16
  75. package/dist/number-input/index.d.ts +0 -113
  76. package/dist/paginator/Icons.js +0 -66
  77. package/dist/paginator/Paginator.js +0 -305
  78. package/dist/paginator/index.d.ts +0 -20
  79. package/dist/password-input/PasswordInput.js +0 -203
  80. package/dist/password-input/index.d.ts +0 -94
  81. package/dist/progress-bar/ProgressBar.js +0 -242
  82. package/dist/progress-bar/index.d.ts +0 -18
  83. package/dist/radio/Radio.js +0 -209
  84. package/dist/radio/index.d.ts +0 -23
  85. package/dist/resultsetTable/ResultsetTable.js +0 -358
  86. package/dist/resultsetTable/index.d.ts +0 -19
  87. package/dist/select/Select.js +0 -1096
  88. package/dist/select/index.d.ts +0 -53
  89. package/dist/sidenav/Sidenav.js +0 -179
  90. package/dist/sidenav/index.d.ts +0 -13
  91. package/dist/slider/Slider.js +0 -404
  92. package/dist/slider/index.d.ts +0 -29
  93. package/dist/spinner/Spinner.js +0 -381
  94. package/dist/spinner/index.d.ts +0 -17
  95. package/dist/switch/Switch.js +0 -222
  96. package/dist/switch/index.d.ts +0 -24
  97. package/dist/table/Table.js +0 -132
  98. package/dist/table/index.d.ts +0 -13
  99. package/dist/tabs/Tabs.js +0 -343
  100. package/dist/tabs/index.d.ts +0 -19
  101. package/dist/tag/Tag.js +0 -282
  102. package/dist/tag/index.d.ts +0 -24
  103. package/dist/text-input/TextInput.js +0 -974
  104. package/dist/text-input/index.d.ts +0 -135
  105. package/dist/textarea/Textarea.js +0 -369
  106. package/dist/textarea/index.d.ts +0 -117
  107. package/dist/toggle/Toggle.js +0 -220
  108. package/dist/toggle/index.d.ts +0 -21
  109. package/dist/toggle-group/ToggleGroup.js +0 -327
  110. package/dist/toggle-group/index.d.ts +0 -21
  111. package/dist/upload/Upload.js +0 -205
  112. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -135
  113. package/dist/upload/buttons-upload/Icons.js +0 -40
  114. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  115. package/dist/upload/dragAndDropArea/Icons.js +0 -39
  116. package/dist/upload/file-upload/FileToUpload.js +0 -189
  117. package/dist/upload/file-upload/Icons.js +0 -66
  118. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  119. package/dist/upload/index.d.ts +0 -15
  120. package/dist/upload/transaction/Icons.js +0 -160
  121. package/dist/upload/transaction/Transaction.js +0 -148
  122. package/dist/upload/transactions/Transactions.js +0 -138
  123. package/dist/useTheme.js +0 -22
  124. package/dist/wizard/Icons.js +0 -65
  125. package/dist/wizard/Wizard.js +0 -405
  126. package/dist/wizard/index.d.ts +0 -18
  127. package/test/Accordion.test.js +0 -33
  128. package/test/AccordionGroup.test.js +0 -125
  129. package/test/Alert.test.js +0 -53
  130. package/test/Box.test.js +0 -10
  131. package/test/Button.test.js +0 -18
  132. package/test/Card.test.js +0 -30
  133. package/test/Checkbox.test.js +0 -45
  134. package/test/Chip.test.js +0 -25
  135. package/test/Date.test.js +0 -395
  136. package/test/DateInput.test.js +0 -242
  137. package/test/Dialog.test.js +0 -23
  138. package/test/Dropdown.test.js +0 -145
  139. package/test/FileInput.test.js +0 -201
  140. package/test/Footer.test.js +0 -94
  141. package/test/Header.test.js +0 -34
  142. package/test/Heading.test.js +0 -83
  143. package/test/InputText.test.js +0 -240
  144. package/test/Link.test.js +0 -43
  145. package/test/NumberInput.test.js +0 -259
  146. package/test/Paginator.test.js +0 -181
  147. package/test/PasswordInput.test.js +0 -83
  148. package/test/ProgressBar.test.js +0 -35
  149. package/test/Radio.test.js +0 -37
  150. package/test/ResultsetTable.test.js +0 -330
  151. package/test/Select.test.js +0 -415
  152. package/test/Sidenav.test.js +0 -45
  153. package/test/Slider.test.js +0 -74
  154. package/test/Spinner.test.js +0 -32
  155. package/test/Switch.test.js +0 -45
  156. package/test/Table.test.js +0 -36
  157. package/test/Tabs.test.js +0 -109
  158. package/test/Tag.test.js +0 -32
  159. package/test/TextInput.test.js +0 -732
  160. package/test/Textarea.test.js +0 -193
  161. package/test/ToggleGroup.test.js +0 -85
  162. package/test/Upload.test.js +0 -60
  163. package/test/V3Select.test.js +0 -212
  164. package/test/V3TextArea.test.js +0 -51
  165. package/test/Wizard.test.js +0 -130
  166. package/test/mocks/pngMock.js +0 -1
  167. 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;
@@ -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;
@@ -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;