I would like to add a Material UI Stepper to my JSONForm. I have read comments from Add alternative categorization renderer based on steppers by edgarmueller · Pull Request #1235 · eclipsesource/jsonforms · GitHub and have got the stepper working (looks great!) but i was wondering if there was any way i could add Next and Previous Buttons to toggle through each page? Also if there was any way to always show previous content, for example if i was on page 1 and i pressed next / went to page 2, it would still show contents from page 1 and just append page 2 to the current view?
Hi,
I think you would need to create your own renderer here. @edgarmueller do you see a good way to make the stepper renderer extensible/configurable for the asked use case?
I’d go with a custom renderer as well. You can copy the existing stepper renderer and add the buttons, e.g. as it is the case in the React Stepper component - Material-UI example. @eneufeld We could probably provide a 2nd UI option called showNavButtons or similar that would display the back/next buttons somewhere (not sure if I like it though).
About your 2nd question, I guess that possible, but I don’t think the Stepper would be a good fit for that. Conceptually, this requirement seems to boil down to displaying multiple categories at once.
I agree, I would also tend to not add a new ui option at the moment,
I would suggest to move this as a feature request to github and discuss the necessity of it there
Hi, i have been trying to implement my own custom renderer to implement the Next and previous buttons i previously described but im struggling to understand how to do this.
I have seen the MaterialCategorizationStepperLayoutRenderer and can see the activeCategory state, which i know i can simple increment / decrement when next / previous button is pressed but im just a little confused on how to get access to that state and where to pass my own handleNext and handlePrevious functions.
I have created my own Control component and corresponding tester, here should i be importing the MaterialCategorizationStepperLayoutRenderer and passing in my own handleNext and handlePrev functions?
The most pragmatic solution is to just copy and adapt the code in the way you want. The renderer only has about 40 lines of code, so this is perfectly fine. If you prefer to reuse the renderer feel free to open a PR which adds customization capabilities (or extracts a common reusable component) and we’ll definitely take a look.