Vaadin Flow: Навигация не работает (?) При использовании SplitLayout и @ParentLayout

[EDIT] Решение в конце вопроса [/ EDIT]

Контекст

В настоящее время я пытаюсь реализовать Component, который основан на SplitLayout, который выглядит так:

Идея заключалась в том, что макет с class="outer" (выделенная строка) будет заполнителем для содержимого, которое должно было загружаться, когда пользователь выбирает строку в Grid.

"outer"-Layout был добавлен к SplitLayout рядом с сеткой и поэтому отмечен slot='secondary'.

Другой класс ссылается на 'outer'-Layout с помощью @Route(value = "details", layout = OuterLayout.class)

При нажатии на запись Grid страница переходит к "grid/details".

Проблема:

Я ожидал, что Vaadin поместит содержимое аннотированного класса в 'outer'-Layout, но вместо этого он добавляет новую запись рядом с ним: Если я удалю первый 'outer'-Layout Vaadin пометит второй как slot='secondary' и отображается его содержимое: Его даже обновление в соответствии с текущим выбранным Gridentry ...

Источники:

Splitlayout

@Route(value = "grid", layout = ContentLayout.class)
@ParentLayout(ContentLayout.class)
public class MySplitLayout extends SplitLayout implements RouterLayout {
    private MyGrid grid;
    private MyDetailOuterLayout detailOuterLayout;

    public MySplitLayout() {
        setSizeFull();

        grid = new MyGrid();
        detailOuterLayout = new MyDetailOuterLayout();

        addToPrimary(grid);
        addToSecondary(detailOuterLayout);
    }
}

Внешний

@ParentLayout(MySplitLayout.class)
public class MyDetailOuterLayout extends FlexLayout implements RouterLayout{

    public MyDetailOuterLayout() {
        setClassName("outer");
    }
}

Внутренний

@Route(value = "grid/details", layout = MyDetailOuterLayout.class)
public class MyDetailLayout extends FlexLayout 
        implements HasUrlParameter<Integer>, BeforeEnterObserver
{
    public MonitorDetailLayout() {
        setClassName("inner");

        /* define data via URL*/
    }
}

Я неправильно понял концепцию жизненного цикла?

заранее спасибо

Решение

Как предложил Тату Лунд, я изменил стандартную реализацию RouterLayout следующим образом:

@Route(value = "grid", layout = ContentLayout.class)
@ParentLayout(ContentLayout.class)
public class MySplitLayout extends SplitLayout implements RouterLayout {
    private MyGrid grid;
    private MyDetailOuterLayout detailOuterLayout;

    public MySplitLayout() {
        setSizeFull();

        grid = new MyGrid();
        detailOuterLayout = new MyDetailOuterLayout();

        addToPrimary(grid);
        addToSecondary(detailOuterLayout);
    }

    @Override
    public void showRouterLayoutContent(HasElement content) {
        if (content != null) {
            Element rootElement = getElement();
            rootElement.removeChild(detailOuterLayout.getElement()); // aka the secondary Element
            rootElement.appendChild(Objects.requireNonNull(content.getElement()));
        }
    }

}