<ng-template #repeaterList let-listItem>
  <sky-repeater [reorderable]="listItem.reorderable">
    @for (item of listItem.children; track item) {
      <sky-repeater-item
        [reorderable]="item.reorderable"
        [selectable]="item.selectable"
      >
        <sky-repeater-item-title>{{ item.label }}</sky-repeater-item-title>
        @if (item.children?.length > 0) {
          <sky-repeater-item-content>
            <ng-container
              *ngTemplateOutlet="repeaterList; context: { $implicit: item }"
            />
          </sky-repeater-item-content>
        }
      </sky-repeater-item>
    }
  </sky-repeater>
</ng-template>

<ng-container
  *ngTemplateOutlet="
    repeaterList;
    context: { $implicit: { children: list, reorderable: false } }
  "
/>
