@instructure/ui-side-nav-bar 10.16.1-snapshot-0 → 10.16.1

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 (21) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/es/SideNavBar/SideNavBarItem/__new-tests__/NavigationItem.test.js +5 -5
  3. package/es/SideNavBar/SideNavBarItem/index.js +18 -12
  4. package/es/SideNavBar/__new-tests__/SideNavBar.test.js +72 -61
  5. package/es/SideNavBar/index.js +25 -19
  6. package/lib/SideNavBar/SideNavBarItem/__new-tests__/NavigationItem.test.js +7 -8
  7. package/lib/SideNavBar/SideNavBarItem/index.js +16 -11
  8. package/lib/SideNavBar/__new-tests__/SideNavBar.test.js +84 -73
  9. package/lib/SideNavBar/index.js +24 -19
  10. package/package.json +17 -17
  11. package/src/SideNavBar/SideNavBarItem/__new-tests__/NavigationItem.test.tsx +0 -1
  12. package/src/SideNavBar/SideNavBarItem/index.tsx +2 -2
  13. package/src/SideNavBar/__new-tests__/SideNavBar.test.tsx +0 -1
  14. package/src/SideNavBar/index.tsx +2 -3
  15. package/tsconfig.build.tsbuildinfo +1 -1
  16. package/types/SideNavBar/SideNavBarItem/__new-tests__/NavigationItem.test.d.ts.map +1 -1
  17. package/types/SideNavBar/SideNavBarItem/index.d.ts +2 -4
  18. package/types/SideNavBar/SideNavBarItem/index.d.ts.map +1 -1
  19. package/types/SideNavBar/__new-tests__/SideNavBar.test.d.ts.map +1 -1
  20. package/types/SideNavBar/index.d.ts +3 -5
  21. package/types/SideNavBar/index.d.ts.map +1 -1
package/lib/SideNavBar/__new-tests__/SideNavBar.test.js CHANGED
@@ -1,8 +1,7 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- var _react = _interopRequireDefault(require("react"));
5
- var _react2 = require("@testing-library/react");
4
+ var _react = require("@testing-library/react");
6
5
  var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
7
6
  var _vitest = require("vitest");
8
7
  require("@testing-library/jest-dom");
@@ -11,6 +10,7 @@ var _IconAdminLine = require("@instructure/ui-icons/lib/IconAdminLine.js");
11
10
  var _IconDashboardLine = require("@instructure/ui-icons/lib/IconDashboardLine.js");
12
11
  var _runAxeCheck = require("@instructure/ui-axe-check/lib/runAxeCheck.js");
13
12
  var _index = require("../index");
13
+ var _jsxRuntime = require("@emotion/react/jsx-runtime");
14
14
  var _SideNavBarItem, _div, _SideNavBarItem2, _SideNavBarItem3, _SideNavBarItem4, _SideNavBarItem5, _SideNavBarItem6, _SideNavBarItem7, _SideNavBarItem8, _SideNavBarItem9;
15
15
  /*
16
16
  * The MIT License (MIT)
@@ -45,19 +45,20 @@ describe('<SideNavBar />', () => {
45
45
  consoleErrorMock.mockRestore();
46
46
  });
47
47
  it('should render', async () => {
48
- const _render = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.SideNavBar, {
48
+ const _render = (0, _react.render)((0, _jsxRuntime.jsx)(_index.SideNavBar, {
49
49
  label: "Main navigation",
50
50
  toggleLabel: {
51
51
  expandedLabel: 'Minimize SideNavBar',
52
52
  minimizedLabel: 'Expand SideNavBar'
53
- }
54
- }, _SideNavBarItem || (_SideNavBarItem = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
55
- icon: /*#__PURE__*/_react.default.createElement(_IconDashboardLine.IconDashboardLine, null),
56
- label: "Dashboard",
57
- href: "#"
58
- })))),
53
+ },
54
+ children: _SideNavBarItem || (_SideNavBarItem = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
55
+ icon: (0, _jsxRuntime.jsx)(_IconDashboardLine.IconDashboardLine, {}),
56
+ label: "Dashboard",
57
+ href: "#"
58
+ }))
59
+ })),
59
60
  container = _render.container;
