@dxc-technology/halstack-react 0.0.0-c680086 → 0.0.0-c702054
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/ThemeContext.d.ts +4 -9
- package/ThemeContext.js +32 -32
- package/accordion/Accordion.test.js +57 -0
- package/accordion-group/AccordionGroup.test.js +133 -0
- package/alert/Alert.test.js +92 -0
- package/badge/Badge.d.ts +4 -0
- package/badge/types.d.ts +4 -0
- package/badge/types.js +5 -0
- package/bleed/types.d.ts +24 -0
- package/box/Box.test.js +18 -0
- package/button/Button.test.js +35 -0
- package/card/Card.test.js +50 -0
- package/checkbox/Checkbox.test.js +65 -0
- package/chip/Chip.test.js +56 -0
- package/common/variables.js +0 -238
- package/date-input/DateInput.js +16 -20
- package/date-input/DateInput.stories.tsx +7 -7
- package/date-input/DateInput.test.js +492 -0
- package/date-input/types.d.ts +4 -0
- package/dialog/Dialog.test.js +40 -0
- package/dropdown/Dropdown.test.js +189 -0
- package/file-input/FileInput.test.js +457 -0
- package/footer/Footer.test.js +109 -0
- package/header/Header.test.js +63 -0
- package/heading/Heading.test.js +186 -0
- package/layout/ApplicationLayout.js +8 -2
- package/link/Link.test.js +91 -0
- package/main.d.ts +3 -6
- package/main.js +12 -36
- package/number-input/NumberInput.js +11 -18
- package/number-input/NumberInput.stories.tsx +5 -5
- package/number-input/NumberInput.test.js +508 -0
- package/number-input/types.d.ts +4 -0
- package/package.json +1 -1
- package/paginator/Paginator.test.js +266 -0
- package/password-input/PasswordInput.test.js +183 -0
- package/progress-bar/ProgressBar.test.js +65 -0
- package/radio/Radio.test.js +71 -0
- package/radio-group/Radio.d.ts +1 -1
- package/radio-group/Radio.js +24 -23
- package/radio-group/RadioGroup.js +39 -32
- package/radio-group/RadioGroup.stories.tsx +60 -39
- package/radio-group/RadioGroup.test.js +530 -83
- package/radio-group/types.d.ts +80 -2
- package/resultsetTable/ResultsetTable.test.js +306 -0
- package/row/types.d.ts +18 -0
- package/select/Icons.d.ts +10 -0
- package/select/Icons.js +93 -0
- package/select/Option.d.ts +4 -0
- package/select/Option.js +110 -0
- package/select/Select.js +82 -205
- package/select/Select.stories.tsx +91 -81
- package/select/Select.test.js +2016 -0
- package/select/types.d.ts +22 -1
- package/sidenav/Sidenav.test.js +56 -0
- package/slider/Slider.test.js +129 -0
- package/spinner/Spinner.test.js +64 -0
- package/stack/types.d.ts +15 -0
- package/switch/Switch.test.js +73 -0
- package/table/Table.test.js +26 -0
- package/tabs/Tabs.test.js +123 -0
- package/tag/Tag.js +12 -14
- package/tag/Tag.stories.tsx +12 -8
- package/tag/Tag.test.js +60 -0
- package/text-input/TextInput.js +8 -4
- package/text-input/TextInput.stories.tsx +30 -12
- package/text-input/TextInput.test.js +1725 -0
- package/text-input/types.d.ts +4 -0
- package/textarea/Textarea.js +8 -4
- package/textarea/Textarea.stories.jsx +33 -12
- package/textarea/Textarea.test.js +447 -0
- package/textarea/types.d.ts +4 -0
- package/toggle-group/ToggleGroup.test.js +125 -0
- package/wizard/Wizard.test.js +128 -0
- package/V3Select/V3Select.js +0 -455
- package/V3Select/index.d.ts +0 -27
- package/V3Textarea/V3Textarea.js +0 -260
- package/V3Textarea/index.d.ts +0 -27
- package/date/Date.js +0 -373
- package/date/index.d.ts +0 -27
- package/input-text/Icons.js +0 -22
- package/input-text/InputText.js +0 -611
- package/input-text/index.d.ts +0 -36
- package/toggle/Toggle.js +0 -186
- package/toggle/index.d.ts +0 -21
- package/upload/Upload.js +0 -201
- package/upload/buttons-upload/ButtonsUpload.js +0 -111
- package/upload/buttons-upload/Icons.js +0 -40
- package/upload/dragAndDropArea/DragAndDropArea.js +0 -225
- package/upload/dragAndDropArea/Icons.js +0 -39
- package/upload/file-upload/FileToUpload.js +0 -115
- package/upload/file-upload/Icons.js +0 -66
- package/upload/files-upload/FilesToUpload.js +0 -109
- package/upload/index.d.ts +0 -15
- package/upload/transaction/Icons.js +0 -160
- package/upload/transaction/Transaction.js +0 -104
- package/upload/transactions/Transactions.js +0 -94
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _react = _interopRequireDefault(require("react"));
|
|
6
|
+
|
|
7
|
+
var _react2 = require("@testing-library/react");
|
|
8
|
+
|
|
9
|
+
var _linkedin = _interopRequireDefault(require("../../app/src/images/linkedin.svg"));
|
|
10
|
+
|
|
11
|
+
var _Footer = _interopRequireDefault(require("./Footer"));
|
|
12
|
+
|
|
13
|
+
describe("Footer component tests", function () {
|
|
14
|
+
test("Footer renders with default logo", function () {
|
|
15
|
+
var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], null)),
|
|
16
|
+
getByTitle = _render.getByTitle;
|
|
17
|
+
|
|
18
|
+
expect(getByTitle("DXC Logo")).toBeTruthy();
|
|
19
|
+
});
|
|
20
|
+
test("Footer renders with social links", function () {
|
|
21
|
+
var social = [{
|
|
22
|
+
href: "https://www.test.com/test",
|
|
23
|
+
logo: _linkedin["default"]
|
|
24
|
+
}];
|
|
25
|
+
|
|
26
|
+
var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], {
|
|
27
|
+
socialLinks: social
|
|
28
|
+
})),
|
|
29
|
+
getByRole = _render2.getByRole;
|
|
30
|
+
|
|
31
|
+
var socialIcon = getByRole("link");
|
|
32
|
+
expect(socialIcon.getAttribute("href")).toBe("https://www.test.com/test");
|
|
33
|
+
});
|
|
34
|
+
test("Footer renders with bottom links", function () {
|
|
35
|
+
var bottom = [{
|
|
36
|
+
href: "https://www.test.com/test",
|
|
37
|
+
text: "bottom-link-text"
|
|
38
|
+
}];
|
|
39
|
+
|
|
40
|
+
var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], {
|
|
41
|
+
bottomLinks: bottom
|
|
42
|
+
})),
|
|
43
|
+
getByText = _render3.getByText;
|
|
44
|
+
|
|
45
|
+
var link = getByText("bottom-link-text");
|
|
46
|
+
expect(link.getAttribute("href")).toBe("https://www.test.com/test");
|
|
47
|
+
});
|
|
48
|
+
test("Footer renders with copyright text", function () {
|
|
49
|
+
var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], {
|
|
50
|
+
copyright: "test-copyright"
|
|
51
|
+
})),
|
|
52
|
+
getByText = _render4.getByText;
|
|
53
|
+
|
|
54
|
+
expect(getByText("test-copyright")).toBeTruthy();
|
|
55
|
+
});
|
|
56
|
+
test("Footer renders with correct children", function () {
|
|
57
|
+
//We need to force the offsetWidth value
|
|
58
|
+
Object.defineProperty(HTMLElement.prototype, "offsetWidth", {
|
|
59
|
+
configurable: true,
|
|
60
|
+
value: 1024
|
|
61
|
+
});
|
|
62
|
+
|
|
63
|
+
var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], null, /*#__PURE__*/_react["default"].createElement("p", null, "footer-child-text"))),
|
|
64
|
+
getByText = _render5.getByText;
|
|
65
|
+
|
|
66
|
+
expect(getByText("footer-child-text")).toBeTruthy();
|
|
67
|
+
});
|
|
68
|
+
test("Footer renders with children in mobile", function () {
|
|
69
|
+
//425 is mobile width
|
|
70
|
+
Object.defineProperty(HTMLElement.prototype, "offsetWidth", {
|
|
71
|
+
configurable: true,
|
|
72
|
+
value: 425
|
|
73
|
+
});
|
|
74
|
+
|
|
75
|
+
var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], null, /*#__PURE__*/_react["default"].createElement("p", null, "footer-child-text"))),
|
|
76
|
+
queryByText = _render6.queryByText;
|
|
77
|
+
|
|
78
|
+
expect(queryByText("footer-child-text")).toBeTruthy();
|
|
79
|
+
});
|
|
80
|
+
test("Footer is fully rendered", function () {
|
|
81
|
+
Object.defineProperty(HTMLElement.prototype, "offsetWidth", {
|
|
82
|
+
configurable: true,
|
|
83
|
+
value: 1024
|
|
84
|
+
});
|
|
85
|
+
var social = [{
|
|
86
|
+
href: "https://www.test.com/social",
|
|
87
|
+
logo: _linkedin["default"]
|
|
88
|
+
}];
|
|
89
|
+
var bottom = [{
|
|
90
|
+
href: "https://www.test.com/bottom",
|
|
91
|
+
text: "bottom-link-text"
|
|
92
|
+
}];
|
|
93
|
+
|
|
94
|
+
var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Footer["default"], {
|
|
95
|
+
socialLinks: social,
|
|
96
|
+
bottomLinks: bottom,
|
|
97
|
+
copyright: "test-copyright"
|
|
98
|
+
}, /*#__PURE__*/_react["default"].createElement("p", null, "footer-child-text"))),
|
|
99
|
+
getAllByRole = _render7.getAllByRole,
|
|
100
|
+
getByText = _render7.getByText;
|
|
101
|
+
|
|
102
|
+
var socialIcon = getAllByRole("link")[0];
|
|
103
|
+
expect(socialIcon.getAttribute("href")).toBe("https://www.test.com/social");
|
|
104
|
+
var bottomLink = getByText("bottom-link-text");
|
|
105
|
+
expect(bottomLink.getAttribute("href")).toBe("https://www.test.com/bottom");
|
|
106
|
+
expect(getByText("test-copyright")).toBeTruthy();
|
|
107
|
+
expect(getByText("footer-child-text")).toBeTruthy();
|
|
108
|
+
});
|
|
109
|
+
});
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _react = _interopRequireDefault(require("react"));
|
|
6
|
+
|
|
7
|
+
var _react2 = require("@testing-library/react");
|
|
8
|
+
|
|
9
|
+
var _Header = _interopRequireDefault(require("./Header"));
|
|
10
|
+
|
|
11
|
+
var _linkedin = _interopRequireDefault(require("../../app/src/images/linkedin.svg"));
|
|
12
|
+
|
|
13
|
+
describe("Header component tests", function () {
|
|
14
|
+
test("Header renders with default logo", function () {
|
|
15
|
+
var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Header["default"], null)),
|
|
16
|
+
getByTitle = _render.getByTitle;
|
|
17
|
+
|
|
18
|
+
expect(getByTitle("DXC Logo")).toBeTruthy();
|
|
19
|
+
});
|
|
20
|
+
test("Call correct function on logo click", function () {
|
|
21
|
+
var onClick = jest.fn();
|
|
22
|
+
|
|
23
|
+
var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
|
|
24
|
+
onClick: onClick
|
|
25
|
+
})),
|
|
26
|
+
getByTitle = _render2.getByTitle;
|
|
27
|
+
|
|
28
|
+
var logo = getByTitle("DXC Logo");
|
|
29
|
+
|
|
30
|
+
_react2.fireEvent.click(logo);
|
|
31
|
+
|
|
32
|
+
expect(onClick).toHaveBeenCalled();
|
|
33
|
+
});
|
|
34
|
+
test("Header renders with correct children", function () {
|
|
35
|
+
// We need to force the offsetWidth value
|
|
36
|
+
Object.defineProperty(HTMLElement.prototype, "offsetWidth", {
|
|
37
|
+
configurable: true,
|
|
38
|
+
value: 1024
|
|
39
|
+
});
|
|
40
|
+
|
|
41
|
+
var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
|
|
42
|
+
content: /*#__PURE__*/_react["default"].createElement("p", null, "header-child-text")
|
|
43
|
+
})),
|
|
44
|
+
getByText = _render3.getByText;
|
|
45
|
+
|
|
46
|
+
expect(getByText("header-child-text")).toBeTruthy();
|
|
47
|
+
});
|
|
48
|
+
test("Header renders menu button in mobile", function () {
|
|
49
|
+
Object.defineProperty(HTMLElement.prototype, "offsetWidth", {
|
|
50
|
+
configurable: true,
|
|
51
|
+
value: 425
|
|
52
|
+
});
|
|
53
|
+
|
|
54
|
+
var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
|
|
55
|
+
responsiveContent: function responsiveContent(closeMenu) {
|
|
56
|
+
return /*#__PURE__*/_react["default"].createElement("p", null, "header-child-text");
|
|
57
|
+
}
|
|
58
|
+
})),
|
|
59
|
+
getByText = _render4.getByText;
|
|
60
|
+
|
|
61
|
+
expect(getByText("Menu")).toBeTruthy();
|
|
62
|
+
});
|
|
63
|
+
});
|
|
@@ -0,0 +1,186 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _react = _interopRequireDefault(require("react"));
|
|
6
|
+
|
|
7
|
+
var _react2 = require("@testing-library/react");
|
|
8
|
+
|
|
9
|
+
var _Heading = _interopRequireDefault(require("./Heading"));
|
|
10
|
+
|
|
11
|
+
describe("Heading component tests", function () {
|
|
12
|
+
test("Heading renders with default level", function () {
|
|
13
|
+
var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
14
|
+
text: "my-heading-test"
|
|
15
|
+
})),
|
|
16
|
+
getByText = _render.getByText,
|
|
17
|
+
getByRole = _render.getByRole;
|
|
18
|
+
|
|
19
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
20
|
+
expect(getByRole("heading", {
|
|
21
|
+
level: 1
|
|
22
|
+
})).toBeTruthy();
|
|
23
|
+
});
|
|
24
|
+
test("Heading renders with level 1", function () {
|
|
25
|
+
var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
26
|
+
text: "my-heading-test",
|
|
27
|
+
level: 1
|
|
28
|
+
})),
|
|
29
|
+
getByText = _render2.getByText,
|
|
30
|
+
getByRole = _render2.getByRole;
|
|
31
|
+
|
|
32
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
33
|
+
expect(getByRole("heading", {
|
|
34
|
+
level: 1
|
|
35
|
+
})).toBeTruthy();
|
|
36
|
+
});
|
|
37
|
+
test("Heading renders with level 2", function () {
|
|
38
|
+
var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
39
|
+
text: "my-heading-test",
|
|
40
|
+
level: 2
|
|
41
|
+
})),
|
|
42
|
+
getByText = _render3.getByText,
|
|
43
|
+
getByRole = _render3.getByRole;
|
|
44
|
+
|
|
45
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
46
|
+
expect(getByRole("heading", {
|
|
47
|
+
level: 2
|
|
48
|
+
})).toBeTruthy();
|
|
49
|
+
});
|
|
50
|
+
test("Heading renders with level 3", function () {
|
|
51
|
+
var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
52
|
+
text: "my-heading-test",
|
|
53
|
+
level: 3
|
|
54
|
+
})),
|
|
55
|
+
getByText = _render4.getByText,
|
|
56
|
+
getByRole = _render4.getByRole;
|
|
57
|
+
|
|
58
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
59
|
+
expect(getByRole("heading", {
|
|
60
|
+
level: 3
|
|
61
|
+
})).toBeTruthy();
|
|
62
|
+
});
|
|
63
|
+
test("Heading renders with level 4", function () {
|
|
64
|
+
var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
65
|
+
text: "my-heading-test",
|
|
66
|
+
level: 4
|
|
67
|
+
})),
|
|
68
|
+
getByText = _render5.getByText,
|
|
69
|
+
getByRole = _render5.getByRole;
|
|
70
|
+
|
|
71
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
72
|
+
expect(getByRole("heading", {
|
|
73
|
+
level: 4
|
|
74
|
+
})).toBeTruthy();
|
|
75
|
+
});
|
|
76
|
+
test("Heading renders with level 5", function () {
|
|
77
|
+
var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
78
|
+
text: "my-heading-test",
|
|
79
|
+
level: 5
|
|
80
|
+
})),
|
|
81
|
+
getByText = _render6.getByText,
|
|
82
|
+
getByRole = _render6.getByRole;
|
|
83
|
+
|
|
84
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
85
|
+
expect(getByRole("heading", {
|
|
86
|
+
level: 5
|
|
87
|
+
})).toBeTruthy();
|
|
88
|
+
});
|
|
89
|
+
test("Heading renders with default level and as h5", function () {
|
|
90
|
+
var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
91
|
+
text: "my-heading-test",
|
|
92
|
+
as: "h5"
|
|
93
|
+
})),
|
|
94
|
+
getByText = _render7.getByText,
|
|
95
|
+
getByRole = _render7.getByRole;
|
|
96
|
+
|
|
97
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
98
|
+
expect(getByRole("heading", {
|
|
99
|
+
level: 5
|
|
100
|
+
})).toBeTruthy();
|
|
101
|
+
});
|
|
102
|
+
test("Heading renders with level 1 and as h5", function () {
|
|
103
|
+
var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
104
|
+
text: "my-heading-test",
|
|
105
|
+
level: 1,
|
|
106
|
+
as: "h5"
|
|
107
|
+
})),
|
|
108
|
+
getByText = _render8.getByText,
|
|
109
|
+
getByRole = _render8.getByRole;
|
|
110
|
+
|
|
111
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
112
|
+
expect(getByRole("heading", {
|
|
113
|
+
level: 5
|
|
114
|
+
})).toBeTruthy();
|
|
115
|
+
});
|
|
116
|
+
test("Heading renders with level 2 and as h4", function () {
|
|
117
|
+
var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
118
|
+
text: "my-heading-test",
|
|
119
|
+
level: 2,
|
|
120
|
+
as: "h4"
|
|
121
|
+
})),
|
|
122
|
+
getByText = _render9.getByText,
|
|
123
|
+
getByRole = _render9.getByRole;
|
|
124
|
+
|
|
125
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
126
|
+
expect(getByRole("heading", {
|
|
127
|
+
level: 4
|
|
128
|
+
})).toBeTruthy();
|
|
129
|
+
});
|
|
130
|
+
test("Heading renders with level 3 and as h2", function () {
|
|
131
|
+
var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
132
|
+
text: "my-heading-test",
|
|
133
|
+
level: 3,
|
|
134
|
+
as: "h2"
|
|
135
|
+
})),
|
|
136
|
+
getByText = _render10.getByText,
|
|
137
|
+
getByRole = _render10.getByRole;
|
|
138
|
+
|
|
139
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
140
|
+
expect(getByRole("heading", {
|
|
141
|
+
level: 2
|
|
142
|
+
})).toBeTruthy();
|
|
143
|
+
});
|
|
144
|
+
test("Heading renders with level 4 and as h3", function () {
|
|
145
|
+
var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
146
|
+
text: "my-heading-test",
|
|
147
|
+
level: 4,
|
|
148
|
+
as: "h3"
|
|
149
|
+
})),
|
|
150
|
+
getByText = _render11.getByText,
|
|
151
|
+
getByRole = _render11.getByRole;
|
|
152
|
+
|
|
153
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
154
|
+
expect(getByRole("heading", {
|
|
155
|
+
level: 3
|
|
156
|
+
})).toBeTruthy();
|
|
157
|
+
});
|
|
158
|
+
test("Heading renders with level 5 as h4", function () {
|
|
159
|
+
var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
160
|
+
text: "my-heading-test",
|
|
161
|
+
level: 5,
|
|
162
|
+
as: "h4"
|
|
163
|
+
})),
|
|
164
|
+
getByText = _render12.getByText,
|
|
165
|
+
getByRole = _render12.getByRole;
|
|
166
|
+
|
|
167
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
168
|
+
expect(getByRole("heading", {
|
|
169
|
+
level: 4
|
|
170
|
+
})).toBeTruthy();
|
|
171
|
+
});
|
|
172
|
+
test("Heading renders with level 5 and invalid as", function () {
|
|
173
|
+
var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
|
|
174
|
+
text: "my-heading-test",
|
|
175
|
+
level: 5,
|
|
176
|
+
as: "h4afdssf"
|
|
177
|
+
})),
|
|
178
|
+
getByText = _render13.getByText,
|
|
179
|
+
getByRole = _render13.getByRole;
|
|
180
|
+
|
|
181
|
+
expect(getByText("my-heading-test")).toBeTruthy();
|
|
182
|
+
expect(getByRole("heading", {
|
|
183
|
+
level: 5
|
|
184
|
+
})).toBeTruthy();
|
|
185
|
+
});
|
|
186
|
+
});
|
|
@@ -114,6 +114,11 @@ var DxcApplicationLayout = function DxcApplicationLayout(_ref4) {
|
|
|
114
114
|
isResponsive = _useState4[0],
|
|
115
115
|
setIsResponsive = _useState4[1];
|
|
116
116
|
|
|
117
|
+
var _useState5 = (0, _react.useState)(null),
|
|
118
|
+
_useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
|
|
119
|
+
previousWidth = _useState6[0],
|
|
120
|
+
setPreviousWidth = _useState6[1];
|
|
121
|
+
|
|
117
122
|
var childrenArray = _react["default"].Children.toArray(children);
|
|
118
123
|
|
|
119
124
|
var header = childTypeExists(childrenArray, _main.DxcHeader) || childTypeExists(childrenArray, Header) || defaultHeader();
|
|
@@ -138,13 +143,14 @@ var DxcApplicationLayout = function DxcApplicationLayout(_ref4) {
|
|
|
138
143
|
|
|
139
144
|
var handleResize = function handleResize(width) {
|
|
140
145
|
if (width) {
|
|
146
|
+
setPreviousWidth(width);
|
|
141
147
|
setIsResponsive(width <= _variables.responsiveSizes.tablet);
|
|
142
148
|
setIsSideNavVisible(true);
|
|
143
149
|
}
|
|
144
150
|
};
|
|
145
151
|
|
|
146
152
|
var handleEventListener = function handleEventListener() {
|
|
147
|
-
handleResize(ref.current.offsetWidth);
|
|
153
|
+
if (previousWidth !== ref.current.offsetWidth) handleResize(ref.current.offsetWidth);
|
|
148
154
|
};
|
|
149
155
|
|
|
150
156
|
(0, _react.useEffect)(function () {
|
|
@@ -156,7 +162,7 @@ var DxcApplicationLayout = function DxcApplicationLayout(_ref4) {
|
|
|
156
162
|
return function () {
|
|
157
163
|
window.removeEventListener("resize", handleEventListener);
|
|
158
164
|
};
|
|
159
|
-
}, []);
|
|
165
|
+
}, [ref.current]);
|
|
160
166
|
|
|
161
167
|
var handleSidenav = function handleSidenav() {
|
|
162
168
|
setIsSideNavVisible(!isSideNavVisible);
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _react = _interopRequireDefault(require("react"));
|
|
6
|
+
|
|
7
|
+
var _react2 = require("@testing-library/react");
|
|
8
|
+
|
|
9
|
+
var _Link = _interopRequireDefault(require("./Link"));
|
|
10
|
+
|
|
11
|
+
describe("Link component tests", function () {
|
|
12
|
+
test("Link renders with correct text", function () {
|
|
13
|
+
var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
14
|
+
text: "Link"
|
|
15
|
+
})),
|
|
16
|
+
getByText = _render.getByText;
|
|
17
|
+
|
|
18
|
+
expect(getByText("Link")).toBeTruthy();
|
|
19
|
+
});
|
|
20
|
+
test("Link renders with correct href", function () {
|
|
21
|
+
var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
22
|
+
text: "Link",
|
|
23
|
+
href: "/testPage"
|
|
24
|
+
})),
|
|
25
|
+
getByRole = _render2.getByRole;
|
|
26
|
+
|
|
27
|
+
expect(getByRole("link").getAttribute("href")).toEqual("/testPage");
|
|
28
|
+
});
|
|
29
|
+
test("Link renders with correct disabled state", function () {
|
|
30
|
+
var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
31
|
+
text: "Link",
|
|
32
|
+
href: "/testPage",
|
|
33
|
+
disabled: true
|
|
34
|
+
})),
|
|
35
|
+
getByText = _render3.getByText;
|
|
36
|
+
|
|
37
|
+
expect(getByText("Link").hasAttribute("href")).toBeFalsy();
|
|
38
|
+
|
|
39
|
+
var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
40
|
+
text: "LinkButton",
|
|
41
|
+
onClick: function onClick() {
|
|
42
|
+
return console.log("Andorra");
|
|
43
|
+
},
|
|
44
|
+
disabled: true
|
|
45
|
+
})),
|
|
46
|
+
getByTextLinkButton = _render4.getByText;
|
|
47
|
+
|
|
48
|
+
expect(getByTextLinkButton("LinkButton").hasAttribute("onclick")).toBeFalsy();
|
|
49
|
+
});
|
|
50
|
+
test("Link open new tab", function () {
|
|
51
|
+
var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
52
|
+
text: "Link",
|
|
53
|
+
href: "/testPage",
|
|
54
|
+
newWindow: true
|
|
55
|
+
})),
|
|
56
|
+
getByRole = _render5.getByRole;
|
|
57
|
+
|
|
58
|
+
expect(getByRole("link").getAttribute("target")).toEqual("_blank");
|
|
59
|
+
});
|
|
60
|
+
test("Link onClick called", function () {
|
|
61
|
+
var onClick = jest.fn();
|
|
62
|
+
|
|
63
|
+
var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
64
|
+
text: "Link",
|
|
65
|
+
onClick: onClick
|
|
66
|
+
})),
|
|
67
|
+
getByText = _render6.getByText;
|
|
68
|
+
|
|
69
|
+
var link = getByText("Link");
|
|
70
|
+
|
|
71
|
+
_react2.fireEvent.click(link);
|
|
72
|
+
|
|
73
|
+
expect(onClick).toHaveBeenCalled();
|
|
74
|
+
});
|
|
75
|
+
test("Disabled link onClick not called", function () {
|
|
76
|
+
var onClick = jest.fn();
|
|
77
|
+
|
|
78
|
+
var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
79
|
+
text: "Link",
|
|
80
|
+
onClick: onClick,
|
|
81
|
+
disabled: true
|
|
82
|
+
})),
|
|
83
|
+
getByText = _render7.getByText;
|
|
84
|
+
|
|
85
|
+
var link = getByText("Link");
|
|
86
|
+
|
|
87
|
+
_react2.fireEvent.click(link);
|
|
88
|
+
|
|
89
|
+
expect(onClick).toHaveBeenCalledTimes(0);
|
|
90
|
+
});
|
|
91
|
+
});
|
package/main.d.ts
CHANGED
|
@@ -3,20 +3,16 @@ import DxcAccordion from "./accordion/Accordion";
|
|
|
3
3
|
import DxcButton from "./button/Button";
|
|
4
4
|
import DxcCard from "./card/Card";
|
|
5
5
|
import DxcCheckbox from "./checkbox/Checkbox";
|
|
6
|
-
import DxcDate from "./date/Date";
|
|
7
6
|
import DxcDialog from "./dialog/Dialog";
|
|
8
7
|
import DxcDropdown from "./dropdown/Dropdown";
|
|
9
8
|
import DxcFooter from "./footer/Footer";
|
|
10
9
|
import DxcHeader from "./header/Header";
|
|
11
|
-
import DxcInput from "./input-text/InputText";
|
|
12
10
|
import DxcRadio from "./radio/Radio";
|
|
13
|
-
import V3DxcSelect from "./V3Select/V3Select";
|
|
14
11
|
import DxcSlider from "./slider/Slider";
|
|
15
12
|
import DxcSwitch from "./switch/Switch";
|
|
16
13
|
import DxcTabs from "./tabs/Tabs";
|
|
17
14
|
import DxcProgressBar from "./progress-bar/ProgressBar";
|
|
18
15
|
import DxcSpinner from "./spinner/Spinner";
|
|
19
|
-
import DxcUpload from "./upload/Upload";
|
|
20
16
|
import DxcTable from "./table/Table";
|
|
21
17
|
import DxcBox from "./box/Box";
|
|
22
18
|
import DxcTag from "./tag/Tag";
|
|
@@ -25,7 +21,6 @@ import DxcSidenav from "./sidenav/Sidenav";
|
|
|
25
21
|
import DxcWizard from "./wizard/Wizard";
|
|
26
22
|
import DxcLink from "./link/Link";
|
|
27
23
|
import DxcHeading from "./heading/Heading";
|
|
28
|
-
import V3DxcTextarea from "./V3Textarea/V3Textarea";
|
|
29
24
|
import DxcResultsetTable from "./resultsetTable/ResultsetTable";
|
|
30
25
|
import DxcChip from "./chip/Chip";
|
|
31
26
|
import DxcApplicationLayout from "./layout/ApplicationLayout";
|
|
@@ -44,6 +39,8 @@ import DxcRow from "./row/Row";
|
|
|
44
39
|
import DxcText from "./text/Text";
|
|
45
40
|
import DxcList from "./list/List";
|
|
46
41
|
import DxcRadioGroup from "./radio-group/RadioGroup";
|
|
42
|
+
import DxcBleed from "./bleed/Bleed";
|
|
43
|
+
import DxcInset from "./inset/Inset";
|
|
47
44
|
import ThemeContext, { ThemeProvider } from "./ThemeContext";
|
|
48
45
|
import { BackgroundColorProvider } from "./BackgroundColorContext";
|
|
49
|
-
export { DxcAlert, DxcButton, DxcFooter, DxcCheckbox,
|
|
46
|
+
export { DxcAlert, DxcButton, DxcFooter, DxcCheckbox, DxcTextInput, DxcDropdown, DxcSwitch, DxcSlider, DxcRadio, DxcHeader, DxcTable, DxcTabs, DxcToggleGroup, DxcDialog, DxcCard, DxcProgressBar, DxcAccordion, DxcSpinner, DxcBox, DxcTag, DxcPaginator, DxcSidenav, DxcWizard, DxcLink, DxcHeading, DxcResultsetTable, DxcChip, DxcApplicationLayout, ThemeContext, ThemeProvider, BackgroundColorProvider, DxcAccordionGroup, DxcBadge, DxcPasswordInput, DxcDateInput, DxcNumberInput, DxcTextarea, DxcSelect, DxcFileInput, DxcStack, DxcRow, DxcText, DxcList, DxcRadioGroup, DxcBleed, DxcInset };
|
package/main.js
CHANGED
|
@@ -43,6 +43,12 @@ Object.defineProperty(exports, "DxcBadge", {
|
|
|
43
43
|
return _Badge["default"];
|
|
44
44
|
}
|
|
45
45
|
});
|
|
46
|
+
Object.defineProperty(exports, "DxcBleed", {
|
|
47
|
+
enumerable: true,
|
|
48
|
+
get: function get() {
|
|
49
|
+
return _Bleed["default"];
|
|
50
|
+
}
|
|
51
|
+
});
|
|
46
52
|
Object.defineProperty(exports, "DxcBox", {
|
|
47
53
|
enumerable: true,
|
|
48
54
|
get: function get() {
|
|
@@ -73,12 +79,6 @@ Object.defineProperty(exports, "DxcChip", {
|
|
|
73
79
|
return _Chip["default"];
|
|
74
80
|
}
|
|
75
81
|
});
|
|
76
|
-
Object.defineProperty(exports, "DxcDate", {
|
|
77
|
-
enumerable: true,
|
|
78
|
-
get: function get() {
|
|
79
|
-
return _Date["default"];
|
|
80
|
-
}
|
|
81
|
-
});
|
|
82
82
|
Object.defineProperty(exports, "DxcDateInput", {
|
|
83
83
|
enumerable: true,
|
|
84
84
|
get: function get() {
|
|
@@ -121,10 +121,10 @@ Object.defineProperty(exports, "DxcHeading", {
|
|
|
121
121
|
return _Heading["default"];
|
|
122
122
|
}
|
|
123
123
|
});
|
|
124
|
-
Object.defineProperty(exports, "
|
|
124
|
+
Object.defineProperty(exports, "DxcInset", {
|
|
125
125
|
enumerable: true,
|
|
126
126
|
get: function get() {
|
|
127
|
-
return
|
|
127
|
+
return _Inset["default"];
|
|
128
128
|
}
|
|
129
129
|
});
|
|
130
130
|
Object.defineProperty(exports, "DxcLink", {
|
|
@@ -265,12 +265,6 @@ Object.defineProperty(exports, "DxcToggleGroup", {
|
|
|
265
265
|
return _ToggleGroup["default"];
|
|
266
266
|
}
|
|
267
267
|
});
|
|
268
|
-
Object.defineProperty(exports, "DxcUpload", {
|
|
269
|
-
enumerable: true,
|
|
270
|
-
get: function get() {
|
|
271
|
-
return _Upload["default"];
|
|
272
|
-
}
|
|
273
|
-
});
|
|
274
268
|
Object.defineProperty(exports, "DxcWizard", {
|
|
275
269
|
enumerable: true,
|
|
276
270
|
get: function get() {
|
|
@@ -289,18 +283,6 @@ Object.defineProperty(exports, "ThemeProvider", {
|
|
|
289
283
|
return _ThemeContext.ThemeProvider;
|
|
290
284
|
}
|
|
291
285
|
});
|
|
292
|
-
Object.defineProperty(exports, "V3DxcSelect", {
|
|
293
|
-
enumerable: true,
|
|
294
|
-
get: function get() {
|
|
295
|
-
return _V3Select["default"];
|
|
296
|
-
}
|
|
297
|
-
});
|
|
298
|
-
Object.defineProperty(exports, "V3DxcTextarea", {
|
|
299
|
-
enumerable: true,
|
|
300
|
-
get: function get() {
|
|
301
|
-
return _V3Textarea["default"];
|
|
302
|
-
}
|
|
303
|
-
});
|
|
304
286
|
|
|
305
287
|
var _Alert = _interopRequireDefault(require("./alert/Alert"));
|
|
306
288
|
|
|
@@ -312,8 +294,6 @@ var _Card = _interopRequireDefault(require("./card/Card"));
|
|
|
312
294
|
|
|
313
295
|
var _Checkbox = _interopRequireDefault(require("./checkbox/Checkbox"));
|
|
314
296
|
|
|
315
|
-
var _Date = _interopRequireDefault(require("./date/Date"));
|
|
316
|
-
|
|
317
297
|
var _Dialog = _interopRequireDefault(require("./dialog/Dialog"));
|
|
318
298
|
|
|
319
299
|
var _Dropdown = _interopRequireDefault(require("./dropdown/Dropdown"));
|
|
@@ -322,12 +302,8 @@ var _Footer = _interopRequireDefault(require("./footer/Footer"));
|
|
|
322
302
|
|
|
323
303
|
var _Header = _interopRequireDefault(require("./header/Header"));
|
|
324
304
|
|
|
325
|
-
var _InputText = _interopRequireDefault(require("./input-text/InputText"));
|
|
326
|
-
|
|
327
305
|
var _Radio = _interopRequireDefault(require("./radio/Radio"));
|
|
328
306
|
|
|
329
|
-
var _V3Select = _interopRequireDefault(require("./V3Select/V3Select"));
|
|
330
|
-
|
|
331
307
|
var _Slider = _interopRequireDefault(require("./slider/Slider"));
|
|
332
308
|
|
|
333
309
|
var _Switch = _interopRequireDefault(require("./switch/Switch"));
|
|
@@ -338,8 +314,6 @@ var _ProgressBar = _interopRequireDefault(require("./progress-bar/ProgressBar"))
|
|
|
338
314
|
|
|
339
315
|
var _Spinner = _interopRequireDefault(require("./spinner/Spinner"));
|
|
340
316
|
|
|
341
|
-
var _Upload = _interopRequireDefault(require("./upload/Upload"));
|
|
342
|
-
|
|
343
317
|
var _Table = _interopRequireDefault(require("./table/Table"));
|
|
344
318
|
|
|
345
319
|
var _Box = _interopRequireDefault(require("./box/Box"));
|
|
@@ -356,8 +330,6 @@ var _Link = _interopRequireDefault(require("./link/Link"));
|
|
|
356
330
|
|
|
357
331
|
var _Heading = _interopRequireDefault(require("./heading/Heading"));
|
|
358
332
|
|
|
359
|
-
var _V3Textarea = _interopRequireDefault(require("./V3Textarea/V3Textarea"));
|
|
360
|
-
|
|
361
333
|
var _ResultsetTable = _interopRequireDefault(require("./resultsetTable/ResultsetTable"));
|
|
362
334
|
|
|
363
335
|
var _Chip = _interopRequireDefault(require("./chip/Chip"));
|
|
@@ -394,6 +366,10 @@ var _List = _interopRequireDefault(require("./list/List"));
|
|
|
394
366
|
|
|
395
367
|
var _RadioGroup = _interopRequireDefault(require("./radio-group/RadioGroup"));
|
|
396
368
|
|
|
369
|
+
var _Bleed = _interopRequireDefault(require("./bleed/Bleed"));
|
|
370
|
+
|
|
371
|
+
var _Inset = _interopRequireDefault(require("./inset/Inset"));
|
|
372
|
+
|
|
397
373
|
var _ThemeContext = _interopRequireWildcard(require("./ThemeContext"));
|
|
398
374
|
|
|
399
375
|
var _BackgroundColorContext = require("./BackgroundColorContext");
|