@dhis2-ui/menu 9.3.0 → 9.4.0-alpha.2
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/menu.stories.js +12 -3
- package/build/cjs/menu-item/menu-item.stories.js +12 -1
- package/build/cjs/menu-item/menu-item.styles.js +2 -2
- package/build/es/menu/menu.stories.js +8 -2
- package/build/es/menu-item/menu-item.stories.js +8 -0
- package/build/es/menu-item/menu-item.styles.js +2 -2
- package/package.json +8 -8
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.default = exports.SideBarMenu = exports.Dense = exports.Default = exports.AutoHideFirstSectionHeaderDivider = void 0;
|
|
6
|
+
exports.default = exports.SideBarMenuRTL = exports.SideBarMenu = exports.Dense = exports.Default = exports.AutoHideFirstSectionHeaderDivider = void 0;
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
@@ -82,8 +82,17 @@ const SideBarMenu = args => /*#__PURE__*/_react.default.createElement("main", {
|
|
|
82
82
|
backgroundColor: '#f3ffff',
|
|
83
83
|
flexGrow: 1,
|
|
84
84
|
padding: 20,
|
|
85
|
-
|
|
85
|
+
borderInlineStart: '1px solid grey'
|
|
86
86
|
}
|
|
87
87
|
}, "Main content"));
|
|
88
88
|
|
|
89
|
-
exports.SideBarMenu = SideBarMenu;
|
|
89
|
+
exports.SideBarMenu = SideBarMenu;
|
|
90
|
+
|
|
91
|
+
const SideBarMenuRTL = args => /*#__PURE__*/_react.default.createElement("div", {
|
|
92
|
+
dir: "rtl",
|
|
93
|
+
style: {
|
|
94
|
+
height: '100%'
|
|
95
|
+
}
|
|
96
|
+
}, /*#__PURE__*/_react.default.createElement(SideBarMenu, args));
|
|
97
|
+
|
|
98
|
+
exports.SideBarMenuRTL = SideBarMenuRTL;
|
|
@@ -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.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.Icon = exports.Disabled = exports.Destructive = exports.Dense = exports.Default = exports.Chevron = exports.Active = void 0;
|
|
7
7
|
|
|
8
8
|
var _ui = require("@dhis2/ui");
|
|
9
9
|
|
|
@@ -210,4 +210,15 @@ SubMenus.parameters = {
|
|
|
210
210
|
story: "_View this story in the 'Canvas' tab for proper submenu alignment._"
|
|
211
211
|
}
|
|
212
212
|
}
|
|
213
|
+
};
|
|
214
|
+
|
|
215
|
+
const RTLSuffixAndChevron = args => /*#__PURE__*/_react.default.createElement("div", {
|
|
216
|
+
dir: "rtl"
|
|
217
|
+
}, /*#__PURE__*/_react.default.createElement(Template, args));
|
|
218
|
+
|
|
219
|
+
exports.RTLSuffixAndChevron = RTLSuffixAndChevron;
|
|
220
|
+
RTLSuffixAndChevron.args = {
|
|
221
|
+
label: 'Security notifications',
|
|
222
|
+
chevron: true,
|
|
223
|
+
suffix: /*#__PURE__*/_react.default.createElement(_ui.Tag, null, "3")
|
|
213
224
|
};
|
|
@@ -7,7 +7,7 @@ exports.default = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _uiConstants = require("@dhis2/ui-constants");
|
|
9
9
|
|
|
10
|
-
const _defaultExport = ["li.jsx-
|
|
11
|
-
_defaultExport.__hash = "
|
|
10
|
+
const _defaultExport = ["li.jsx-3192368000{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:".concat(_uiConstants.colors.white, ";color:").concat(_uiConstants.colors.grey900, ";fill:").concat(_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-3192368000:hover{background-color:".concat(_uiConstants.colors.grey200, ";}"), "li.jsx-3192368000:active,li.active.jsx-3192368000{background-color:".concat(_uiConstants.colors.grey300, ";}"), "li.destructive.jsx-3192368000{color:".concat(_uiConstants.colors.red700, ";fill:").concat(_uiConstants.colors.red600, ";}"), "li.destructive.jsx-3192368000:hover{background-color:".concat(_uiConstants.colors.red050, ";}"), "li.destructive.jsx-3192368000:active,li.destructive.active.jsx-3192368000{background-color:".concat(_uiConstants.colors.red100, ";}"), "li.disabled.jsx-3192368000{cursor:not-allowed;color:".concat(_uiConstants.colors.grey500, ";fill:").concat(_uiConstants.colors.grey500, ";}"), "li.disabled.jsx-3192368000:hover{background-color:".concat(_uiConstants.colors.white, ";}"), "a.jsx-3192368000{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 ".concat(_uiConstants.spacers.dp16, ";min-height:40px;-webkit-text-decoration:none;text-decoration:none;color:inherit;}"), "a.jsx-3192368000:focus{outline:3px solid ".concat(_uiConstants.theme.focus, ";outline-offset:-3px;}"), "a.jsx-3192368000:focus.jsx-3192368000:not(:focus-visible){outline:none;}", "li.with-chevron.jsx-3192368000 a.jsx-3192368000{padding-inline-end:".concat(_uiConstants.spacers.dp8, ";}"), "li.dense.jsx-3192368000 a.jsx-3192368000{padding:0 ".concat(_uiConstants.spacers.dp12, ";min-height:32px;}"), "li.with-chevron.dense.jsx-3192368000 a.jsx-3192368000{padding-inline-end:".concat(_uiConstants.spacers.dp4, ";}"), ".label.jsx-3192368000{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:".concat(_uiConstants.spacers.dp12, " 0;}"), "li.dense.jsx-3192368000 .label.jsx-3192368000{padding:".concat(_uiConstants.spacers.dp8, " 0;}"), ".icon.jsx-3192368000{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;margin-inline-end:".concat(_uiConstants.spacers.dp12, ";width:24px;height:24px;}"), ".suffix.jsx-3192368000{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:".concat(_uiConstants.spacers.dp8, ";}"), ".chevron.jsx-3192368000{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:".concat(_uiConstants.spacers.dp24, ";}"), ".chevron.jsx-3192368000:dir(rtl){-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}", "li.dense.jsx-3192368000 .icon.jsx-3192368000{margin-inline-end:".concat(_uiConstants.spacers.dp8, ";width:16px;height:16px;}"), "li.jsx-3192368000 .icon.jsx-3192368000>svg{width:24px;height:24px;}", "li.dense.jsx-3192368000 .icon.jsx-3192368000>svg,li.jsx-3192368000 .chevron.jsx-3192368000>svg{width:16px;height:16px;}"];
|
|
11
|
+
_defaultExport.__hash = "3192368000";
|
|
12
12
|
var _default = _defaultExport;
|
|
13
13
|
exports.default = _default;
|
|
@@ -59,6 +59,12 @@ export const SideBarMenu = args => /*#__PURE__*/React.createElement("main", {
|
|
|
59
59
|
backgroundColor: '#f3ffff',
|
|
60
60
|
flexGrow: 1,
|
|
61
61
|
padding: 20,
|
|
62
|
-
|
|
62
|
+
borderInlineStart: '1px solid grey'
|
|
63
63
|
}
|
|
64
|
-
}, "Main content"));
|
|
64
|
+
}, "Main content"));
|
|
65
|
+
export const SideBarMenuRTL = args => /*#__PURE__*/React.createElement("div", {
|
|
66
|
+
dir: "rtl",
|
|
67
|
+
style: {
|
|
68
|
+
height: '100%'
|
|
69
|
+
}
|
|
70
|
+
}, /*#__PURE__*/React.createElement(SideBarMenu, args));
|
|
@@ -171,4 +171,12 @@ SubMenus.parameters = {
|
|
|
171
171
|
story: "_View this story in the 'Canvas' tab for proper submenu alignment._"
|
|
172
172
|
}
|
|
173
173
|
}
|
|
174
|
+
};
|
|
175
|
+
export const RTLSuffixAndChevron = args => /*#__PURE__*/React.createElement("div", {
|
|
176
|
+
dir: "rtl"
|
|
177
|
+
}, /*#__PURE__*/React.createElement(Template, args));
|
|
178
|
+
RTLSuffixAndChevron.args = {
|
|
179
|
+
label: 'Security notifications',
|
|
180
|
+
chevron: true,
|
|
181
|
+
suffix: /*#__PURE__*/React.createElement(Tag, null, "3")
|
|
174
182
|
};
|
|
@@ -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-3192368000{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:".concat(colors.white, ";color:").concat(colors.grey900, ";fill:").concat(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-3192368000:hover{background-color:".concat(colors.grey200, ";}"), "li.jsx-3192368000:active,li.active.jsx-3192368000{background-color:".concat(colors.grey300, ";}"), "li.destructive.jsx-3192368000{color:".concat(colors.red700, ";fill:").concat(colors.red600, ";}"), "li.destructive.jsx-3192368000:hover{background-color:".concat(colors.red050, ";}"), "li.destructive.jsx-3192368000:active,li.destructive.active.jsx-3192368000{background-color:".concat(colors.red100, ";}"), "li.disabled.jsx-3192368000{cursor:not-allowed;color:".concat(colors.grey500, ";fill:").concat(colors.grey500, ";}"), "li.disabled.jsx-3192368000:hover{background-color:".concat(colors.white, ";}"), "a.jsx-3192368000{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 ".concat(spacers.dp16, ";min-height:40px;-webkit-text-decoration:none;text-decoration:none;color:inherit;}"), "a.jsx-3192368000:focus{outline:3px solid ".concat(theme.focus, ";outline-offset:-3px;}"), "a.jsx-3192368000:focus.jsx-3192368000:not(:focus-visible){outline:none;}", "li.with-chevron.jsx-3192368000 a.jsx-3192368000{padding-inline-end:".concat(spacers.dp8, ";}"), "li.dense.jsx-3192368000 a.jsx-3192368000{padding:0 ".concat(spacers.dp12, ";min-height:32px;}"), "li.with-chevron.dense.jsx-3192368000 a.jsx-3192368000{padding-inline-end:".concat(spacers.dp4, ";}"), ".label.jsx-3192368000{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:".concat(spacers.dp12, " 0;}"), "li.dense.jsx-3192368000 .label.jsx-3192368000{padding:".concat(spacers.dp8, " 0;}"), ".icon.jsx-3192368000{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;margin-inline-end:".concat(spacers.dp12, ";width:24px;height:24px;}"), ".suffix.jsx-3192368000{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:".concat(spacers.dp8, ";}"), ".chevron.jsx-3192368000{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:".concat(spacers.dp24, ";}"), ".chevron.jsx-3192368000:dir(rtl){-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}", "li.dense.jsx-3192368000 .icon.jsx-3192368000{margin-inline-end:".concat(spacers.dp8, ";width:16px;height:16px;}"), "li.jsx-3192368000 .icon.jsx-3192368000>svg{width:24px;height:24px;}", "li.dense.jsx-3192368000 .icon.jsx-3192368000>svg,li.jsx-3192368000 .chevron.jsx-3192368000>svg{width:16px;height:16px;}"];
|
|
3
|
+
_defaultExport.__hash = "3192368000";
|
|
4
4
|
export default _defaultExport;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dhis2-ui/menu",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.4.0-alpha.2",
|
|
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": "9.
|
|
37
|
-
"@dhis2-ui/divider": "9.
|
|
38
|
-
"@dhis2-ui/layer": "9.
|
|
39
|
-
"@dhis2-ui/popper": "9.
|
|
40
|
-
"@dhis2-ui/portal": "9.
|
|
41
|
-
"@dhis2/ui-constants": "9.
|
|
42
|
-
"@dhis2/ui-icons": "9.
|
|
36
|
+
"@dhis2-ui/card": "9.4.0-alpha.2",
|
|
37
|
+
"@dhis2-ui/divider": "9.4.0-alpha.2",
|
|
38
|
+
"@dhis2-ui/layer": "9.4.0-alpha.2",
|
|
39
|
+
"@dhis2-ui/popper": "9.4.0-alpha.2",
|
|
40
|
+
"@dhis2-ui/portal": "9.4.0-alpha.2",
|
|
41
|
+
"@dhis2/ui-constants": "9.4.0-alpha.2",
|
|
42
|
+
"@dhis2/ui-icons": "9.4.0-alpha.2",
|
|
43
43
|
"classnames": "^2.3.1",
|
|
44
44
|
"prop-types": "^15.7.2"
|
|
45
45
|
},
|