@instructure/ui-navigation 10.13.0 → 10.13.1-pr-snapshot-1741357986437

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 (7) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/lib/AppNav/Item/__new-tests__/Item.test.js +5 -5
  3. package/lib/AppNav/Item/index.js +11 -14
  4. package/lib/AppNav/__new-tests__/AppNav.test.js +2 -2
  5. package/lib/AppNav/index.js +16 -17
  6. package/lib/AppNav/props.js +2 -2
  7. package/package.json +25 -25
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [10.13.1-pr-snapshot-1741357986437](https://github.com/instructure/instructure-ui/compare/v10.13.0...v10.13.1-pr-snapshot-1741357986437) (2025-03-07)
7
+
8
+ **Note:** Version bump only for package @instructure/ui-navigation
9
+
10
+
11
+
12
+
13
+
6
14
  # [10.13.0](https://github.com/instructure/instructure-ui/compare/v10.12.0...v10.13.0) (2025-03-06)
7
15
 
8
16
  **Note:** Version bump only for package @instructure/ui-navigation
package/lib/AppNav/Item/__new-tests__/Item.test.js CHANGED
@@ -6,8 +6,8 @@ var _react2 = require("@testing-library/react");
6
6
  var _vitest = require("vitest");
7
7
  var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
8
8
  require("@testing-library/jest-dom");
9
- var _runAxeCheck = require("@instructure/ui-axe-check/lib/runAxeCheck.js");
10
- var _ScreenReaderContent2 = require("@instructure/ui-a11y-content/lib/ScreenReaderContent");
9
+ var _uiAxeCheck = require("@instructure/ui-axe-check");
10
+ var _uiA11yContent = require("@instructure/ui-a11y-content");
11
11
  var _index = require("../index");
12
12
  var _Item, _Item2, _Item3, _ScreenReaderContent;
13
13
  /*
@@ -64,7 +64,7 @@ describe('<AppNav.Item />', () => {
64
64
  it('should render an icon/image/etc.', async () => {
65
65
  const _render = (0, _react2.render)(_Item2 || (_Item2 = /*#__PURE__*/_react.default.createElement(_index.Item, {
66
66
  renderIcon: icon,
67
- renderLabel: /*#__PURE__*/_react.default.createElement(_ScreenReaderContent2.ScreenReaderContent, null, "Some label"),
67
+ renderLabel: /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, "Some label"),
68
68
  href: "#"
69
69
  }))),
70
70
  container = _render.container;
@@ -113,11 +113,11 @@ describe('<AppNav.Item />', () => {
113
113
  it('should meet a11y standards', async () => {
114
114
  const _render2 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.Item, {
115
115
  renderIcon: icon,
116
- renderLabel: _ScreenReaderContent || (_ScreenReaderContent = /*#__PURE__*/_react.default.createElement(_ScreenReaderContent2.ScreenReaderContent, null, "Some label")),
116
+ renderLabel: _ScreenReaderContent || (_ScreenReaderContent = /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, "Some label")),
117
117
  onClick: () => 'clicked'
118
118
  })),
119
119
  container = _render2.container;
120
- const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
120
+ const axeCheck = await (0, _uiAxeCheck.runAxeCheck)(container);
121
121
  expect(axeCheck).toBe(true);
122
122
  });
123
123
  });
