Vertical Nav default closed not working Angular 17

[violabs-josh]

I have added the vertical nav and I want it to default to closed. I have set it up based on the docs and it will not default to closed. I have tried 1) inline, 2) variable, 3) async behavior subject, 4) triggering with ngOnInit 5) triggered with ngAfterViewInit. The button works to show and hide it normally.

How to reproduce

`

Dashboard Interactive Analytics

<div class="content-container">
    <clr-vertical-nav [clrVerticalNavCollapsed]="true" [clrVerticalNavCollapsible]="true">
        <a clrVerticalNavLink routerLink="./normal" routerLinkActive="active">
            <cds-icon clrVerticalNavIcon shape="terminal"></cds-icon>
            Live Log
        </a>
    </clr-vertical-nav>

    <div class="content-area">
        <router-outlet></router-outlet>
    </div>
</div>

`

Expected behavior

It should be closed on render of the page.

Versions

Clarity version:
v17.0.1

Framework version:
Angular 17

Device:

• Type: Macbook
• OS: iOS
• Browser - Arc, Safari
• Version - Chromium version 122.0.6261.94, safari Version 17.2.1

Additional notes

I have a pretty bare setup, so I don't think it is this project. I also spun up an entirely new project and got the same results.

[dtsanevmw]

Hello @violabs-josh, by default the vertical nav is 'collapsible: false' and while for Angular the input order matters specifying clrVerticalNavCollapsed before clrVerticalNavCollapsible will lead to this not working because initially it's not collapsible and it would ignore this one. Try setting collapsible first and then collapsed.