Stepper component not working?

[Kara]

I am trying to use the Stepper component and I'm getting errors on the console `Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.`

This only appears when I am using the Stepper. I have tried removing it and replacing it with another Kendo component, such as a Button, and that works fine and no error. I have tried updating the packages to the latest and making sure that I have installed the progressbars dependency, and that that is also updated to the latest. I have also tried moving it out of a child component into the parent so that it's not being exported and it still has that message displayed. I have also tried inserting the stepper demo code, and that also gives the error. Any ideas on what is going on? I see that this component works fine in StackBlitz, so it seems like a me problem. But I could use some guidance!

 

Thanks,

Kara

[Ina]

Hello Kara,

Can you try using some other component from the `Layout` package in order to see if the package is correctly imported, or is it an issue only with the `Stepper` component, as the Button component is part of a different package? 

In order to help you further, can I ask, for example, representing the behavior, so we could be able to debug it and see what is causing it?

Some of our demos can be used as a starting point for making an example:

https://www.telerik.com/kendo-react-ui/components/layout/ 

Please let me know if I could assist with something more.

Regards,
Ina
Progress Telerik

[Kara]

Yes, I have pulled the demo code for the stepper into mine and tried that with no luck. I know I use another Layout component in a different area of my code with no issue, but let me see if I can put it on this particular page. Will post an update.

[Kara]

I added a Card in the Steppers place and it works fine.

[Ina]

Hello Kara,

The `Stepper` component has two mandatory props in order to work properly.

The `value` prop, which should be number and represents the index of the selected step and the `items` prop, which should be array of `StepProps` and represents the steps collection.

Do you have this properties, with the correct implementation?

Please check this API references for the `Stepper` API and `StepProps` API:

https://www.telerik.com/kendo-react-ui/components/layout/api/StepperProps/ 

https://www.telerik.com/kendo-react-ui/components/layout/api/StepProps/ 

If the issue still exists please, give us more information about the example, or if it's possible - example representing the behavior, so we could be able to debug and help further.

Please let me know if I could help with something more.

Regards,
Ina
Progress Telerik

[Kara]

Hi Ina,

I tried Menu in it's place as well and that's working fine.

I have been providing the Stepper value and items props. I have also tried directly copy/pasting the provided kendo example code into my application and even that does not work as expected. Unfortunately, I've been unable to recreate my exact situation in a shareable example. I was able to successfully create a stepper in StackBlitz from scratch. So I'm not sure what I'm doing wrong in my application.

Would it be possible to have a troubleshooting session with someone from support?

 

Kara

[Ina]

Hello Kara,

Currently, the remote assistance is part of the `ultimate support` package:

https://www.telerik.com/purchase/support-plans

I can try to help further so we could be able to resolve the issue.

Can you send me the console error, video of the issue, or some kind of code, since the example is not an option?

Please let me know if I can help with something more.

Regards,
Ina
Progress Telerik