This is a migrated thread and some comments may be shown as answers.

Stepper component not working?

6 Answers 945 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Kara
Top achievements
Rank 1
Veteran
Kara asked on 01 Oct 2020, 05:47 PM

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

6 Answers, 1 is accepted

Sort by
0
Ina
Telerik team
answered on 02 Oct 2020, 07:20 AM

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

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

0
Kara
Top achievements
Rank 1
Veteran
answered on 02 Oct 2020, 02:14 PM
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.
0
Kara
Top achievements
Rank 1
Veteran
answered on 02 Oct 2020, 04:19 PM
I added a Card in the Steppers place and it works fine.
0
Ina
Telerik team
answered on 05 Oct 2020, 07:53 AM

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

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Kara
Top achievements
Rank 1
Veteran
answered on 05 Oct 2020, 05:07 PM

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

0
Ina
Telerik team
answered on 06 Oct 2020, 02:05 PM

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

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
General Discussions
Asked by
Kara
Top achievements
Rank 1
Veteran
Answers by
Ina
Telerik team
Kara
Top achievements
Rank 1
Veteran
Share this question
or