Hello, I'm migrating my embedded dashboards from Iframes to React. One problem I'm struggling with is the React version is not full width (but the iframe is), and I'm not sure how to fix that? Is there a prop I'm missing? I've included the React vs. Iframe images below for clarify what I mean:

Hi Michael, Can you please confirm which SDK version are you using here?

10.4

Hello Michael, May I know if there’s any styling? You can check with dev tools > Elements which ones are being applied. Or in the App itself (usually under index file)

Hey Daniela, yes, here is the styling for the "gd-dashboards-root" class. Width is being set, but I'm not sure where from.

From the screenshot, seems like

gd-flex-container

width is being limited from somewhere 🤔 Would it be possible to create a very very basic page to eliminate where the problem might be? for example, setting up something like this:

export const App: React.FC = () => {
    return (
        <BackendProvider backend={backend}>
            <WorkspaceProvider workspace={workspaceId}>
                <div className="app">
                    <b>sup</b>
                    <Dashboard dashboard={dashboard} />
                </div>
            </WorkspaceProvider>
        </BackendProvider>
    );
};

Since I’m not familiarize with your code, I can try to guide you, but pls keep in mind that you might have to search in the app styling a bit further.

If I set component-root's width to 100%, everything looks correct.... I'll just do that. Weird I have to set it explicitly, though?

Heyo Michael, it is weird for sure 🙂 But then again, I tried to reproduce this on my own from more or less a fresh start, and the Dashboard seemed to inherit its width perfectly fine, so this is an interesting issue to begin with.