* Called upon `onSelectionChangeRequested`. * Selects the external step (ui5-wizard-step), * based on the clicked or activated via keyboard step in the header (ui5-wizard-tab). * @param stepInHeader the step equivalent in the header * @private
(stepInHeader: WizardTab)
| 660 | * @private |
| 661 | */ |
| 662 | async changeSelectionByStepAction(stepInHeader: WizardTab) { |
| 663 | const stepRefId = stepInHeader.getAttribute("data-ui5-content-ref-id")!; |
| 664 | const selectedStep = this.selectedStep; |
| 665 | const stepToSelect = this.getStepByRefId(stepRefId); |
| 666 | const bExpanded = stepInHeader.getAttribute(EXPANDED_STEP) === "true"; |
| 667 | const newlySelectedIndex = this.slottedSteps.indexOf(stepToSelect); |
| 668 | const firstElementChild = stepToSelect.firstElementChild as HTMLElement; |
| 669 | const firstFocusableElement = await getFirstFocusableElement(firstElementChild); |
| 670 | |
| 671 | if (firstFocusableElement) { |
| 672 | // Focus the first focusable element within the step content corresponding to the currently focused tab |
| 673 | firstFocusableElement.focus(); |
| 674 | } |
| 675 | |
| 676 | // If the currently selected (active) step is clicked, |
| 677 | // just scroll to its starting point and stop. |
| 678 | if (selectedStep === stepToSelect) { |
| 679 | this.scrollToContentItem(this.selectedStepIndex); |
| 680 | return; |
| 681 | } |
| 682 | |
| 683 | if (bExpanded || (!bExpanded && (newlySelectedIndex === 0 || newlySelectedIndex === this.steps.length - 1))) { |
| 684 | // Change selection and fire "step-change". |
| 685 | this.switchSelectionFromOldToNewStep(selectedStep, stepToSelect, newlySelectedIndex, false); |
| 686 | } |
| 687 | } |
| 688 | |
| 689 | getContentHeight() { |
| 690 | let contentHeight = 0; |
no test coverage detected