@dhis2-ui/button 9.12.0 → 9.14.0

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.
@@ -15,22 +15,22 @@ describe('<Button>', () => {
15
15
  });
16
16
  describe('warning for missing aria-label and title', () => {
17
17
  it('No warning if children exist but aria-label and title is missing', () => {
18
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, null, "Children content"));
18
+ (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_button.Button, null, "Children content"));
19
19
  expect(consoleSpy).not.toHaveBeenCalled();
20
20
  });
21
21
  it('does not warn if aria-label and title is present', () => {
22
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
22
+ (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_button.Button, {
23
23
  "aria-label": "Test",
24
24
  title: "Test"
25
25
  }, "Children content"));
26
26
  expect(consoleSpy).not.toHaveBeenCalled();
27
27
  });
28
28
  it('warns if no children are present with no arial-label and title', () => {
29
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, null));
29
+ (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_button.Button, null));
30
30
  expect(consoleSpy).toHaveBeenCalledWith('Button component has no children but is missing title and ariaLabel attribute.');
31
31
  });
32
32
  it('No warning if there are no children but arial label and title', () => {
33
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
33
+ (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_button.Button, {
34
34
  "aria-label": "Test",
35
35
  title: "Test"
36
36
  }));
@@ -39,7 +39,7 @@ describe('<Button>', () => {
39
39
  });
40
40
  it('renders a default data-test attribute', () => {
41
41
  const dataTest = 'dhis2-uicore-button';
42
- const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
42
+ const wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react2.default.createElement(_button.Button, {
43
43
  dataTest: dataTest
44
44
  }));
45
45
  const actual = wrapper.find({
@@ -49,7 +49,7 @@ describe('<Button>', () => {
49
49
  });
50
50
  it('renders a custom data-test attribute', () => {
51
51
  const dataTest = 'button-data-test';
52
- const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
52
+ const wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react2.default.createElement(_button.Button, {
53
53
  dataTest: dataTest
54
54
  }));
55
55
  const actual = wrapper.find({
@@ -59,7 +59,7 @@ describe('<Button>', () => {
59
59
  });
60
60
  it('has the accessibility attributes', () => {
61
61
  const dataTest = 'button-data-test';
62
- const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
62
+ const wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react2.default.createElement(_button.Button, {
63
63
  dataTest: dataTest,
64
64
  ariaLabel: "test aria label",
65
65
  title: "title for button"
@@ -70,21 +70,21 @@ describe('<Button>', () => {
70
70
  });
71
71
  describe('toggle', () => {
72
72
  it('should have class "toggled" if toggled-prop is true', () => {
73
- const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
73
+ const wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react2.default.createElement(_button.Button, {
74
74
  toggled: true
75
75
  }));
76
76
  const actual = wrapper.find('button');
77
77
  expect(actual.hasClass('toggled')).toBe(true);
78
78
  });
79
79
  it('should not have class "toggled" if toggled-prop is not passed', () => {
80
- const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react2.default.createElement(_button.Button, null));
80
+ const wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react2.default.createElement(_button.Button, null));
81
81
  const actual = wrapper.find('button');
82
82
  expect(actual.hasClass('toggled')).toBe(false);
83
83
  });
84
84
  });
85
85
  it('should call the onKeyDown callback when provided', () => {
86
86
  const onKeyDown = jest.fn();
87
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
87
+ (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_button.Button, {
88
88
  name: "button-name",
89
89
  value: "button-value",
90
90
  onKeyDown: onKeyDown
@@ -44,7 +44,7 @@ describe('<DropdownButton>', () => {
44
44
  const {
45
45
  getByTestId,
46
46
  queryByText
47
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_dropdownButton.DropdownButton, {
47
+ } = (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_dropdownButton.DropdownButton, {
48
48
  component: componentText
49
49
  }));
50
50
  const toggleButton = getByTestId('dhis2-uicore-dropdownbutton-toggle');
@@ -68,7 +68,7 @@ describe('<DropdownButton>', () => {
68
68
  const {
69
69
  getByTestId,
70
70
  queryByText
71
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_modal.Modal, {
71
+ } = (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_modal.Modal, {
72
72
  hide: false,
73
73
  onClose: () => {}
74
74
  }, modalContent));
@@ -88,7 +88,7 @@ describe('<DropdownButton>', () => {
88
88
  });
89
89
  describe('closed state', () => {
90
90
  const onClick = jest.fn();
91
- const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react2.default.createElement(_dropdownButton.DropdownButton, {
91
+ const wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react2.default.createElement(_dropdownButton.DropdownButton, {
92
92
  onClick: onClick,
93
93
  open: false,
94
94
  component: /*#__PURE__*/_react2.default.createElement("span", null, "test")
@@ -2,7 +2,6 @@
2
2
 
3
3
  var _react = require("@testing-library/react");
4
4
  var _react2 = _interopRequireDefault(require("react"));
5
- require("@testing-library/jest-dom/extend-expect");
6
5
  var _splitButton = require("./split-button.js");
7
6
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
8
7
  describe('SplitButton', () => {
@@ -10,14 +9,14 @@ describe('SplitButton', () => {
10
9
  it('renders button with children', () => {
11
10
  const {
12
11
  getByText
13
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null, "Click me"));
12
+ } = (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null, "Click me"));
14
13
  expect(getByText('Click me')).toBeInTheDocument();
15
14
  });
16
15
  it('toggles dropdown when left button is clicked', () => {
17
16
  const {
18
17
  getByTestId,
19
18
  queryByTestId
20
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null));
19
+ } = (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null));
21
20
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
22
21
  _react.fireEvent.click(toggleButton);
23
22
  expect(queryByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
@@ -27,7 +26,7 @@ describe('SplitButton', () => {
27
26
  it('renders dropdown content when open is true', () => {
28
27
  const {
29
28
  getByTestId
30
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
29
+ } = (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
31
30
  component: /*#__PURE__*/_react2.default.createElement("div", null, "Dropdown Content")
32
31
  }));
33
32
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
@@ -37,7 +36,7 @@ describe('SplitButton', () => {
37
36
  it("does not close dropdown 'Enter' key is pressed", async () => {
38
37
  const {
39
38
  getByTestId
40
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
39
+ } = (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
41
40
  component: /*#__PURE__*/_react2.default.createElement("div", null, "Dropdown Content")
42
41
  }));
43
42
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
@@ -56,7 +55,7 @@ describe('SplitButton', () => {
56
55
  const {
57
56
  getByTestId,
58
57
  queryByTestId
59
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
58
+ } = (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
60
59
  component: /*#__PURE__*/_react2.default.createElement("div", null, "Dropdown Content")
61
60
  }));
62
61
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
@@ -74,7 +73,7 @@ describe('SplitButton', () => {
74
73
  it('adds title and aria-label attributes to the right button', () => {
75
74
  const {
76
75
  getByTestId
77
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null));
76
+ } = (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null));
78
77
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
79
78
  expect(toggleButton).toHaveAttribute('title', 'Toggle dropdown');
80
79
  expect(toggleButton).toHaveAttribute('aria-label', 'Toggle dropdown');
@@ -12,22 +12,22 @@ describe('<Button>', () => {
12
12
  });
13
13
  describe('warning for missing aria-label and title', () => {
14
14
  it('No warning if children exist but aria-label and title is missing', () => {
15
- render( /*#__PURE__*/React.createElement(Button, null, "Children content"));
15
+ render(/*#__PURE__*/React.createElement(Button, null, "Children content"));
16
16
  expect(consoleSpy).not.toHaveBeenCalled();
17
17
  });
18
18
  it('does not warn if aria-label and title is present', () => {
19
- render( /*#__PURE__*/React.createElement(Button, {
19
+ render(/*#__PURE__*/React.createElement(Button, {
20
20
  "aria-label": "Test",
21
21
  title: "Test"
22
22
  }, "Children content"));
23
23
  expect(consoleSpy).not.toHaveBeenCalled();
24
24
  });
25
25
  it('warns if no children are present with no arial-label and title', () => {
26
- render( /*#__PURE__*/React.createElement(Button, null));
26
+ render(/*#__PURE__*/React.createElement(Button, null));
27
27
  expect(consoleSpy).toHaveBeenCalledWith('Button component has no children but is missing title and ariaLabel attribute.');
28
28
  });
29
29
  it('No warning if there are no children but arial label and title', () => {
30
- render( /*#__PURE__*/React.createElement(Button, {
30
+ render(/*#__PURE__*/React.createElement(Button, {
31
31
  "aria-label": "Test",
32
32
  title: "Test"
33
33
  }));
@@ -36,7 +36,7 @@ describe('<Button>', () => {
36
36
  });
37
37
  it('renders a default data-test attribute', () => {
38
38
  const dataTest = 'dhis2-uicore-button';
39
- const wrapper = mount( /*#__PURE__*/React.createElement(Button, {
39
+ const wrapper = mount(/*#__PURE__*/React.createElement(Button, {
40
40
  dataTest: dataTest
41
41
  }));
42
42
  const actual = wrapper.find({
@@ -46,7 +46,7 @@ describe('<Button>', () => {
46
46
  });
47
47
  it('renders a custom data-test attribute', () => {
48
48
  const dataTest = 'button-data-test';
49
- const wrapper = mount( /*#__PURE__*/React.createElement(Button, {
49
+ const wrapper = mount(/*#__PURE__*/React.createElement(Button, {
50
50
  dataTest: dataTest
51
51
  }));
52
52
  const actual = wrapper.find({
@@ -56,7 +56,7 @@ describe('<Button>', () => {
56
56
  });
57
57
  it('has the accessibility attributes', () => {
58
58
  const dataTest = 'button-data-test';
59
- const wrapper = mount( /*#__PURE__*/React.createElement(Button, {
59
+ const wrapper = mount(/*#__PURE__*/React.createElement(Button, {
60
60
  dataTest: dataTest,
61
61
  ariaLabel: "test aria label",
62
62
  title: "title for button"
@@ -67,21 +67,21 @@ describe('<Button>', () => {
67
67
  });
68
68
  describe('toggle', () => {
69
69
  it('should have class "toggled" if toggled-prop is true', () => {
70
- const wrapper = mount( /*#__PURE__*/React.createElement(Button, {
70
+ const wrapper = mount(/*#__PURE__*/React.createElement(Button, {
71
71
  toggled: true
72
72
  }));
73
73
  const actual = wrapper.find('button');
74
74
  expect(actual.hasClass('toggled')).toBe(true);
75
75
  });
76
76
  it('should not have class "toggled" if toggled-prop is not passed', () => {
77
- const wrapper = mount( /*#__PURE__*/React.createElement(Button, null));
77
+ const wrapper = mount(/*#__PURE__*/React.createElement(Button, null));
78
78
  const actual = wrapper.find('button');
79
79
  expect(actual.hasClass('toggled')).toBe(false);
80
80
  });
81
81
  });
82
82
  it('should call the onKeyDown callback when provided', () => {
83
83
  const onKeyDown = jest.fn();
84
- render( /*#__PURE__*/React.createElement(Button, {
84
+ render(/*#__PURE__*/React.createElement(Button, {
85
85
  name: "button-name",
86
86
  value: "button-value",
87
87
  onKeyDown: onKeyDown
@@ -41,7 +41,7 @@ describe('<DropdownButton>', () => {
41
41
  const {
42
42
  getByTestId,
43
43
  queryByText
44
- } = render( /*#__PURE__*/React.createElement(DropdownButton, {
44
+ } = render(/*#__PURE__*/React.createElement(DropdownButton, {
45
45
  component: componentText
46
46
  }));
47
47
  const toggleButton = getByTestId('dhis2-uicore-dropdownbutton-toggle');
@@ -65,7 +65,7 @@ describe('<DropdownButton>', () => {
65
65
  const {
66
66
  getByTestId,
67
67
  queryByText
68
- } = render( /*#__PURE__*/React.createElement(Modal, {
68
+ } = render(/*#__PURE__*/React.createElement(Modal, {
69
69
  hide: false,
70
70
  onClose: () => {}
71
71
  }, modalContent));
@@ -85,7 +85,7 @@ describe('<DropdownButton>', () => {
85
85
  });
86
86
  describe('closed state', () => {
87
87
  const onClick = jest.fn();
88
- const wrapper = mount( /*#__PURE__*/React.createElement(DropdownButton, {
88
+ const wrapper = mount(/*#__PURE__*/React.createElement(DropdownButton, {
89
89
  onClick: onClick,
90
90
  open: false,
91
91
  component: /*#__PURE__*/React.createElement("span", null, "test")
@@ -1,20 +1,19 @@
1
1
  import { render, fireEvent, cleanup, waitFor } from '@testing-library/react';
2
2
  import React from 'react';
3
- import '@testing-library/jest-dom/extend-expect';
4
3
  import { SplitButton } from './split-button.js';
5
4
  describe('SplitButton', () => {
6
5
  afterEach(cleanup);
7
6
  it('renders button with children', () => {
8
7
  const {
9
8
  getByText
10
- } = render( /*#__PURE__*/React.createElement(SplitButton, null, "Click me"));
9
+ } = render(/*#__PURE__*/React.createElement(SplitButton, null, "Click me"));
11
10
  expect(getByText('Click me')).toBeInTheDocument();
12
11
  });
13
12
  it('toggles dropdown when left button is clicked', () => {
14
13
  const {
15
14
  getByTestId,
16
15
  queryByTestId
17
- } = render( /*#__PURE__*/React.createElement(SplitButton, null));
16
+ } = render(/*#__PURE__*/React.createElement(SplitButton, null));
18
17
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
19
18
  fireEvent.click(toggleButton);
20
19
  expect(queryByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
@@ -24,7 +23,7 @@ describe('SplitButton', () => {
24
23
  it('renders dropdown content when open is true', () => {
25
24
  const {
26
25
  getByTestId
27
- } = render( /*#__PURE__*/React.createElement(SplitButton, {
26
+ } = render(/*#__PURE__*/React.createElement(SplitButton, {
28
27
  component: /*#__PURE__*/React.createElement("div", null, "Dropdown Content")
29
28
  }));
30
29
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
@@ -34,7 +33,7 @@ describe('SplitButton', () => {
34
33
  it("does not close dropdown 'Enter' key is pressed", async () => {
35
34
  const {
36
35
  getByTestId
37
- } = render( /*#__PURE__*/React.createElement(SplitButton, {
36
+ } = render(/*#__PURE__*/React.createElement(SplitButton, {
38
37
  component: /*#__PURE__*/React.createElement("div", null, "Dropdown Content")
39
38
  }));
40
39
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
@@ -53,7 +52,7 @@ describe('SplitButton', () => {
53
52
  const {
54
53
  getByTestId,
55
54
  queryByTestId
56
- } = render( /*#__PURE__*/React.createElement(SplitButton, {
55
+ } = render(/*#__PURE__*/React.createElement(SplitButton, {
57
56
  component: /*#__PURE__*/React.createElement("div", null, "Dropdown Content")
58
57
  }));
59
58
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
@@ -71,7 +70,7 @@ describe('SplitButton', () => {
71
70
  it('adds title and aria-label attributes to the right button', () => {
72
71
  const {
73
72
  getByTestId
74
- } = render( /*#__PURE__*/React.createElement(SplitButton, null));
73
+ } = render(/*#__PURE__*/React.createElement(SplitButton, null));
75
74
  const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
76
75
  expect(toggleButton).toHaveAttribute('title', 'Toggle dropdown');
77
76
  expect(toggleButton).toHaveAttribute('aria-label', 'Toggle dropdown');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2-ui/button",
3
- "version": "9.12.0",
3
+ "version": "9.14.0",
4
4
  "description": "UI Button",
5
5
  "repository": {
6
6
  "type": "git",
@@ -27,17 +27,17 @@
27
27
  "test": "d2-app-scripts test --jestConfig ../../jest.config.shared.js"
28
28
  },
29
29
  "peerDependencies": {
30
- "react": "^16.13",
31
- "react-dom": "^16.13",
30
+ "react": "^16.13 || ^18",
31
+ "react-dom": "^16.13 || ^18",
32
32
  "styled-jsx": "^4"
33
33
  },
34
34
  "dependencies": {
35
35
  "@dhis2/prop-types": "^3.1.2",
36
- "@dhis2-ui/layer": "9.12.0",
37
- "@dhis2-ui/loader": "9.12.0",
38
- "@dhis2-ui/popper": "9.12.0",
39
- "@dhis2/ui-constants": "9.12.0",
40
- "@dhis2/ui-icons": "9.12.0",
36
+ "@dhis2-ui/layer": "9.14.0",
37
+ "@dhis2-ui/loader": "9.14.0",
38
+ "@dhis2-ui/popper": "9.14.0",
39
+ "@dhis2/ui-constants": "9.14.0",
40
+ "@dhis2/ui-icons": "9.14.0",
41
41
  "classnames": "^2.3.1",
42
42
  "prop-types": "^15.7.2"
43
43
  },
@@ -46,8 +46,8 @@
46
46
  "types"
47
47
  ],
48
48
  "devDependencies": {
49
- "react": "16.13",
50
- "react-dom": "16.13",
49
+ "react": "^18.3.1",
50
+ "react-dom": "^18.3.1",
51
51
  "styled-jsx": "^4.0.1"
52
52
  },
53
53
  "types": "types"