fluentui
fluentui copied to clipboard
[Bug]: <Menu> control issue
Library
React Components / v9 (@fluentui/react-components)
System Info
System:
OS: Windows 11 10.0.22631
CPU: (16) x64 AMD Ryzen 7 5800H with Radeon Graphics
Memory: 43.85 GB / 63.86 GB
Browsers:
Edge: Chromium (121.0.2277.98)
Internet Explorer: 11.0.22621.1
Are you reporting Accessibility issue?
None
Reproduction
https://github.com/aleksandrasroka/empty-spfx.git
Bug Description
Actual Behavior
Can't add below component to simple Spfx solution
<Menu>
<MenuTrigger disableButtonEnhancement>
<Button icon={<MoreHorizontalRegular />} aria-label="More" />
</MenuTrigger>
<MenuPopover>
<MenuList>
<MenuItem>New </MenuItem>
</MenuList>
</MenuPopover>
</Menu>
Menu control shows error (Logs section)
Expected Behavior
No error.
Installed packages
"dependencies": { "@fluentui/react-components": "^9.35.1", "@fluentui/react-icons": "^2.0.227", "@microsoft/sp-core-library": "1.18.2", "@microsoft/sp-lodash-subset": "1.18.2", "@microsoft/sp-property-pane": "1.18.2", "@microsoft/sp-webpart-base": "1.18.2", "@pnp/graph": "^3.22.0", "@pnp/logging": "^3.22.0", "@pnp/sp": "^3.22.0", "react": "17.0.1", "react-dom": "17.0.1", "tslib": "2.3.1" }, "devDependencies": { "@microsoft/rush-stack-compiler-4.7": "0.1.0", "@microsoft/sp-build-web": "1.18.2", "@microsoft/sp-module-interfaces": "1.18.2", "@types/react": "17.0.45", "@types/react-dom": "17.0.17", "@types/webpack-env": "~1.15.2", "ajv": "^8.12.0", "gulp": "4.0.2", "prettier": "^3.2.5", "tslint-config-prettier": "^1.18.0", "typescript": "4.7.4" }
Logs
Type '{ children: Element[]; }' is not assignable to type '{ children: Element | [Element, Element]; hoverDelay?: number | undefined; inline?: boolean | undefined; onOpenChange?: ((e: MouseEvent | React.MouseEvent<...> | KeyboardEvent<...> | TouchEvent, data: MenuOpenChangeData) => void) | undefined; ... 6 more ...; closeOnScroll?: boolean | undefined; }'.
Types of property 'children' are incompatible.
Type 'Element[]' is not assignable to type 'Element | [Element, Element]'.
Type 'Element[]' is not assignable to type '[Element, Element]'.
Target requires 2 element(s) but source may have fewer.ts(2322)
Requested priority
Blocking
Products/sites affected
No response
Are you willing to submit a PR to fix?
yes
Validations
- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- [X] The provided reproduction is a minimal reproducible example of the bug.