@atlaskit/menu 4.0.0 → 5.0.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.
- package/CHANGELOG.md +10 -0
- package/dist/cjs/internal/components/menu-item-primitive.js +4 -7
- package/dist/cjs/menu-item/button-item.js +2 -4
- package/dist/cjs/menu-item/custom-item.js +4 -4
- package/dist/cjs/menu-item/link-item.js +3 -6
- package/dist/es2019/internal/components/menu-item-primitive.js +3 -7
- package/dist/es2019/menu-item/button-item.js +1 -3
- package/dist/es2019/menu-item/custom-item.js +2 -3
- package/dist/es2019/menu-item/link-item.js +2 -5
- package/dist/esm/internal/components/menu-item-primitive.js +4 -7
- package/dist/esm/menu-item/button-item.js +2 -4
- package/dist/esm/menu-item/custom-item.js +4 -4
- package/dist/esm/menu-item/link-item.js +3 -6
- package/dist/types/internal/components/menu-item-primitive.d.ts +1 -1
- package/dist/types/types.d.ts +9 -10
- package/dist/types-ts4.5/internal/components/menu-item-primitive.d.ts +1 -1
- package/dist/types-ts4.5/types.d.ts +9 -10
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# @atlaskit/menu
|
|
2
2
|
|
|
3
|
+
## 5.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [#146281](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/146281)
|
|
8
|
+
[`ebb2af6f3c40f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ebb2af6f3c40f) -
|
|
9
|
+
Removed deprecated `overrides` props from ButtonItem, CustomItem, and LinkItem, and from the
|
|
10
|
+
BaseItemProps type export. Introduced `isTitleHeading` prop on CustomItem which when true renders
|
|
11
|
+
its children in a `h2` element rather than the default `span`.
|
|
12
|
+
|
|
3
13
|
## 4.0.0
|
|
4
14
|
|
|
5
15
|
### Major Changes
|
|
@@ -10,13 +10,12 @@ require("./menu-item-primitive.compiled.css");
|
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
11
|
var React = _react;
|
|
12
12
|
var _runtime = require("@compiled/react/runtime");
|
|
13
|
-
var _deprecationWarning = require("@atlaskit/ds-lib/deprecation-warning");
|
|
14
13
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
15
14
|
var _compiled = require("@atlaskit/primitives/compiled");
|
|
16
15
|
var _menuContext = require("./menu-context");
|
|
17
16
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
18
17
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
19
|
-
var
|
|
18
|
+
var renderTitle = function renderTitle(Component, props) {
|
|
20
19
|
return (
|
|
21
20
|
/*#__PURE__*/
|
|
22
21
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
@@ -69,7 +68,6 @@ var MenuItemPrimitive = function MenuItemPrimitive(_ref) {
|
|
|
69
68
|
description = _ref.description,
|
|
70
69
|
iconAfter = _ref.iconAfter,
|
|
71
70
|
iconBefore = _ref.iconBefore,
|
|
72
|
-
overrides = _ref.overrides,
|
|
73
71
|
UNSAFE_externalClassName = _ref.className,
|
|
74
72
|
_ref$shouldTitleWrap = _ref.shouldTitleWrap,
|
|
75
73
|
shouldTitleWrap = _ref$shouldTitleWrap === void 0 ? false : _ref$shouldTitleWrap,
|
|
@@ -79,12 +77,11 @@ var MenuItemPrimitive = function MenuItemPrimitive(_ref) {
|
|
|
79
77
|
isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
|
|
80
78
|
_ref$isSelected = _ref.isSelected,
|
|
81
79
|
isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
|
|
80
|
+
_ref$isTitleHeading = _ref.isTitleHeading,
|
|
81
|
+
isTitleHeading = _ref$isTitleHeading === void 0 ? false : _ref$isTitleHeading,
|
|
82
82
|
testId = _ref.testId;
|
|
83
|
-
(0, _deprecationWarning.propDeprecationWarning)("@atlaskit/menu" || '', 'overrides', overrides !== undefined, '' // TODO: Create DAC post when primitives/xcss are available as alternatives
|
|
84
|
-
);
|
|
85
83
|
var spacing = (0, _react.useContext)(_menuContext.SpacingContext);
|
|
86
84
|
var selectionStyle = (0, _react.useContext)(_menuContext.SELECTION_STYLE_CONTEXT_DO_NOT_USE);
|
|
87
|
-
var renderTitle = overrides && overrides.Title && overrides.Title.render || defaultRender;
|
|
88
85
|
var UNSAFE_className = UNSAFE_externalClassName;
|
|
89
86
|
return function () {
|
|
90
87
|
return children({
|
|
@@ -102,7 +99,7 @@ var MenuItemPrimitive = function MenuItemPrimitive(_ref) {
|
|
|
102
99
|
className: (0, _runtime.ax)([(0, _platformFeatureFlags.fg)('platform_ads_component_no_icon_spacing_support') && styles.beforeAfterElement, !(0, _platformFeatureFlags.fg)('platform_ads_component_no_icon_spacing_support') && styles.beforeAfterElementOld])
|
|
103
100
|
}, iconBefore), title && /*#__PURE__*/React.createElement("div", {
|
|
104
101
|
className: (0, _runtime.ax)([styles.content])
|
|
105
|
-
}, renderTitle('span', {
|
|
102
|
+
}, renderTitle(isTitleHeading ? 'h2' : 'span', {
|
|
106
103
|
children: title,
|
|
107
104
|
className: (0, _runtime.ax)([styles.title, shouldTitleWrap ? styles.wordBreak : styles.truncate]),
|
|
108
105
|
'data-item-title': true
|
|
@@ -15,7 +15,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
15
15
|
var _interactionContext = _interopRequireDefault(require("@atlaskit/interaction-context"));
|
|
16
16
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
17
17
|
var _menuItemPrimitive = _interopRequireDefault(require("../internal/components/menu-item-primitive"));
|
|
18
|
-
var _excluded = ["children", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "
|
|
18
|
+
var _excluded = ["children", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "onMouseDown", "shouldTitleWrap", "shouldDescriptionWrap", "className", "interactionName"];
|
|
19
19
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
20
20
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
21
21
|
/**
|
|
@@ -39,7 +39,6 @@ function (props, ref) {
|
|
|
39
39
|
isSelected = _props$isSelected === void 0 ? false : _props$isSelected,
|
|
40
40
|
onClick = props.onClick,
|
|
41
41
|
testId = props.testId,
|
|
42
|
-
overrides = props.overrides,
|
|
43
42
|
onMouseDown = props.onMouseDown,
|
|
44
43
|
shouldTitleWrap = props.shouldTitleWrap,
|
|
45
44
|
shouldDescriptionWrap = props.shouldDescriptionWrap,
|
|
@@ -60,12 +59,11 @@ function (props, ref) {
|
|
|
60
59
|
, (0, _extends2.default)({
|
|
61
60
|
className: UNSAFE_className
|
|
62
61
|
}, rest, {
|
|
63
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
64
|
-
overrides: overrides,
|
|
65
62
|
iconBefore: iconBefore,
|
|
66
63
|
iconAfter: iconAfter,
|
|
67
64
|
isDisabled: isDisabled,
|
|
68
65
|
isSelected: isSelected,
|
|
66
|
+
isTitleHeading: false,
|
|
69
67
|
description: description,
|
|
70
68
|
title: children,
|
|
71
69
|
shouldTitleWrap: shouldTitleWrap,
|
|
@@ -15,7 +15,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
15
15
|
var _interactionContext = _interopRequireDefault(require("@atlaskit/interaction-context"));
|
|
16
16
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
17
17
|
var _menuItemPrimitive = _interopRequireDefault(require("../internal/components/menu-item-primitive"));
|
|
18
|
-
var _excluded = ["component", "isDisabled", "isSelected", "onClick", "testId", "children", "description", "iconAfter", "iconBefore", "
|
|
18
|
+
var _excluded = ["component", "isDisabled", "isSelected", "isTitleHeading", "onClick", "testId", "children", "description", "iconAfter", "iconBefore", "onMouseDown", "shouldTitleWrap", "shouldDescriptionWrap", "className", "UNSAFE_isDraggable", "interactionName"];
|
|
19
19
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
20
20
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
21
21
|
var preventEvent = function preventEvent(e) {
|
|
@@ -38,13 +38,14 @@ var CustomItem = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardR
|
|
|
38
38
|
isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
|
|
39
39
|
_ref$isSelected = _ref.isSelected,
|
|
40
40
|
isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
|
|
41
|
+
_ref$isTitleHeading = _ref.isTitleHeading,
|
|
42
|
+
isTitleHeading = _ref$isTitleHeading === void 0 ? false : _ref$isTitleHeading,
|
|
41
43
|
onClick = _ref.onClick,
|
|
42
44
|
testId = _ref.testId,
|
|
43
45
|
children = _ref.children,
|
|
44
46
|
description = _ref.description,
|
|
45
47
|
iconAfter = _ref.iconAfter,
|
|
46
48
|
iconBefore = _ref.iconBefore,
|
|
47
|
-
overrides = _ref.overrides,
|
|
48
49
|
onMouseDown = _ref.onMouseDown,
|
|
49
50
|
shouldTitleWrap = _ref.shouldTitleWrap,
|
|
50
51
|
shouldDescriptionWrap = _ref.shouldDescriptionWrap,
|
|
@@ -66,14 +67,13 @@ var CustomItem = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardR
|
|
|
66
67
|
, (0, _extends2.default)({
|
|
67
68
|
className: UNSAFE_className
|
|
68
69
|
}, rest, {
|
|
69
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
70
|
-
overrides: overrides,
|
|
71
70
|
description: description,
|
|
72
71
|
iconAfter: iconAfter,
|
|
73
72
|
title: children,
|
|
74
73
|
iconBefore: iconBefore,
|
|
75
74
|
isSelected: isSelected,
|
|
76
75
|
isDisabled: isDisabled,
|
|
76
|
+
isTitleHeading: isTitleHeading,
|
|
77
77
|
shouldTitleWrap: shouldTitleWrap,
|
|
78
78
|
shouldDescriptionWrap: shouldDescriptionWrap,
|
|
79
79
|
testId: testId && "".concat(testId, "--primitive")
|
|
@@ -16,7 +16,7 @@ var _appProvider = require("@atlaskit/app-provider");
|
|
|
16
16
|
var _interactionContext = _interopRequireDefault(require("@atlaskit/interaction-context"));
|
|
17
17
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
18
18
|
var _menuItemPrimitive = _interopRequireDefault(require("../internal/components/menu-item-primitive"));
|
|
19
|
-
var _excluded = ["children", "href", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "
|
|
19
|
+
var _excluded = ["children", "href", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "onMouseDown", "shouldTitleWrap", "shouldDescriptionWrap", "className", "UNSAFE_shouldDisableRouterLink", "UNSAFE_isDraggable", "interactionName"];
|
|
20
20
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
21
21
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
22
22
|
var IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
|
|
@@ -47,7 +47,6 @@ function (props, ref) {
|
|
|
47
47
|
isSelected = _props$isSelected === void 0 ? false : _props$isSelected,
|
|
48
48
|
onClick = props.onClick,
|
|
49
49
|
testId = props.testId,
|
|
50
|
-
overrides = props.overrides,
|
|
51
50
|
onMouseDown = props.onMouseDown,
|
|
52
51
|
shouldTitleWrap = props.shouldTitleWrap,
|
|
53
52
|
shouldDescriptionWrap = props.shouldDescriptionWrap,
|
|
@@ -82,14 +81,12 @@ function (props, ref) {
|
|
|
82
81
|
var Component = isRouterLink ? RouterLink : 'a';
|
|
83
82
|
return /*#__PURE__*/React.createElement(_menuItemPrimitive.default, (0, _extends2.default)({}, rest, {
|
|
84
83
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
85
|
-
className: UNSAFE_className
|
|
86
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
87
|
-
,
|
|
88
|
-
overrides: overrides,
|
|
84
|
+
className: UNSAFE_className,
|
|
89
85
|
iconBefore: iconBefore,
|
|
90
86
|
iconAfter: iconAfter,
|
|
91
87
|
isSelected: isSelected,
|
|
92
88
|
isDisabled: isDisabled,
|
|
89
|
+
isTitleHeading: false,
|
|
93
90
|
description: description,
|
|
94
91
|
shouldTitleWrap: shouldTitleWrap,
|
|
95
92
|
shouldDescriptionWrap: shouldDescriptionWrap,
|
|
@@ -3,11 +3,10 @@ import "./menu-item-primitive.compiled.css";
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import { useContext } from 'react';
|
|
5
5
|
import { ax, ix } from '@compiled/react/runtime';
|
|
6
|
-
import { propDeprecationWarning } from '@atlaskit/ds-lib/deprecation-warning';
|
|
7
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
7
|
import { Inline } from '@atlaskit/primitives/compiled';
|
|
9
8
|
import { SELECTION_STYLE_CONTEXT_DO_NOT_USE, SpacingContext } from './menu-context';
|
|
10
|
-
const
|
|
9
|
+
const renderTitle = (Component, props) =>
|
|
11
10
|
/*#__PURE__*/
|
|
12
11
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
13
12
|
React.createElement(Component, props);
|
|
@@ -57,19 +56,16 @@ const MenuItemPrimitive = ({
|
|
|
57
56
|
description,
|
|
58
57
|
iconAfter,
|
|
59
58
|
iconBefore,
|
|
60
|
-
overrides,
|
|
61
59
|
className: UNSAFE_externalClassName,
|
|
62
60
|
shouldTitleWrap = false,
|
|
63
61
|
shouldDescriptionWrap = false,
|
|
64
62
|
isDisabled = false,
|
|
65
63
|
isSelected = false,
|
|
64
|
+
isTitleHeading = false,
|
|
66
65
|
testId
|
|
67
66
|
}) => {
|
|
68
|
-
propDeprecationWarning("@atlaskit/menu" || '', 'overrides', overrides !== undefined, '' // TODO: Create DAC post when primitives/xcss are available as alternatives
|
|
69
|
-
);
|
|
70
67
|
const spacing = useContext(SpacingContext);
|
|
71
68
|
const selectionStyle = useContext(SELECTION_STYLE_CONTEXT_DO_NOT_USE);
|
|
72
|
-
const renderTitle = overrides && overrides.Title && overrides.Title.render || defaultRender;
|
|
73
69
|
const UNSAFE_className = UNSAFE_externalClassName;
|
|
74
70
|
return (() => {
|
|
75
71
|
return children({
|
|
@@ -87,7 +83,7 @@ const MenuItemPrimitive = ({
|
|
|
87
83
|
className: ax([fg('platform_ads_component_no_icon_spacing_support') && styles.beforeAfterElement, !fg('platform_ads_component_no_icon_spacing_support') && styles.beforeAfterElementOld])
|
|
88
84
|
}, iconBefore), title && /*#__PURE__*/React.createElement("div", {
|
|
89
85
|
className: ax([styles.content])
|
|
90
|
-
}, renderTitle('span', {
|
|
86
|
+
}, renderTitle(isTitleHeading ? 'h2' : 'span', {
|
|
91
87
|
children: title,
|
|
92
88
|
className: ax([styles.title, shouldTitleWrap ? styles.wordBreak : styles.truncate]),
|
|
93
89
|
'data-item-title': true
|
|
@@ -26,7 +26,6 @@ const ButtonItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(
|
|
|
26
26
|
isSelected = false,
|
|
27
27
|
onClick,
|
|
28
28
|
testId,
|
|
29
|
-
overrides,
|
|
30
29
|
onMouseDown,
|
|
31
30
|
shouldTitleWrap,
|
|
32
31
|
shouldDescriptionWrap,
|
|
@@ -48,12 +47,11 @@ const ButtonItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(
|
|
|
48
47
|
, _extends({
|
|
49
48
|
className: UNSAFE_className
|
|
50
49
|
}, rest, {
|
|
51
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
52
|
-
overrides: overrides,
|
|
53
50
|
iconBefore: iconBefore,
|
|
54
51
|
iconAfter: iconAfter,
|
|
55
52
|
isDisabled: isDisabled,
|
|
56
53
|
isSelected: isSelected,
|
|
54
|
+
isTitleHeading: false,
|
|
57
55
|
description: description,
|
|
58
56
|
title: children,
|
|
59
57
|
shouldTitleWrap: shouldTitleWrap,
|
|
@@ -24,13 +24,13 @@ const CustomItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
24
24
|
component: Component,
|
|
25
25
|
isDisabled = false,
|
|
26
26
|
isSelected = false,
|
|
27
|
+
isTitleHeading = false,
|
|
27
28
|
onClick,
|
|
28
29
|
testId,
|
|
29
30
|
children,
|
|
30
31
|
description,
|
|
31
32
|
iconAfter,
|
|
32
33
|
iconBefore,
|
|
33
|
-
overrides,
|
|
34
34
|
onMouseDown,
|
|
35
35
|
shouldTitleWrap,
|
|
36
36
|
shouldDescriptionWrap,
|
|
@@ -53,14 +53,13 @@ const CustomItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
53
53
|
, _extends({
|
|
54
54
|
className: UNSAFE_className
|
|
55
55
|
}, rest, {
|
|
56
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
57
|
-
overrides: overrides,
|
|
58
56
|
description: description,
|
|
59
57
|
iconAfter: iconAfter,
|
|
60
58
|
title: children,
|
|
61
59
|
iconBefore: iconBefore,
|
|
62
60
|
isSelected: isSelected,
|
|
63
61
|
isDisabled: isDisabled,
|
|
62
|
+
isTitleHeading: isTitleHeading,
|
|
64
63
|
shouldTitleWrap: shouldTitleWrap,
|
|
65
64
|
shouldDescriptionWrap: shouldDescriptionWrap,
|
|
66
65
|
testId: testId && `${testId}--primitive`
|
|
@@ -34,7 +34,6 @@ const LinkItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(
|
|
|
34
34
|
isSelected = false,
|
|
35
35
|
onClick,
|
|
36
36
|
testId,
|
|
37
|
-
overrides,
|
|
38
37
|
onMouseDown,
|
|
39
38
|
shouldTitleWrap,
|
|
40
39
|
shouldDescriptionWrap,
|
|
@@ -70,14 +69,12 @@ const LinkItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(
|
|
|
70
69
|
const Component = isRouterLink ? RouterLink : 'a';
|
|
71
70
|
return /*#__PURE__*/React.createElement(MenuItemPrimitive, _extends({}, rest, {
|
|
72
71
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
73
|
-
className: UNSAFE_className
|
|
74
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
75
|
-
,
|
|
76
|
-
overrides: overrides,
|
|
72
|
+
className: UNSAFE_className,
|
|
77
73
|
iconBefore: iconBefore,
|
|
78
74
|
iconAfter: iconAfter,
|
|
79
75
|
isSelected: isSelected,
|
|
80
76
|
isDisabled: isDisabled,
|
|
77
|
+
isTitleHeading: false,
|
|
81
78
|
description: description,
|
|
82
79
|
shouldTitleWrap: shouldTitleWrap,
|
|
83
80
|
shouldDescriptionWrap: shouldDescriptionWrap,
|
|
@@ -3,11 +3,10 @@ import "./menu-item-primitive.compiled.css";
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import { useContext } from 'react';
|
|
5
5
|
import { ax, ix } from '@compiled/react/runtime';
|
|
6
|
-
import { propDeprecationWarning } from '@atlaskit/ds-lib/deprecation-warning';
|
|
7
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
7
|
import { Inline } from '@atlaskit/primitives/compiled';
|
|
9
8
|
import { SELECTION_STYLE_CONTEXT_DO_NOT_USE, SpacingContext } from './menu-context';
|
|
10
|
-
var
|
|
9
|
+
var renderTitle = function renderTitle(Component, props) {
|
|
11
10
|
return (
|
|
12
11
|
/*#__PURE__*/
|
|
13
12
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
@@ -60,7 +59,6 @@ var MenuItemPrimitive = function MenuItemPrimitive(_ref) {
|
|
|
60
59
|
description = _ref.description,
|
|
61
60
|
iconAfter = _ref.iconAfter,
|
|
62
61
|
iconBefore = _ref.iconBefore,
|
|
63
|
-
overrides = _ref.overrides,
|
|
64
62
|
UNSAFE_externalClassName = _ref.className,
|
|
65
63
|
_ref$shouldTitleWrap = _ref.shouldTitleWrap,
|
|
66
64
|
shouldTitleWrap = _ref$shouldTitleWrap === void 0 ? false : _ref$shouldTitleWrap,
|
|
@@ -70,12 +68,11 @@ var MenuItemPrimitive = function MenuItemPrimitive(_ref) {
|
|
|
70
68
|
isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
|
|
71
69
|
_ref$isSelected = _ref.isSelected,
|
|
72
70
|
isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
|
|
71
|
+
_ref$isTitleHeading = _ref.isTitleHeading,
|
|
72
|
+
isTitleHeading = _ref$isTitleHeading === void 0 ? false : _ref$isTitleHeading,
|
|
73
73
|
testId = _ref.testId;
|
|
74
|
-
propDeprecationWarning("@atlaskit/menu" || '', 'overrides', overrides !== undefined, '' // TODO: Create DAC post when primitives/xcss are available as alternatives
|
|
75
|
-
);
|
|
76
74
|
var spacing = useContext(SpacingContext);
|
|
77
75
|
var selectionStyle = useContext(SELECTION_STYLE_CONTEXT_DO_NOT_USE);
|
|
78
|
-
var renderTitle = overrides && overrides.Title && overrides.Title.render || defaultRender;
|
|
79
76
|
var UNSAFE_className = UNSAFE_externalClassName;
|
|
80
77
|
return function () {
|
|
81
78
|
return children({
|
|
@@ -93,7 +90,7 @@ var MenuItemPrimitive = function MenuItemPrimitive(_ref) {
|
|
|
93
90
|
className: ax([fg('platform_ads_component_no_icon_spacing_support') && styles.beforeAfterElement, !fg('platform_ads_component_no_icon_spacing_support') && styles.beforeAfterElementOld])
|
|
94
91
|
}, iconBefore), title && /*#__PURE__*/React.createElement("div", {
|
|
95
92
|
className: ax([styles.content])
|
|
96
|
-
}, renderTitle('span', {
|
|
93
|
+
}, renderTitle(isTitleHeading ? 'h2' : 'span', {
|
|
97
94
|
children: title,
|
|
98
95
|
className: ax([styles.title, shouldTitleWrap ? styles.wordBreak : styles.truncate]),
|
|
99
96
|
'data-item-title': true
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/* button-item.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
-
var _excluded = ["children", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "
|
|
4
|
+
var _excluded = ["children", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "onMouseDown", "shouldTitleWrap", "shouldDescriptionWrap", "className", "interactionName"];
|
|
5
5
|
import * as React from 'react';
|
|
6
6
|
import { ax, ix } from "@compiled/react/runtime";
|
|
7
7
|
import { forwardRef, memo, useCallback, useContext } from 'react';
|
|
@@ -29,7 +29,6 @@ function (props, ref) {
|
|
|
29
29
|
isSelected = _props$isSelected === void 0 ? false : _props$isSelected,
|
|
30
30
|
onClick = props.onClick,
|
|
31
31
|
testId = props.testId,
|
|
32
|
-
overrides = props.overrides,
|
|
33
32
|
onMouseDown = props.onMouseDown,
|
|
34
33
|
shouldTitleWrap = props.shouldTitleWrap,
|
|
35
34
|
shouldDescriptionWrap = props.shouldDescriptionWrap,
|
|
@@ -50,12 +49,11 @@ function (props, ref) {
|
|
|
50
49
|
, _extends({
|
|
51
50
|
className: UNSAFE_className
|
|
52
51
|
}, rest, {
|
|
53
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
54
|
-
overrides: overrides,
|
|
55
52
|
iconBefore: iconBefore,
|
|
56
53
|
iconAfter: iconAfter,
|
|
57
54
|
isDisabled: isDisabled,
|
|
58
55
|
isSelected: isSelected,
|
|
56
|
+
isTitleHeading: false,
|
|
59
57
|
description: description,
|
|
60
58
|
title: children,
|
|
61
59
|
shouldTitleWrap: shouldTitleWrap,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/* custom-item.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
-
var _excluded = ["component", "isDisabled", "isSelected", "onClick", "testId", "children", "description", "iconAfter", "iconBefore", "
|
|
4
|
+
var _excluded = ["component", "isDisabled", "isSelected", "isTitleHeading", "onClick", "testId", "children", "description", "iconAfter", "iconBefore", "onMouseDown", "shouldTitleWrap", "shouldDescriptionWrap", "className", "UNSAFE_isDraggable", "interactionName"];
|
|
5
5
|
import * as React from 'react';
|
|
6
6
|
import { ax, ix } from "@compiled/react/runtime";
|
|
7
7
|
import { forwardRef, memo, useCallback, useContext } from 'react';
|
|
@@ -28,13 +28,14 @@ var CustomItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref)
|
|
|
28
28
|
isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
|
|
29
29
|
_ref$isSelected = _ref.isSelected,
|
|
30
30
|
isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
|
|
31
|
+
_ref$isTitleHeading = _ref.isTitleHeading,
|
|
32
|
+
isTitleHeading = _ref$isTitleHeading === void 0 ? false : _ref$isTitleHeading,
|
|
31
33
|
onClick = _ref.onClick,
|
|
32
34
|
testId = _ref.testId,
|
|
33
35
|
children = _ref.children,
|
|
34
36
|
description = _ref.description,
|
|
35
37
|
iconAfter = _ref.iconAfter,
|
|
36
38
|
iconBefore = _ref.iconBefore,
|
|
37
|
-
overrides = _ref.overrides,
|
|
38
39
|
onMouseDown = _ref.onMouseDown,
|
|
39
40
|
shouldTitleWrap = _ref.shouldTitleWrap,
|
|
40
41
|
shouldDescriptionWrap = _ref.shouldDescriptionWrap,
|
|
@@ -56,14 +57,13 @@ var CustomItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref)
|
|
|
56
57
|
, _extends({
|
|
57
58
|
className: UNSAFE_className
|
|
58
59
|
}, rest, {
|
|
59
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
60
|
-
overrides: overrides,
|
|
61
60
|
description: description,
|
|
62
61
|
iconAfter: iconAfter,
|
|
63
62
|
title: children,
|
|
64
63
|
iconBefore: iconBefore,
|
|
65
64
|
isSelected: isSelected,
|
|
66
65
|
isDisabled: isDisabled,
|
|
66
|
+
isTitleHeading: isTitleHeading,
|
|
67
67
|
shouldTitleWrap: shouldTitleWrap,
|
|
68
68
|
shouldDescriptionWrap: shouldDescriptionWrap,
|
|
69
69
|
testId: testId && "".concat(testId, "--primitive")
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/* link-item.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
-
var _excluded = ["children", "href", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "
|
|
4
|
+
var _excluded = ["children", "href", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "onMouseDown", "shouldTitleWrap", "shouldDescriptionWrap", "className", "UNSAFE_shouldDisableRouterLink", "UNSAFE_isDraggable", "interactionName"];
|
|
5
5
|
import * as React from 'react';
|
|
6
6
|
import { ax, ix } from "@compiled/react/runtime";
|
|
7
7
|
import { forwardRef, memo, useCallback, useContext } from 'react';
|
|
@@ -37,7 +37,6 @@ function (props, ref) {
|
|
|
37
37
|
isSelected = _props$isSelected === void 0 ? false : _props$isSelected,
|
|
38
38
|
onClick = props.onClick,
|
|
39
39
|
testId = props.testId,
|
|
40
|
-
overrides = props.overrides,
|
|
41
40
|
onMouseDown = props.onMouseDown,
|
|
42
41
|
shouldTitleWrap = props.shouldTitleWrap,
|
|
43
42
|
shouldDescriptionWrap = props.shouldDescriptionWrap,
|
|
@@ -72,14 +71,12 @@ function (props, ref) {
|
|
|
72
71
|
var Component = isRouterLink ? RouterLink : 'a';
|
|
73
72
|
return /*#__PURE__*/React.createElement(MenuItemPrimitive, _extends({}, rest, {
|
|
74
73
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
75
|
-
className: UNSAFE_className
|
|
76
|
-
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
77
|
-
,
|
|
78
|
-
overrides: overrides,
|
|
74
|
+
className: UNSAFE_className,
|
|
79
75
|
iconBefore: iconBefore,
|
|
80
76
|
iconAfter: iconAfter,
|
|
81
77
|
isSelected: isSelected,
|
|
82
78
|
isDisabled: isDisabled,
|
|
79
|
+
isTitleHeading: false,
|
|
83
80
|
description: description,
|
|
84
81
|
shouldTitleWrap: shouldTitleWrap,
|
|
85
82
|
shouldDescriptionWrap: shouldDescriptionWrap,
|
|
@@ -14,5 +14,5 @@ import type { MenuItemPrimitiveProps } from '../../types';
|
|
|
14
14
|
* </MenuItemPrimitive>
|
|
15
15
|
* ```
|
|
16
16
|
*/
|
|
17
|
-
declare const MenuItemPrimitive: ({ children, title, description, iconAfter, iconBefore,
|
|
17
|
+
declare const MenuItemPrimitive: ({ children, title, description, iconAfter, iconBefore, className: UNSAFE_externalClassName, shouldTitleWrap, shouldDescriptionWrap, isDisabled, isSelected, isTitleHeading, testId, }: MenuItemPrimitiveProps) => JSX.Element;
|
|
18
18
|
export default MenuItemPrimitive;
|
package/dist/types/types.d.ts
CHANGED
|
@@ -133,14 +133,14 @@ export interface MenuItemPrimitiveProps {
|
|
|
133
133
|
description: React.ReactNode | undefined;
|
|
134
134
|
iconAfter: React.ReactNode | undefined;
|
|
135
135
|
iconBefore: React.ReactNode | undefined;
|
|
136
|
-
/**
|
|
137
|
-
* @deprecated This API is deprecated and will be removed in a future release. See DSP-2676 for more information.
|
|
138
|
-
*/
|
|
139
|
-
overrides: Overrides | undefined;
|
|
140
136
|
shouldTitleWrap: boolean | undefined;
|
|
141
137
|
shouldDescriptionWrap: boolean | undefined;
|
|
142
138
|
isDisabled: boolean | undefined;
|
|
143
139
|
isSelected: boolean | undefined;
|
|
140
|
+
/**
|
|
141
|
+
* @deprecated This API exists to support functionality in `@atlaskit/side-navigation` and should not be used. Once the new navigation is fully rolled out, this prop will be removed.
|
|
142
|
+
*/
|
|
143
|
+
isTitleHeading: boolean | undefined;
|
|
144
144
|
className?: string;
|
|
145
145
|
testId?: string;
|
|
146
146
|
}
|
|
@@ -190,12 +190,6 @@ export interface MenuItemProps {
|
|
|
190
190
|
* serving as a hook for automated tests.
|
|
191
191
|
*/
|
|
192
192
|
testId?: string;
|
|
193
|
-
/**
|
|
194
|
-
* Custom overrides for the composed components.
|
|
195
|
-
*
|
|
196
|
-
* @deprecated This API is deprecated and will be removed in a future release. See DSP-2676 for more information.
|
|
197
|
-
*/
|
|
198
|
-
overrides?: Overrides;
|
|
199
193
|
/**
|
|
200
194
|
* When `true`, the title of the item will wrap multiple lines if it's long enough.
|
|
201
195
|
*/
|
|
@@ -204,6 +198,11 @@ export interface MenuItemProps {
|
|
|
204
198
|
* When `true`, the description of the item will wrap multiple lines if it's long enough.
|
|
205
199
|
*/
|
|
206
200
|
shouldDescriptionWrap?: boolean;
|
|
201
|
+
/**
|
|
202
|
+
* When `true`, the title of the item will render as a `h2` rather than a `span`
|
|
203
|
+
* @deprecated This API exists to support functionality in `@atlaskit/side-navigation` and should not be used. Once the new navigation is fully rolled out, this prop will be removed.
|
|
204
|
+
*/
|
|
205
|
+
isTitleHeading?: boolean;
|
|
207
206
|
/**
|
|
208
207
|
* An optional name used to identify events for [React UFO (Unified Frontend Observability) press interactions](https://developer.atlassian.com/platform/ufo/react-ufo/react-ufo/getting-started/#quick-start--press-interactions). For more information, see [React UFO integration into Design System components](https://go.atlassian.com/react-ufo-dst-integration).
|
|
209
208
|
*/
|
|
@@ -14,5 +14,5 @@ import type { MenuItemPrimitiveProps } from '../../types';
|
|
|
14
14
|
* </MenuItemPrimitive>
|
|
15
15
|
* ```
|
|
16
16
|
*/
|
|
17
|
-
declare const MenuItemPrimitive: ({ children, title, description, iconAfter, iconBefore,
|
|
17
|
+
declare const MenuItemPrimitive: ({ children, title, description, iconAfter, iconBefore, className: UNSAFE_externalClassName, shouldTitleWrap, shouldDescriptionWrap, isDisabled, isSelected, isTitleHeading, testId, }: MenuItemPrimitiveProps) => JSX.Element;
|
|
18
18
|
export default MenuItemPrimitive;
|
|
@@ -133,14 +133,14 @@ export interface MenuItemPrimitiveProps {
|
|
|
133
133
|
description: React.ReactNode | undefined;
|
|
134
134
|
iconAfter: React.ReactNode | undefined;
|
|
135
135
|
iconBefore: React.ReactNode | undefined;
|
|
136
|
-
/**
|
|
137
|
-
* @deprecated This API is deprecated and will be removed in a future release. See DSP-2676 for more information.
|
|
138
|
-
*/
|
|
139
|
-
overrides: Overrides | undefined;
|
|
140
136
|
shouldTitleWrap: boolean | undefined;
|
|
141
137
|
shouldDescriptionWrap: boolean | undefined;
|
|
142
138
|
isDisabled: boolean | undefined;
|
|
143
139
|
isSelected: boolean | undefined;
|
|
140
|
+
/**
|
|
141
|
+
* @deprecated This API exists to support functionality in `@atlaskit/side-navigation` and should not be used. Once the new navigation is fully rolled out, this prop will be removed.
|
|
142
|
+
*/
|
|
143
|
+
isTitleHeading: boolean | undefined;
|
|
144
144
|
className?: string;
|
|
145
145
|
testId?: string;
|
|
146
146
|
}
|
|
@@ -190,12 +190,6 @@ export interface MenuItemProps {
|
|
|
190
190
|
* serving as a hook for automated tests.
|
|
191
191
|
*/
|
|
192
192
|
testId?: string;
|
|
193
|
-
/**
|
|
194
|
-
* Custom overrides for the composed components.
|
|
195
|
-
*
|
|
196
|
-
* @deprecated This API is deprecated and will be removed in a future release. See DSP-2676 for more information.
|
|
197
|
-
*/
|
|
198
|
-
overrides?: Overrides;
|
|
199
193
|
/**
|
|
200
194
|
* When `true`, the title of the item will wrap multiple lines if it's long enough.
|
|
201
195
|
*/
|
|
@@ -204,6 +198,11 @@ export interface MenuItemProps {
|
|
|
204
198
|
* When `true`, the description of the item will wrap multiple lines if it's long enough.
|
|
205
199
|
*/
|
|
206
200
|
shouldDescriptionWrap?: boolean;
|
|
201
|
+
/**
|
|
202
|
+
* When `true`, the title of the item will render as a `h2` rather than a `span`
|
|
203
|
+
* @deprecated This API exists to support functionality in `@atlaskit/side-navigation` and should not be used. Once the new navigation is fully rolled out, this prop will be removed.
|
|
204
|
+
*/
|
|
205
|
+
isTitleHeading?: boolean;
|
|
207
206
|
/**
|
|
208
207
|
* An optional name used to identify events for [React UFO (Unified Frontend Observability) press interactions](https://developer.atlassian.com/platform/ufo/react-ufo/react-ufo/getting-started/#quick-start--press-interactions). For more information, see [React UFO integration into Design System components](https://go.atlassian.com/react-ufo-dst-integration).
|
|
209
208
|
*/
|