<os-head-bar [editMode]="hasChanged" (saveEvent)="sendUpdate()" (mainEvent)="onCancel()" [nav]="false">
    <!-- Title -->
    <div class="title-slot">
        <h2 *ngIf="category">{{ 'Sort motions' | translate }} ({{ category.prefixedName }})</h2>
    </div>
</os-head-bar>

<mat-card class="os-form-card">
    <div *ngIf="isMultiSelect">
        <span>{{ sortSelector.multiSelectedIndex.length }}&nbsp;</span>
        <span translate>selected</span>
        <button mat-button (click)="moveToPosition()"><span translate>move ...</span></button>
    </div>
    <os-sorting-list (sortEvent)="onListUpdate($event)" [input]="motionObservable" #sorter>
        <ng-template let-motion>
            <mat-basic-chip class="bluegrey" disableRipple matTooltip="{{ 'Sequential number' | translate }}">
                {{ motion.id }}
            </mat-basic-chip>
        </ng-template>
    </os-sorting-list>
</mat-card>
