search

saini-g / react-step-progress

Dynamic multi-step progress indicator for React.
MIT License
82 stars 36 forks source link

Feature Request: Hooks for stepForward & stepBackward #3

Open r-bt opened 4 years ago

r-bt commented 4 years ago

Proposal

Expose a useStepProgress() hook which returns stepForward() & stepBackwards()to allow custom implementations of the Next and Previous Buttons

Reasoning

It would be great to separate some of the UI logic to allow better customization of the library. This way the buttonWrapperClass, primaryBtnClass, and secondaryBtnClass props can be removed and users can more easily make their own step forward / backwards navigation.

Other

If this is something you'd be interested in adding to the library, I'd be happy to submit a pull-request for it

saini-g commented 4 years ago

Thanks for the suggestion @richardbeattie . Will try to incorporate this.

r-bt commented 4 years ago

I was having a go at it and came up with this. It needs some work and refinements, but it gets the gist of the proposal.

timo22h commented 4 years ago

I'm looking forward to disable the primary or secondary button for example. That secondary button isn't showing on last step.

yenicelik commented 3 years ago

any progress on this one? I really love the progress bar itself and don't need the buttons, so would like to remove the buttons completely. Any idea on how to achieve this?

r-bt commented 3 years ago

any progress on this one? I really love the progress bar itself and don't need the buttons, so would like to remove the buttons completely. Any idea on how to achieve this?

@yenicelik I'm not sure if this library is still being maintained so I've forked it to https://github.com/r-bt/react-stepz which incorporates this change so you can use it like

import { StepProgressBar, useStepProgress }

const { stepForward, stepBackwards } = useStepProgress(steps);

// Use stepForward & stepBackwards to handle moving back and forward however you want

return (
   <StepProgressBar steps={steps} />
)