Changing the display from form to wizard to form and then removing the panel breaks the builder

[llemire-exp]

Describe the bug When you render the FormBuilder, if you change the display type from form to wizard and then back to form, the builder is still on wizard mode after adding a new component and the component you just tried to add disappear until you click on the +page button

To Reproduce Steps to reproduce the behavior:

1. Render the builder using the <FormBuilder /> component
2. keep a reference to the builder using the onBuilderReady prop
3. change the display type to wizard (using the builder reference)
4. change the display type back to form (using the builder reference)
5. remove the remaining panel
6. add a new textfield

Expected behavior The builder should be in form mode and behave normally

Screenshots Gif demonstrating the issue

Sandbox Example builder-display-bug.zip

the zip file contain a simple vite app unzip it, run npm i and npm run dev to test the issue, here is the actual code used to recreate the bug:

import { FormBuilder } from "@formio/react";
import { useCallback, useRef } from "react";

function App() {
	const ref = useRef(null);
	const onBuilderReady = useCallback((builder) => {
		ref.current = builder;
	}, []);

    return (
        <>
			<select onChange={(e) => {
				ref.current.setDisplay(e.target.value);
			}}>
				<option value="form">form</option>
				<option value="wizard">wizard</option>
			</select>
			<FormBuilder onBuilderReady={onBuilderReady}/>
        </>
    );
}

export default App;

Desktop (please complete the following information):

• OS: Windows
• Browser Chrome
• Version Version 137.0.7151.104 (Official Build) (64-bit)

Smartphone (please complete the following information):

Not tested

[ZenMasterJacob20011]

Thank you for reporting this issue! A ticket has been created internally for our team to investigate. FIO-10376