@atlaskit/navigation-system 5.9.4 → 5.10.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.
Files changed (13) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/cjs/ui/top-nav-items/end-item.js +7 -1
  3. package/dist/cjs/ui/top-nav-items/help.js +4 -2
  4. package/dist/cjs/ui/top-nav-items/notifications.js +4 -2
  5. package/dist/es2019/ui/top-nav-items/end-item.js +7 -1
  6. package/dist/es2019/ui/top-nav-items/help.js +4 -2
  7. package/dist/es2019/ui/top-nav-items/notifications.js +4 -2
  8. package/dist/esm/ui/top-nav-items/end-item.js +7 -1
  9. package/dist/esm/ui/top-nav-items/help.js +4 -2
  10. package/dist/esm/ui/top-nav-items/notifications.js +4 -2
  11. package/dist/types/ui/top-nav-items/end-item.d.ts +7 -0
  12. package/dist/types-ts4.5/ui/top-nav-items/end-item.d.ts +7 -0
  13. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # @atlassian/navigation-system
2
2
 
3
+ ## 5.10.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`f089cdf7f6a28`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f089cdf7f6a28) -
8
+ The following top nav items now support displaying a shortcut in their tooltips, through the new
9
+ `shortcut` prop:
10
+ - EndItem
11
+ - Notifications
12
+ - Help
13
+ - Profile
14
+ - Settings
15
+
3
16
  ## 5.9.4
4
17
 
5
18
  ### Patch Changes
package/dist/cjs/ui/top-nav-items/end-item.js CHANGED
@@ -28,7 +28,8 @@ var EndItem = exports.EndItem = /*#__PURE__*/(0, _react.forwardRef)(function (_r
28
28
  ariaExpanded = _ref['aria-expanded'],
29
29
  ariaHasPopup = _ref['aria-haspopup'],
30
30
  _ref$isListItem = _ref.isListItem,
31
- isListItem = _ref$isListItem === void 0 ? true : _ref$isListItem;
31
+ isListItem = _ref$isListItem === void 0 ? true : _ref$isListItem,
32
+ shortcut = _ref.shortcut;
32
33
  var Wrapper = isListItem ? _listItem.ListItem : _react.Fragment;
33
34
  return /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_migration.IconButton, {
34
35
  ref: forwardedRef,
@@ -44,5 +45,10 @@ var EndItem = exports.EndItem = /*#__PURE__*/(0, _react.forwardRef)(function (_r
44
45
  "aria-controls": ariaControls,
45
46
  "aria-expanded": ariaExpanded,
46
47
  "aria-haspopup": ariaHasPopup
48
+ // Only creating object when shortcut is provided
49
+ ,
50
+ tooltip: shortcut ? {
51
+ shortcut: shortcut
52
+ } : undefined
47
53
  }));
48
54
  });
