eui
eui copied to clipboard
[EuiTour] Built-in 'Next' button
Would it be possible to have default Next
behaviour added to the bottom of the tour steps? Right now I have to pass a custom footer action to each step except the final one, which is a bit clunky - I understand that, in the examples included in the documentation, the tour steps progress via actions such as copy pasting and clicking other buttons rather than clicking Next
; however, I think that a Next
button would, at the very least, be a common use case worth considering. Here is an example of what we had in our original tour for what was considered the 'default' footerAction
:
<EuiFlexGroup responsive={false} gutterSize="s" alignItems="center">
<EuiFlexItem grow={false}>
<EuiButtonEmpty color="text" size="xs" onClick={actions.finishTour()}>
Skip tour
</EuiButtonEmpty>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiButton size="s" color="success" onClick={actions.incrementStep()}>
Next
</EuiButton>
</EuiFlexItem>
</EuiFlexGroup>
Which rendered to this:
Originally posted by @Heenawter in https://github.com/elastic/eui/issues/5696#issuecomment-1062191573
Security Solution is interested in this as well. We'd like to have some built-in previous/next buttons in the tour steps that would allow the user to navigate between the steps.
So far we had to add our custom buttons to the content of every step: https://github.com/elastic/kibana/pull/128405
👋 Hey there. This issue hasn't had any activity for 180 days. We'll automatically close it if that trend continues for another week. If you feel this issue is still valid and needs attention please let us know with a comment.
I think this would still be a valuable addition 👍
It was fixed by https://github.com/elastic/eui/pull/6384. We just added support to pass an array of buttons to footerAction
.