Angular Stepper. First step shows up closed.

Hello, on the following code:

<mdb-stepper #stepper [vertical]="true">
                <mdb-step name="Step 1" label="Type something">
                    <p>Some Text 2</p>
                    <button mdbBtn size="sm" color="primary" (click)="stepper.next()">CONTINUE</button>
                </mdb-step>
                <mdb-step name="Step 2">
                    <p>Some Text 2</p>
                    <button mdbBtn size="sm" color="primary" (click)="stepper.next()">CONTINUE</button>
                    <button mdbBtn size="sm" color="secondary" (click)="stepper.previous()">BACK</button>
                </mdb-step>
                <mdb-step name="Step 3" label="Step 3 label">
                    <p>Some Text 3</p>
                    <div class="step-actions">
                        <button mdbBtn size="sm" color="primary" (click)="onSubmit()">SUBMIT</button>
                    </div>
                </mdb-step>
            </mdb-stepper>

I cannot get the STEP 1 to show up opened. I need to click on STEP 1 to open it and show the content.

How do I set the STEP 1 to be opened by default?!

Thanks.