60
- const nav = _react2.screen.getByRole('navigation');
61
+ const nav = _react.screen.getByRole('navigation');
61
62
  const icons = container.querySelectorAll('svg');
62
63
  expect(icons.length).toBe(2);
63
64
  expect(icons[0]).toHaveAttribute('name', 'IconDashboard');
@@ -68,112 +69,122 @@ describe('<SideNavBar />', () => {
68
69
  expect(nav).toHaveTextContent('Minimize SideNavBar');
69
70
  });
70
71
  it('should not crash with valid React elements', async () => {
71
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.SideNavBar, {
72
+ (0, _react.render)((0, _jsxRuntime.jsxs)(_index.SideNavBar, {
72
73
  label: "Main navigation",
73
74
  toggleLabel: {
74
75
  expandedLabel: 'Minimize SideNavBar',
75
76
  minimizedLabel: 'Expand SideNavBar'
76
- }
77
- }, false, _div || (_div = /*#__PURE__*/_react.default.createElement("div", null, "test123")), _SideNavBarItem2 || (_SideNavBarItem2 = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
78
- icon: /*#__PURE__*/_react.default.createElement(_IconDashboardLine.IconDashboardLine, null),
79
- label: "Dashboard",
80
- href: "#"
81
- }))));
82
- const navElements = _react2.screen.getAllByRole('listitem');
77
+ },
78
+ children: [false, _div || (_div = (0, _jsxRuntime.jsx)("div", {
79
+ children: "test123"
80
+ })), _SideNavBarItem2 || (_SideNavBarItem2 = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
81
+ icon: (0, _jsxRuntime.jsx)(_IconDashboardLine.IconDashboardLine, {}),
82
+ label: "Dashboard",
83
+ href: "#"
84
+ }))]
85
+ }));
86
+ const navElements = _react.screen.getAllByRole('listitem');
83
87
  expect(navElements[0]).toHaveTextContent('test123');
84
88
  expect(navElements[1]).toHaveTextContent('Dashboard');
85
89
  });
86
90
  it('should render a single semantic nav element', async () => {
87
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.SideNavBar, {
91
+ (0, _react.render)((0, _jsxRuntime.jsx)(_index.SideNavBar, {
88
92
  label: "Main navigation",
89
93
  toggleLabel: {
90
94
  expandedLabel: 'Minimize SideNavBar',
91
95
  minimizedLabel: 'Expand SideNavBar'
92
- }
93
- }, _SideNavBarItem3 || (_SideNavBarItem3 = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
94
- icon: /*#__PURE__*/_react.default.createElement(_IconDashboardLine.IconDashboardLine, null),
95
- label: "Dashboard",
96
- href: "#"
97
- }))));
98
- const nav = _react2.screen.getByRole('navigation');
99
- const navElements = _react2.screen.getAllByRole('listitem');
96
+ },
97
+ children: _SideNavBarItem3 || (_SideNavBarItem3 = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
98
+ icon: (0, _jsxRuntime.jsx)(_IconDashboardLine.IconDashboardLine, {}),
99
+ label: "Dashboard",
100
+ href: "#"
101
+ }))
102
+ }));
103
+ const nav = _react.screen.getByRole('navigation');
104
+ const navElements = _react.screen.getAllByRole('listitem');
100
105
  expect(nav).toBeInTheDocument();
101
106
  expect(nav.tagName).toBe('NAV');
102
107
  expect(navElements.length).toBe(1);
103
108
  expect(navElements[0]).toHaveTextContent('Dashboard');
104
109
  });