package/lib/AppNav/Item/index.js CHANGED
@@ -8,13 +8,10 @@ Object.defineProperty(exports, "__esModule", {
8
8
  exports.default = exports.Item = void 0;
9
9
  var _react = _interopRequireWildcard(require("react"));
10
10
  var _console = require("@instructure/console");
11
- var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
12
- var _getElementType = require("@instructure/ui-react-utils/lib/getElementType.js");
13
- var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
14
- var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
15
- var _testable = require("@instructure/ui-testable/lib/testable.js");
16
- var _View = require("@instructure/ui-view/lib/View");
17
- var _ScreenReaderContent = require("@instructure/ui-a11y-content/lib/ScreenReaderContent");
11
+ var _uiReactUtils = require("@instructure/ui-react-utils");
12
+ var _uiTestable = require("@instructure/ui-testable");
13
+ var _uiView = require("@instructure/ui-view");
14
+ var _uiA11yContent = require("@instructure/ui-a11y-content");
18
15
  var _emotion = require("@instructure/emotion");
19
16
  var _styles = _interopRequireDefault(require("./styles"));
20
17
  var _theme = _interopRequireDefault(require("./theme"));
@@ -51,7 +48,7 @@ id: AppNav.Item
51
48
  ---
52
49
  @module Item
53
50
  **/
54
- let Item = exports.Item = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_Item = class Item extends _react.Component {
51
+ let Item = exports.Item = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _uiTestable.testable)(), _dec(_class = _dec2(_class = (_Item = class Item extends _react.Component {
55
52
  constructor(...args) {
56
53
  super(...args);
57
54
  this.ref = null;
@@ -84,7 +81,7 @@ let Item = exports.Item = (_dec = (0, _emotion.withStyle)(_styles.default, _them
84
81
  }
85
82
  render() {
86
83
  var _this$props$styles, _this$props$styles2;
87
- const ElementType = (0, _getElementType.getElementType)(Item, this.props);
84
+ const ElementType = (0, _uiReactUtils.getElementType)(Item, this.props);
88
85
  const _this$props4 = this.props,
89
86
  renderIcon = _this$props4.renderIcon,
90
87
  renderLabel = _this$props4.renderLabel,
@@ -92,13 +89,13 @@ let Item = exports.Item = (_dec = (0, _emotion.withStyle)(_styles.default, _them
92
89
  renderAfter = _this$props4.renderAfter,
93
90
  cursor = _this$props4.cursor,
94
91
  isDisabled = _this$props4.isDisabled;
95
- const icon = (0, _callRenderProp.callRenderProp)(renderIcon);
96
- const label = (0, _callRenderProp.callRenderProp)(renderLabel);
97
- const labelIsForScreenReaders = (0, _matchComponentTypes.matchComponentTypes)(label, [_ScreenReaderContent.ScreenReaderContent]);
92
+ const icon = (0, _uiReactUtils.callRenderProp)(renderIcon);
93
+ const label = (0, _uiReactUtils.callRenderProp)(renderLabel);
94
+ const labelIsForScreenReaders = (0, _uiReactUtils.matchComponentTypes)(label, [_uiA11yContent.ScreenReaderContent]);
98
95
  if (icon) {
99
96
  (0, _console.logError)(labelIsForScreenReaders, '[AppNav] If an icon is used, the label text should be wrapped in <ScreenReaderContent />.');
100
97
  }
101
- return (0, _emotion.jsx)(_View.View, Object.assign({}, (0, _passthroughProps.passthroughProps)(this.props), {
98
+ return (0, _emotion.jsx)(_uiView.View, Object.assign({}, (0, _uiReactUtils.passthroughProps)(this.props), {
102
99
  as: ElementType,
103
100
  href: href,
104
101
  onClick: this.handleClick,
@@ -111,7 +108,7 @@ let Item = exports.Item = (_dec = (0, _emotion.withStyle)(_styles.default, _them
111
108
  css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.item
112
109
  }), icon, labelIsForScreenReaders ? label : (0, _emotion.jsx)("span", {
113
110
  css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.label
114
- }, label), renderAfter && (0, _callRenderProp.callRenderProp)(renderAfter));
111
+ }, label), renderAfter && (0, _uiReactUtils.callRenderProp)(renderAfter));
115
112
  }
116
113
  }, _Item.displayName = "Item", _Item.componentId = 'AppNav.Item', _Item.allowedProps = _props.allowedProps, _Item.propTypes = _props.propTypes, _Item.defaultProps = {
117
114
  children: null,
package/lib/AppNav/__new-tests__/AppNav.test.js CHANGED
@@ -6,7 +6,7 @@ var _react2 = require("@testing-library/react");
6
6
  var _vitest = require("vitest");
7
7
  require("@testing-library/jest-dom");
8
8
  var _generateA11yTests = require("@instructure/ui-scripts/lib/test/generateA11yTests");
9
- var _runAxeCheck = require("@instructure/ui-axe-check/lib/runAxeCheck.js");
9
+ var _uiAxeCheck = require("@instructure/ui-axe-check");
10
10
  var _index = require("../index");
11
11
  var _AppNav4 = _interopRequireDefault(require("../__examples__/AppNav.examples"));
12
12
  var _AppNav, _AppNav$Item, _AppNav2, _AppNav3, _AppNav$Item2, _AppNav$Item3, _AppNav$Item4, _AppNav$Item5;
@@ -148,7 +148,7 @@ describe('<AppNav />', () => {
148
148
  it(component.description, async () => {
149
149
  const _render2 = (0, _react2.render)(component.content),
150
150
  container = _render2.container;
151
- const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
151
+ const axeCheck = await (0, _uiAxeCheck.runAxeCheck)(container);
152
152
  expect(axeCheck).toBe(true);
153
153
  });
154
154
  }
package/lib/AppNav/index.js CHANGED
@@ -8,16 +8,15 @@ Object.defineProperty(exports, "__esModule", {
8
8
  exports.default = exports.AppNav = void 0;
9
9
  var _react = _interopRequireWildcard(require("react"));
10
10
  var _emotion = require("@instructure/emotion");
11
- var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
12
- var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
13
- var _testable = require("@instructure/ui-testable/lib/testable.js");
14
- var _View = require("@instructure/ui-view/lib/View");
15
- var _Menu = require("@instructure/ui-menu/lib/Menu");
11
+ var _uiReactUtils = require("@instructure/ui-react-utils");
12
+ var _uiTestable = require("@instructure/ui-testable");
13
+ var _uiView = require("@instructure/ui-view");
14
+ var _uiMenu = require("@instructure/ui-menu");
16
15
  var _Item = require("./Item");
17
16
  var _styles = _interopRequireDefault(require("./styles"));
18
17
  var _theme = _interopRequireDefault(require("./theme"));
19
18
  var _props = require("./props");
20
- var _TruncateList = require("@instructure/ui-truncate-list/lib/TruncateList");
19
+ var _uiTruncateList = require("@instructure/ui-truncate-list");
21
20
  var _dec, _dec2, _class, _AppNav;
22
21
  /*
23
22
  * The MIT License (MIT)
@@ -48,7 +47,7 @@ var _dec, _dec2, _class, _AppNav;
48
47
  category: components
49
48
  ---
50
49
  **/
51
- let AppNav = exports.AppNav = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_AppNav = class AppNav extends _react.Component {
50
+ let AppNav = exports.AppNav = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _uiTestable.testable)(), _dec(_class = _dec2(_class = (_AppNav = class AppNav extends _react.Component {
52
51
  constructor(...args) {
53
52
  super(...args);
54
53
  this.state = {
@@ -72,16 +71,16 @@ let AppNav = exports.AppNav = (_dec = (0, _emotion.withStyle)(_styles.default, _
72
71
  (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
73
72
  }
74
73
  renderMenu(items) {
75
- return (0, _emotion.jsx)(_Menu.Menu, {
74
+ return (0, _emotion.jsx)(_uiMenu.Menu, {
76
75
  trigger: (0, _emotion.jsx)(AppNav.Item, {
77
- renderLabel: (0, _callRenderProp.callRenderProp)(this.props.renderTruncateLabel)
76
+ renderLabel: (0, _uiReactUtils.callRenderProp)(this.props.renderTruncateLabel)
78
77
  })
79
78
  }, items.map((item, index) => {
80
- return (0, _emotion.jsx)(_Menu.Menu.Item, {
79
+ return (0, _emotion.jsx)(_uiMenu.Menu.Item, {
81
80
  href: item.props.href ? item.props.href : void 0,
82
81
  onClick: item.props.onClick && !item.props.href ? item.props.onClick : void 0,
83
82
  key: index
84
- }, (0, _callRenderProp.callRenderProp)(item.props.renderLabel));
83
+ }, (0, _uiReactUtils.callRenderProp)(item.props.renderLabel));
85
84
  }));
86
85
  }
87
86
  render() {
@@ -91,17 +90,17 @@ let AppNav = exports.AppNav = (_dec = (0, _emotion.withStyle)(_styles.default, _
91
90
  margin = _this$props3.margin,
92
91
  debounce = _this$props3.debounce,
93
92
  styles = _this$props3.styles;
94
- const passthroughProps = _View.View.omitViewProps((0, _omitProps.omitProps)(this.props, AppNav.allowedProps), AppNav);
95
- const renderBeforeItems = (0, _callRenderProp.callRenderProp)(this.props.renderBeforeItems);
96
- const renderAfterItems = (0, _callRenderProp.callRenderProp)(this.props.renderAfterItems);
93
+ const passthroughProps = _uiView.View.omitViewProps((0, _uiReactUtils.omitProps)(this.props, AppNav.allowedProps), AppNav);
94
+ const renderBeforeItems = (0, _uiReactUtils.callRenderProp)(this.props.renderBeforeItems);
95
+ const renderAfterItems = (0, _uiReactUtils.callRenderProp)(this.props.renderAfterItems);
97
96
  const hasRenderedContent = renderBeforeItems || renderAfterItems;
98
- return (0, _emotion.jsx)(_View.View, Object.assign({}, passthroughProps, {
97
+ return (0, _emotion.jsx)(_uiView.View, Object.assign({}, passthroughProps, {
99
98
  as: "nav",
100
99
  css: [styles === null || styles === void 0 ? void 0 : styles.appNav, hasRenderedContent ? styles === null || styles === void 0 ? void 0 : styles.alignCenter : ''],
101
100
  margin: margin,
102
101
  display: hasRenderedContent ? 'flex' : 'block',
103
102
  elementRef: this.handleRef
104
- }), renderBeforeItems && (0, _emotion.jsx)("span", null, renderBeforeItems), (0, _emotion.jsx)(_TruncateList.TruncateList, {
103
+ }), renderBeforeItems && (0, _emotion.jsx)("span", null, renderBeforeItems), (0, _emotion.jsx)(_uiTruncateList.TruncateList, {
105
104
  visibleItemsCount: visibleItemsCount,
106
105
  debounce: debounce,
107
106
  onUpdate: this.props.onUpdate,
@@ -109,7 +108,7 @@ let AppNav = exports.AppNav = (_dec = (0, _emotion.withStyle)(_styles.default, _
109
108
  itemSpacing: styles === null || styles === void 0 ? void 0 : styles.horizontalMargin,
110
109
  fixMenuTriggerWidth: styles === null || styles === void 0 ? void 0 : styles.menuTriggerWidth,
111
110
  css: styles === null || styles === void 0 ? void 0 : styles.list,
112
- "aria-label": (0, _callRenderProp.callRenderProp)(screenReaderLabel)
111
+ "aria-label": (0, _uiReactUtils.callRenderProp)(screenReaderLabel)
113
112
  }, this.props.children), renderAfterItems && (0, _emotion.jsx)("span", null, renderAfterItems));
114
113
  }
115
114
  }, _AppNav.displayName = "AppNav", _AppNav.componentId = 'AppNav', _AppNav.allowedProps = _props.allowedProps, _AppNav.propTypes = _props.propTypes, _AppNav.defaultProps = {
package/lib/AppNav/props.js CHANGED
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.propTypes = exports.allowedProps = void 0;
8
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
9
- var _Children = require("@instructure/ui-prop-types/lib/Children.js");
9
+ var _uiPropTypes = require("@instructure/ui-prop-types");
10
10
  var _emotion = require("@instructure/emotion");
11
11
  var _Item = require("./Item");
12
12
  /*
@@ -35,7 +35,7 @@ var _Item = require("./Item");
35
35
 
36
36
  const propTypes = exports.propTypes = {
37
37
  screenReaderLabel: _propTypes.default.string.isRequired,
38
- children: _Children.Children.oneOf([_Item.Item]),
38
+ children: _uiPropTypes.Children.oneOf([_Item.Item]),
39
39
  debounce: _propTypes.default.number,
40
40
  renderBeforeItems: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
41
41
  renderAfterItems: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-navigation",
3
- "version": "10.13.0",
3
+ "version": "10.13.1-pr-snapshot-1741357986437",
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,12 +23,12 @@
23
23
  },
24
24
  "license": "MIT",
25
25
  "devDependencies": {
26
- "@instructure/ui-axe-check": "10.13.0",
27
- "@instructure/ui-babel-preset": "10.13.0",
28
- "@instructure/ui-color-utils": "10.13.0",
29
- "@instructure/ui-scripts": "10.13.0",
30
- "@instructure/ui-test-utils": "10.13.0",
31
- "@instructure/ui-themes": "10.13.0",
26
+ "@instructure/ui-axe-check": "10.13.1-pr-snapshot-1741357986437",
27
+ "@instructure/ui-babel-preset": "10.13.1-pr-snapshot-1741357986437",
28
+ "@instructure/ui-color-utils": "10.13.1-pr-snapshot-1741357986437",
29
+ "@instructure/ui-scripts": "10.13.1-pr-snapshot-1741357986437",
30
+ "@instructure/ui-test-utils": "10.13.1-pr-snapshot-1741357986437",
31
+ "@instructure/ui-themes": "10.13.1-pr-snapshot-1741357986437",
32
32
  "@testing-library/jest-dom": "^6.6.3",
33
33
  "@testing-library/react": "^16.0.1",
34
34
  "@testing-library/user-event": "^14.5.2",
@@ -36,24 +36,24 @@
36
36
  },
37
37
  "dependencies": {
38
38
  "@babel/runtime": "^7.26.0",
39
- "@instructure/console": "10.13.0",
40
- "@instructure/debounce": "10.13.0",
41
- "@instructure/emotion": "10.13.0",
42
- "@instructure/shared-types": "10.13.0",
43
- "@instructure/ui-a11y-content": "10.13.0",
44
- "@instructure/ui-a11y-utils": "10.13.0",
45
- "@instructure/ui-badge": "10.13.0",
46
- "@instructure/ui-dom-utils": "10.13.0",
47
- "@instructure/ui-focusable": "10.13.0",
48
- "@instructure/ui-icons": "10.13.0",
49
- "@instructure/ui-menu": "10.13.0",
50
- "@instructure/ui-prop-types": "10.13.0",
51
- "@instructure/ui-react-utils": "10.13.0",
52
- "@instructure/ui-testable": "10.13.0",
53
- "@instructure/ui-tooltip": "10.13.0",
54
- "@instructure/ui-truncate-list": "10.13.0",
55
- "@instructure/ui-utils": "10.13.0",
56
- "@instructure/ui-view": "10.13.0",
39
+ "@instructure/console": "10.13.1-pr-snapshot-1741357986437",
40
+ "@instructure/debounce": "10.13.1-pr-snapshot-1741357986437",
41
+ "@instructure/emotion": "10.13.1-pr-snapshot-1741357986437",
42
+ "@instructure/shared-types": "10.13.1-pr-snapshot-1741357986437",
43
+ "@instructure/ui-a11y-content": "10.13.1-pr-snapshot-1741357986437",
44
+ "@instructure/ui-a11y-utils": "10.13.1-pr-snapshot-1741357986437",
45
+ "@instructure/ui-badge": "10.13.1-pr-snapshot-1741357986437",
46
+ "@instructure/ui-dom-utils": "10.13.1-pr-snapshot-1741357986437",
47
+ "@instructure/ui-focusable": "10.13.1-pr-snapshot-1741357986437",
48
+ "@instructure/ui-icons": "10.13.1-pr-snapshot-1741357986437",
49
+ "@instructure/ui-menu": "10.13.1-pr-snapshot-1741357986437",
50
+ "@instructure/ui-prop-types": "10.13.1-pr-snapshot-1741357986437",
51
+ "@instructure/ui-react-utils": "10.13.1-pr-snapshot-1741357986437",
52
+ "@instructure/ui-testable": "10.13.1-pr-snapshot-1741357986437",
53
+ "@instructure/ui-tooltip": "10.13.1-pr-snapshot-1741357986437",
54
+ "@instructure/ui-truncate-list": "10.13.1-pr-snapshot-1741357986437",
55
+ "@instructure/ui-utils": "10.13.1-pr-snapshot-1741357986437",
56
+ "@instructure/ui-view": "10.13.1-pr-snapshot-1741357986437",
57
57
  "prop-types": "^15.8.1"
58
58
  },
59
59
  "peerDependencies": {