@dhis2-ui/menu 10.0.4 → 10.1.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.
- package/build/cjs/menu-item/__tests__/menu-item.test.js +35 -0
- package/build/cjs/menu-item/menu-item.js +16 -3
- package/build/cjs/menu-item/menu-item.prod.stories.js +13 -1
- package/build/cjs/menu-item/menu-item.styles.js +2 -2
- package/build/es/menu-item/__tests__/menu-item.test.js +35 -0
- package/build/es/menu-item/menu-item.js +17 -4
- package/build/es/menu-item/menu-item.prod.stories.js +11 -0
- package/build/es/menu-item/menu-item.styles.js +2 -2
- package/package.json +8 -8
|
@@ -67,4 +67,39 @@ describe('Menu Component', () => {
|
|
|
67
67
|
label: 'Test submenu child'
|
|
68
68
|
}).exists()).toBe(false);
|
|
69
69
|
});
|
|
70
|
+
describe('aria-label attribute', () => {
|
|
71
|
+
it('produces a log if the label prop is not a string', () => {
|
|
72
|
+
// Prep to test logs
|
|
73
|
+
const originalConsoleDebug = console.debug;
|
|
74
|
+
const consoleDebugMock = jest.fn();
|
|
75
|
+
console.debug = consoleDebugMock;
|
|
76
|
+
const menuItemDataTest = 'data-test-menu-item';
|
|
77
|
+
const wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(_menuItem.MenuItem, {
|
|
78
|
+
dataTest: menuItemDataTest,
|
|
79
|
+
label: /*#__PURE__*/_react.default.createElement("span", null, 'Node label')
|
|
80
|
+
}));
|
|
81
|
+
const menuItem = wrapper.find({
|
|
82
|
+
'data-test': menuItemDataTest
|
|
83
|
+
});
|
|
84
|
+
expect(menuItem.childAt(0).prop('role')).toBe('menuitem');
|
|
85
|
+
expect(menuItem.childAt(0).prop('aria-label')).toBe(undefined);
|
|
86
|
+
expect(consoleDebugMock).toHaveBeenCalledWith('The label prop on MenuItem is not a string; a value for the ariaLabel prop should be provided');
|
|
87
|
+
|
|
88
|
+
// Teardown
|
|
89
|
+
console.debug = originalConsoleDebug;
|
|
90
|
+
});
|
|
91
|
+
it('uses the ariaLabel prop for aria-label if defined', () => {
|
|
92
|
+
const menuItemDataTest = 'data-test-menu-item';
|
|
93
|
+
const wrapper = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(_menuItem.MenuItem, {
|
|
94
|
+
dataTest: menuItemDataTest,
|
|
95
|
+
label: /*#__PURE__*/_react.default.createElement("span", null, 'Node label'),
|
|
96
|
+
ariaLabel: "Aria label"
|
|
97
|
+
}));
|
|
98
|
+
const menuItem = wrapper.find({
|
|
99
|
+
'data-test': menuItemDataTest
|
|
100
|
+
});
|
|
101
|
+
expect(menuItem.childAt(0).prop('role')).toBe('menuitem');
|
|
102
|
+
expect(menuItem.childAt(0).prop('aria-label')).toBe('Aria label');
|
|
103
|
+
});
|
|
104
|
+
});
|
|
70
105
|
});
|
|
@@ -52,6 +52,7 @@ const MenuItem = _ref2 => {
|
|
|
52
52
|
chevron,
|
|
53
53
|
value,
|
|
54
54
|
label,
|
|
55
|
+
ariaLabel,
|
|
55
56
|
showSubMenu,
|
|
56
57
|
toggleSubMenu,
|
|
57
58
|
suffix,
|
|
@@ -96,6 +97,12 @@ const MenuItem = _ref2 => {
|
|
|
96
97
|
menuItem.removeEventListener('keydown', handleKeyDown);
|
|
97
98
|
};
|
|
98
99
|
}, [openSubMenus]);
|
|
100
|
+
const resolvedAriaLabel = (0, _react.useMemo)(() => {
|
|
101
|
+
if (typeof label !== 'string' && ariaLabel === undefined) {
|
|
102
|
+
console.debug('The label prop on MenuItem is not a string; a value for the ariaLabel prop should be provided');
|
|
103
|
+
}
|
|
104
|
+
return ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : typeof label === 'string' ? label : undefined;
|
|
105
|
+
}, [ariaLabel, label]);
|
|
99
106
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("li", {
|
|
100
107
|
ref: menuItemRef,
|
|
101
108
|
"data-test": dataTest,
|
|
@@ -106,7 +113,7 @@ const MenuItem = _ref2 => {
|
|
|
106
113
|
destructive,
|
|
107
114
|
disabled,
|
|
108
115
|
dense,
|
|
109
|
-
active: active || showSubMenu
|
|
116
|
+
active: active || showSubMenu,
|
|
110
117
|
'with-chevron': children || chevron
|
|
111
118
|
}) || "")
|
|
112
119
|
}, /*#__PURE__*/_react.default.createElement("a", {
|
|
@@ -123,7 +130,7 @@ const MenuItem = _ref2 => {
|
|
|
123
130
|
"aria-disabled": disabled,
|
|
124
131
|
"aria-haspopup": children && 'menu',
|
|
125
132
|
"aria-expanded": showSubMenu,
|
|
126
|
-
"aria-label":
|
|
133
|
+
"aria-label": resolvedAriaLabel,
|
|
127
134
|
className: `jsx-${_menuItemStyles.default.__hash}`
|
|
128
135
|
}, icon && /*#__PURE__*/_react.default.createElement("span", {
|
|
129
136
|
className: `jsx-${_menuItemStyles.default.__hash}` + " " + "icon"
|
|
@@ -145,6 +152,12 @@ const MenuItem = _ref2 => {
|
|
|
145
152
|
exports.MenuItem = MenuItem;
|
|
146
153
|
MenuItem.propTypes = {
|
|
147
154
|
active: _propTypes.default.bool,
|
|
155
|
+
/**
|
|
156
|
+
* By default, the label prop is used for the aria-label attribute on the
|
|
157
|
+
* underlying HTML element. If this prop is defined, it will be used as the
|
|
158
|
+
* aria-label instead
|
|
159
|
+
*/
|
|
160
|
+
ariaLabel: _propTypes.default.string,
|
|
148
161
|
checkbox: _propTypes.default.bool,
|
|
149
162
|
checked: _propTypes.default.bool,
|
|
150
163
|
chevron: _propTypes.default.bool,
|
|
@@ -162,7 +175,7 @@ MenuItem.propTypes = {
|
|
|
162
175
|
href: _propTypes.default.string,
|
|
163
176
|
/** An icon for the left side of the menu item */
|
|
164
177
|
icon: _propTypes.default.node,
|
|
165
|
-
/** Text in the menu item */
|
|
178
|
+
/** Text in the menu item. If it's a string, will be used as aria-label */
|
|
166
179
|
label: _propTypes.default.node,
|
|
167
180
|
/** When true, nested menu items are shown in a Popper */
|
|
168
181
|
showSubMenu: _propTypes.default.bool,
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.default = exports.ToggleMenuItem = exports.SuffixAndChevron = exports.Suffix = exports.SubMenus = exports.RTLSuffixAndChevron = exports.OnClick = exports.Link = exports.Icon = exports.Disabled = exports.Destructive = exports.Dense = exports.Default = exports.Chevron = exports.Active = void 0;
|
|
6
|
+
exports.default = exports.ToggleMenuItem = exports.SuffixAndChevron = exports.Suffix = exports.SubMenus = exports.RTLSuffixAndChevron = exports.OnClick = exports.Link = exports.InContainer = exports.Icon = exports.Disabled = exports.Destructive = exports.Dense = exports.Default = exports.Chevron = exports.Active = void 0;
|
|
7
7
|
var _ui = require("@dhis2/ui");
|
|
8
8
|
var _uiConstants = require("@dhis2/ui-constants");
|
|
9
9
|
var _uiIcons = require("@dhis2/ui-icons");
|
|
@@ -104,6 +104,18 @@ Icon.parameters = {
|
|
|
104
104
|
}
|
|
105
105
|
}
|
|
106
106
|
};
|
|
107
|
+
const InContainer = args => {
|
|
108
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
109
|
+
style: {
|
|
110
|
+
height: 40,
|
|
111
|
+
width: 300,
|
|
112
|
+
overflow: 'hidden'
|
|
113
|
+
}
|
|
114
|
+
}, /*#__PURE__*/_react.default.createElement(_index.Menu, args, /*#__PURE__*/_react.default.createElement(_menuItem.MenuItem, {
|
|
115
|
+
label: "Menu item"
|
|
116
|
+
})));
|
|
117
|
+
};
|
|
118
|
+
exports.InContainer = InContainer;
|
|
107
119
|
const Suffix = exports.Suffix = Template.bind({});
|
|
108
120
|
Suffix.args = {
|
|
109
121
|
label: 'Open in Data Visualizer',
|
|
@@ -5,6 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _uiConstants = require("@dhis2/ui-constants");
|
|
8
|
-
const _defaultExport = [`li.jsx-
|
|
9
|
-
_defaultExport.__hash = "
|
|
8
|
+
const _defaultExport = [`li.jsx-1688414627{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;padding:0;cursor:pointer;list-style:none;background-color:${_uiConstants.colors.white};color:${_uiConstants.colors.grey900};fill:${_uiConstants.colors.grey900};font-size:14px;line-height:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}`, `li.jsx-1688414627:hover{background-color:${_uiConstants.colors.grey200};}`, `li.jsx-1688414627:active,li.active.jsx-1688414627{background-color:${_uiConstants.colors.grey300};}`, `li.destructive.jsx-1688414627{color:${_uiConstants.colors.red700};fill:${_uiConstants.colors.red600};}`, `li.destructive.jsx-1688414627:hover{background-color:${_uiConstants.colors.red050};}`, `li.destructive.jsx-1688414627:active,li.destructive.active.jsx-1688414627{background-color:${_uiConstants.colors.red100};}`, `li.disabled.jsx-1688414627{cursor:not-allowed;color:${_uiConstants.colors.grey500};fill:${_uiConstants.colors.grey500};}`, `li.disabled.jsx-1688414627:hover{background-color:${_uiConstants.colors.white};}`, `li.jsx-1688414627:focus{outline:3px solid ${_uiConstants.theme.focus};outline-offset:-3px;}`, "li.jsx-1688414627:focus.jsx-1688414627:not(:focus-visible){outline:none;}", `a.jsx-1688414627{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0 ${_uiConstants.spacers.dp16};min-height:40px;-webkit-text-decoration:none;text-decoration:none;color:inherit;}`, `li.with-chevron.jsx-1688414627 a.jsx-1688414627{padding-inline-end:${_uiConstants.spacers.dp8};}`, `li.dense.jsx-1688414627 a.jsx-1688414627{padding:0 ${_uiConstants.spacers.dp12};min-height:32px;}`, `li.with-chevron.dense.jsx-1688414627 a.jsx-1688414627{padding-inline-end:${_uiConstants.spacers.dp4};}`, `.label.jsx-1688414627{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:${_uiConstants.spacers.dp12} 0;}`, `li.dense.jsx-1688414627 .label.jsx-1688414627{padding:${_uiConstants.spacers.dp8} 0;}`, `.icon.jsx-1688414627{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;margin-inline-end:${_uiConstants.spacers.dp12};width:24px;height:24px;}`, `.suffix.jsx-1688414627{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-inline-start:${_uiConstants.spacers.dp8};}`, `.chevron.jsx-1688414627{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;margin-inline-start:${_uiConstants.spacers.dp24};}`, ".chevron.jsx-1688414627:dir(rtl){-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}", `li.dense.jsx-1688414627 .icon.jsx-1688414627{margin-inline-end:${_uiConstants.spacers.dp8};width:16px;height:16px;}`, "li.jsx-1688414627 .icon.jsx-1688414627>svg{width:24px;height:24px;}", "li.dense.jsx-1688414627 .icon.jsx-1688414627>svg,li.jsx-1688414627 .chevron.jsx-1688414627>svg{width:16px;height:16px;}"];
|
|
9
|
+
_defaultExport.__hash = "1688414627";
|
|
10
10
|
var _default = exports.default = _defaultExport;
|
|
@@ -64,4 +64,39 @@ describe('Menu Component', () => {
|
|
|
64
64
|
label: 'Test submenu child'
|
|
65
65
|
}).exists()).toBe(false);
|
|
66
66
|
});
|
|
67
|
+
describe('aria-label attribute', () => {
|
|
68
|
+
it('produces a log if the label prop is not a string', () => {
|
|
69
|
+
// Prep to test logs
|
|
70
|
+
const originalConsoleDebug = console.debug;
|
|
71
|
+
const consoleDebugMock = jest.fn();
|
|
72
|
+
console.debug = consoleDebugMock;
|
|
73
|
+
const menuItemDataTest = 'data-test-menu-item';
|
|
74
|
+
const wrapper = mount(/*#__PURE__*/React.createElement(MenuItem, {
|
|
75
|
+
dataTest: menuItemDataTest,
|
|
76
|
+
label: /*#__PURE__*/React.createElement("span", null, 'Node label')
|
|
77
|
+
}));
|
|
78
|
+
const menuItem = wrapper.find({
|
|
79
|
+
'data-test': menuItemDataTest
|
|
80
|
+
});
|
|
81
|
+
expect(menuItem.childAt(0).prop('role')).toBe('menuitem');
|
|
82
|
+
expect(menuItem.childAt(0).prop('aria-label')).toBe(undefined);
|
|
83
|
+
expect(consoleDebugMock).toHaveBeenCalledWith('The label prop on MenuItem is not a string; a value for the ariaLabel prop should be provided');
|
|
84
|
+
|
|
85
|
+
// Teardown
|
|
86
|
+
console.debug = originalConsoleDebug;
|
|
87
|
+
});
|
|
88
|
+
it('uses the ariaLabel prop for aria-label if defined', () => {
|
|
89
|
+
const menuItemDataTest = 'data-test-menu-item';
|
|
90
|
+
const wrapper = mount(/*#__PURE__*/React.createElement(MenuItem, {
|
|
91
|
+
dataTest: menuItemDataTest,
|
|
92
|
+
label: /*#__PURE__*/React.createElement("span", null, 'Node label'),
|
|
93
|
+
ariaLabel: "Aria label"
|
|
94
|
+
}));
|
|
95
|
+
const menuItem = wrapper.find({
|
|
96
|
+
'data-test': menuItemDataTest
|
|
97
|
+
});
|
|
98
|
+
expect(menuItem.childAt(0).prop('role')).toBe('menuitem');
|
|
99
|
+
expect(menuItem.childAt(0).prop('aria-label')).toBe('Aria label');
|
|
100
|
+
});
|
|
101
|
+
});
|
|
67
102
|
});
|
|
@@ -4,7 +4,7 @@ import { Popper } from '@dhis2-ui/popper';
|
|
|
4
4
|
import { Portal } from '@dhis2-ui/portal';
|
|
5
5
|
import cx from 'classnames';
|
|
6
6
|
import PropTypes from 'prop-types';
|
|
7
|
-
import React, { useEffect, useRef, useState } from 'react';
|
|
7
|
+
import React, { useEffect, useRef, useState, useMemo } from 'react';
|
|
8
8
|
import { FlyoutMenu } from '../flyout-menu/index.js';
|
|
9
9
|
import styles from './menu-item.styles.js';
|
|
10
10
|
const isModifiedEvent = evt => evt.metaKey || evt.altKey || evt.ctrlKey || evt.shiftKey;
|
|
@@ -43,6 +43,7 @@ const MenuItem = _ref2 => {
|
|
|
43
43
|
chevron,
|
|
44
44
|
value,
|
|
45
45
|
label,
|
|
46
|
+
ariaLabel,
|
|
46
47
|
showSubMenu,
|
|
47
48
|
toggleSubMenu,
|
|
48
49
|
suffix,
|
|
@@ -87,6 +88,12 @@ const MenuItem = _ref2 => {
|
|
|
87
88
|
menuItem.removeEventListener('keydown', handleKeyDown);
|
|
88
89
|
};
|
|
89
90
|
}, [openSubMenus]);
|
|
91
|
+
const resolvedAriaLabel = useMemo(() => {
|
|
92
|
+
if (typeof label !== 'string' && ariaLabel === undefined) {
|
|
93
|
+
console.debug('The label prop on MenuItem is not a string; a value for the ariaLabel prop should be provided');
|
|
94
|
+
}
|
|
95
|
+
return ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : typeof label === 'string' ? label : undefined;
|
|
96
|
+
}, [ariaLabel, label]);
|
|
90
97
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("li", {
|
|
91
98
|
ref: menuItemRef,
|
|
92
99
|
"data-test": dataTest,
|
|
@@ -97,7 +104,7 @@ const MenuItem = _ref2 => {
|
|
|
97
104
|
destructive,
|
|
98
105
|
disabled,
|
|
99
106
|
dense,
|
|
100
|
-
active: active || showSubMenu
|
|
107
|
+
active: active || showSubMenu,
|
|
101
108
|
'with-chevron': children || chevron
|
|
102
109
|
}) || "")
|
|
103
110
|
}, /*#__PURE__*/React.createElement("a", {
|
|
@@ -114,7 +121,7 @@ const MenuItem = _ref2 => {
|
|
|
114
121
|
"aria-disabled": disabled,
|
|
115
122
|
"aria-haspopup": children && 'menu',
|
|
116
123
|
"aria-expanded": showSubMenu,
|
|
117
|
-
"aria-label":
|
|
124
|
+
"aria-label": resolvedAriaLabel,
|
|
118
125
|
className: `jsx-${styles.__hash}`
|
|
119
126
|
}, icon && /*#__PURE__*/React.createElement("span", {
|
|
120
127
|
className: `jsx-${styles.__hash}` + " " + "icon"
|
|
@@ -135,6 +142,12 @@ const MenuItem = _ref2 => {
|
|
|
135
142
|
};
|
|
136
143
|
MenuItem.propTypes = {
|
|
137
144
|
active: PropTypes.bool,
|
|
145
|
+
/**
|
|
146
|
+
* By default, the label prop is used for the aria-label attribute on the
|
|
147
|
+
* underlying HTML element. If this prop is defined, it will be used as the
|
|
148
|
+
* aria-label instead
|
|
149
|
+
*/
|
|
150
|
+
ariaLabel: PropTypes.string,
|
|
138
151
|
checkbox: PropTypes.bool,
|
|
139
152
|
checked: PropTypes.bool,
|
|
140
153
|
chevron: PropTypes.bool,
|
|
@@ -152,7 +165,7 @@ MenuItem.propTypes = {
|
|
|
152
165
|
href: PropTypes.string,
|
|
153
166
|
/** An icon for the left side of the menu item */
|
|
154
167
|
icon: PropTypes.node,
|
|
155
|
-
/** Text in the menu item */
|
|
168
|
+
/** Text in the menu item. If it's a string, will be used as aria-label */
|
|
156
169
|
label: PropTypes.node,
|
|
157
170
|
/** When true, nested menu items are shown in a Popper */
|
|
158
171
|
showSubMenu: PropTypes.bool,
|
|
@@ -95,6 +95,17 @@ Icon.parameters = {
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
};
|
|
98
|
+
export const InContainer = args => {
|
|
99
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
100
|
+
style: {
|
|
101
|
+
height: 40,
|
|
102
|
+
width: 300,
|
|
103
|
+
overflow: 'hidden'
|
|
104
|
+
}
|
|
105
|
+
}, /*#__PURE__*/React.createElement(Menu, args, /*#__PURE__*/React.createElement(MenuItem, {
|
|
106
|
+
label: "Menu item"
|
|
107
|
+
})));
|
|
108
|
+
};
|
|
98
109
|
export const Suffix = Template.bind({});
|
|
99
110
|
Suffix.args = {
|
|
100
111
|
label: 'Open in Data Visualizer',
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { colors, spacers, theme } from '@dhis2/ui-constants';
|
|
2
|
-
const _defaultExport = [`li.jsx-
|
|
3
|
-
_defaultExport.__hash = "
|
|
2
|
+
const _defaultExport = [`li.jsx-1688414627{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;padding:0;cursor:pointer;list-style:none;background-color:${colors.white};color:${colors.grey900};fill:${colors.grey900};font-size:14px;line-height:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}`, `li.jsx-1688414627:hover{background-color:${colors.grey200};}`, `li.jsx-1688414627:active,li.active.jsx-1688414627{background-color:${colors.grey300};}`, `li.destructive.jsx-1688414627{color:${colors.red700};fill:${colors.red600};}`, `li.destructive.jsx-1688414627:hover{background-color:${colors.red050};}`, `li.destructive.jsx-1688414627:active,li.destructive.active.jsx-1688414627{background-color:${colors.red100};}`, `li.disabled.jsx-1688414627{cursor:not-allowed;color:${colors.grey500};fill:${colors.grey500};}`, `li.disabled.jsx-1688414627:hover{background-color:${colors.white};}`, `li.jsx-1688414627:focus{outline:3px solid ${theme.focus};outline-offset:-3px;}`, "li.jsx-1688414627:focus.jsx-1688414627:not(:focus-visible){outline:none;}", `a.jsx-1688414627{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0 ${spacers.dp16};min-height:40px;-webkit-text-decoration:none;text-decoration:none;color:inherit;}`, `li.with-chevron.jsx-1688414627 a.jsx-1688414627{padding-inline-end:${spacers.dp8};}`, `li.dense.jsx-1688414627 a.jsx-1688414627{padding:0 ${spacers.dp12};min-height:32px;}`, `li.with-chevron.dense.jsx-1688414627 a.jsx-1688414627{padding-inline-end:${spacers.dp4};}`, `.label.jsx-1688414627{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:${spacers.dp12} 0;}`, `li.dense.jsx-1688414627 .label.jsx-1688414627{padding:${spacers.dp8} 0;}`, `.icon.jsx-1688414627{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;margin-inline-end:${spacers.dp12};width:24px;height:24px;}`, `.suffix.jsx-1688414627{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-inline-start:${spacers.dp8};}`, `.chevron.jsx-1688414627{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;margin-inline-start:${spacers.dp24};}`, ".chevron.jsx-1688414627:dir(rtl){-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}", `li.dense.jsx-1688414627 .icon.jsx-1688414627{margin-inline-end:${spacers.dp8};width:16px;height:16px;}`, "li.jsx-1688414627 .icon.jsx-1688414627>svg{width:24px;height:24px;}", "li.dense.jsx-1688414627 .icon.jsx-1688414627>svg,li.jsx-1688414627 .chevron.jsx-1688414627>svg{width:16px;height:16px;}"];
|
|
3
|
+
_defaultExport.__hash = "1688414627";
|
|
4
4
|
export default _defaultExport;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dhis2-ui/menu",
|
|
3
|
-
"version": "10.
|
|
3
|
+
"version": "10.1.1",
|
|
4
4
|
"description": "UI Menu",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -33,13 +33,13 @@
|
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@dhis2/prop-types": "^3.1.2",
|
|
36
|
-
"@dhis2-ui/card": "10.
|
|
37
|
-
"@dhis2-ui/divider": "10.
|
|
38
|
-
"@dhis2-ui/layer": "10.
|
|
39
|
-
"@dhis2-ui/popper": "10.
|
|
40
|
-
"@dhis2-ui/portal": "10.
|
|
41
|
-
"@dhis2/ui-constants": "10.
|
|
42
|
-
"@dhis2/ui-icons": "10.
|
|
36
|
+
"@dhis2-ui/card": "10.1.1",
|
|
37
|
+
"@dhis2-ui/divider": "10.1.1",
|
|
38
|
+
"@dhis2-ui/layer": "10.1.1",
|
|
39
|
+
"@dhis2-ui/popper": "10.1.1",
|
|
40
|
+
"@dhis2-ui/portal": "10.1.1",
|
|
41
|
+
"@dhis2/ui-constants": "10.1.1",
|
|
42
|
+
"@dhis2/ui-icons": "10.1.1",
|
|
43
43
|
"classnames": "^2.3.1",
|
|
44
44
|
"prop-types": "^15.7.2"
|
|
45
45
|
},
|