-
Notifications
You must be signed in to change notification settings - Fork 260
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(ui5-wizard): initial implementation #2400
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks great!
Overall I've found just very small things.
- check if tag names are used somewhere else (I only found one usage) to not break scoping
- I'm not sure whether we should automatically select the first step, but let's give it a try. We can change this later
Introduce ui5-wizard and ui5-wizard-step components that enables users to accomplish a single goal that consists of multiple dependable sub-tasks. The ui5-wizard-step API defines both the content of particular step and its corresponding tab, displayed within the Wizard's navigation header with the icon and text properties. Also, the component provides selected and disabled properties, that determine which step is currently "selected" (active), which ones are enabled or disabled. Тhe Wizard does not provide "move to next button", instead we give the user freedom to decide how to move to particular step. It might be button, or something else, placed inside the content of step. At the end, to move to particular step, the user can use the API of the ui5-wizard-step (selected and disabled). In terms of user experience, the wizard allows navigation between enabled (validated) steps upon clicking the steps within the navigation header and via scrolling. When these interactions occur, the wizard updates the selected state and fires selection-change event to notify the interested parties. FIXES: #2368
when is this wizard component going to be released? Also is it possible to determine the steps dynamically (rather than have them asa fixed static sequence), based on what the user selected in previous steps. Example:
|
Introduce ui5-wizard and ui5-wizard-step components that enables users to accomplish a single goal that consists of multiple dependable sub-tasks. The ui5-wizard-step API defines both the content of particular step and its corresponding tab, displayed within the Wizard's navigation header with the icon and text properties. Also, the component provides selected and disabled properties, that determine which step is currently "selected" (active), which ones are enabled or disabled. Тhe Wizard does not provide "move to next button", instead we give the user freedom to decide how to move to particular step. It might be button, or something else, placed inside the content of step. At the end, to move to particular step, the user can use the API of the ui5-wizard-step (selected and disabled). In terms of user experience, the wizard allows navigation between enabled (validated) steps upon clicking the steps within the navigation header and via scrolling. When these interactions occur, the wizard updates the selected state and fires selection-change event to notify the interested parties. FIXES: #2368
Introduce ui5-wizard and ui5-wizard-step components that enables users to accomplish a single goal that consists of multiple dependable sub-tasks. The ui5-wizard-step API defines both the content of particular step and its corresponding tab, displayed within the Wizard's navigation header with the icon and text properties. Also, the component provides selected and disabled properties, that determine which step is currently "selected" (active), which ones are enabled or disabled. Тhe Wizard does not provide "move to next button", instead we give the user freedom to decide how to move to particular step. It might be button, or something else, placed inside the content of step. At the end, to move to particular step, the user can use the API of the ui5-wizard-step (selected and disabled). In terms of user experience, the wizard allows navigation between enabled (validated) steps upon clicking the steps within the navigation header and via scrolling. When these interactions occur, the wizard updates the selected state and fires selection-change event to notify the interested parties. FIXES: #2368
This is an update to let you know that we have introduced a change to the naming of the wizard event 'selection-change'. We have decided to rename the "selection-change" event in order for its name to better represent its origins. |
Part of #3107 BREAKING CHANGE: The support for ```aria-labelledby``` have been deprecated in favour of new attribute ```accessible-name-ref``` for the following components: - ComboBox (Requested by SF #1916) - DatePicker (Requested by SF #2107) - Input (Requested #1866) - List (Requested by SF #1886) - Rating Indicator - Select (Requested by SF #2107) - StepInput (Implemented as part of the initial implementation #2804) - TextArea (Requested by SF #2107) - WizardStep (Implemented as part of the initial implementation #2400) The ```aria-labelledby``` has been deprecated for the following component: - Button (Requested by SF #1425) The ```accessible-name``` has been deprecated for the following components: - Link (Requested by SF #2356) Both ```aria-labelledby``` and ```accessible-name``` have been deprecated for the following components: - Card (Requested by CBC #2127) - CheckBox (Requested by SF #2265)
Introduce
ui5-wizard
andui5-wizard-step
components that enables users to accomplish a single goal that consists of multiple dependable sub-tasks.Overview
The
ui5-wizard-step API
defines both the content of particular step and its corresponding tab, displayed within the Wizard's navigation header with theicon
andtext
properties. Also, the component providesselected
anddisabled
properties, that determine which step is currently "selected" (active), which ones are enabled or disabled.The Wizard does not provide "move to next button", instead we give the user freedom to decide how to move to particular step. It might be button, or something else, placed inside the content of step. At the end, to move to particular step, the user can use the API of the ui5-wizard-step (
selected
anddisabled
).In terms of user experience, the wizard allows navigation between enabled (validated) steps upon clicking the steps within the navigation header and via scrolling. When these interactions occur, the wizard updates the
selected
state and firesselection-change
event to notify the interested parties.What is not in the initial scope:
Preview
![ezgif com-gif-maker](https://user-images.githubusercontent.com/15702139/97278587-9e704c80-1842-11eb-967d-be62633bbf31.gif)
FIXES: #2368