@dxc-technology/halstack-react 0.0.0-8d998c7 → 0.0.0-8db6a95

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 (159) hide show
  1. package/README.md +46 -0
  2. package/dist/index.d.mts +6669 -0
  3. package/dist/index.d.ts +6669 -0
  4. package/dist/index.js +14523 -0
  5. package/dist/index.mjs +14465 -0
  6. package/package.json +69 -68
  7. package/BackgroundColorContext.js +0 -50
  8. package/ThemeContext.js +0 -246
  9. package/V3Select/V3Select.js +0 -455
  10. package/V3Select/index.d.ts +0 -27
  11. package/V3Textarea/V3Textarea.js +0 -260
  12. package/V3Textarea/index.d.ts +0 -27
  13. package/accordion/Accordion.d.ts +0 -4
  14. package/accordion/Accordion.js +0 -258
  15. package/accordion/types.d.ts +0 -68
  16. package/accordion/types.js +0 -5
  17. package/accordion-group/AccordionGroup.d.ts +0 -7
  18. package/accordion-group/AccordionGroup.js +0 -170
  19. package/accordion-group/types.d.ts +0 -72
  20. package/accordion-group/types.js +0 -5
  21. package/alert/Alert.d.ts +0 -4
  22. package/alert/Alert.js +0 -290
  23. package/alert/types.d.ts +0 -49
  24. package/alert/types.js +0 -5
  25. package/badge/Badge.js +0 -59
  26. package/box/Box.js +0 -152
  27. package/box/Box.stories.jsx +0 -132
  28. package/box/index.d.ts +0 -25
  29. package/button/Button.d.ts +0 -4
  30. package/button/Button.js +0 -182
  31. package/button/Button.stories.tsx +0 -293
  32. package/button/types.d.ts +0 -57
  33. package/button/types.js +0 -5
  34. package/card/Card.d.ts +0 -4
  35. package/card/Card.js +0 -165
  36. package/card/types.d.ts +0 -69
  37. package/card/types.js +0 -5
  38. package/checkbox/Checkbox.d.ts +0 -4
  39. package/checkbox/Checkbox.js +0 -253
  40. package/checkbox/types.d.ts +0 -60
  41. package/checkbox/types.js +0 -5
  42. package/chip/Chip.js +0 -221
  43. package/chip/index.d.ts +0 -22
  44. package/common/OpenSans.css +0 -81
  45. package/common/RequiredComponent.js +0 -32
  46. package/common/fonts/OpenSans-Bold.ttf +0 -0
  47. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  48. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  49. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  50. package/common/fonts/OpenSans-Italic.ttf +0 -0
  51. package/common/fonts/OpenSans-Light.ttf +0 -0
  52. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  53. package/common/fonts/OpenSans-Regular.ttf +0 -0
  54. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  55. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  56. package/common/utils.js +0 -22
  57. package/common/variables.js +0 -1569
  58. package/date/Date.js +0 -373
  59. package/date/index.d.ts +0 -27
  60. package/date-input/DateInput.d.ts +0 -4
  61. package/date-input/DateInput.js +0 -361
  62. package/date-input/types.d.ts +0 -100
  63. package/date-input/types.js +0 -5
  64. package/dialog/Dialog.js +0 -184
  65. package/dialog/index.d.ts +0 -18
  66. package/dropdown/Dropdown.d.ts +0 -4
  67. package/dropdown/Dropdown.js +0 -417
  68. package/dropdown/types.d.ts +0 -89
  69. package/dropdown/types.js +0 -5
  70. package/file-input/FileInput.js +0 -532
  71. package/file-input/FileItem.js +0 -193
  72. package/file-input/index.d.ts +0 -81
  73. package/footer/Footer.d.ts +0 -4
  74. package/footer/Footer.js +0 -266
  75. package/footer/Icons.js +0 -77
  76. package/footer/types.d.ts +0 -61
  77. package/footer/types.js +0 -5
  78. package/header/Header.js +0 -326
  79. package/header/Icons.js +0 -59
  80. package/header/index.d.ts +0 -25
  81. package/heading/Heading.js +0 -176
  82. package/heading/index.d.ts +0 -17
  83. package/input-text/Icons.js +0 -22
  84. package/input-text/InputText.js +0 -611
  85. package/input-text/index.d.ts +0 -36
  86. package/layout/ApplicationLayout.js +0 -235
  87. package/layout/Icons.js +0 -55
  88. package/link/Link.js +0 -183
  89. package/link/index.d.ts +0 -23
  90. package/main.d.ts +0 -44
  91. package/main.js +0 -363
  92. package/number-input/NumberInput.js +0 -128
  93. package/number-input/NumberInputContext.js +0 -16
  94. package/number-input/index.d.ts +0 -113
  95. package/paginator/Icons.js +0 -66
  96. package/paginator/Paginator.d.ts +0 -4
  97. package/paginator/Paginator.js +0 -198
  98. package/paginator/types.d.ts +0 -38
  99. package/paginator/types.js +0 -5
  100. package/password-input/PasswordInput.js +0 -199
  101. package/password-input/PasswordInput.stories.jsx +0 -131
  102. package/password-input/index.d.ts +0 -94
  103. package/progress-bar/ProgressBar.d.ts +0 -4
  104. package/progress-bar/ProgressBar.js +0 -170
  105. package/progress-bar/types.d.ts +0 -37
  106. package/progress-bar/types.js +0 -5
  107. package/radio/Radio.d.ts +0 -4
  108. package/radio/Radio.js +0 -174
  109. package/radio/types.d.ts +0 -54
  110. package/radio/types.js +0 -5
  111. package/resultsetTable/ResultsetTable.js +0 -274
  112. package/resultsetTable/index.d.ts +0 -19
  113. package/select/Select.js +0 -865
  114. package/select/index.d.ts +0 -131
  115. package/sidenav/Sidenav.js +0 -145
  116. package/sidenav/index.d.ts +0 -13
  117. package/slider/Slider.d.ts +0 -4
  118. package/slider/Slider.js +0 -306
  119. package/slider/types.d.ts +0 -83
  120. package/slider/types.js +0 -5
  121. package/spinner/Spinner.js +0 -267
  122. package/spinner/index.d.ts +0 -17
  123. package/switch/Switch.d.ts +0 -4
  124. package/switch/Switch.js +0 -179
  125. package/switch/types.d.ts +0 -58
  126. package/switch/types.js +0 -5
  127. package/table/Table.js +0 -118
  128. package/table/index.d.ts +0 -13
  129. package/tabs/Tabs.d.ts +0 -4
  130. package/tabs/Tabs.js +0 -211
  131. package/tabs/types.d.ts +0 -71
  132. package/tabs/types.js +0 -5
  133. package/tag/Tag.js +0 -208
  134. package/tag/index.d.ts +0 -24
  135. package/text-input/TextInput.js +0 -825
  136. package/text-input/index.d.ts +0 -135
  137. package/textarea/Textarea.js +0 -317
  138. package/textarea/Textarea.stories.jsx +0 -135
  139. package/textarea/index.d.ts +0 -117
  140. package/toggle/Toggle.js +0 -186
  141. package/toggle/index.d.ts +0 -21
  142. package/toggle-group/ToggleGroup.js +0 -243
  143. package/toggle-group/index.d.ts +0 -21
  144. package/upload/Upload.js +0 -201
  145. package/upload/buttons-upload/ButtonsUpload.js +0 -111
  146. package/upload/buttons-upload/Icons.js +0 -40
  147. package/upload/dragAndDropArea/DragAndDropArea.js +0 -225
  148. package/upload/dragAndDropArea/Icons.js +0 -39
  149. package/upload/file-upload/FileToUpload.js +0 -115
  150. package/upload/file-upload/Icons.js +0 -66
  151. package/upload/files-upload/FilesToUpload.js +0 -109
  152. package/upload/index.d.ts +0 -15
  153. package/upload/transaction/Icons.js +0 -160
  154. package/upload/transaction/Transaction.js +0 -104
  155. package/upload/transactions/Transactions.js +0 -94
  156. package/useTheme.js +0 -22
  157. package/wizard/Icons.js +0 -65
  158. package/wizard/Wizard.js +0 -271
  159. package/wizard/index.d.ts +0 -18
