ESLint Errors with <React.StrictMode> and <React.Fragment> in Fluent UI

[otkHsiao]

Hi @aubreyquinn,

First of all, thank you for your amazing work on this project! I recently encountered an issue with the ESLint plugin when using <React.StrictMode> or <React.Fragment> in my code.

Here is the code snippet that triggers the error:

const render = (Component) => {
    ReactDOM.render(
        <React.StrictMode>
            <FluentProvider theme={themeV9} style={rootStyle} applyStylesToPortals={false}>
                <Component />
            </FluentProvider>
        </React.StrictMode>,
        document.getElementById("container"),
    );
};

The ESLint errors are as follows:

ensure AccordionItem has exactly one header and one panel eslint@microsoft/fluentui-jsx-a11y/accordion-item-needs-header-and-panel
ensure DialogBody has exactly one header, one content, and one footer eslint@microsoft/fluentui-jsx-a11y/dialogbody-needs-title-content-and-actions
I wanted to check if this is a misidentification by the ESLint plugin or if there is a known solution to this issue.

Thank you in advance for your time and effort, and I appreciate any insights you can provide!

Best regards.