@fluentui-react-native/menu 0.14.8 → 0.15.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 +16 -1
- package/CHANGELOG.md +10 -2
- package/lib/MenuItem/MenuItem.d.ts +2 -0
- package/lib/MenuItem/MenuItem.d.ts.map +1 -1
- package/lib/MenuItem/MenuItem.js +18 -6
- package/lib/MenuItem/MenuItem.js.map +1 -1
- package/lib/MenuItem/MenuItem.types.d.ts +0 -1
- package/lib/MenuItem/MenuItem.types.d.ts.map +1 -1
- package/lib/MenuItem/useMenuItem.d.ts.map +1 -1
- package/lib/MenuItem/useMenuItem.js +1 -1
- package/lib/MenuItem/useMenuItem.js.map +1 -1
- package/lib/MenuItemCheckbox/MenuItemCheckbox.d.ts +1 -0
- package/lib/MenuItemCheckbox/MenuItemCheckbox.d.ts.map +1 -1
- package/lib/MenuItemCheckbox/MenuItemCheckbox.js +7 -5
- package/lib/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib/MenuItemCheckbox/MenuItemCheckbox.types.d.ts +0 -1
- package/lib/MenuItemCheckbox/MenuItemCheckbox.types.d.ts.map +1 -1
- package/lib/MenuItemCheckbox/useMenuItemCheckbox.d.ts.map +1 -1
- package/lib/MenuItemCheckbox/useMenuItemCheckbox.js +2 -2
- package/lib/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib/__tests__/Menu.test.js +18 -18
- package/lib/__tests__/Menu.test.js.map +1 -1
- package/lib-commonjs/MenuItem/MenuItem.d.ts +2 -0
- package/lib-commonjs/MenuItem/MenuItem.d.ts.map +1 -1
- package/lib-commonjs/MenuItem/MenuItem.js +17 -5
- package/lib-commonjs/MenuItem/MenuItem.js.map +1 -1
- package/lib-commonjs/MenuItem/MenuItem.types.d.ts +0 -1
- package/lib-commonjs/MenuItem/MenuItem.types.d.ts.map +1 -1
- package/lib-commonjs/MenuItem/useMenuItem.d.ts.map +1 -1
- package/lib-commonjs/MenuItem/useMenuItem.js +1 -1
- package/lib-commonjs/MenuItem/useMenuItem.js.map +1 -1
- package/lib-commonjs/MenuItemCheckbox/MenuItemCheckbox.d.ts +1 -0
- package/lib-commonjs/MenuItemCheckbox/MenuItemCheckbox.d.ts.map +1 -1
- package/lib-commonjs/MenuItemCheckbox/MenuItemCheckbox.js +6 -4
- package/lib-commonjs/MenuItemCheckbox/MenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/MenuItemCheckbox/MenuItemCheckbox.types.d.ts +0 -1
- package/lib-commonjs/MenuItemCheckbox/MenuItemCheckbox.types.d.ts.map +1 -1
- package/lib-commonjs/MenuItemCheckbox/useMenuItemCheckbox.d.ts.map +1 -1
- package/lib-commonjs/MenuItemCheckbox/useMenuItemCheckbox.js +2 -2
- package/lib-commonjs/MenuItemCheckbox/useMenuItemCheckbox.js.map +1 -1
- package/lib-commonjs/__tests__/Menu.test.js +18 -18
- package/lib-commonjs/__tests__/Menu.test.js.map +1 -1
- package/package.json +1 -1
- package/src/MenuItem/MenuItem.tsx +22 -5
- package/src/MenuItem/MenuItem.types.ts +0 -2
- package/src/MenuItem/useMenuItem.ts +0 -1
- package/src/MenuItemCheckbox/MenuItemCheckbox.tsx +8 -4
- package/src/MenuItemCheckbox/MenuItemCheckbox.types.ts +0 -2
- package/src/MenuItemCheckbox/useMenuItemCheckbox.ts +2 -1
- package/src/__tests__/Menu.test.tsx +20 -18
- package/src/__tests__/__snapshots__/Menu.test.tsx.snap +0 -13
- package/SPEC.md +0 -344
|
@@ -10,6 +10,7 @@ var experimental_text_1 = require("@fluentui-react-native/experimental-text");
|
|
|
10
10
|
var MenuItemCheckbox_types_1 = require("./MenuItemCheckbox.types");
|
|
11
11
|
var useMenuItemCheckbox_1 = require("./useMenuItemCheckbox");
|
|
12
12
|
var MenuItemCheckbox_styling_1 = require("./MenuItemCheckbox.styling");
|
|
13
|
+
var MenuItem_1 = require("../MenuItem/MenuItem");
|
|
13
14
|
exports.MenuItemCheckbox = (0, framework_1.compose)((0, tslib_1.__assign)((0, tslib_1.__assign)({ displayName: MenuItemCheckbox_types_1.menuItemCheckboxName }, MenuItemCheckbox_styling_1.stylingSettings), { slots: {
|
|
14
15
|
root: react_native_1.View,
|
|
15
16
|
checkmark: react_native_svg_1.SvgXml,
|
|
@@ -20,12 +21,13 @@ exports.MenuItemCheckbox = (0, framework_1.compose)((0, tslib_1.__assign)((0, ts
|
|
|
20
21
|
return (0, exports.menuItemFinalRender)(menuItem, Slots);
|
|
21
22
|
} }));
|
|
22
23
|
var menuItemFinalRender = function (menuItem, Slots) {
|
|
23
|
-
return function (final) {
|
|
24
|
-
var
|
|
24
|
+
return function (final, children) {
|
|
25
|
+
var _a = (0, framework_1.mergeProps)(menuItem.props, final), accessibilityLabel = _a.accessibilityLabel, mergedProps = (0, tslib_1.__rest)(_a, ["accessibilityLabel"]);
|
|
25
26
|
var checkmarkXml = "\n <svg>\n <path fill='currentColor' d='M9.85355 3.14645C10.0488 3.34171 10.0488 3.65829 9.85355 3.85355L5.35355 8.35355C5.15829 8.54882 4.84171 8.54882 4.64645 8.35355L2.64645 6.35355C2.45118 6.15829 2.45118 5.84171 2.64645 5.64645C2.84171 5.45118 3.15829 5.45118 3.35355 5.64645L5 7.29289L9.14645 3.14645C9.34171 2.95118 9.65829 2.95118 9.85355 3.14645Z' />\n </svg>";
|
|
26
|
-
|
|
27
|
+
var label = (0, MenuItem_1.getAccessibilityLabel)(accessibilityLabel, children[0]);
|
|
28
|
+
return ((0, framework_1.withSlots)(Slots.root, (0, tslib_1.__assign)({}, mergedProps, { accessibilityLabel: label }),
|
|
27
29
|
(0, framework_1.withSlots)(Slots.checkmark, { xml: checkmarkXml }),
|
|
28
|
-
|
|
30
|
+
children && (0, framework_1.withSlots)(Slots.content, null, children)));
|
|
29
31
|
};
|
|
30
32
|
};
|
|
31
33
|
exports.menuItemFinalRender = menuItemFinalRender;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItemCheckbox.js","sourceRoot":"","sources":["../../src/MenuItemCheckbox/MenuItemCheckbox.tsx"],"names":[],"mappings":";;;;AAAA,qBAAqB;AACrB,6CAAoC;AACpC,qDAA0C;AAC1C,8DAAmG;AACnG,8EAAgE;AAChE,mEAMkC;AAClC,6DAA4D;AAC5D,uEAA6D;
|
|
1
|
+
{"version":3,"file":"MenuItemCheckbox.js","sourceRoot":"","sources":["../../src/MenuItemCheckbox/MenuItemCheckbox.tsx"],"names":[],"mappings":";;;;AAAA,qBAAqB;AACrB,6CAAoC;AACpC,qDAA0C;AAC1C,8DAAmG;AACnG,8EAAgE;AAChE,mEAMkC;AAClC,6DAA4D;AAC5D,uEAA6D;AAC7D,iDAA6D;AAGhD,QAAA,gBAAgB,GAAG,IAAA,mBAAO,gDACrC,WAAW,EAAE,6CAAoB,IAC9B,0CAAe,KAClB,KAAK,EAAE;QACL,IAAI,EAAE,mBAAI;QACV,SAAS,EAAE,yBAAM;QACjB,OAAO,EAAE,wBAAI;KACd,EACD,SAAS,EAAE,UAAC,SAAgC,EAAE,QAAwC;QACpF,IAAM,QAAQ,GAAG,IAAA,yCAAmB,EAAC,SAAS,CAAC,CAAC;QAChD,IAAM,KAAK,GAAG,QAAQ,CAAC,SAAS,EAAE,UAAC,KAAK,IAAc,OAAA,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC,EAAzC,CAAyC,CAAC,CAAC;QAEjG,OAAO,IAAA,2BAAmB,EAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IAC9C,CAAC,IACD,CAAC;AAEI,IAAM,mBAAmB,GAAG,UACjC,QAA+B,EAC/B,KAAuC;IAEvC,OAAO,UAAC,KAA4B,EAAE,QAAyB;QAC7D,IAAM,KAAyC,IAAA,sBAAU,EAAC,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC,EAAxE,kBAAkB,wBAAA,EAAK,WAAW,2BAApC,sBAAsC,CAAoC,CAAC;QACjF,IAAM,YAAY,GAAG,6XAGd,CAAC;QAER,IAAM,KAAK,GAAG,IAAA,gCAAqB,EAAC,kBAAkB,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QAErE,OAAO,CACL,2BAAC,KAAK,CAAC,IAAI,4BAAK,WAAW,IAAE,kBAAkB,EAAE,KAAK;YACpD,2BAAC,KAAK,CAAC,SAAS,IAAC,GAAG,EAAE,YAAY,GAAI;YACrC,QAAQ,IAAI,2BAAC,KAAK,CAAC,OAAO,QAAE,QAAQ,CAAiB,CAC3C,CACd,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC,CAAC;AApBW,QAAA,mBAAmB,uBAoB9B"}
|
|
@@ -19,7 +19,6 @@ export interface MenuItemCheckboxTokens extends LayoutTokens, FontTokens, IBorde
|
|
|
19
19
|
pressed?: MenuItemCheckboxTokens;
|
|
20
20
|
}
|
|
21
21
|
export interface MenuItemCheckboxProps extends Omit<IWithPressableOptions<ViewProps>, 'onPress'> {
|
|
22
|
-
content: string;
|
|
23
22
|
/**
|
|
24
23
|
* Applies disabled styles to menu item but remains focusable
|
|
25
24
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItemCheckbox.types.d.ts","sourceRoot":"","sources":["../../src/MenuItemCheckbox/MenuItemCheckbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAC;AAC9G,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAEtG,eAAO,MAAM,oBAAoB,qBAAqB,CAAC;AAEvD,MAAM,WAAW,sBAAuB,SAAQ,YAAY,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY;IACnG,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,QAAQ,CAAC,EAAE,sBAAsB,CAAC;IAClC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,OAAO,CAAC,EAAE,sBAAsB,CAAC;CAClC;AAED,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,qBAAqB,CAAC,SAAS,CAAC,EAAE,SAAS,CAAC;IAC9F
|
|
1
|
+
{"version":3,"file":"MenuItemCheckbox.types.d.ts","sourceRoot":"","sources":["../../src/MenuItemCheckbox/MenuItemCheckbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAC;AAC9G,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAEtG,eAAO,MAAM,oBAAoB,qBAAqB,CAAC;AAEvD,MAAM,WAAW,sBAAuB,SAAQ,YAAY,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY;IACnG,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,QAAQ,CAAC,EAAE,sBAAsB,CAAC;IAClC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,OAAO,CAAC,EAAE,sBAAsB,CAAC;CAClC;AAED,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,qBAAqB,CAAC,SAAS,CAAC,EAAE,SAAS,CAAC;IAC9F;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAE3C;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,qBAAsB,SAAQ,eAAe,CAAC,qBAAqB,GAAG,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC;CAAG;AAE3H,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IACrC,SAAS,CAAC,EAAE,QAAQ,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,qBAAqB,CAAC;IAC7B,MAAM,EAAE,sBAAsB,CAAC;IAC/B,SAAS,EAAE,yBAAyB,CAAC;CACtC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMenuItemCheckbox.d.ts","sourceRoot":"","sources":["../../src/MenuItemCheckbox/useMenuItemCheckbox.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAExF,OAAO,EACL,gBAAgB,EAKjB,MAAM,0CAA0C,CAAC;AAKlD,eAAO,MAAM,mBAAmB,UAAW,qBAAqB,KAAG,qBAgBlE,CAAC;AAUF;;;;;;;GAOG;AACH,eAAO,MAAM,0BAA0B,UAC9B,qBAAqB,sBACR,gBAAgB,KAAK,IAAI,KAC5C,
|
|
1
|
+
{"version":3,"file":"useMenuItemCheckbox.d.ts","sourceRoot":"","sources":["../../src/MenuItemCheckbox/useMenuItemCheckbox.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAExF,OAAO,EACL,gBAAgB,EAKjB,MAAM,0CAA0C,CAAC;AAKlD,eAAO,MAAM,mBAAmB,UAAW,qBAAqB,KAAG,qBAgBlE,CAAC;AAUF;;;;;;;GAOG;AACH,eAAO,MAAM,0BAA0B,UAC9B,qBAAqB,sBACR,gBAAgB,KAAK,IAAI,KAC5C,qBAiEF,CAAC"}
|
|
@@ -40,7 +40,7 @@ function getAccessibilityStateWorker(disabled, checked, accessibilityState) {
|
|
|
40
40
|
var useMenuCheckboxInteraction = function (props, toggleCallback) {
|
|
41
41
|
var _a;
|
|
42
42
|
var defaultComponentRef = React.useRef(null);
|
|
43
|
-
var accessibilityActions = props.accessibilityActions, accessibilityState = props.accessibilityState, _b = props.componentRef, componentRef = _b === void 0 ? defaultComponentRef : _b, disabled = props.disabled, name = props.name, onAccessibilityAction = props.onAccessibilityAction, rest = (0, tslib_1.__rest)(props, ["accessibilityActions", "accessibilityState", "componentRef", "disabled", "name", "onAccessibilityAction"]);
|
|
43
|
+
var accessibilityActions = props.accessibilityActions, accessibilityLabel = props.accessibilityLabel, accessibilityState = props.accessibilityState, _b = props.componentRef, componentRef = _b === void 0 ? defaultComponentRef : _b, disabled = props.disabled, name = props.name, onAccessibilityAction = props.onAccessibilityAction, rest = (0, tslib_1.__rest)(props, ["accessibilityActions", "accessibilityLabel", "accessibilityState", "componentRef", "disabled", "name", "onAccessibilityAction"]);
|
|
44
44
|
var context = (0, menuListContext_1.useMenuListContext)();
|
|
45
45
|
var checked = (_a = context.checked) === null || _a === void 0 ? void 0 : _a[name];
|
|
46
46
|
// Ensure focus is placed on checkbox after click
|
|
@@ -60,7 +60,7 @@ var useMenuCheckboxInteraction = function (props, toggleCallback) {
|
|
|
60
60
|
}, [disabled, toggleCallback, onAccessibilityAction]);
|
|
61
61
|
var state = (0, tslib_1.__assign)((0, tslib_1.__assign)({}, pressable.state), { disabled: !!props.disabled, checked: checked });
|
|
62
62
|
return {
|
|
63
|
-
props: (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({}, pressable.props), { accessible: true, accessibilityActions: accessibilityActionsProp, accessibilityLabel:
|
|
63
|
+
props: (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({}, pressable.props), { accessible: true, accessibilityActions: accessibilityActionsProp, accessibilityLabel: accessibilityLabel, accessibilityRole: 'menuitem', accessibilityState: getAccessibilityState(disabled, state.checked, accessibilityState), enableFocusRing: react_native_1.Platform.select({
|
|
64
64
|
macos: false,
|
|
65
65
|
default: true, // win32
|
|
66
66
|
}), focusable: react_native_1.Platform.select({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMenuItemCheckbox.js","sourceRoot":"","sources":["../../src/MenuItemCheckbox/useMenuItemCheckbox.ts"],"names":[],"mappings":";;;;AAAA,wDAA+B;AAC/B,6CAAsF;AAEtF,8DAA2D;AAC3D,8EAMkD;AAClD,8DAAgE;AAEhE,IAAM,2BAA2B,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;AAElD,IAAM,mBAAmB,GAAG,UAAC,KAA4B;;IACtD,IAAA,QAAQ,GAAW,KAAK,SAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;IACjC,IAAM,OAAO,GAAG,IAAA,oCAAkB,GAAE,CAAC;IACrC,IAAM,OAAO,GAAG,MAAA,OAAO,CAAC,OAAO,0CAAG,IAAI,CAAC,CAAC;IACxC,IAAM,eAAe,GAAG,OAAO,CAAC,eAAe,CAAC;IAEhD,IAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CACrC,UAAC,CAAmB;QAClB,IAAI,CAAC,QAAQ,EAAE;YACb,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,OAAO,CAAC,CAAC;SACpC;IACH,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,eAAe,CAAC,CAC3C,CAAC;IAEF,OAAO,IAAA,kCAA0B,EAAC,KAAK,EAAE,aAAa,CAAC,CAAC;AAC1D,CAAC,CAAC;AAhBW,QAAA,mBAAmB,uBAgB9B;AAEF,IAAM,qBAAqB,GAAG,IAAA,mBAAO,EAAC,2BAA2B,CAAC,CAAC;AACnE,SAAS,2BAA2B,CAAC,QAAiB,EAAE,OAAgB,EAAE,kBAAuC;IAC/G,IAAI,kBAAkB,EAAE;QACtB,+BAAS,QAAQ,UAAA,EAAE,OAAO,SAAA,IAAK,kBAAkB,EAAG;KACrD;IACD,OAAO,EAAE,QAAQ,UAAA,EAAE,OAAO,SAAA,EAAE,CAAC;AAC/B,CAAC;AAED;;;;;;;GAOG;AACI,IAAM,0BAA0B,GAAG,UACxC,KAA4B,EAC5B,cAA6C;;IAE7C,IAAM,mBAAmB,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAE7C,IAAA,oBAAoB,
|
|
1
|
+
{"version":3,"file":"useMenuItemCheckbox.js","sourceRoot":"","sources":["../../src/MenuItemCheckbox/useMenuItemCheckbox.ts"],"names":[],"mappings":"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"}
|
|
@@ -21,7 +21,7 @@ describe('Checkbox component tests', function () {
|
|
|
21
21
|
React.createElement(button_1.ButtonV1, null, "Default")),
|
|
22
22
|
React.createElement(MenuPopover_1.default, null,
|
|
23
23
|
React.createElement(MenuList_1.MenuList, null,
|
|
24
|
-
React.createElement(MenuItem_1.MenuItem,
|
|
24
|
+
React.createElement(MenuItem_1.MenuItem, null, "Option 1")))))
|
|
25
25
|
.toJSON();
|
|
26
26
|
expect(tree).toMatchSnapshot();
|
|
27
27
|
});
|
|
@@ -32,7 +32,7 @@ describe('Checkbox component tests', function () {
|
|
|
32
32
|
React.createElement(button_1.ButtonV1, null, "Open")),
|
|
33
33
|
React.createElement(MenuPopover_1.default, null,
|
|
34
34
|
React.createElement(MenuList_1.MenuList, null,
|
|
35
|
-
React.createElement(MenuItem_1.MenuItem,
|
|
35
|
+
React.createElement(MenuItem_1.MenuItem, null, "Option 1")))))
|
|
36
36
|
.toJSON();
|
|
37
37
|
expect(tree).toMatchSnapshot();
|
|
38
38
|
});
|
|
@@ -43,8 +43,8 @@ describe('Checkbox component tests', function () {
|
|
|
43
43
|
React.createElement(button_1.ButtonV1, null, "Open")),
|
|
44
44
|
React.createElement(MenuPopover_1.default, null,
|
|
45
45
|
React.createElement(MenuList_1.MenuList, null,
|
|
46
|
-
React.createElement(MenuItem_1.MenuItem,
|
|
47
|
-
React.createElement(MenuItem_1.MenuItem, { disabled: true,
|
|
46
|
+
React.createElement(MenuItem_1.MenuItem, null, "Option 1"),
|
|
47
|
+
React.createElement(MenuItem_1.MenuItem, { disabled: true }, "Option 2")))))
|
|
48
48
|
.toJSON();
|
|
49
49
|
expect(tree).toMatchSnapshot();
|
|
50
50
|
});
|
|
@@ -55,9 +55,9 @@ describe('Checkbox component tests', function () {
|
|
|
55
55
|
React.createElement(button_1.ButtonV1, null, "Open")),
|
|
56
56
|
React.createElement(MenuPopover_1.default, null,
|
|
57
57
|
React.createElement(MenuList_1.MenuList, null,
|
|
58
|
-
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, {
|
|
58
|
+
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 1" }, "Option 1"),
|
|
59
59
|
React.createElement(MenuDivider_1.MenuDivider, null),
|
|
60
|
-
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { disabled: true,
|
|
60
|
+
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { disabled: true, name: "Option 2" }, "Option 2")))))
|
|
61
61
|
.toJSON();
|
|
62
62
|
expect(tree).toMatchSnapshot();
|
|
63
63
|
});
|
|
@@ -68,8 +68,8 @@ describe('Checkbox component tests', function () {
|
|
|
68
68
|
React.createElement(button_1.ButtonV1, null, "Open")),
|
|
69
69
|
React.createElement(MenuPopover_1.default, null,
|
|
70
70
|
React.createElement(MenuList_1.MenuList, null,
|
|
71
|
-
React.createElement(MenuItemRadio_1.MenuItemRadio, {
|
|
72
|
-
React.createElement(MenuItemRadio_1.MenuItemRadio, {
|
|
71
|
+
React.createElement(MenuItemRadio_1.MenuItemRadio, { name: "Option 1" }, "Option 1"),
|
|
72
|
+
React.createElement(MenuItemRadio_1.MenuItemRadio, { name: "Option 2" }, "Option 2")))))
|
|
73
73
|
.toJSON();
|
|
74
74
|
expect(tree).toMatchSnapshot();
|
|
75
75
|
});
|
|
@@ -80,9 +80,9 @@ describe('Checkbox component tests', function () {
|
|
|
80
80
|
React.createElement(button_1.ButtonV1, null, "Open")),
|
|
81
81
|
React.createElement(MenuPopover_1.default, null,
|
|
82
82
|
React.createElement(MenuList_1.MenuList, null,
|
|
83
|
-
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, {
|
|
83
|
+
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 1" }, "Option 1"),
|
|
84
84
|
React.createElement(MenuDivider_1.MenuDivider, null),
|
|
85
|
-
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, {
|
|
85
|
+
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 2" }, "Option 2")))))
|
|
86
86
|
.toJSON();
|
|
87
87
|
expect(tree).toMatchSnapshot();
|
|
88
88
|
});
|
|
@@ -93,9 +93,9 @@ describe('Checkbox component tests', function () {
|
|
|
93
93
|
React.createElement(button_1.ButtonV1, null, "Open")),
|
|
94
94
|
React.createElement(MenuPopover_1.default, null,
|
|
95
95
|
React.createElement(MenuList_1.MenuList, null,
|
|
96
|
-
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, {
|
|
96
|
+
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 1" }, "Option 1"),
|
|
97
97
|
React.createElement(MenuDivider_1.MenuDivider, null),
|
|
98
|
-
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, {
|
|
98
|
+
React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 2" }, "Option 2")))))
|
|
99
99
|
.toJSON();
|
|
100
100
|
expect(tree).toMatchSnapshot();
|
|
101
101
|
});
|
|
@@ -106,13 +106,13 @@ describe('Checkbox component tests', function () {
|
|
|
106
106
|
React.createElement(button_1.ButtonV1, null, "Default")),
|
|
107
107
|
React.createElement(MenuPopover_1.default, null,
|
|
108
108
|
React.createElement(MenuList_1.MenuList, null,
|
|
109
|
-
React.createElement(MenuItem_1.MenuItem,
|
|
109
|
+
React.createElement(MenuItem_1.MenuItem, null, "Option 1"),
|
|
110
110
|
React.createElement(Menu_1.Menu, null,
|
|
111
111
|
React.createElement(MenuTrigger_1.default, null,
|
|
112
|
-
React.createElement(MenuItem_1.MenuItem,
|
|
112
|
+
React.createElement(MenuItem_1.MenuItem, null, "Option 2")),
|
|
113
113
|
React.createElement(MenuPopover_1.default, null,
|
|
114
114
|
React.createElement(MenuList_1.MenuList, null,
|
|
115
|
-
React.createElement(MenuItem_1.MenuItem,
|
|
115
|
+
React.createElement(MenuItem_1.MenuItem, null, "Option 1"))))))))
|
|
116
116
|
.toJSON();
|
|
117
117
|
expect(tree).toMatchSnapshot();
|
|
118
118
|
});
|
|
@@ -124,7 +124,7 @@ describe('Menu rerender tests', function () {
|
|
|
124
124
|
React.createElement(button_1.ButtonV1, null, "Rerender twice")),
|
|
125
125
|
React.createElement(MenuPopover_1.default, null,
|
|
126
126
|
React.createElement(MenuList_1.MenuList, null,
|
|
127
|
-
React.createElement(MenuItem_1.MenuItem,
|
|
127
|
+
React.createElement(MenuItem_1.MenuItem, null, "Option 1"))))); }, 3);
|
|
128
128
|
});
|
|
129
129
|
it('Menu re-renders correctly with style', function () {
|
|
130
130
|
var style = { backgroundColor: 'black' };
|
|
@@ -133,7 +133,7 @@ describe('Menu rerender tests', function () {
|
|
|
133
133
|
React.createElement(button_1.ButtonV1, { style: style }, "Rerender twice")),
|
|
134
134
|
React.createElement(MenuPopover_1.default, null,
|
|
135
135
|
React.createElement(MenuList_1.MenuList, null,
|
|
136
|
-
React.createElement(MenuItem_1.MenuItem,
|
|
136
|
+
React.createElement(MenuItem_1.MenuItem, null, "Option 1"))))); }, 3);
|
|
137
137
|
});
|
|
138
138
|
it('Menu re-renders correctly with accessibilityAction', function () {
|
|
139
139
|
var action = [{ name: 'Expand' }];
|
|
@@ -142,7 +142,7 @@ describe('Menu rerender tests', function () {
|
|
|
142
142
|
React.createElement(button_1.ButtonV1, null, "Rerender twice")),
|
|
143
143
|
React.createElement(MenuPopover_1.default, null,
|
|
144
144
|
React.createElement(MenuList_1.MenuList, null,
|
|
145
|
-
React.createElement(MenuItem_1.MenuItem, { accessibilityActions: action,
|
|
145
|
+
React.createElement(MenuItem_1.MenuItem, { accessibilityActions: action }, "Option 1"))))); }, 3);
|
|
146
146
|
});
|
|
147
147
|
});
|
|
148
148
|
//# sourceMappingURL=Menu.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Menu.test.js","sourceRoot":"","sources":["../../src/__tests__/Menu.test.tsx"],"names":[],"mappings":";;;AAAA,wDAA+B;AAE/B,yEAAgD;AAChD,qCAAoC;AACpC,gEAAkE;AAClE,wFAAqD;AACrD,wDAAmE;AACnE,wFAAqD;AACrD,iDAAgD;AAChD,iDAAgD;AAChD,yEAAwE;AACxE,0DAAyD;AACzD,gEAA+D;AAE/D,QAAQ,CAAC,0BAA0B,EAAE;IACnC,EAAE,CAAC,cAAc,EAAE;QACjB,IAAM,IAAI,GAAG,QAAQ;aAClB,MAAM,CACL,oBAAC,WAAI;YACH,oBAAC,qBAAW;gBACV,oBAAC,iBAAM,kBAAiB,CACZ;YACd,oBAAC,qBAAW;gBACV,oBAAC,mBAAQ;oBACP,oBAAC,mBAAQ,
|
|
1
|
+
{"version":3,"file":"Menu.test.js","sourceRoot":"","sources":["../../src/__tests__/Menu.test.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
/** @jsx withSlots */
|
|
2
2
|
import { I18nManager, View } from 'react-native';
|
|
3
3
|
import { SvgXml } from 'react-native-svg';
|
|
4
|
-
import { compose, mergeProps, UseSlots, withSlots } from '@fluentui-react-native/framework';
|
|
4
|
+
import { compose, memoize, mergeProps, UseSlots, withSlots } from '@fluentui-react-native/framework';
|
|
5
5
|
import { Text } from '@fluentui-react-native/experimental-text';
|
|
6
6
|
import { menuItemName, MenuItemProps, MenuItemType } from './MenuItem.types';
|
|
7
7
|
import { useMenuItem } from './useMenuItem';
|
|
8
8
|
import { stylingSettings } from './MenuItem.styling';
|
|
9
|
+
import React from 'react';
|
|
9
10
|
|
|
10
11
|
export const MenuItem = compose<MenuItemType>({
|
|
11
12
|
displayName: menuItemName,
|
|
@@ -20,8 +21,8 @@ export const MenuItem = compose<MenuItemType>({
|
|
|
20
21
|
const menuItem = useMenuItem(userProps);
|
|
21
22
|
const Slots = useSlots(userProps, (layer): boolean => menuItem.state[layer] || userProps[layer]);
|
|
22
23
|
|
|
23
|
-
return (final: MenuItemProps) => {
|
|
24
|
-
const mergedProps = mergeProps(menuItem.props, final);
|
|
24
|
+
return (final: MenuItemProps, children: React.ReactNode) => {
|
|
25
|
+
const { accessibilityLabel, ...mergedProps } = mergeProps(menuItem.props, final);
|
|
25
26
|
const chevronXml = I18nManager.isRTL
|
|
26
27
|
? `
|
|
27
28
|
<svg>
|
|
@@ -32,13 +33,29 @@ export const MenuItem = compose<MenuItemType>({
|
|
|
32
33
|
<path fill='currentColor' d='M4.64645 2.14645C4.45118 2.34171 4.45118 2.65829 4.64645 2.85355L7.79289 6L4.64645 9.14645C4.45118 9.34171 4.45118 9.65829 4.64645 9.85355C4.84171 10.0488 5.15829 10.0488 5.35355 9.85355L8.85355 6.35355C9.04882 6.15829 9.04882 5.84171 8.85355 5.64645L5.35355 2.14645C5.15829 1.95118 4.84171 1.95118 4.64645 2.14645Z' />
|
|
33
34
|
</svg>`;
|
|
34
35
|
|
|
36
|
+
// We only automatically support the one child string.
|
|
37
|
+
const label = getAccessibilityLabel(accessibilityLabel, children[0]);
|
|
38
|
+
|
|
35
39
|
return (
|
|
36
|
-
<Slots.root {...mergedProps}>
|
|
40
|
+
<Slots.root {...mergedProps} accessibilityLabel={label}>
|
|
37
41
|
{menuItem.hasCheckmarks && <Slots.checkmark />}
|
|
38
|
-
{
|
|
42
|
+
{children && <Slots.content>{children}</Slots.content>}
|
|
39
43
|
{menuItem.hasSubmenu && <Slots.submenuIndicator xml={chevronXml} />}
|
|
40
44
|
</Slots.root>
|
|
41
45
|
);
|
|
42
46
|
};
|
|
43
47
|
},
|
|
44
48
|
});
|
|
49
|
+
|
|
50
|
+
const getAccessibilityLabelWorker = (accessibilityLabel: string, child: React.ReactNode) => {
|
|
51
|
+
if (accessibilityLabel !== undefined) {
|
|
52
|
+
return accessibilityLabel;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
if (typeof child === 'string') {
|
|
56
|
+
return child;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
return '';
|
|
60
|
+
};
|
|
61
|
+
export const getAccessibilityLabel = memoize(getAccessibilityLabelWorker);
|
|
@@ -21,8 +21,6 @@ export interface MenuItemTokens extends LayoutTokens, FontTokens, IBorderTokens,
|
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
export interface MenuItemProps extends Omit<IWithPressableOptions<ViewProps>, 'onPress'> {
|
|
24
|
-
content: string;
|
|
25
|
-
|
|
26
24
|
/**
|
|
27
25
|
* Applies disabled styles to menu item but remains focusable
|
|
28
26
|
*/
|
|
@@ -68,7 +68,6 @@ export const useMenuItem = (props: MenuItemProps): MenuItemState => {
|
|
|
68
68
|
accessible: true,
|
|
69
69
|
accessibilityRole: 'menuitem',
|
|
70
70
|
onAccessibilityTap: props.onAccessibilityTap || onInvoke,
|
|
71
|
-
accessibilityLabel: props.accessibilityLabel || props.content,
|
|
72
71
|
accessibilityState: getAccessibilityState(disabled, accessibilityState),
|
|
73
72
|
enableFocusRing: Platform.select({
|
|
74
73
|
macos: false,
|
|
@@ -12,6 +12,8 @@ import {
|
|
|
12
12
|
} from './MenuItemCheckbox.types';
|
|
13
13
|
import { useMenuItemCheckbox } from './useMenuItemCheckbox';
|
|
14
14
|
import { stylingSettings } from './MenuItemCheckbox.styling';
|
|
15
|
+
import { getAccessibilityLabel } from '../MenuItem/MenuItem';
|
|
16
|
+
import React from 'react';
|
|
15
17
|
|
|
16
18
|
export const MenuItemCheckbox = compose<MenuItemCheckboxType>({
|
|
17
19
|
displayName: menuItemCheckboxName,
|
|
@@ -33,17 +35,19 @@ export const menuItemFinalRender = (
|
|
|
33
35
|
menuItem: MenuItemCheckboxState,
|
|
34
36
|
Slots: Slots<MenuItemCheckboxSlotProps>,
|
|
35
37
|
): React.FunctionComponent<MenuItemCheckboxProps> => {
|
|
36
|
-
return (final: MenuItemCheckboxProps) => {
|
|
37
|
-
const mergedProps = mergeProps(menuItem.props, final);
|
|
38
|
+
return (final: MenuItemCheckboxProps, children: React.ReactNode) => {
|
|
39
|
+
const { accessibilityLabel, ...mergedProps } = mergeProps(menuItem.props, final);
|
|
38
40
|
const checkmarkXml = `
|
|
39
41
|
<svg>
|
|
40
42
|
<path fill='currentColor' d='M9.85355 3.14645C10.0488 3.34171 10.0488 3.65829 9.85355 3.85355L5.35355 8.35355C5.15829 8.54882 4.84171 8.54882 4.64645 8.35355L2.64645 6.35355C2.45118 6.15829 2.45118 5.84171 2.64645 5.64645C2.84171 5.45118 3.15829 5.45118 3.35355 5.64645L5 7.29289L9.14645 3.14645C9.34171 2.95118 9.65829 2.95118 9.85355 3.14645Z' />
|
|
41
43
|
</svg>`;
|
|
42
44
|
|
|
45
|
+
const label = getAccessibilityLabel(accessibilityLabel, children[0]);
|
|
46
|
+
|
|
43
47
|
return (
|
|
44
|
-
<Slots.root {...mergedProps}>
|
|
48
|
+
<Slots.root {...mergedProps} accessibilityLabel={label}>
|
|
45
49
|
<Slots.checkmark xml={checkmarkXml} />
|
|
46
|
-
{
|
|
50
|
+
{children && <Slots.content>{children}</Slots.content>}
|
|
47
51
|
</Slots.root>
|
|
48
52
|
);
|
|
49
53
|
};
|
|
@@ -23,8 +23,6 @@ export interface MenuItemCheckboxTokens extends LayoutTokens, FontTokens, IBorde
|
|
|
23
23
|
}
|
|
24
24
|
|
|
25
25
|
export interface MenuItemCheckboxProps extends Omit<IWithPressableOptions<ViewProps>, 'onPress'> {
|
|
26
|
-
content: string;
|
|
27
|
-
|
|
28
26
|
/**
|
|
29
27
|
* Applies disabled styles to menu item but remains focusable
|
|
30
28
|
*/
|
|
@@ -54,6 +54,7 @@ export const useMenuCheckboxInteraction = (
|
|
|
54
54
|
const defaultComponentRef = React.useRef(null);
|
|
55
55
|
const {
|
|
56
56
|
accessibilityActions,
|
|
57
|
+
accessibilityLabel,
|
|
57
58
|
accessibilityState,
|
|
58
59
|
componentRef = defaultComponentRef,
|
|
59
60
|
disabled,
|
|
@@ -97,7 +98,7 @@ export const useMenuCheckboxInteraction = (
|
|
|
97
98
|
...pressable.props,
|
|
98
99
|
accessible: true,
|
|
99
100
|
accessibilityActions: accessibilityActionsProp,
|
|
100
|
-
accessibilityLabel
|
|
101
|
+
accessibilityLabel,
|
|
101
102
|
accessibilityRole: 'menuitem',
|
|
102
103
|
accessibilityState: getAccessibilityState(disabled, state.checked, accessibilityState),
|
|
103
104
|
enableFocusRing: Platform.select({
|
|
@@ -22,7 +22,7 @@ describe('Checkbox component tests', () => {
|
|
|
22
22
|
</MenuTrigger>
|
|
23
23
|
<MenuPopover>
|
|
24
24
|
<MenuList>
|
|
25
|
-
<MenuItem
|
|
25
|
+
<MenuItem>Option 1</MenuItem>
|
|
26
26
|
</MenuList>
|
|
27
27
|
</MenuPopover>
|
|
28
28
|
</Menu>,
|
|
@@ -40,7 +40,7 @@ describe('Checkbox component tests', () => {
|
|
|
40
40
|
</MenuTrigger>
|
|
41
41
|
<MenuPopover>
|
|
42
42
|
<MenuList>
|
|
43
|
-
<MenuItem
|
|
43
|
+
<MenuItem>Option 1</MenuItem>
|
|
44
44
|
</MenuList>
|
|
45
45
|
</MenuPopover>
|
|
46
46
|
</Menu>,
|
|
@@ -58,8 +58,8 @@ describe('Checkbox component tests', () => {
|
|
|
58
58
|
</MenuTrigger>
|
|
59
59
|
<MenuPopover>
|
|
60
60
|
<MenuList>
|
|
61
|
-
<MenuItem
|
|
62
|
-
<MenuItem disabled
|
|
61
|
+
<MenuItem>Option 1</MenuItem>
|
|
62
|
+
<MenuItem disabled>Option 2</MenuItem>
|
|
63
63
|
</MenuList>
|
|
64
64
|
</MenuPopover>
|
|
65
65
|
</Menu>,
|
|
@@ -77,9 +77,11 @@ describe('Checkbox component tests', () => {
|
|
|
77
77
|
</MenuTrigger>
|
|
78
78
|
<MenuPopover>
|
|
79
79
|
<MenuList>
|
|
80
|
-
<MenuItemCheckbox
|
|
80
|
+
<MenuItemCheckbox name="Option 1">Option 1</MenuItemCheckbox>
|
|
81
81
|
<MenuDivider />
|
|
82
|
-
<MenuItemCheckbox disabled
|
|
82
|
+
<MenuItemCheckbox disabled name="Option 2">
|
|
83
|
+
Option 2
|
|
84
|
+
</MenuItemCheckbox>
|
|
83
85
|
</MenuList>
|
|
84
86
|
</MenuPopover>
|
|
85
87
|
</Menu>,
|
|
@@ -97,8 +99,8 @@ describe('Checkbox component tests', () => {
|
|
|
97
99
|
</MenuTrigger>
|
|
98
100
|
<MenuPopover>
|
|
99
101
|
<MenuList>
|
|
100
|
-
<MenuItemRadio
|
|
101
|
-
<MenuItemRadio
|
|
102
|
+
<MenuItemRadio name="Option 1">Option 1</MenuItemRadio>
|
|
103
|
+
<MenuItemRadio name="Option 2">Option 2</MenuItemRadio>
|
|
102
104
|
</MenuList>
|
|
103
105
|
</MenuPopover>
|
|
104
106
|
</Menu>,
|
|
@@ -116,9 +118,9 @@ describe('Checkbox component tests', () => {
|
|
|
116
118
|
</MenuTrigger>
|
|
117
119
|
<MenuPopover>
|
|
118
120
|
<MenuList>
|
|
119
|
-
<MenuItemCheckbox
|
|
121
|
+
<MenuItemCheckbox name="Option 1">Option 1</MenuItemCheckbox>
|
|
120
122
|
<MenuDivider />
|
|
121
|
-
<MenuItemCheckbox
|
|
123
|
+
<MenuItemCheckbox name="Option 2">Option 2</MenuItemCheckbox>
|
|
122
124
|
</MenuList>
|
|
123
125
|
</MenuPopover>
|
|
124
126
|
</Menu>,
|
|
@@ -136,9 +138,9 @@ describe('Checkbox component tests', () => {
|
|
|
136
138
|
</MenuTrigger>
|
|
137
139
|
<MenuPopover>
|
|
138
140
|
<MenuList>
|
|
139
|
-
<MenuItemCheckbox
|
|
141
|
+
<MenuItemCheckbox name="Option 1">Option 1</MenuItemCheckbox>
|
|
140
142
|
<MenuDivider />
|
|
141
|
-
<MenuItemCheckbox
|
|
143
|
+
<MenuItemCheckbox name="Option 2">Option 2</MenuItemCheckbox>
|
|
142
144
|
</MenuList>
|
|
143
145
|
</MenuPopover>
|
|
144
146
|
</Menu>,
|
|
@@ -156,14 +158,14 @@ describe('Checkbox component tests', () => {
|
|
|
156
158
|
</MenuTrigger>
|
|
157
159
|
<MenuPopover>
|
|
158
160
|
<MenuList>
|
|
159
|
-
<MenuItem
|
|
161
|
+
<MenuItem>Option 1</MenuItem>
|
|
160
162
|
<Menu>
|
|
161
163
|
<MenuTrigger>
|
|
162
|
-
<MenuItem
|
|
164
|
+
<MenuItem>Option 2</MenuItem>
|
|
163
165
|
</MenuTrigger>
|
|
164
166
|
<MenuPopover>
|
|
165
167
|
<MenuList>
|
|
166
|
-
<MenuItem
|
|
168
|
+
<MenuItem>Option 1</MenuItem>
|
|
167
169
|
</MenuList>
|
|
168
170
|
</MenuPopover>
|
|
169
171
|
</Menu>
|
|
@@ -186,7 +188,7 @@ describe('Menu rerender tests', () => {
|
|
|
186
188
|
</MenuTrigger>
|
|
187
189
|
<MenuPopover>
|
|
188
190
|
<MenuList>
|
|
189
|
-
<MenuItem
|
|
191
|
+
<MenuItem>Option 1</MenuItem>
|
|
190
192
|
</MenuList>
|
|
191
193
|
</MenuPopover>
|
|
192
194
|
</Menu>
|
|
@@ -205,7 +207,7 @@ describe('Menu rerender tests', () => {
|
|
|
205
207
|
</MenuTrigger>
|
|
206
208
|
<MenuPopover>
|
|
207
209
|
<MenuList>
|
|
208
|
-
<MenuItem
|
|
210
|
+
<MenuItem>Option 1</MenuItem>
|
|
209
211
|
</MenuList>
|
|
210
212
|
</MenuPopover>
|
|
211
213
|
</Menu>
|
|
@@ -224,7 +226,7 @@ describe('Menu rerender tests', () => {
|
|
|
224
226
|
</MenuTrigger>
|
|
225
227
|
<MenuPopover>
|
|
226
228
|
<MenuList>
|
|
227
|
-
<MenuItem accessibilityActions={action}
|
|
229
|
+
<MenuItem accessibilityActions={action}>Option 1</MenuItem>
|
|
228
230
|
</MenuList>
|
|
229
231
|
</MenuPopover>
|
|
230
232
|
</Menu>
|
|
@@ -178,7 +178,6 @@ Array [
|
|
|
178
178
|
}
|
|
179
179
|
}
|
|
180
180
|
accessible={true}
|
|
181
|
-
content="Option 1"
|
|
182
181
|
enableFocusRing={true}
|
|
183
182
|
focusable={true}
|
|
184
183
|
onAccessibilityTap={[Function]}
|
|
@@ -232,7 +231,6 @@ Array [
|
|
|
232
231
|
}
|
|
233
232
|
}
|
|
234
233
|
accessible={true}
|
|
235
|
-
content="Option 2"
|
|
236
234
|
disabled={true}
|
|
237
235
|
enableFocusRing={true}
|
|
238
236
|
focusable={true}
|
|
@@ -400,7 +398,6 @@ Array [
|
|
|
400
398
|
}
|
|
401
399
|
}
|
|
402
400
|
accessible={true}
|
|
403
|
-
content="Option 1"
|
|
404
401
|
enableFocusRing={true}
|
|
405
402
|
focusable={true}
|
|
406
403
|
onAccessibilityTap={[Function]}
|
|
@@ -574,7 +571,6 @@ Array [
|
|
|
574
571
|
}
|
|
575
572
|
}
|
|
576
573
|
accessible={true}
|
|
577
|
-
content="Option 1"
|
|
578
574
|
enableFocusRing={true}
|
|
579
575
|
focusable={true}
|
|
580
576
|
onAccessibilityAction={[Function]}
|
|
@@ -700,7 +696,6 @@ Array [
|
|
|
700
696
|
}
|
|
701
697
|
}
|
|
702
698
|
accessible={true}
|
|
703
|
-
content="Option 2"
|
|
704
699
|
disabled={true}
|
|
705
700
|
enableFocusRing={true}
|
|
706
701
|
focusable={true}
|
|
@@ -928,7 +923,6 @@ Array [
|
|
|
928
923
|
}
|
|
929
924
|
}
|
|
930
925
|
accessible={true}
|
|
931
|
-
content="Option 1"
|
|
932
926
|
enableFocusRing={true}
|
|
933
927
|
focusable={true}
|
|
934
928
|
onAccessibilityAction={[Function]}
|
|
@@ -1054,7 +1048,6 @@ Array [
|
|
|
1054
1048
|
}
|
|
1055
1049
|
}
|
|
1056
1050
|
accessible={true}
|
|
1057
|
-
content="Option 2"
|
|
1058
1051
|
enableFocusRing={true}
|
|
1059
1052
|
focusable={true}
|
|
1060
1053
|
onAccessibilityAction={[Function]}
|
|
@@ -1281,7 +1274,6 @@ Array [
|
|
|
1281
1274
|
}
|
|
1282
1275
|
}
|
|
1283
1276
|
accessible={true}
|
|
1284
|
-
content="Option 1"
|
|
1285
1277
|
enableFocusRing={true}
|
|
1286
1278
|
focusable={true}
|
|
1287
1279
|
onAccessibilityAction={[Function]}
|
|
@@ -1407,7 +1399,6 @@ Array [
|
|
|
1407
1399
|
}
|
|
1408
1400
|
}
|
|
1409
1401
|
accessible={true}
|
|
1410
|
-
content="Option 2"
|
|
1411
1402
|
enableFocusRing={true}
|
|
1412
1403
|
focusable={true}
|
|
1413
1404
|
onAccessibilityAction={[Function]}
|
|
@@ -1634,7 +1625,6 @@ Array [
|
|
|
1634
1625
|
}
|
|
1635
1626
|
}
|
|
1636
1627
|
accessible={true}
|
|
1637
|
-
content="Option 1"
|
|
1638
1628
|
enableFocusRing={true}
|
|
1639
1629
|
focusable={true}
|
|
1640
1630
|
onAccessibilityAction={[Function]}
|
|
@@ -1748,7 +1738,6 @@ Array [
|
|
|
1748
1738
|
}
|
|
1749
1739
|
}
|
|
1750
1740
|
accessible={true}
|
|
1751
|
-
content="Option 2"
|
|
1752
1741
|
enableFocusRing={true}
|
|
1753
1742
|
focusable={true}
|
|
1754
1743
|
onAccessibilityAction={[Function]}
|
|
@@ -1967,7 +1956,6 @@ Array [
|
|
|
1967
1956
|
}
|
|
1968
1957
|
}
|
|
1969
1958
|
accessible={true}
|
|
1970
|
-
content="Option 1"
|
|
1971
1959
|
enableFocusRing={true}
|
|
1972
1960
|
focusable={true}
|
|
1973
1961
|
onAccessibilityTap={[Function]}
|
|
@@ -2023,7 +2011,6 @@ Array [
|
|
|
2023
2011
|
}
|
|
2024
2012
|
}
|
|
2025
2013
|
accessible={true}
|
|
2026
|
-
content="Option 2"
|
|
2027
2014
|
enableFocusRing={true}
|
|
2028
2015
|
focusable={true}
|
|
2029
2016
|
onAccessibilityAction={[Function]}
|