<div>
    <umb-load-indicator
        ng-if="vm.editor.loading">
    </umb-load-indicator>

    <div class="umb-split-view__content" ng-show="!vm.editor.loading">

        <ng-form name="contentHeaderForm" ng-if="vm.editor.content.apps.length > 0">
            <umb-editor-content-header
                menu="vm.page.menu"
                hide-menu="vm.page.hideActionsMenu"
                name="vm.editor.content.name"
                name-disabled="vm.nameDisabled"
                content="vm.editor.content"
                on-select-navigation-item="vm.selectApp(item)"
                on-select-anchor-item="vm.selectAppAnchor(item, anchor)"
                open-variants="vm.openVariants"
                hide-change-variant="vm.page.hideChangeVariant"
                show-back-button="vm.showBackButton()"
                on-back="vm.onBack()"
                split-view-open="vm.editorCount > 1"
                on-open-in-split-view="vm.openSplitView(variant)"
                on-close-split-view="vm.onCloseSplitView()"
                on-select-variant="vm.selectVariant(variant)"
                server-validation-name-field="{{'Variants[' + vm.editorIndex + '].Name'}}">
            </umb-editor-content-header>
        </ng-form>

        <umb-editor-container ng-if="vm.editor.content.apps.length > 0">
            <div class="umb-editor-sub-views">
                <div ng-repeat="app in vm.editor.content.apps track by app.alias">
                    <umb-editor-sub-view model="app" content="vm.content" />
                </div>
            </div>
        </umb-editor-container>

        <umb-empty-state
            ng-if="vm.editor.content.apps.length === 0"
            position="center">
            <localize key="content_noProperties"></localize>
        </umb-empty-state>

    </div>
</div>
