@fluentui-react-native/tester 0.120.1 → 0.121.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.json +37 -1
- package/CHANGELOG.md +19 -2
- package/lib/fluent-tester/src/TestComponents/Menu/MenuScrollView.d.ts +3 -0
- package/lib/fluent-tester/src/TestComponents/Menu/MenuScrollView.d.ts.map +1 -0
- package/lib/fluent-tester/src/TestComponents/Menu/MenuScrollView.js +69 -0
- package/lib/fluent-tester/src/TestComponents/Menu/MenuScrollView.js.map +1 -0
- package/lib/fluent-tester/src/TestComponents/Menu/MenuTest.d.ts +1 -1
- package/lib/fluent-tester/src/TestComponents/Menu/MenuTest.d.ts.map +1 -1
- package/lib/fluent-tester/src/TestComponents/Menu/MenuTest.js +7 -2
- package/lib/fluent-tester/src/TestComponents/Menu/MenuTest.js.map +1 -1
- package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuScrollView.d.ts +3 -0
- package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuScrollView.d.ts.map +1 -0
- package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuScrollView.js +73 -0
- package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuScrollView.js.map +1 -0
- package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuTest.d.ts +1 -1
- package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuTest.d.ts.map +1 -1
- package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuTest.js +100 -95
- package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuTest.js.map +1 -1
- package/package.json +3 -3
- package/src/TestComponents/Menu/MenuScrollView.tsx +97 -0
- package/src/TestComponents/Menu/MenuTest.tsx +7 -2
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,43 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/tester",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "Wed, 21 Dec 2022
|
|
5
|
+
"date": "Wed, 21 Dec 2022 23:00:34 GMT",
|
|
6
|
+
"tag": "@fluentui-react-native/tester_v0.121.0",
|
|
7
|
+
"version": "0.121.0",
|
|
8
|
+
"comments": {
|
|
9
|
+
"minor": [
|
|
10
|
+
{
|
|
11
|
+
"author": "amchiu@microsoft.com",
|
|
12
|
+
"package": "@fluentui-react-native/tester",
|
|
13
|
+
"commit": "c6f0feaa01969cab2a902cd4c4c603729e39ef24",
|
|
14
|
+
"comment": "Add ScrollView to Menu (macOS)"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui-react-native/tester",
|
|
19
|
+
"comment": "Bump @fluentui-react-native/menu to v1.2.0",
|
|
20
|
+
"commit": "c6f0feaa01969cab2a902cd4c4c603729e39ef24"
|
|
21
|
+
}
|
|
22
|
+
]
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
"date": "Wed, 21 Dec 2022 17:18:46 GMT",
|
|
27
|
+
"tag": "@fluentui-react-native/tester_v0.120.2",
|
|
28
|
+
"version": "0.120.2",
|
|
29
|
+
"comments": {
|
|
30
|
+
"patch": [
|
|
31
|
+
{
|
|
32
|
+
"author": "beachball",
|
|
33
|
+
"package": "@fluentui-react-native/tester",
|
|
34
|
+
"comment": "Bump @fluentui/react-native to v0.34.4",
|
|
35
|
+
"commit": "272c2cde9b5260eec755ccbe7083e0b7c5040152"
|
|
36
|
+
}
|
|
37
|
+
]
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"date": "Wed, 21 Dec 2022 10:29:07 GMT",
|
|
6
42
|
"tag": "@fluentui-react-native/tester_v0.120.1",
|
|
7
43
|
"version": "0.120.1",
|
|
8
44
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,29 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/tester
|
|
2
2
|
|
|
3
|
-
This log was last generated on Wed, 21 Dec 2022
|
|
3
|
+
This log was last generated on Wed, 21 Dec 2022 23:00:34 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## 0.121.0
|
|
8
|
+
|
|
9
|
+
Wed, 21 Dec 2022 23:00:34 GMT
|
|
10
|
+
|
|
11
|
+
### Minor changes
|
|
12
|
+
|
|
13
|
+
- Add ScrollView to Menu (macOS) (amchiu@microsoft.com)
|
|
14
|
+
- Bump @fluentui-react-native/menu to v1.2.0
|
|
15
|
+
|
|
16
|
+
## 0.120.2
|
|
17
|
+
|
|
18
|
+
Wed, 21 Dec 2022 17:18:46 GMT
|
|
19
|
+
|
|
20
|
+
### Patches
|
|
21
|
+
|
|
22
|
+
- Bump @fluentui/react-native to v0.34.4
|
|
23
|
+
|
|
7
24
|
## 0.120.1
|
|
8
25
|
|
|
9
|
-
Wed, 21 Dec 2022 10:
|
|
26
|
+
Wed, 21 Dec 2022 10:29:07 GMT
|
|
10
27
|
|
|
11
28
|
### Patches
|
|
12
29
|
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MenuScrollView.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAaxC,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,iBAmFlC,CAAC"}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { __spreadArray } from "tslib";
|
|
2
|
+
import React, { useState } from 'react';
|
|
3
|
+
import { ButtonV1 as Button } from '@fluentui/react-native';
|
|
4
|
+
import { Menu, MenuItem, MenuTrigger, MenuPopover, MenuList } from '@fluentui-react-native/menu';
|
|
5
|
+
import { Stack } from '@fluentui-react-native/stack';
|
|
6
|
+
import { stackStyle } from '../Common/styles';
|
|
7
|
+
import { TextInput, StyleSheet, View } from 'react-native';
|
|
8
|
+
import { commonTestStyles as commonStyles } from '../Common/styles';
|
|
9
|
+
var styles = StyleSheet.create({
|
|
10
|
+
menuContainerRow: { flexDirection: 'row' },
|
|
11
|
+
menuMargin: { marginRight: 20 },
|
|
12
|
+
});
|
|
13
|
+
export var MenuScrollView = function () {
|
|
14
|
+
var _a = useState([
|
|
15
|
+
React.createElement(MenuItem, { key: 1 }, "MenuItem 1"),
|
|
16
|
+
React.createElement(MenuItem, { key: 2 }, "MenuItem 2"),
|
|
17
|
+
React.createElement(MenuItem, { key: 3 }, "MenuItem 3"),
|
|
18
|
+
React.createElement(MenuItem, { key: 4 }, "MenuItem 4"),
|
|
19
|
+
React.createElement(MenuItem, { key: 5 }, "MenuItem 5"),
|
|
20
|
+
]), data = _a[0], setData = _a[1];
|
|
21
|
+
var insertOnClick = React.useCallback(function () {
|
|
22
|
+
data.push(React.createElement(MenuItem, { key: Math.random() }, "MenuItem"));
|
|
23
|
+
var newList = __spreadArray([], data, true);
|
|
24
|
+
setData(newList);
|
|
25
|
+
}, [data]);
|
|
26
|
+
var popOnClick = React.useCallback(function () {
|
|
27
|
+
if (data.length > 0) {
|
|
28
|
+
data.pop();
|
|
29
|
+
var newList = __spreadArray([], data, true);
|
|
30
|
+
setData(newList);
|
|
31
|
+
}
|
|
32
|
+
}, [data]);
|
|
33
|
+
var _b = useState(800), maxHeight = _b[0], setMaxHeight = _b[1];
|
|
34
|
+
var menuItems = [];
|
|
35
|
+
for (var i = 0; i < 40; i++) {
|
|
36
|
+
menuItems.push(React.createElement(MenuItem, { key: i },
|
|
37
|
+
"MenuItem ",
|
|
38
|
+
i));
|
|
39
|
+
}
|
|
40
|
+
return (React.createElement(Stack, { style: stackStyle },
|
|
41
|
+
React.createElement(View, { style: styles.menuContainerRow },
|
|
42
|
+
React.createElement(TextInput, { accessibilityLabel: "Max height for menu", style: [commonStyles.textBox, styles.menuMargin], placeholder: "Max height for menu", blurOnSubmit: true, onSubmitEditing: function (e) {
|
|
43
|
+
setMaxHeight(parseInt(e.nativeEvent.text));
|
|
44
|
+
} }),
|
|
45
|
+
React.createElement(Menu, null,
|
|
46
|
+
React.createElement(MenuTrigger, null,
|
|
47
|
+
React.createElement(Button, null, "Custom height")),
|
|
48
|
+
React.createElement(MenuPopover, { maxHeight: maxHeight },
|
|
49
|
+
React.createElement(MenuList, null, menuItems)))),
|
|
50
|
+
React.createElement(View, { style: styles.menuContainerRow },
|
|
51
|
+
React.createElement(Button, { appearance: "subtle", onClick: insertOnClick }, "Add new menu item"),
|
|
52
|
+
React.createElement(Button, { appearance: "subtle", onClick: popOnClick }, "Remove last menu item"),
|
|
53
|
+
React.createElement(Menu, null,
|
|
54
|
+
React.createElement(MenuTrigger, null,
|
|
55
|
+
React.createElement(Button, null, "Mutable Menu")),
|
|
56
|
+
React.createElement(MenuPopover, null,
|
|
57
|
+
React.createElement(MenuList, null, data)))),
|
|
58
|
+
React.createElement(Menu, null,
|
|
59
|
+
React.createElement(MenuTrigger, null,
|
|
60
|
+
React.createElement(Button, null, "Height: 100")),
|
|
61
|
+
React.createElement(MenuPopover, { maxHeight: 100 },
|
|
62
|
+
React.createElement(MenuList, null,
|
|
63
|
+
React.createElement(MenuItem, null, "MenuItem 1"),
|
|
64
|
+
React.createElement(MenuItem, null, "MenuItem 2"),
|
|
65
|
+
React.createElement(MenuItem, null, "MenuItem 3"),
|
|
66
|
+
React.createElement(MenuItem, null, "MenuItem 4"),
|
|
67
|
+
React.createElement(MenuItem, null, "MenuItem 5"))))));
|
|
68
|
+
};
|
|
69
|
+
//# sourceMappingURL=MenuScrollView.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MenuScrollView.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuScrollView.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuTest.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"MenuTest.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AA0S1B,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,iBAe5B,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { __assign } from "tslib";
|
|
2
|
-
import
|
|
2
|
+
import React from 'react';
|
|
3
3
|
import { ButtonV1 as Button } from '@fluentui/react-native';
|
|
4
4
|
import { Menu, MenuItem, MenuItemCheckbox, MenuItemRadio, MenuTrigger, MenuPopover, MenuList, MenuDivider, } from '@fluentui-react-native/menu';
|
|
5
5
|
import { Stack } from '@fluentui-react-native/stack';
|
|
@@ -8,9 +8,10 @@ import { MENU_TESTPAGE } from './consts';
|
|
|
8
8
|
import { Test } from '../Test';
|
|
9
9
|
import { TextV1 as Text } from '@fluentui-react-native/text';
|
|
10
10
|
import { E2EMenuTest } from './E2EMenuTest';
|
|
11
|
-
import { StyleSheet } from 'react-native';
|
|
12
11
|
import { MenuTriggerHoverCallback, MenuTriggerOnClickCallback } from './MenuTriggerCallbacks';
|
|
13
12
|
import { MenuTriggerChildRef } from './MenuRefs';
|
|
13
|
+
import { StyleSheet } from 'react-native';
|
|
14
|
+
import { MenuScrollView } from './MenuScrollView';
|
|
14
15
|
var MenuDefault = function () {
|
|
15
16
|
return (React.createElement(Stack, { style: stackStyle },
|
|
16
17
|
React.createElement(Menu, null,
|
|
@@ -182,6 +183,10 @@ var menuSections = [
|
|
|
182
183
|
name: 'Menu Submenu',
|
|
183
184
|
component: MenuSubMenu,
|
|
184
185
|
},
|
|
186
|
+
{
|
|
187
|
+
name: 'Menu with ScrollView',
|
|
188
|
+
component: MenuScrollView,
|
|
189
|
+
},
|
|
185
190
|
{
|
|
186
191
|
name: 'Menu Trigger onClick Override',
|
|
187
192
|
component: MenuTriggerOnClickCallback,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuTest.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"MenuTest.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MenuScrollView.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAaxC,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,iBAmFlC,CAAC"}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.MenuScrollView = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = (0, tslib_1.__importStar)(require("react"));
|
|
6
|
+
var react_native_1 = require("@fluentui/react-native");
|
|
7
|
+
var menu_1 = require("@fluentui-react-native/menu");
|
|
8
|
+
var stack_1 = require("@fluentui-react-native/stack");
|
|
9
|
+
var styles_1 = require("../Common/styles");
|
|
10
|
+
var react_native_2 = require("react-native");
|
|
11
|
+
var styles_2 = require("../Common/styles");
|
|
12
|
+
var styles = react_native_2.StyleSheet.create({
|
|
13
|
+
menuContainerRow: { flexDirection: 'row' },
|
|
14
|
+
menuMargin: { marginRight: 20 },
|
|
15
|
+
});
|
|
16
|
+
var MenuScrollView = function () {
|
|
17
|
+
var _a = (0, react_1.useState)([
|
|
18
|
+
react_1.default.createElement(menu_1.MenuItem, { key: 1 }, "MenuItem 1"),
|
|
19
|
+
react_1.default.createElement(menu_1.MenuItem, { key: 2 }, "MenuItem 2"),
|
|
20
|
+
react_1.default.createElement(menu_1.MenuItem, { key: 3 }, "MenuItem 3"),
|
|
21
|
+
react_1.default.createElement(menu_1.MenuItem, { key: 4 }, "MenuItem 4"),
|
|
22
|
+
react_1.default.createElement(menu_1.MenuItem, { key: 5 }, "MenuItem 5"),
|
|
23
|
+
]), data = _a[0], setData = _a[1];
|
|
24
|
+
var insertOnClick = react_1.default.useCallback(function () {
|
|
25
|
+
data.push(react_1.default.createElement(menu_1.MenuItem, { key: Math.random() }, "MenuItem"));
|
|
26
|
+
var newList = (0, tslib_1.__spreadArray)([], data, true);
|
|
27
|
+
setData(newList);
|
|
28
|
+
}, [data]);
|
|
29
|
+
var popOnClick = react_1.default.useCallback(function () {
|
|
30
|
+
if (data.length > 0) {
|
|
31
|
+
data.pop();
|
|
32
|
+
var newList = (0, tslib_1.__spreadArray)([], data, true);
|
|
33
|
+
setData(newList);
|
|
34
|
+
}
|
|
35
|
+
}, [data]);
|
|
36
|
+
var _b = (0, react_1.useState)(800), maxHeight = _b[0], setMaxHeight = _b[1];
|
|
37
|
+
var menuItems = [];
|
|
38
|
+
for (var i = 0; i < 40; i++) {
|
|
39
|
+
menuItems.push(react_1.default.createElement(menu_1.MenuItem, { key: i },
|
|
40
|
+
"MenuItem ",
|
|
41
|
+
i));
|
|
42
|
+
}
|
|
43
|
+
return (react_1.default.createElement(stack_1.Stack, { style: styles_1.stackStyle },
|
|
44
|
+
react_1.default.createElement(react_native_2.View, { style: styles.menuContainerRow },
|
|
45
|
+
react_1.default.createElement(react_native_2.TextInput, { accessibilityLabel: "Max height for menu", style: [styles_2.commonTestStyles.textBox, styles.menuMargin], placeholder: "Max height for menu", blurOnSubmit: true, onSubmitEditing: function (e) {
|
|
46
|
+
setMaxHeight(parseInt(e.nativeEvent.text));
|
|
47
|
+
} }),
|
|
48
|
+
react_1.default.createElement(menu_1.Menu, null,
|
|
49
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
50
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Custom height")),
|
|
51
|
+
react_1.default.createElement(menu_1.MenuPopover, { maxHeight: maxHeight },
|
|
52
|
+
react_1.default.createElement(menu_1.MenuList, null, menuItems)))),
|
|
53
|
+
react_1.default.createElement(react_native_2.View, { style: styles.menuContainerRow },
|
|
54
|
+
react_1.default.createElement(react_native_1.ButtonV1, { appearance: "subtle", onClick: insertOnClick }, "Add new menu item"),
|
|
55
|
+
react_1.default.createElement(react_native_1.ButtonV1, { appearance: "subtle", onClick: popOnClick }, "Remove last menu item"),
|
|
56
|
+
react_1.default.createElement(menu_1.Menu, null,
|
|
57
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
58
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Mutable Menu")),
|
|
59
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
60
|
+
react_1.default.createElement(menu_1.MenuList, null, data)))),
|
|
61
|
+
react_1.default.createElement(menu_1.Menu, null,
|
|
62
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
63
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Height: 100")),
|
|
64
|
+
react_1.default.createElement(menu_1.MenuPopover, { maxHeight: 100 },
|
|
65
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
66
|
+
react_1.default.createElement(menu_1.MenuItem, null, "MenuItem 1"),
|
|
67
|
+
react_1.default.createElement(menu_1.MenuItem, null, "MenuItem 2"),
|
|
68
|
+
react_1.default.createElement(menu_1.MenuItem, null, "MenuItem 3"),
|
|
69
|
+
react_1.default.createElement(menu_1.MenuItem, null, "MenuItem 4"),
|
|
70
|
+
react_1.default.createElement(menu_1.MenuItem, null, "MenuItem 5"))))));
|
|
71
|
+
};
|
|
72
|
+
exports.MenuScrollView = MenuScrollView;
|
|
73
|
+
//# sourceMappingURL=MenuScrollView.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MenuScrollView.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuScrollView.tsx"],"names":[],"mappings":";;;;AAAA,0DAAwC;AACxC,uDAA4D;AAC5D,oDAAiG;AACjG,sDAAqD;AACrD,2CAA8C;AAC9C,6CAA2D;AAC3D,2CAAoE;AAEpE,IAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,gBAAgB,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE;IAC1C,UAAU,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE;CAChC,CAAC,CAAC;AAEI,IAAM,cAAc,GAA4B;IAC/C,IAAA,KAAkB,IAAA,gBAAQ,EAAC;QAC/B,8BAAC,eAAQ,IAAC,GAAG,EAAE,CAAC,iBAAuB;QACvC,8BAAC,eAAQ,IAAC,GAAG,EAAE,CAAC,iBAAuB;QACvC,8BAAC,eAAQ,IAAC,GAAG,EAAE,CAAC,iBAAuB;QACvC,8BAAC,eAAQ,IAAC,GAAG,EAAE,CAAC,iBAAuB;QACvC,8BAAC,eAAQ,IAAC,GAAG,EAAE,CAAC,iBAAuB;KACxC,CAAC,EANK,IAAI,QAAA,EAAE,OAAO,QAMlB,CAAC;IAEH,IAAM,aAAa,GAAG,eAAK,CAAC,WAAW,CAAC;QACtC,IAAI,CAAC,IAAI,CAAC,8BAAC,eAAQ,IAAC,GAAG,EAAE,IAAI,CAAC,MAAM,EAAE,eAAqB,CAAC,CAAC;QAC7D,IAAM,OAAO,kCAAO,IAAI,OAAC,CAAC;QAC1B,OAAO,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAM,UAAU,GAAG,eAAK,CAAC,WAAW,CAAC;QACnC,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;YACnB,IAAI,CAAC,GAAG,EAAE,CAAC;YACX,IAAM,OAAO,kCAAO,IAAI,OAAC,CAAC;YAC1B,OAAO,CAAC,OAAO,CAAC,CAAC;SAClB;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEL,IAAA,KAA4B,IAAA,gBAAQ,EAAS,GAAG,CAAC,EAAhD,SAAS,QAAA,EAAE,YAAY,QAAyB,CAAC;IACxD,IAAM,SAAS,GAAG,EAAE,CAAC;IAErB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,EAAE,EAAE;QAC3B,SAAS,CAAC,IAAI,CAAC,8BAAC,eAAQ,IAAC,GAAG,EAAE,CAAC;;YAAY,CAAC,CAAY,CAAC,CAAC;KAC3D;IAED,OAAO,CACL,8BAAC,aAAK,IAAC,KAAK,EAAE,mBAAU;QACtB,8BAAC,mBAAI,IAAC,KAAK,EAAE,MAAM,CAAC,gBAAgB;YAClC,8BAAC,wBAAS,IACR,kBAAkB,EAAC,qBAAqB,EACxC,KAAK,EAAE,CAAC,yBAAY,CAAC,OAAO,EAAE,MAAM,CAAC,UAAU,CAAC,EAChD,WAAW,EAAC,qBAAqB,EACjC,YAAY,EAAE,IAAI,EAClB,eAAe,EAAE,UAAC,CAAC;oBACjB,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC;gBAC7C,CAAC,GACD;YACF,8BAAC,WAAI;gBACH,8BAAC,kBAAW;oBACV,8BAAC,uBAAM,wBAAuB,CAClB;gBACd,8BAAC,kBAAW,IAAC,SAAS,EAAE,SAAS;oBAC/B,8BAAC,eAAQ,QAAE,SAAS,CAAY,CACpB,CACT,CACF;QACP,8BAAC,mBAAI,IAAC,KAAK,EAAE,MAAM,CAAC,gBAAgB;YAClC,8BAAC,uBAAM,IAAC,UAAU,EAAC,QAAQ,EAAC,OAAO,EAAE,aAAa,wBAEzC;YACT,8BAAC,uBAAM,IAAC,UAAU,EAAC,QAAQ,EAAC,OAAO,EAAE,UAAU,4BAEtC;YACT,8BAAC,WAAI;gBACH,8BAAC,kBAAW;oBACV,8BAAC,uBAAM,uBAAsB,CACjB;gBACd,8BAAC,kBAAW;oBACV,8BAAC,eAAQ,QAAE,IAAI,CAAY,CACf,CACT,CACF;QACP,8BAAC,WAAI;YACH,8BAAC,kBAAW;gBACV,8BAAC,uBAAM,sBAAqB,CAChB;YACd,8BAAC,kBAAW,IAAC,SAAS,EAAE,GAAG;gBACzB,8BAAC,eAAQ;oBACP,8BAAC,eAAQ,qBAAsB;oBAC/B,8BAAC,eAAQ,qBAAsB;oBAC/B,8BAAC,eAAQ,qBAAsB;oBAC/B,8BAAC,eAAQ,qBAAsB;oBAC/B,8BAAC,eAAQ,qBAAsB,CACtB,CACC,CACT,CACD,CACT,CAAC;AACJ,CAAC,CAAC;AAnFW,QAAA,cAAc,kBAmFzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuTest.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"MenuTest.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AA0S1B,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,iBAe5B,CAAC"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.MenuTest = void 0;
|
|
4
4
|
var tslib_1 = require("tslib");
|
|
5
|
-
var
|
|
5
|
+
var react_1 = (0, tslib_1.__importDefault)(require("react"));
|
|
6
6
|
var react_native_1 = require("@fluentui/react-native");
|
|
7
7
|
var menu_1 = require("@fluentui-react-native/menu");
|
|
8
8
|
var stack_1 = require("@fluentui-react-native/stack");
|
|
@@ -11,111 +11,112 @@ var consts_1 = require("./consts");
|
|
|
11
11
|
var Test_1 = require("../Test");
|
|
12
12
|
var text_1 = require("@fluentui-react-native/text");
|
|
13
13
|
var E2EMenuTest_1 = require("./E2EMenuTest");
|
|
14
|
-
var react_native_2 = require("react-native");
|
|
15
14
|
var MenuTriggerCallbacks_1 = require("./MenuTriggerCallbacks");
|
|
16
15
|
var MenuRefs_1 = require("./MenuRefs");
|
|
16
|
+
var react_native_2 = require("react-native");
|
|
17
|
+
var MenuScrollView_1 = require("./MenuScrollView");
|
|
17
18
|
var MenuDefault = function () {
|
|
18
|
-
return (
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
19
|
+
return (react_1.default.createElement(stack_1.Stack, { style: styles_1.stackStyle },
|
|
20
|
+
react_1.default.createElement(menu_1.Menu, null,
|
|
21
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
22
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Test")),
|
|
23
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
24
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
25
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A plain MenuItem"),
|
|
26
|
+
react_1.default.createElement(menu_1.MenuItem, { disabled: true }, "A second disabled plain MenuItem"),
|
|
27
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A third plain MenuItem"))))));
|
|
27
28
|
};
|
|
28
29
|
var defaultCheckedTestCase = ['itemOne'];
|
|
29
30
|
var checkedTestCase = ['itemTwo'];
|
|
30
31
|
var MenuCheckmarks = function () {
|
|
31
|
-
return (
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
32
|
+
return (react_1.default.createElement(stack_1.Stack, { style: styles_1.stackStyle },
|
|
33
|
+
react_1.default.createElement(menu_1.Menu, { defaultChecked: defaultCheckedTestCase },
|
|
34
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
35
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "All checkmark items")),
|
|
36
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
37
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
38
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { name: "itemOne" }, "A MenuItem with checkmark"),
|
|
39
|
+
react_1.default.createElement(menu_1.MenuDivider, null),
|
|
40
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { name: "itemTwo" }, "Another MenuItem with checkmark")))),
|
|
41
|
+
react_1.default.createElement(menu_1.Menu, { hasCheckmarks: true, checked: checkedTestCase },
|
|
42
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
43
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Some controlled checkmark items with alignment")),
|
|
44
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
45
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
46
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A plain MenuItem"),
|
|
47
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { name: "itemTwo" }, "A MenuItem with checkmark"),
|
|
48
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { disabled: true, name: "itemThree" }, "A disabled MenuItem with checkmark"),
|
|
49
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { name: "itemFour" }, "A MenuItem with checkmark")))),
|
|
50
|
+
react_1.default.createElement(menu_1.Menu, null,
|
|
51
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
52
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Some checkmark items without alignment")),
|
|
53
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
54
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
55
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A plain MenuItem"),
|
|
56
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { name: "itemTwo" }, "A MenuItem with checkmark"),
|
|
57
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { name: "itemThree" }, "A MenuItem with checkmark"))))));
|
|
57
58
|
};
|
|
58
59
|
var MenuRadioItem = function () {
|
|
59
|
-
var _a =
|
|
60
|
-
var onCheckedChange =
|
|
60
|
+
var _a = react_1.default.useState(['itemOne']), checked = _a[0], setChecked = _a[1];
|
|
61
|
+
var onCheckedChange = react_1.default.useCallback(function (_e, checkedChange) {
|
|
61
62
|
setChecked(checkedChange);
|
|
62
63
|
}, [setChecked]);
|
|
63
|
-
return (
|
|
64
|
-
|
|
64
|
+
return (react_1.default.createElement(stack_1.Stack, { style: styles_1.stackStyle },
|
|
65
|
+
react_1.default.createElement(text_1.TextV1, null,
|
|
65
66
|
"Current checked: ",
|
|
66
67
|
checked.join(' ')),
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
68
|
+
react_1.default.createElement(menu_1.Menu, { defaultChecked: defaultCheckedTestCase, onCheckedChange: onCheckedChange },
|
|
69
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
70
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Items with radio selection")),
|
|
71
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
72
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
73
|
+
react_1.default.createElement(menu_1.MenuItemRadio, { name: "itemOne" }, "A MenuItem with checkmark and radio selection"),
|
|
74
|
+
react_1.default.createElement(menu_1.MenuItemRadio, { name: "itemTwo" }, "Another MenuItem with checkmark and radio selection"),
|
|
75
|
+
react_1.default.createElement(menu_1.MenuItemRadio, { name: "itemThree" }, "A third MenuItem with checkmark and radio selection"),
|
|
76
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { name: "itemFour" }, "A MenuItem with checkmark and toggle selection"))))));
|
|
76
77
|
};
|
|
77
78
|
var Submenu = function () {
|
|
78
|
-
return (
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
79
|
+
return (react_1.default.createElement(menu_1.Menu, null,
|
|
80
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
81
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A second MenuItem")),
|
|
82
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
83
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
84
|
+
react_1.default.createElement(menu_1.MenuItemCheckbox, { name: 'a' }, "A nested MenuItemCheckbox"),
|
|
85
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A nested MenuItem"),
|
|
86
|
+
react_1.default.createElement(Submenu, null)))));
|
|
86
87
|
};
|
|
87
88
|
var MenuSubMenu = function () {
|
|
88
|
-
return (
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
89
|
+
return (react_1.default.createElement(stack_1.Stack, { style: styles_1.stackStyle },
|
|
90
|
+
react_1.default.createElement(menu_1.Menu, null,
|
|
91
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
92
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Test")),
|
|
93
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
94
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
95
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A MenuItem"),
|
|
96
|
+
react_1.default.createElement(Submenu, null))))));
|
|
96
97
|
};
|
|
97
98
|
var MenuOpenOnHover = function () {
|
|
98
|
-
return (
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
99
|
+
return (react_1.default.createElement(stack_1.Stack, { style: styles_1.stackStyle },
|
|
100
|
+
react_1.default.createElement(menu_1.Menu, { openOnHover: true },
|
|
101
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
102
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Test")),
|
|
103
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
104
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
105
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A MenuItem"),
|
|
106
|
+
react_1.default.createElement(Submenu, null))))));
|
|
106
107
|
};
|
|
107
108
|
var rootStackStyle = react_native_2.StyleSheet.create({ root: (0, tslib_1.__assign)((0, tslib_1.__assign)({}, styles_1.stackStyle), { flexDirection: 'row' }) });
|
|
108
109
|
var MenuControlledOpen = function () {
|
|
109
|
-
var _a =
|
|
110
|
-
return (
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
110
|
+
var _a = react_1.default.useState(false), open = _a[0], setOpen = _a[1];
|
|
111
|
+
return (react_1.default.createElement(stack_1.Stack, { style: rootStackStyle.root },
|
|
112
|
+
react_1.default.createElement(react_native_1.ButtonV1, { onClick: function () { return setOpen(!open); } }, "Toggle open"),
|
|
113
|
+
react_1.default.createElement(menu_1.Menu, { open: open },
|
|
114
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
115
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Test")),
|
|
116
|
+
react_1.default.createElement(menu_1.MenuPopover, null,
|
|
117
|
+
react_1.default.createElement(menu_1.MenuList, null,
|
|
118
|
+
react_1.default.createElement(menu_1.MenuItem, null, "A MenuItem"),
|
|
119
|
+
react_1.default.createElement(Submenu, null))))));
|
|
119
120
|
};
|
|
120
121
|
var CustomMenuPopover = menu_1.MenuPopover.customize({ borderWidth: 4, borderColor: 'blue' });
|
|
121
122
|
var CustomMenuList = menu_1.MenuList.customize({ gap: 5, padding: 6, backgroundColor: 'pink' });
|
|
@@ -148,16 +149,16 @@ var CustomMenuDivider = menu_1.MenuDivider.customize({
|
|
|
148
149
|
backgroundColor: 'purple',
|
|
149
150
|
});
|
|
150
151
|
var MenuCustomized = function () {
|
|
151
|
-
return (
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
152
|
+
return (react_1.default.createElement(stack_1.Stack, { style: styles_1.stackStyle },
|
|
153
|
+
react_1.default.createElement(menu_1.Menu, null,
|
|
154
|
+
react_1.default.createElement(menu_1.MenuTrigger, null,
|
|
155
|
+
react_1.default.createElement(react_native_1.ButtonV1, null, "Test")),
|
|
156
|
+
react_1.default.createElement(CustomMenuPopover, null,
|
|
157
|
+
react_1.default.createElement(CustomMenuList, null,
|
|
158
|
+
react_1.default.createElement(CustomMenuItem, null, "A MenuItem"),
|
|
159
|
+
react_1.default.createElement(CustomMenuItem, null, "A MenuItem"),
|
|
160
|
+
react_1.default.createElement(CustomMenuDivider, null),
|
|
161
|
+
react_1.default.createElement(CustomMenuCheckmark, { name: 'custom' }, "A MenuItem"))))));
|
|
161
162
|
};
|
|
162
163
|
var menuSections = [
|
|
163
164
|
{
|
|
@@ -185,6 +186,10 @@ var menuSections = [
|
|
|
185
186
|
name: 'Menu Submenu',
|
|
186
187
|
component: MenuSubMenu,
|
|
187
188
|
},
|
|
189
|
+
{
|
|
190
|
+
name: 'Menu with ScrollView',
|
|
191
|
+
component: MenuScrollView_1.MenuScrollView,
|
|
192
|
+
},
|
|
188
193
|
{
|
|
189
194
|
name: 'Menu Trigger onClick Override',
|
|
190
195
|
component: MenuTriggerCallbacks_1.MenuTriggerOnClickCallback,
|
|
@@ -216,7 +221,7 @@ var MenuTest = function () {
|
|
|
216
221
|
};
|
|
217
222
|
var description = 'A Menu is an component that displays a list of options on a temporary surface. They are invoked when users interact with a button, action, or other control.';
|
|
218
223
|
var spec = 'https://github.com/microsoft/fluentui-react-native/blob/main/packages/components/Menu/SPEC.md';
|
|
219
|
-
return
|
|
224
|
+
return react_1.default.createElement(Test_1.Test, { name: "Menu Test", description: description, spec: spec, sections: menuSections, status: status });
|
|
220
225
|
};
|
|
221
226
|
exports.MenuTest = MenuTest;
|
|
222
227
|
//# sourceMappingURL=MenuTest.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuTest.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":";;;;AAAA,
|
|
1
|
+
{"version":3,"file":"MenuTest.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-react-native/tester",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.121.0",
|
|
4
4
|
"description": "A test app to test FluentUI React Native Components during development",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Microsoft <fluentuinativeowners@microsoft.com>",
|
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
"@fluentui-react-native/framework": ">=0.8.26 <1.0.0",
|
|
58
58
|
"@fluentui-react-native/icon": "0.16.3",
|
|
59
59
|
"@fluentui-react-native/interactive-hooks": ">=0.22.1 <1.0.0",
|
|
60
|
-
"@fluentui-react-native/menu": "^1.
|
|
60
|
+
"@fluentui-react-native/menu": "^1.2.0",
|
|
61
61
|
"@fluentui-react-native/merge-props": ">=0.5.1 <1.0.0",
|
|
62
62
|
"@fluentui-react-native/notification": "0.21.1",
|
|
63
63
|
"@fluentui-react-native/stack": ">=0.7.32 <1.0.0",
|
|
@@ -69,7 +69,7 @@
|
|
|
69
69
|
"@fluentui-react-native/themed-stylesheet": "^1.4.1",
|
|
70
70
|
"@fluentui-react-native/theming-utils": ">=0.20.1 <1.0.0",
|
|
71
71
|
"@fluentui-react-native/win32-theme": ">=0.24.4 <1.0.0",
|
|
72
|
-
"@fluentui/react-native": ">=0.34.
|
|
72
|
+
"@fluentui/react-native": ">=0.34.4 <1.0.0",
|
|
73
73
|
"@fortawesome/fontawesome-svg-core": "^6.2.0",
|
|
74
74
|
"@fortawesome/free-solid-svg-icons": "^6.2.0",
|
|
75
75
|
"@fortawesome/react-native-fontawesome": "^0.3.0",
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import React, { useState } from 'react';
|
|
2
|
+
import { ButtonV1 as Button } from '@fluentui/react-native';
|
|
3
|
+
import { Menu, MenuItem, MenuTrigger, MenuPopover, MenuList } from '@fluentui-react-native/menu';
|
|
4
|
+
import { Stack } from '@fluentui-react-native/stack';
|
|
5
|
+
import { stackStyle } from '../Common/styles';
|
|
6
|
+
import { TextInput, StyleSheet, View } from 'react-native';
|
|
7
|
+
import { commonTestStyles as commonStyles } from '../Common/styles';
|
|
8
|
+
|
|
9
|
+
const styles = StyleSheet.create({
|
|
10
|
+
menuContainerRow: { flexDirection: 'row' },
|
|
11
|
+
menuMargin: { marginRight: 20 },
|
|
12
|
+
});
|
|
13
|
+
|
|
14
|
+
export const MenuScrollView: React.FunctionComponent = () => {
|
|
15
|
+
const [data, setData] = useState([
|
|
16
|
+
<MenuItem key={1}>MenuItem 1</MenuItem>,
|
|
17
|
+
<MenuItem key={2}>MenuItem 2</MenuItem>,
|
|
18
|
+
<MenuItem key={3}>MenuItem 3</MenuItem>,
|
|
19
|
+
<MenuItem key={4}>MenuItem 4</MenuItem>,
|
|
20
|
+
<MenuItem key={5}>MenuItem 5</MenuItem>,
|
|
21
|
+
]);
|
|
22
|
+
|
|
23
|
+
const insertOnClick = React.useCallback(() => {
|
|
24
|
+
data.push(<MenuItem key={Math.random()}>MenuItem</MenuItem>);
|
|
25
|
+
const newList = [...data];
|
|
26
|
+
setData(newList);
|
|
27
|
+
}, [data]);
|
|
28
|
+
|
|
29
|
+
const popOnClick = React.useCallback(() => {
|
|
30
|
+
if (data.length > 0) {
|
|
31
|
+
data.pop();
|
|
32
|
+
const newList = [...data];
|
|
33
|
+
setData(newList);
|
|
34
|
+
}
|
|
35
|
+
}, [data]);
|
|
36
|
+
|
|
37
|
+
const [maxHeight, setMaxHeight] = useState<number>(800);
|
|
38
|
+
const menuItems = [];
|
|
39
|
+
|
|
40
|
+
for (let i = 0; i < 40; i++) {
|
|
41
|
+
menuItems.push(<MenuItem key={i}>MenuItem {i}</MenuItem>);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
return (
|
|
45
|
+
<Stack style={stackStyle}>
|
|
46
|
+
<View style={styles.menuContainerRow}>
|
|
47
|
+
<TextInput
|
|
48
|
+
accessibilityLabel="Max height for menu"
|
|
49
|
+
style={[commonStyles.textBox, styles.menuMargin]}
|
|
50
|
+
placeholder="Max height for menu"
|
|
51
|
+
blurOnSubmit={true}
|
|
52
|
+
onSubmitEditing={(e) => {
|
|
53
|
+
setMaxHeight(parseInt(e.nativeEvent.text));
|
|
54
|
+
}}
|
|
55
|
+
/>
|
|
56
|
+
<Menu>
|
|
57
|
+
<MenuTrigger>
|
|
58
|
+
<Button>Custom height</Button>
|
|
59
|
+
</MenuTrigger>
|
|
60
|
+
<MenuPopover maxHeight={maxHeight}>
|
|
61
|
+
<MenuList>{menuItems}</MenuList>
|
|
62
|
+
</MenuPopover>
|
|
63
|
+
</Menu>
|
|
64
|
+
</View>
|
|
65
|
+
<View style={styles.menuContainerRow}>
|
|
66
|
+
<Button appearance="subtle" onClick={insertOnClick}>
|
|
67
|
+
Add new menu item
|
|
68
|
+
</Button>
|
|
69
|
+
<Button appearance="subtle" onClick={popOnClick}>
|
|
70
|
+
Remove last menu item
|
|
71
|
+
</Button>
|
|
72
|
+
<Menu>
|
|
73
|
+
<MenuTrigger>
|
|
74
|
+
<Button>Mutable Menu</Button>
|
|
75
|
+
</MenuTrigger>
|
|
76
|
+
<MenuPopover>
|
|
77
|
+
<MenuList>{data}</MenuList>
|
|
78
|
+
</MenuPopover>
|
|
79
|
+
</Menu>
|
|
80
|
+
</View>
|
|
81
|
+
<Menu>
|
|
82
|
+
<MenuTrigger>
|
|
83
|
+
<Button>Height: 100</Button>
|
|
84
|
+
</MenuTrigger>
|
|
85
|
+
<MenuPopover maxHeight={100}>
|
|
86
|
+
<MenuList>
|
|
87
|
+
<MenuItem>MenuItem 1</MenuItem>
|
|
88
|
+
<MenuItem>MenuItem 2</MenuItem>
|
|
89
|
+
<MenuItem>MenuItem 3</MenuItem>
|
|
90
|
+
<MenuItem>MenuItem 4</MenuItem>
|
|
91
|
+
<MenuItem>MenuItem 5</MenuItem>
|
|
92
|
+
</MenuList>
|
|
93
|
+
</MenuPopover>
|
|
94
|
+
</Menu>
|
|
95
|
+
</Stack>
|
|
96
|
+
);
|
|
97
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { ButtonV1 as Button } from '@fluentui/react-native';
|
|
3
3
|
import {
|
|
4
4
|
Menu,
|
|
@@ -16,9 +16,10 @@ import { MENU_TESTPAGE } from './consts';
|
|
|
16
16
|
import { Test, TestSection, PlatformStatus } from '../Test';
|
|
17
17
|
import { TextV1 as Text } from '@fluentui-react-native/text';
|
|
18
18
|
import { E2EMenuTest } from './E2EMenuTest';
|
|
19
|
-
import { StyleSheet } from 'react-native';
|
|
20
19
|
import { MenuTriggerHoverCallback, MenuTriggerOnClickCallback } from './MenuTriggerCallbacks';
|
|
21
20
|
import { MenuTriggerChildRef } from './MenuRefs';
|
|
21
|
+
import { StyleSheet } from 'react-native';
|
|
22
|
+
import { MenuScrollView } from './MenuScrollView';
|
|
22
23
|
|
|
23
24
|
const MenuDefault: React.FunctionComponent = () => {
|
|
24
25
|
return (
|
|
@@ -269,6 +270,10 @@ const menuSections: TestSection[] = [
|
|
|
269
270
|
name: 'Menu Submenu',
|
|
270
271
|
component: MenuSubMenu,
|
|
271
272
|
},
|
|
273
|
+
{
|
|
274
|
+
name: 'Menu with ScrollView',
|
|
275
|
+
component: MenuScrollView,
|
|
276
|
+
},
|
|
272
277
|
{
|
|
273
278
|
name: 'Menu Trigger onClick Override',
|
|
274
279
|
component: MenuTriggerOnClickCallback,
|