Hiding and Opening multiple widgets changes layout order

[ovitocbsy]

Describe the bug

Similar to #1497

When you change widget state to Hidden and then back to Open, if a lower priority widget is to the right of a higher priority widget, it will keep moving every Hide/Open iteration.

To Reproduce

1. Place lower priority widget to the right of higher priority widget
2. Change the 2 widgets state to Hidden at the same time
3. Change their state to Open
4. Lower priority widget moves to the right by one slot

Modified code used to reproduce in test app:

WidgetControls

function WidgetControls({ id1, id2 }: { id1: string, id2: string }) {
  const [state, setState] = React.useState<WidgetState | undefined>(undefined);
  return (
    <>
      <span>Widget state</span>
      <WidgetStateSelect
        state={state}
        onChange={s => {
          setState(undefined);
          const frontstageDef = UiFramework.frontstages.activeFrontstageDef;
          const widgetDef1 = frontstageDef?.findWidgetDef(id1);
          const widgetDef2 = frontstageDef?.findWidgetDef(id2);
          widgetDef1?.setWidgetState(s);
          widgetDef2?.setWidgetState(s);
        }}
      />
      <span>Widget actions</span>
      <div style={{ display: "flex", gap: "12px" }}>
        <Button
          onClick={() => {
            const frontstageDef = UiFramework.frontstages.activeFrontstageDef;
            const widgetDef1 = frontstageDef?.findWidgetDef(id1);
            const widgetDef2 = frontstageDef?.findWidgetDef(id2);
            widgetDef1?.show();
            widgetDef2?.show();
          }}
        >
          Show
        </Button>
        <Button
          onClick={() => {
            const frontstageDef = UiFramework.frontstages.activeFrontstageDef;
            const widgetDef1 = frontstageDef?.findWidgetDef(id1);
            const widgetDef2 = frontstageDef?.findWidgetDef(id2);
            widgetDef1?.expand();
            widgetDef2?.expand();
          }}
        >
          Expand
        </Button>
      </div>
    </>
  );
}

SelectWidgetControls

function SelectWidgetControls() {
  const [id1, setId1] = React.useState("RightStart2");
  const [id2, setId2] = React.useState("RightStart2");
  return (
    <>
      <h2 style={{ gridColumnStart: 1, gridColumnEnd: 3 }}>Widget controls</h2>
      <span>Widget id1</span>
      <WidgetSelect id={id1} onChange={i => setId1(i)} />
      <span>Widget id2</span>
      <WidgetSelect id={id2} onChange={i => setId2(i)} />
      <WidgetControls id1={id1} id2={id2} />
    </>
  );
}

Video showcasing correct behavior when widgets are in order of priority and incorrect behavior when lower priority widget is to the right of the higher priority widget:

Screen.Recording.2026-02-23.152411.mp4

Expected Behavior

Widget order stays the same regardless of priority order and how many widgets you open and hide at the same time

Screenshots

No response

Desktop (please complete the applicable information)

AppUI version 5.24.2

Additional context

No response