105
110
  it('should render a semantic list for the nav content', async () => {
106
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.SideNavBar, {
111
+ (0, _react.render)((0, _jsxRuntime.jsxs)(_index.SideNavBar, {
107
112
  label: "Main navigation",
108
113
  toggleLabel: {
109
114
  expandedLabel: 'Minimize SideNavBar',
110
115
  minimizedLabel: 'Expand SideNavBar'
111
- }
112
- }, _SideNavBarItem4 || (_SideNavBarItem4 = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
113
- icon: /*#__PURE__*/_react.default.createElement(_IconDashboardLine.IconDashboardLine, null),
114
- label: "Dashboard",
115
- href: "#"
116
- })), _SideNavBarItem5 || (_SideNavBarItem5 = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
117
- icon: /*#__PURE__*/_react.default.createElement(_Badge.Badge, {
118
- count: 99
119
- }, /*#__PURE__*/_react.default.createElement(_IconAdminLine.IconAdminLine, null)),
120
- label: "Inbox",
121
- href: "#"
122
- }))));
123
- const list = _react2.screen.getAllByRole('list');
124
- const navElements = _react2.screen.getAllByRole('listitem');
116
+ },
117
+ children: [_SideNavBarItem4 || (_SideNavBarItem4 = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
118
+ icon: (0, _jsxRuntime.jsx)(_IconDashboardLine.IconDashboardLine, {}),
119
+ label: "Dashboard",
120
+ href: "#"
121
+ })), _SideNavBarItem5 || (_SideNavBarItem5 = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
122
+ icon: (0, _jsxRuntime.jsx)(_Badge.Badge, {
123
+ count: 99,
124
+ children: (0, _jsxRuntime.jsx)(_IconAdminLine.IconAdminLine, {})
125
+ }),
126
+ label: "Inbox",
127
+ href: "#"
128
+ }))]
129
+ }));
130
+ const list = _react.screen.getAllByRole('list');
131
+ const navElements = _react.screen.getAllByRole('listitem');
125
132
  expect(list[0].tagName).toBe('UL');
126
133
  expect(list.length).toBe(1);
127
134
  expect(navElements.length).toBe(2);
128
135
  });
129
136
  it('should switch aria-expanded when the Toggle SideNavBar button is clicked', async () => {
130
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.SideNavBar, {
137
+ (0, _react.render)((0, _jsxRuntime.jsxs)(_index.SideNavBar, {
131
138
  label: "Main navigation",
132
139
  toggleLabel: {
133
140
  expandedLabel: 'Minimize SideNavBar',
134
141
  minimizedLabel: 'Expand SideNavBar'
135
- }
136
- }, _SideNavBarItem6 || (_SideNavBarItem6 = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
137
- icon: /*#__PURE__*/_react.default.createElement(_IconDashboardLine.IconDashboardLine, null),
138
- label: "Dashboard",
139
- href: "#"
140
- })), _SideNavBarItem7 || (_SideNavBarItem7 = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
141
- icon: /*#__PURE__*/_react.default.createElement(_Badge.Badge, {
142
- count: 99
143
- }, /*#__PURE__*/_react.default.createElement(_IconAdminLine.IconAdminLine, null)),
144
- label: "Inbox",
145
- href: "#"
146
- }))));
147
- const nav = _react2.screen.getByRole('navigation');
148
- const toggleBtn = _react2.screen.getByRole('button');
142
+ },
143
+ children: [_SideNavBarItem6 || (_SideNavBarItem6 = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
144
+ icon: (0, _jsxRuntime.jsx)(_IconDashboardLine.IconDashboardLine, {}),
145
+ label: "Dashboard",
146
+ href: "#"
147
+ })), _SideNavBarItem7 || (_SideNavBarItem7 = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
148
+ icon: (0, _jsxRuntime.jsx)(_Badge.Badge, {
149
+ count: 99,
150
+ children: (0, _jsxRuntime.jsx)(_IconAdminLine.IconAdminLine, {})
151
+ }),
152
+ label: "Inbox",
153
+ href: "#"
154
+ }))]
155
+ }));
156
+ const nav = _react.screen.getByRole('navigation');
157
+ const toggleBtn = _react.screen.getByRole('button');
149
158
  expect(nav).toHaveTextContent('Minimize SideNavBar');
150
159
  expect(toggleBtn).toHaveAttribute('aria-expanded', 'true');
151
160
  _userEvent.default.click(toggleBtn);
152
- await (0, _react2.waitFor)(() => {
153
- const updatedToggleBtn = _react2.screen.getByRole('button');
154
- const updatedNav = _react2.screen.getByRole('navigation');
161
+ await (0, _react.waitFor)(() => {
162
+ const updatedToggleBtn = _react.screen.getByRole('button');
163
+ const updatedNav = _react.screen.getByRole('navigation');
155
164
  expect(updatedNav).toHaveTextContent('Expand SideNavBar');
156
165
  expect(updatedToggleBtn).toHaveAttribute('aria-expanded', 'false');
157
166
  });
158
167
  });