package/dist/cjs/ui/top-nav-items/help.js CHANGED
@@ -30,7 +30,8 @@ var Help = exports.Help = /*#__PURE__*/(0, _react.forwardRef)(function Help(_ref
30
30
  testId = _ref.testId,
31
31
  interactionName = _ref.interactionName,
32
32
  isListItem = _ref.isListItem,
33
- badge = _ref.badge;
33
+ badge = _ref.badge,
34
+ shortcut = _ref.shortcut;
34
35
  var sharedProps = {
35
36
  icon: _questionCircle.default,
36
37
  label: label,
@@ -39,7 +40,8 @@ var Help = exports.Help = /*#__PURE__*/(0, _react.forwardRef)(function Help(_ref
39
40
  isSelected: isSelected,
40
41
  testId: testId,
41
42
  interactionName: interactionName,
42
- ref: ref
43
+ ref: ref,
44
+ shortcut: shortcut
43
45
  };
44
46
  if (!badge) {
45
47
  return /*#__PURE__*/_react.default.createElement(_endItem.EndItem, (0, _extends2.default)({}, sharedProps, {
package/dist/cjs/ui/top-nav-items/notifications.js CHANGED
@@ -28,7 +28,8 @@ var Notifications = exports.Notifications = /*#__PURE__*/(0, _react.forwardRef)(
28
28
  ariaExpanded = _ref['aria-expanded'],
29
29
  ariaHasPopup = _ref['aria-haspopup'],
30
30
  isListItem = _ref.isListItem,
31
- badge = _ref.badge;
31
+ badge = _ref.badge,
32
+ shortcut = _ref.shortcut;
32
33
  return /*#__PURE__*/_react.default.createElement(_badgeContainer.BadgeContainer, {
33
34
  id: NOTIFICATIONS_BADGE_ID,
34
35
  badge: badge
@@ -50,6 +51,7 @@ var Notifications = exports.Notifications = /*#__PURE__*/(0, _react.forwardRef)(
50
51
  // We explicitly set the EndItem to not be a list item,
51
52
  // because the BadgeContainer already has a list item role (if `isListItem` is true)
52
53
  ,
53
- isListItem: false
54
+ isListItem: false,
55
+ shortcut: shortcut
54
56
  }));
55
57
  });
package/dist/es2019/ui/top-nav-items/end-item.js CHANGED
@@ -19,7 +19,8 @@ export const EndItem = /*#__PURE__*/forwardRef(({
19
19
  'aria-controls': ariaControls,
20
20
  'aria-expanded': ariaExpanded,
21
21
  'aria-haspopup': ariaHasPopup,
22
- isListItem = true
22
+ isListItem = true,
23
+ shortcut
23
24
  }, forwardedRef) => {
24
25
  const Wrapper = isListItem ? ListItem : Fragment;
25
26
  return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(IconButton, {
@@ -36,5 +37,10 @@ export const EndItem = /*#__PURE__*/forwardRef(({
36
37
  "aria-controls": ariaControls,
37
38
  "aria-expanded": ariaExpanded,
38
39
  "aria-haspopup": ariaHasPopup
40
+ // Only creating object when shortcut is provided
41
+ ,
42
+ tooltip: shortcut ? {
43
+ shortcut
44
+ } : undefined
39
45
  }));
40
46
  });
package/dist/es2019/ui/top-nav-items/help.js CHANGED
@@ -20,7 +20,8 @@ export const Help = /*#__PURE__*/forwardRef(function Help({
20
20
  testId,
21
21
  interactionName,
22
22
  isListItem,
23
- badge
23
+ badge,
24
+ shortcut
24
25
  }, ref) {
25
26
  const sharedProps = {
26
27
  icon: HelpIcon,
@@ -30,7 +31,8 @@ export const Help = /*#__PURE__*/forwardRef(function Help({
30
31
  isSelected,
31
32
  testId,
32
33
  interactionName,
33
- ref
34
+ ref,
35
+ shortcut
34
36
  };
35
37
  if (!badge) {
36
38
  return /*#__PURE__*/React.createElement(EndItem, _extends({}, sharedProps, {
package/dist/es2019/ui/top-nav-items/notifications.js CHANGED
@@ -19,7 +19,8 @@ export const Notifications = /*#__PURE__*/forwardRef(function Notifications({
19
19
  'aria-expanded': ariaExpanded,
20
20
  'aria-haspopup': ariaHasPopup,
21
21
  isListItem,
22
- badge
22
+ badge,
23
+ shortcut
23
24
  }, ref) {
24
25
  return /*#__PURE__*/React.createElement(BadgeContainer, {
25
26
  id: NOTIFICATIONS_BADGE_ID,
@@ -42,6 +43,7 @@ export const Notifications = /*#__PURE__*/forwardRef(function Notifications({
42
43
  // We explicitly set the EndItem to not be a list item,
43
44
  // because the BadgeContainer already has a list item role (if `isListItem` is true)
44
45
  ,
45
- isListItem: false
46
+ isListItem: false,
47
+ shortcut: shortcut
46
48
  }));
47
49
  });
package/dist/esm/ui/top-nav-items/end-item.js CHANGED
@@ -20,7 +20,8 @@ export var EndItem = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
20
20
  ariaExpanded = _ref['aria-expanded'],
21
21
  ariaHasPopup = _ref['aria-haspopup'],
22
22
  _ref$isListItem = _ref.isListItem,
23
- isListItem = _ref$isListItem === void 0 ? true : _ref$isListItem;
23
+ isListItem = _ref$isListItem === void 0 ? true : _ref$isListItem,
24
+ shortcut = _ref.shortcut;
24
25
  var Wrapper = isListItem ? ListItem : Fragment;
25
26
  return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(IconButton, {
26
27
  ref: forwardedRef,
@@ -36,5 +37,10 @@ export var EndItem = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
36
37
  "aria-controls": ariaControls,
37
38
  "aria-expanded": ariaExpanded,
38
39
  "aria-haspopup": ariaHasPopup
40
+ // Only creating object when shortcut is provided
41
+ ,
42
+ tooltip: shortcut ? {
43
+ shortcut: shortcut
44
+ } : undefined
39
45
  }));
40
46
  });
package/dist/esm/ui/top-nav-items/help.js CHANGED
@@ -20,7 +20,8 @@ export var Help = /*#__PURE__*/forwardRef(function Help(_ref, ref) {
20
20
  testId = _ref.testId,
21
21
  interactionName = _ref.interactionName,
22
22
  isListItem = _ref.isListItem,
23
- badge = _ref.badge;
23
+ badge = _ref.badge,
24
+ shortcut = _ref.shortcut;
24
25
  var sharedProps = {
25
26
  icon: HelpIcon,
26
27
  label: label,
@@ -29,7 +30,8 @@ export var Help = /*#__PURE__*/forwardRef(function Help(_ref, ref) {
29
30
  isSelected: isSelected,
30
31
  testId: testId,
31
32
  interactionName: interactionName,
32
- ref: ref
33
+ ref: ref,
34
+ shortcut: shortcut
33
35
  };
34
36
  if (!badge) {
35
37
  return /*#__PURE__*/React.createElement(EndItem, _extends({}, sharedProps, {
package/dist/esm/ui/top-nav-items/notifications.js CHANGED
@@ -19,7 +19,8 @@ export var Notifications = /*#__PURE__*/forwardRef(function Notifications(_ref,
19
19
  ariaExpanded = _ref['aria-expanded'],
20
20
  ariaHasPopup = _ref['aria-haspopup'],
21
21
  isListItem = _ref.isListItem,
22
- badge = _ref.badge;
22
+ badge = _ref.badge,
23
+ shortcut = _ref.shortcut;
23
24
  return /*#__PURE__*/React.createElement(BadgeContainer, {
24
25
  id: NOTIFICATIONS_BADGE_ID,
25
26
  badge: badge
@@ -41,6 +42,7 @@ export var Notifications = /*#__PURE__*/forwardRef(function Notifications(_ref,
41
42
  // We explicitly set the EndItem to not be a list item,
42
43
  // because the BadgeContainer already has a list item role (if `isListItem` is true)
43
44
  ,
44
- isListItem: false
45
+ isListItem: false,
46
+ shortcut: shortcut
45
47
  }));
46
48
  });
package/dist/types/ui/top-nav-items/end-item.d.ts CHANGED
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import type { UIAnalyticsEvent } from '@atlaskit/analytics-next';
3
3
  import { type IconButtonProps } from '@atlaskit/button/new';
4
4
  import type { TriggerProps } from '@atlaskit/popup/types';
5
+ import type { TooltipProps } from '@atlaskit/tooltip';
5
6
  export interface EndItemProps extends Partial<Pick<TriggerProps, 'aria-controls' | 'aria-expanded' | 'aria-haspopup'>> {
6
7
  /**
7
8
  * Provide an accessible label, often used by screen readers.
@@ -62,6 +63,12 @@ export interface EndItemProps extends Partial<Pick<TriggerProps, 'aria-controls'
62
63
  * ```
63
64
  */
64
65
  isListItem?: boolean;
66
+ /**
67
+ * Display a keyboard shortcut in the tooltip.
68
+ *
69
+ * Keys will be displayed as individual keyboard key segments after the tooltip content.
70
+ */
71
+ shortcut?: TooltipProps['shortcut'];
65
72
  }
66
73
  /**
67
74
  * __EndItem__
package/dist/types-ts4.5/ui/top-nav-items/end-item.d.ts CHANGED
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import type { UIAnalyticsEvent } from '@atlaskit/analytics-next';
3
3
  import { type IconButtonProps } from '@atlaskit/button/new';
4
4
  import type { TriggerProps } from '@atlaskit/popup/types';
5
+ import type { TooltipProps } from '@atlaskit/tooltip';
5
6
  export interface EndItemProps extends Partial<Pick<TriggerProps, 'aria-controls' | 'aria-expanded' | 'aria-haspopup'>> {
6
7
  /**
7
8
  * Provide an accessible label, often used by screen readers.
@@ -62,6 +63,12 @@ export interface EndItemProps extends Partial<Pick<TriggerProps, 'aria-controls'
62
63
  * ```
63
64
  */
64
65
  isListItem?: boolean;
66
+ /**
67
+ * Display a keyboard shortcut in the tooltip.
68
+ *
69
+ * Keys will be displayed as individual keyboard key segments after the tooltip content.
70
+ */
71
+ shortcut?: TooltipProps['shortcut'];
65
72
  }
66
73
  /**
67
74
  * __EndItem__
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/navigation-system",
3
- "version": "5.9.4",
3
+ "version": "5.10.0",
4
4
  "description": "The latest navigation system for Atlassian apps.",
5
5
  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
6
6
  "author": "Atlassian Pty Ltd",
@@ -80,7 +80,7 @@
80
80
  "@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.1.0",
81
81
  "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
82
82
  "@atlaskit/primitives": "^16.4.0",
83
- "@atlaskit/tokens": "^8.3.0",
83
+ "@atlaskit/tokens": "^8.4.0",
84
84
  "@atlaskit/tooltip": "^20.10.0",
85
85
  "@atlaskit/visually-hidden": "^3.0.0",
86
86
  "@babel/runtime": "^7.0.0",