[Bug]: Stepper - setting linear property to true throws an error

[RivaIvanova]

Which component(s) are affected?

Stepper

Description

Using the IgcStepper in an Angular project and setting its linear property to true throws an error.

Reproduction

1. Create an Angular app and install the igniteui-webcomponents package.
2. Add an IgcStepper and set the linear property to true.
3. Observe the DevTools Console.

<igc-stepper
  #stepper
  id="stepper"
  [linear]="true"
>
  <!-- Step 1 Shopping Card-->
  <igc-step>
    <span slot="indicator">1</span>
    <span slot="title">Shopping Card</span>
    <span>First Step</span>
  </igc-step>
  <!-- Step 2 Delivery Address -->
  <igc-step>
    <span slot="indicator">2</span>
    <span slot="title">Delivery Address</span>
    <span>Second Step</span>
  </igc-step>
</igc-stepper>

import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { defineComponents, IgcStepperComponent } from 'igniteui-webcomponents';

defineComponents(IgcStepperComponent);

@Component({
  selector: 'app-my-stepper',
  imports: [],
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  templateUrl: './my-stepper.component.html',
  styleUrl: './my-stepper.component.scss',
})
export class MyStepperComponent {}

Workaround

ngOnInit(): void {
  const stepper = document.getElementById('stepper') as IgcStepperComponent;
  const activeStep = stepper.steps.findIndex((step) => step.active);
  if (activeStep === -1) {
    stepper.navigateTo(0);
  }
}

Is this a regression?

No or unsure. This never worker, or I haven't tried before.

Affected versions

5.3.0

Browser/OS/Node environment

N/A