159
168
  it('should meet a11y standards', async () => {
160
- const _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.SideNavBar, {
169
+ const _render2 = (0, _react.render)((0, _jsxRuntime.jsxs)(_index.SideNavBar, {
161
170
  label: "Main navigation",
162
171
  toggleLabel: {
163
172
  expandedLabel: 'Minimize SideNavBar',
164
173
  minimizedLabel: 'Expand SideNavBar'
165
- }
166
- }, _SideNavBarItem8 || (_SideNavBarItem8 = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
167
- icon: /*#__PURE__*/_react.default.createElement(_IconDashboardLine.IconDashboardLine, null),
168
- label: "Dashboard",
169
- href: "#"
170
- })), _SideNavBarItem9 || (_SideNavBarItem9 = /*#__PURE__*/_react.default.createElement(_index.SideNavBarItem, {
171
- icon: /*#__PURE__*/_react.default.createElement(_Badge.Badge, {
172
- count: 99
173
- }, /*#__PURE__*/_react.default.createElement(_IconAdminLine.IconAdminLine, null)),
174
- label: "Inbox",
175
- href: "#"
176
- })))),
174
+ },
175
+ children: [_SideNavBarItem8 || (_SideNavBarItem8 = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
176
+ icon: (0, _jsxRuntime.jsx)(_IconDashboardLine.IconDashboardLine, {}),
177
+ label: "Dashboard",
178
+ href: "#"
179
+ })), _SideNavBarItem9 || (_SideNavBarItem9 = (0, _jsxRuntime.jsx)(_index.SideNavBarItem, {
180
+ icon: (0, _jsxRuntime.jsx)(_Badge.Badge, {
181
+ count: 99,
182
+ children: (0, _jsxRuntime.jsx)(_IconAdminLine.IconAdminLine, {})
183
+ }),
184
+ label: "Inbox",
185
+ href: "#"
186
+ }))]
187
+ })),
177
188
  container = _render2.container;
178
189
  const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
179
190
  expect(axeCheck).toBe(true);
package/lib/SideNavBar/index.js CHANGED
@@ -1,6 +1,5 @@
1
1
  "use strict";
