Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | 211x 86x 169x 169x 86x 169x 86x 161x 86x 169x 85x 168x 6x 168x 85x 86x 211x 122x 211x 211x 122x 122x | @if (!headerTemplate() && showHeader()) {
<div
class="si-split-part-header"
[class.gap-4]="collapsedState()"
[class.is-collapsed]="collapsedState()"
>
<div class="si-split-part-title text-truncate">
{{ heading() | translate }}
</div>
@if (!collapsedState()) {
<div class="si-split-part-actions">
@for (action of actions(); track $index) {
<button
type="button"
class="btn btn-icon btn-tertiary-ghost si-split-button"
[title]="action.tooltip || ''"
[attr.aria-label]="action.tooltip"
(click)="action.click($event)"
>
<si-icon [icon]="action.iconClass" />
</button>
}
</div>
}
@if (collapsible()) {
<div class="si-split-part-collapse-button">
<button
type="button"
class="btn btn-icon btn-tertiary-ghost si-split-button"
[attr.aria-label]="collapseLabel() | translate"
(click)="toggleCollapse()"
>
<si-icon class="collapse-icon" [icon]="collapseIconClass() ?? icons.elementDoubleRight" />
</button>
</div>
}
</div>
}
@if (headerTemplate(); as headerTemplate) {
<ng-container *ngTemplateOutlet="headerTemplate; context: headerContext" />
}
<div
class="si-split-part-content"
[class.d-none]="!removeContentOnCollapse() && collapsedState() && !collapseToMinSize()"
>
@if (!removeContentOnCollapse() || !collapsedState()) {
<ng-content />
}
</div>
|