@@ -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 DxcInput(props: Props): JSX.Element;
@@ -1,235 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof = require("@babel/runtime/helpers/typeof");
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
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
33
-
34
- var _excluded = ["displayArrow", "mode"];
35
-
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); }
37
-
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; }
39
-
40
- var year = new Date().getFullYear();
41
-
42
- var Header = function Header(_ref) {
43
- var children = _ref.children;
44
- return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, children);
45
- };
46
-
47
- var Main = function Main(_ref2) {
48
- var children = _ref2.children;
49
- return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, children);
50
- };
51
-
52
- var Footer = function Footer(_ref3) {
53
- var children = _ref3.children;
54
- return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, children);
55
- };
56
-
57
- var SideNav = function SideNav(props) {
58
- var displayArrow = props.displayArrow,
59
- mode = props.mode,
60
- childProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
61
- return /*#__PURE__*/_react["default"].createElement(_main.DxcSidenav, childProps, childProps.children);
62
- };
63
-
64
- SideNav.propTypes = {
65
- mode: _propTypes["default"].oneOf(["overlay", "push", ""]),
66
- displayArrow: _propTypes["default"].bool,
67
- padding: _propTypes["default"].oneOfType([_propTypes["default"].shape({
68
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
69
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
70
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
71
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
72
- })])
73
- };
74
-
75
- var defaultFooter = function defaultFooter() {
76
- return /*#__PURE__*/_react["default"].createElement(_main.DxcFooter, {
77
- copyright: "\xA9 DXC Technology ".concat(year, "\u200B\u200B\u200B\u200B. All rights reserved."),
78
- bottomLinks: [{
79
- href: "https://www.linkedin.com/company/dxctechnology",
80
- text: "Linkedin"
81
- }, {
82
- href: "https://twitter.com/dxctechnology",
83
- text: "Twitter"
84
- }, {
85
- href: "https://www.facebook.com/DXCTechnology/",
86
- text: "Facebook"
87
- }],
88
- socialLinks: [{
89
- href: "https://www.linkedin.com/company/dxctechnology",
90
- logo: _Icons.linkedinLogo
91
- }, {
92
- href: "https://twitter.com/dxctechnology",
93
- logo: _Icons.twitterLogo
94
- }, {
95
- href: "https://www.facebook.com/DXCTechnology/",
96
- logo: _Icons.facebookLogo
97
- }]
98
- });
99
- };
100
-
101
- var defaultHeader = function defaultHeader() {
102
- return /*#__PURE__*/_react["default"].createElement(_main.DxcHeader, {
103
- underlined: true
104
- });
105
- };
106
-
107
- var childTypeExists = function childTypeExists(children, childType) {
108
- return children.find(function (child) {
109
- return child && child.type && child.type === childType;
110
- });
111
- };
112
-
113
- var DxcApplicationLayout = function DxcApplicationLayout(_ref4) {
114
- var children = _ref4.children;
115
- var ref = (0, _react.useRef)(null);
116
- var colorsTheme = (0, _useTheme["default"])();
117
-
118
- var _useState = (0, _react.useState)(true),
119
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
120
- isSideNavVisible = _useState2[0],
121
- setIsSideNavVisible = _useState2[1];
122
-
123
- var _useState3 = (0, _react.useState)(),
124
- _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
125
- isResponsive = _useState4[0],
126
- setIsResponsive = _useState4[1];
127
-
128
- var childrenArray = _react["default"].Children.toArray(children);
129
-
130
- var header = childTypeExists(childrenArray, _main.DxcHeader) || childTypeExists(childrenArray, Header) || defaultHeader();
131
- var footer = childTypeExists(childrenArray, _main.DxcFooter) || childTypeExists(childrenArray, Footer) || defaultFooter();
132
- var sideNav = childTypeExists(childrenArray, SideNav);
133
- var main = childTypeExists(childrenArray, Main);
134
- var displayArrow = sideNav && sideNav.props && sideNav.props.displayArrow;
135
- var sideNavMode = sideNav && sideNav.props && sideNav.props.mode;
136
-
137
- var ArrowIcon = function ArrowIcon() {
138
- return /*#__PURE__*/_react["default"].createElement("svg", {
139
- xmlns: "http://www.w3.org/2000/svg",
140
- width: "15.995",
141
- height: "10.01",
142
- viewBox: "0 0 15.995 10.01"
143
- }, /*#__PURE__*/_react["default"].createElement("path", {
144
- "data-testid": "arrow-to-right",
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",
146
- transform: "translate(-2 -6.996)"
147
- }));
148
- };
149
-
150
- var handleResize = function handleResize(width) {
151
- if (width) {
152
- if (width <= _variables.responsiveSizes.tablet ? setIsResponsive(true) : setIsResponsive(false)) ;
153
- setIsSideNavVisible(true);
154
- }
155
- };
156
-
157
- var handleEventListener = function handleEventListener() {
158
- handleResize(ref.current.offsetWidth);
159
- };
160
-
161
- (0, _react.useEffect)(function () {
162
- if (ref.current) {
163
- window.addEventListener("resize", handleEventListener);
164
- handleResize(ref.current.offsetWidth);
165
- }
166
-
167
- return function () {
168
- window.removeEventListener("resize", handleEventListener);
169
- };
170
- }, []);
171
-
172
- var handleSidenav = function handleSidenav() {
173
- setIsSideNavVisible(!isSideNavVisible);
174
- };
175
-
176
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
177
- theme: colorsTheme.sidenav
178
- }, /*#__PURE__*/_react["default"].createElement(ApplicationLayoutContainer, {
179
- ref: ref
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, {
181
- isSideNavVisible: isSideNavVisible
182
- }, sideNav, /*#__PURE__*/_react["default"].createElement(ArrowContainer, null, sideNav && (displayArrow || isResponsive) && /*#__PURE__*/_react["default"].createElement(ArrowTrigger, {
183
- tabIndex: 0,
184
- onClick: handleSidenav,
185
- isSideNavVisible: isSideNavVisible
186
- }, /*#__PURE__*/_react["default"].createElement(ArrowIcon, null)))), /*#__PURE__*/_react["default"].createElement(MainBodyContainer, null, /*#__PURE__*/_react["default"].createElement(MainContent, {
187
- sideNav: sideNav,
188
- mode: isResponsive ? "overlay" : sideNavMode,
189
- isSideNavVisible: isSideNavVisible
190
- }, main), /*#__PURE__*/_react["default"].createElement(FooterContainer, {
191
- sideNav: sideNav,
192
- mode: isResponsive ? "overlay" : sideNavMode,
193
- isSideNavVisible: isSideNavVisible
194
- }, footer))))));
195
- };
196
-
197
- DxcApplicationLayout.Header = Header;
198
- DxcApplicationLayout.Main = Main;
199
- DxcApplicationLayout.Footer = Footer;
200
- DxcApplicationLayout.SideNav = SideNav;
201
-
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"])));
203
-
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"])));
205
-
206
- var BodyContainer = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n flex: 1;\n display: flex;\n flex-direction: column;\n"])));
207
-
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"])));
209
-
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"])));
211
-
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) {
213
- return props.sideNav ? props.mode === "push" && !props.isSideNavVisible || props.mode === "overlay" ? "-300px" : "" : "";
214
- });
215
-
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) {
217
- return props.sideNav ? props.mode === "push" && props.isSideNavVisible ? "" : "-297px" : "";
218
- });
219
-
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) {
221
- return props.isSideNavVisible ? "translateX(0)" : !props.isSideNavVisible ? "translateX(-100%)" : "";
222
- });
223
-
224
- var ArrowContainer = _styledComponents["default"].div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["\n position: absolute;\n height: calc(100vh - 64px);\n left: 279px;\n"])));
225
-
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) {
227
- return "".concat(props.theme.arrowContainerColor);
228
- }, function (props) {
229
- return props.isSideNavVisible ? "rotate(-180deg)" : "rotate(0deg)";
230
- }, function (props) {
231
- return props.theme.arrowColor;
232
- });
233
-
234
- var _default = DxcApplicationLayout;
235
- exports["default"] = _default;
package/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.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 DELETED
@@ -1,183 +0,0 @@
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 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;
package/main.d.ts DELETED
@@ -1,44 +0,0 @@
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, };