2
2
 
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
5
4
  Object.defineProperty(exports, "__esModule", {
6
5
  value: true
@@ -13,7 +12,7 @@ Object.defineProperty(exports, "SideNavBarItem", {
13
12
  }
14
13
  });
15
14
  exports.default = void 0;
16
- var _react = _interopRequireWildcard(require("react"));
15
+ var _react = require("react");
17
16
  var _testable = require("@instructure/ui-testable/lib/testable.js");
18
17
  var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
19
18
  var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
@@ -24,6 +23,7 @@ var _SideNavBarItem = require("./SideNavBarItem");
24
23
  var _styles = _interopRequireDefault(require("./styles"));
25
24
  var _theme = _interopRequireDefault(require("./theme"));
26
25
  var _props = require("./props");
26
+ var _jsxRuntime = require("@emotion/react/jsx-runtime");
27
27
  var _dec, _dec2, _class, _SideNavBar;
28
28
  /*
29
29
  * The MIT License (MIT)
@@ -48,7 +48,6 @@ var _dec, _dec2, _class, _SideNavBar;
48
48
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
49
49
  * SOFTWARE.
50
50
  */
51
- /** @jsx jsx */
52
51
  const navMinimized = ({
53
52
  minimized
54
53
  }) => ({
@@ -104,9 +103,10 @@ let SideNavBar = exports.SideNavBar = (_dec = (0, _emotion.withStyle)(_styles.de
104
103
  const navItem = (0, _safeCloneElement.safeCloneElement)(child, {
105
104
  minimized: this.state.minimized
106
105
  });
107
- return (0, _emotion.jsx)("li", {
108
- css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.list
109
- }, navItem);
106
+ return (0, _jsxRuntime.jsx)("li", {
107
+ css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.list,
108
+ children: navItem
109
+ });
110
110
  });
111
111
  }
112
112
  toggleMessage() {
@@ -116,23 +116,28 @@ let SideNavBar = exports.SideNavBar = (_dec = (0, _emotion.withStyle)(_styles.de
116
116
  var _this$props$styles2, _this$props$styles3, _this$props$styles4;
117
117
  const label = this.props.label;
118
118
  const props = (0, _omitProps.omitProps)(this.props, SideNavBar.allowedProps, ['minimized']);
119
- return (0, _emotion.jsx)("nav", Object.assign({}, props, {
119
+ return (0, _jsxRuntime.jsxs)("nav", {
120
+ ...props,
120
121
  css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.navigation,
121
122
  "aria-label": label,
122
123
  ref: element => {
123
124
  this.ref = element;
124
- }
125
- }), (0, _emotion.jsx)("ul", {
126
- css: (_this$props$styles3 = this.props.styles) === null || _this$props$styles3 === void 0 ? void 0 : _this$props$styles3.content
127
- }, this.renderChildren()), (0, _emotion.jsx)(_SideNavBarItem.SideNavBarItem, {
128
- "aria-expanded": !this.minimized,
129
- onClick: this.handleNavToggle,
130
- icon: (0, _emotion.jsx)(_IconMoveStartLine.IconMoveStartLine, {
131
- css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.toggleIcon,
132
- inline: false
133
- }),
134
- label: (0, _emotion.jsx)(_ScreenReaderContent.ScreenReaderContent, null, this.toggleMessage())
135
- }));
125
+ },
126
+ children: [(0, _jsxRuntime.jsx)("ul", {
127
+ css: (_this$props$styles3 = this.props.styles) === null || _this$props$styles3 === void 0 ? void 0 : _this$props$styles3.content,
128
+ children: this.renderChildren()
129
+ }), (0, _jsxRuntime.jsx)(_SideNavBarItem.SideNavBarItem, {
130
+ "aria-expanded": !this.minimized,
131
+ onClick: this.handleNavToggle,
132
+ icon: (0, _jsxRuntime.jsx)(_IconMoveStartLine.IconMoveStartLine, {
133
+ css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.toggleIcon,
134
+ inline: false
135
+ }),
136
+ label: (0, _jsxRuntime.jsx)(_ScreenReaderContent.ScreenReaderContent, {
137
+ children: this.toggleMessage()
138
+ })
139
+ })]
140
+ });
136
141
  }
137
142
  }, _SideNavBar.displayName = "SideNavBar", _SideNavBar.componentId = 'SideNavBar', _SideNavBar.allowedProps = _props.allowedProps, _SideNavBar.propTypes = _props.propTypes, _SideNavBar.defaultProps = {
138
143
  children: null,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-side-nav-bar",
3
- "version": "10.16.1-snapshot-0",
3
+ "version": "10.16.1",
4
4
  "description": "Main and application level navigational components",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -23,11 +23,11 @@
23
23
  },
24
24
  "license": "MIT",
25
25
  "devDependencies": {
26
- "@instructure/ui-axe-check": "10.16.1-snapshot-0",
27
- "@instructure/ui-babel-preset": "10.16.1-snapshot-0",
28
- "@instructure/ui-color-utils": "10.16.1-snapshot-0",
29
- "@instructure/ui-test-utils": "10.16.1-snapshot-0",
30
- "@instructure/ui-themes": "10.16.1-snapshot-0",
26
+ "@instructure/ui-axe-check": "10.16.1",
27
+ "@instructure/ui-babel-preset": "10.16.1",
28
+ "@instructure/ui-color-utils": "10.16.1",
29
+ "@instructure/ui-test-utils": "10.16.1",
30
+ "@instructure/ui-themes": "10.16.1",
31
31
  "@testing-library/jest-dom": "^6.6.3",
32
32
  "@testing-library/react": "^16.0.1",
33
33
  "@testing-library/user-event": "^14.5.2",
@@ -35,17 +35,17 @@
35
35
  },
36
36
  "dependencies": {
37
37
  "@babel/runtime": "^7.26.0",
38
- "@instructure/debounce": "10.16.1-snapshot-0",
39
- "@instructure/emotion": "10.16.1-snapshot-0",
40
- "@instructure/shared-types": "10.16.1-snapshot-0",
41
- "@instructure/ui-a11y-content": "10.16.1-snapshot-0",
42
- "@instructure/ui-a11y-utils": "10.16.1-snapshot-0",
43
- "@instructure/ui-badge": "10.16.1-snapshot-0",
44
- "@instructure/ui-icons": "10.16.1-snapshot-0",
45
- "@instructure/ui-prop-types": "10.16.1-snapshot-0",
46
- "@instructure/ui-react-utils": "10.16.1-snapshot-0",
47
- "@instructure/ui-testable": "10.16.1-snapshot-0",
48
- "@instructure/ui-tooltip": "10.16.1-snapshot-0",
38
+ "@instructure/debounce": "10.16.1",
39
+ "@instructure/emotion": "10.16.1",
40
+ "@instructure/shared-types": "10.16.1",
41
+ "@instructure/ui-a11y-content": "10.16.1",
42
+ "@instructure/ui-a11y-utils": "10.16.1",
43
+ "@instructure/ui-badge": "10.16.1",
44
+ "@instructure/ui-icons": "10.16.1",
45
+ "@instructure/ui-prop-types": "10.16.1",
46
+ "@instructure/ui-react-utils": "10.16.1",
47
+ "@instructure/ui-testable": "10.16.1",
48
+ "@instructure/ui-tooltip": "10.16.1",
49
49
  "prop-types": "^15.8.1"
50
50
  },
51
51
  "peerDependencies": {
package/src/SideNavBar/SideNavBarItem/__new-tests__/NavigationItem.test.tsx CHANGED
@@ -22,7 +22,6 @@
22
22
  * SOFTWARE.
23
23
  */
24
24
 
25
- import React from 'react'
26
25
  import { render, screen } from '@testing-library/react'
27
26
  import { vi } from 'vitest'
28
27
  import '@testing-library/jest-dom'
package/src/SideNavBar/SideNavBarItem/index.tsx CHANGED
@@ -21,14 +21,14 @@
21
21
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22
22
  * SOFTWARE.
23
23
  */
24
- /** @jsx jsx */
24
+
25
25
  import { Component } from 'react'
26
26
 
27
27
  import { testable } from '@instructure/ui-testable'
28
28
  import { omitProps, getElementType } from '@instructure/ui-react-utils'
29
29
  import { Tooltip } from '@instructure/ui-tooltip'
30
30
  import { hasVisibleChildren } from '@instructure/ui-a11y-utils'
31
- import { withStyle, jsx } from '@instructure/emotion'
31
+ import { withStyle } from '@instructure/emotion'
32
32
 
33
33
  import generateStyle from './styles'
34
34
  import generateComponentTheme from './theme'
package/src/SideNavBar/__new-tests__/SideNavBar.test.tsx CHANGED
@@ -22,7 +22,6 @@
22
22
  * SOFTWARE.
23
23
  */
24
24
 
25
- import React from 'react'
26
25
  import { render, screen, waitFor } from '@testing-library/react'
27
26
  import userEvent from '@testing-library/user-event'
28
27
  import { vi } from 'vitest'
package/src/SideNavBar/index.tsx CHANGED
@@ -21,15 +21,14 @@
21
21
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22
22
  * SOFTWARE.
23
23
  */
24
- /** @jsx jsx */
25
- import React, { Component, Children, ReactElement, isValidElement } from 'react'
24
+ import { Component, Children, ReactElement, isValidElement } from 'react'
26
25
 
27
26
  import { testable } from '@instructure/ui-testable'
28
27
 
29
28
  import { omitProps, safeCloneElement } from '@instructure/ui-react-utils'
30
29
  import { IconMoveStartLine } from '@instructure/ui-icons'
31
30
  import { ScreenReaderContent } from '@instructure/ui-a11y-content'
32
- import { withStyle, jsx } from '@instructure/emotion'
31
+ import { withStyle } from '@instructure/emotion'
33
32
 
34
33
  import { SideNavBarItem } from './SideNavBarItem'
35
34