- {!isNarrow && (
+ {!isNarrow && (
- {backLinkProps && (
+ {backLinkProps && (
+ />
)}
)}
-
- {mainLinkProps && (
+
+ {mainLinkProps && (
+ />
)}
{!isNarrow && exitLinkProps && (
- = (
);
-};
+};
\ No newline at end of file
diff --git a/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.styles.ts b/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.styles.ts
index c2c63142..094057e3 100644
--- a/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.styles.ts
+++ b/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.styles.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import { FontWeights } from '@fluentui/react';
import { detailPanelGutterWidth } from '../customizations/src/index';
diff --git a/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.tsx b/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.tsx
index 562a5fa9..a170d3f2 100644
--- a/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.tsx
+++ b/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
import { styled } from '@fluentui/react';
import type { FC } from 'react';
diff --git a/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.types.ts b/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.types.ts
index cef58cb3..56d0ec95 100644
--- a/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.types.ts
+++ b/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.types.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type {
IButtonProps,
IButtonStyles,
diff --git a/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.utils.ts b/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.utils.ts
index 10efef55..a810fdcd 100644
--- a/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.utils.ts
+++ b/SubwayNav/SubwayNav/utilities/setup-wizard-action-bar-v2/setup-wizard-action-bar-v2.utils.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type { IContextualMenuItem } from '@fluentui/react';
import { getId } from '@fluentui/react';
diff --git a/SubwayNav/SubwayNav/utilities/subway-nav/common.ts b/SubwayNav/SubwayNav/utilities/subway-nav/common.ts
index d3fc1766..3b473290 100644
--- a/SubwayNav/SubwayNav/utilities/subway-nav/common.ts
+++ b/SubwayNav/SubwayNav/utilities/subway-nav/common.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type { ISubwayNavNodeProps } from './subway-node.types';
import { SubwayNavNodeState } from './subway-node.types';
/**
diff --git a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav-no-animation.styles.tsx b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav-no-animation.styles.tsx
index 5f6b7d10..a75093aa 100644
--- a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav-no-animation.styles.tsx
+++ b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav-no-animation.styles.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
/* eslint-disable */
/* istanbul ignore file */
// # FEATURE - Disable animation: Related changes are performed in this file
diff --git a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.base.tsx b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.base.tsx
index 581d18b3..64f87d40 100644
--- a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.base.tsx
+++ b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.base.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
/* eslint-disable */
/* istanbul ignore file */
import type { IProcessedStyleSet } from '@fluentui/react';
diff --git a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.styles.tsx b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.styles.tsx
index addd8b15..ca52661a 100644
--- a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.styles.tsx
+++ b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.styles.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
/* eslint-disable */
/* istanbul ignore file */
import type { IStyle } from '@fluentui/react';
diff --git a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.tsx b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.tsx
index 2f0bb3ba..fb1c407b 100644
--- a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.tsx
+++ b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
/* eslint-disable */
/* istanbul ignore file */
import { styled } from '@fluentui/react';
diff --git a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.types.ts b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.types.ts
index d9e8b92e..927fb02e 100644
--- a/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.types.ts
+++ b/SubwayNav/SubwayNav/utilities/subway-nav/subway-nav.types.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
/* eslint-disable */
/* istanbul ignore file */
import type { IFocusZoneProps, IStyle, IStyleFunctionOrObject } from '@fluentui/react';
diff --git a/SubwayNav/SubwayNav/utilities/subway-nav/subway-node.types.ts b/SubwayNav/SubwayNav/utilities/subway-nav/subway-node.types.ts
index 962e59ee..66dde0c0 100644
--- a/SubwayNav/SubwayNav/utilities/subway-nav/subway-node.types.ts
+++ b/SubwayNav/SubwayNav/utilities/subway-nav/subway-node.types.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type {
IIconRecord,
IProcessedStyleSet,
diff --git a/SubwayNav/SubwayNav/utilities/subway-nav/wizard.types.ts b/SubwayNav/SubwayNav/utilities/subway-nav/wizard.types.ts
index b4de770d..1c2db46d 100644
--- a/SubwayNav/SubwayNav/utilities/subway-nav/wizard.types.ts
+++ b/SubwayNav/SubwayNav/utilities/subway-nav/wizard.types.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
export enum SubwayNavNodeState {
NotStarted = 'NotStarted',
Current = 'Current',
diff --git a/SubwayNav/SubwayNav/utilities/subway-node/index.ts b/SubwayNav/SubwayNav/utilities/subway-node/index.ts
index 6e51dcb7..ad8226d6 100644
--- a/SubwayNav/SubwayNav/utilities/subway-node/index.ts
+++ b/SubwayNav/SubwayNav/utilities/subway-node/index.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
export { SubwayNode } from './subway-node';
export { SubwayNodeBase } from './subway-node.base';
export {
diff --git a/SubwayNav/SubwayNav/utilities/subway-node/subway-node.base.tsx b/SubwayNav/SubwayNav/utilities/subway-node/subway-node.base.tsx
index 461f07b8..624da641 100644
--- a/SubwayNav/SubwayNav/utilities/subway-node/subway-node.base.tsx
+++ b/SubwayNav/SubwayNav/utilities/subway-node/subway-node.base.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type { IIconRecord, IProcessedStyleSet } from '@fluentui/react';
import { buttonProperties, classNamesFunction, getIcon, getNativeProps } from '@fluentui/react';
import type { ReactNode } from 'react';
diff --git a/SubwayNav/SubwayNav/utilities/subway-node/subway-node.styles.ts b/SubwayNav/SubwayNav/utilities/subway-node/subway-node.styles.ts
index e412c518..57daa821 100644
--- a/SubwayNav/SubwayNav/utilities/subway-node/subway-node.styles.ts
+++ b/SubwayNav/SubwayNav/utilities/subway-node/subway-node.styles.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type { IGetFocusStylesOptions, IStyle } from '@fluentui/react';
import { FontWeights, getFocusStyle } from '@fluentui/react';
import type { IM365Theme } from '../customizations/src';
diff --git a/SubwayNav/SubwayNav/utilities/subway-node/subway-node.tsx b/SubwayNav/SubwayNav/utilities/subway-node/subway-node.tsx
index 94f1771a..8ba1268a 100644
--- a/SubwayNav/SubwayNav/utilities/subway-node/subway-node.tsx
+++ b/SubwayNav/SubwayNav/utilities/subway-node/subway-node.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
import { styled } from '@fluentui/react';
import type { FC } from 'react';
diff --git a/SubwayNav/SubwayNav/utilities/subway-node/subway-node.types.ts b/SubwayNav/SubwayNav/utilities/subway-node/subway-node.types.ts
index 5ff5c1cd..bd4a439f 100644
--- a/SubwayNav/SubwayNav/utilities/subway-node/subway-node.types.ts
+++ b/SubwayNav/SubwayNav/utilities/subway-node/subway-node.types.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type {
IIconRecord,
IProcessedStyleSet,
diff --git a/SubwayNav/SubwayNav/utilities/themes/index.ts b/SubwayNav/SubwayNav/utilities/themes/index.ts
index ec23e825..00171b9d 100644
--- a/SubwayNav/SubwayNav/utilities/themes/index.ts
+++ b/SubwayNav/SubwayNav/utilities/themes/index.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
export {
PPACActualDarkTheme,
PPACDarkColorPalette,
diff --git a/SubwayNav/SubwayNav/utilities/themes/ppac-dark-theme.ts b/SubwayNav/SubwayNav/utilities/themes/ppac-dark-theme.ts
index 999eba54..906ef9d0 100644
--- a/SubwayNav/SubwayNav/utilities/themes/ppac-dark-theme.ts
+++ b/SubwayNav/SubwayNav/utilities/themes/ppac-dark-theme.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
/* eslint-disable @typescript-eslint/no-namespace */
import type { ICustomizations, ITheme } from '@fluentui/react';
import { createTheme } from '@fluentui/react';
diff --git a/SubwayNav/SubwayNav/utilities/themes/ppac-light-theme.ts b/SubwayNav/SubwayNav/utilities/themes/ppac-light-theme.ts
index b4e26e14..d84aaa0a 100644
--- a/SubwayNav/SubwayNav/utilities/themes/ppac-light-theme.ts
+++ b/SubwayNav/SubwayNav/utilities/themes/ppac-light-theme.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
/* eslint-disable @typescript-eslint/no-namespace */
import type { ICustomizations, ITheme } from '@fluentui/react';
import { createTheme } from '@fluentui/react';
diff --git a/SubwayNav/SubwayNav/utilities/utilities/animation.ts b/SubwayNav/SubwayNav/utilities/utilities/animation.ts
index 61138cac..da5d3923 100644
--- a/SubwayNav/SubwayNav/utilities/utilities/animation.ts
+++ b/SubwayNav/SubwayNav/utilities/utilities/animation.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type { IRawStyle } from '@fluentui/react';
import { keyframes } from '@fluentui/react';
diff --git a/SubwayNav/SubwayNav/utilities/utilities/common.ts b/SubwayNav/SubwayNav/utilities/utilities/common.ts
index dcce73c0..acac24e4 100644
--- a/SubwayNav/SubwayNav/utilities/utilities/common.ts
+++ b/SubwayNav/SubwayNav/utilities/utilities/common.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import { ScreenWidthMinLarge } from '@fluentui/react';
import { clone } from 'ramda';
diff --git a/SubwayNav/SubwayNav/utilities/utilities/index.ts b/SubwayNav/SubwayNav/utilities/utilities/index.ts
index 2dc669d4..cac5e9f9 100644
--- a/SubwayNav/SubwayNav/utilities/utilities/index.ts
+++ b/SubwayNav/SubwayNav/utilities/utilities/index.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
export {
backgroundSlideDownInAnimation,
backgroundSlideDownInAnimationStr,
diff --git a/SubwayNav/SubwayNav/utilities/wizard-action-bar/index.ts b/SubwayNav/SubwayNav/utilities/wizard-action-bar/index.ts
index 267e473d..3cc0118d 100644
--- a/SubwayNav/SubwayNav/utilities/wizard-action-bar/index.ts
+++ b/SubwayNav/SubwayNav/utilities/wizard-action-bar/index.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
export { WizardActionBar } from './wizard-action-bar';
export { WizardActionBarBase } from './wizard-action-bar.base';
export {
diff --git a/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.base.tsx b/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.base.tsx
index caf564bc..4634baa7 100644
--- a/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.base.tsx
+++ b/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.base.tsx
@@ -1,7 +1,8 @@
+// @ts-nocheck
import { classNamesFunction, DefaultButton, PrimaryButton } from '@fluentui/react';
import type { FC } from 'react';
import * as React from 'react';
-
+// @ts-ignore
import { generateWizardClickHandler, generateWizardClickHandler1, shouldWizardBeNarrow } from '../utilities/common';
import type {
IWizardActionBarProps,
diff --git a/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.styles.ts b/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.styles.ts
index b6668aa9..4b4631d2 100644
--- a/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.styles.ts
+++ b/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.styles.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type { IStyle } from '@fluentui/react';
import { detailPanelGutterWidth } from '../customizations/src';
diff --git a/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.tsx b/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.tsx
index 6330af17..6a9a0dea 100644
--- a/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.tsx
+++ b/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
import { styled } from '@fluentui/react';
import type { FC } from 'react';
diff --git a/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.types.ts b/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.types.ts
index ad81a949..f9146958 100644
--- a/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.types.ts
+++ b/SubwayNav/SubwayNav/utilities/wizard-action-bar/wizard-action-bar.types.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type {
IButtonProps,
IButtonStyles,
diff --git a/SubwayNav/SubwayNav/utilities/wizard/index.ts b/SubwayNav/SubwayNav/utilities/wizard/index.ts
index 83612c2d..3924ecd7 100644
--- a/SubwayNav/SubwayNav/utilities/wizard/index.ts
+++ b/SubwayNav/SubwayNav/utilities/wizard/index.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
export { Wizard } from './wizard';
export { WizardBase } from './wizard.base';
export {
diff --git a/SubwayNav/SubwayNav/utilities/wizard/wizard.base.tsx b/SubwayNav/SubwayNav/utilities/wizard/wizard.base.tsx
index 5f7ba9c9..8889cdcc 100644
--- a/SubwayNav/SubwayNav/utilities/wizard/wizard.base.tsx
+++ b/SubwayNav/SubwayNav/utilities/wizard/wizard.base.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
import type { ICalloutPositionedInfo, IProcessedStyleSet } from '@fluentui/react';
import { Announced, Callout, classNamesFunction, DirectionalHint } from '@fluentui/react';
import { Collapsible } from '../collapsible/src/collapsible';
@@ -10,20 +11,20 @@ import { SubwayNav } from '../subway-nav/subway-nav';
import { SubwayNode } from '../subway-node/index';
import {
- getStepIndex,
+ getStepIndex,
getStepToShow,
isDestinationStepAhead,
- shouldHideScrollBarPresence,
+ shouldHideScrollBarPresence,
shouldShowScrollBarPresence,
shouldWizardBeNarrow,
wrapStepClickWithCloseFunction,
} from '../utilities/index';
import type {
- IWizardProps,
+ IWizardProps,
IWizardState,
IWizardStepIndex,
IWizardStepProps,
- IWizardStyleProps,
+ IWizardStyleProps,
IWizardStyles,
} from './wizard.types';
@@ -31,220 +32,217 @@ const getClassNames = classNamesFunction
();
/** Component for Wizard Base */
export class WizardBase extends React.Component {
- private _collapsibleElement: HTMLElement | null;
+ private _collapsibleElement: HTMLElement | null;
private _rootRef: React.RefObject;
- private _contentSectionRef: React.RefObject;
+ private _contentSectionRef: React.RefObject;
private _resizeObserver?: ResizeObserver;
private lastStepIndexShown: IWizardStepIndex;
- private isLastStepSubStep: boolean;
+ private isLastStepSubStep: boolean;
- private clickedForward: boolean | undefined;
+ private clickedForward: boolean | undefined;
private clickedBackward: boolean | undefined;
private isSubStep: boolean;
- private isFirstSubStep: boolean;
+ private isFirstSubStep: boolean;
- private _rootWidth: number;
+ private _rootWidth: number;
private _classNames: IProcessedStyleSet;
- constructor(props: IWizardProps) {
+ constructor(props: IWizardProps) {
super(props);
- this.state = {
+ this.state = {
isNarrow: false,
- isContentScrollBarPresent: true,
+ isContentScrollBarPresent: true,
isCalloutExpanded: false,
hideCalloutOverFlow: true,
};
- this._rootRef = React.createRef();
+ this._rootRef = React.createRef();
this._contentSectionRef = React.createRef();
this._toggleCallout = this._toggleCallout.bind(this);
this._onCalloutDismiss = this._onCalloutDismiss.bind(this);
- this._onRenderCollapsibleTitle = this._onRenderCollapsibleTitle.bind(this);
+ this._onRenderCollapsibleTitle = this._onRenderCollapsibleTitle.bind(this);
this._onRenderContent = this._onRenderContent.bind(this);
this._onRenderLoading = this._onRenderLoading.bind(this);
this._onCalloutPositioned = this._onCalloutPositioned.bind(this);
- this._updateScrollBarPresence = this._updateScrollBarPresence.bind(this);
+ this._updateScrollBarPresence = this._updateScrollBarPresence.bind(this);
- const wizardStepProps = this.props.stepToShow ? this.props.stepToShow : getStepToShow(this.props);
+ const wizardStepProps = this.props.stepToShow ? this.props.stepToShow : getStepToShow(this.props);
- this.lastStepIndexShown = getStepIndex(this.props.steps, wizardStepProps.id);
- }
+ this.lastStepIndexShown = getStepIndex(this.props.steps, wizardStepProps.id);
+ }
- public componentDidMount(): void {
+ public componentDidMount(): void {
const rootDiv = this._rootRef.current;
- // eslint-disable-next-line @typescript-eslint/unbound-method
- const { resizeObserverRef, onIsNarrowChanged = this._defaultIsNarrowChanged } =
- this.props;
+ // eslint-disable-next-line @typescript-eslint/unbound-method
+ const { resizeObserverRef, onIsNarrowChanged = this._defaultIsNarrowChanged } = this.props;
- if (rootDiv) {
+ if (rootDiv) {
// if we are passed a constructor for a ponyfill, use that instead
const ROConstructor = resizeObserverRef ? resizeObserverRef : ResizeObserver;
- this._resizeObserver = new ROConstructor((entries: ReadonlyArray) => {
- const { isNarrow } = this.state;
+ this._resizeObserver = new ROConstructor((entries: ReadonlyArray) => {
+ const { isNarrow } = this.state;
- const rootDivWidth = entries[0].contentRect.width;
+ const rootDivWidth = entries[0].contentRect.width;
- this._rootWidth = rootDivWidth;
+ this._rootWidth = rootDivWidth;
- if (!isNarrow && shouldWizardBeNarrow(rootDivWidth)) {
- this.setState({ isNarrow: true });
- onIsNarrowChanged(true);
- } else if (isNarrow && !shouldWizardBeNarrow(rootDivWidth)) {
- this.setState({ isNarrow: false });
- onIsNarrowChanged(false);
- }
- });
+ if (!isNarrow && shouldWizardBeNarrow(rootDivWidth)) {
+ this.setState({ isNarrow: true });
+ onIsNarrowChanged(true);
+ } else if (isNarrow && !shouldWizardBeNarrow(rootDivWidth)) {
+ this.setState({ isNarrow: false });
+ onIsNarrowChanged(false);
+ }
+ });
- this._resizeObserver.observe(rootDiv);
- }
+ this._resizeObserver.observe(rootDiv);
}
+ }
- public componentDidUpdate(): void {
+ public componentDidUpdate(): void {
this._updateScrollBarPresence();
- }
+ }
- public componentWillUnmount(): void {
+ public componentWillUnmount(): void {
if (this._resizeObserver !== undefined) {
this._resizeObserver.disconnect();
- }
}
+ }
- public render() {
+ public render() {
const {
steps,
wizardComplete,
subwayNavProps,
navAriaLabel,
collapsibleProps,
- calloutProps,
+ calloutProps,
loadingPaneProps,
showProgressIndicator,
// eslint-disable-next-line @typescript-eslint/unbound-method
- onRenderLoading = this._onRenderLoading,
+ onRenderLoading = this._onRenderLoading,
// eslint-disable-next-line @typescript-eslint/unbound-method
- onRenderContent = this._onRenderContent,
+ onRenderContent = this._onRenderContent,
optOutOfFocusBehavior = false,
- isLoading,
+ isLoading,
styles,
theme,
- } = this.props;
+ } = this.props;
const { isNarrow, isCalloutExpanded, isContentScrollBarPresent } = this.state;
- if (steps.length === 0) {
+ if (steps.length === 0) {
throw new Error('Wizard must have at least one step.');
}
- if (subwayNavProps?.steps) {
- console.warn(
- 'It looks like you passed in steps to the subway nav props for the wizard. Instead please use the \'steps\' props on the top level wizard props.',
+ if (subwayNavProps?.steps) {
+ console.warn(
+ "It looks like you passed in steps to the subway nav props for the wizard. Instead please use the 'steps' props on the top level wizard props."
);
}
- if (calloutProps?.styles) {
- console.warn(
- 'It looks like you passed in calloutProps.styles. These will be over ridden. Please use WizardProps.styles.subComponentStyles.calloutContent instead.',
- );
+ if (calloutProps?.styles) {
+ console.warn(
+ 'It looks like you passed in calloutProps.styles. These will be overridden. Please use WizardProps.styles.subComponentStyles.calloutContent instead.'
+ );
}
- if (collapsibleProps?.styles) {
+ if (collapsibleProps?.styles) {
console.warn(
- 'It looks like you passed in collapsibleProps.styles. These will be over ridden. Please use WizardProps.styles.subComponentStyles.collapsibleProps instead.',
- );
- }
+ 'It looks like you passed in collapsibleProps.styles. These will be overridden. Please use WizardProps.styles.subComponentStyles.collapsibleProps instead.'
+ );
+ }
- if (loadingPaneProps?.styles) {
- console.warn(
- 'It looks like you passed in loadingPaneProps.styles. These will be over ridden. Please use WizardProps.styles.subComponentStyles.loadingPane instead.',
+ if (loadingPaneProps?.styles) {
+ console.warn(
+ 'It looks like you passed in loadingPaneProps.styles. These will be overridden. Please use WizardProps.styles.subComponentStyles.loadingPane instead.'
);
}
- if (showProgressIndicator !== undefined) {
- console.warn(
- 'It looks like you passed in showProgressIndicator. isLoading takes priority over it and showProgressIndicator will be deprecated in the future. Please use isLoading instead.',
- );
+ if (showProgressIndicator !== undefined) {
+ console.warn(
+ 'It looks like you passed in showProgressIndicator. isLoading takes priority over it and showProgressIndicator will be deprecated in the future. Please use isLoading instead.'
+ );
}
- // if the step to render is already passed in, use that
- const wizardStepProps = this.props.stepToShow ? this.props.stepToShow : getStepToShow(this.props);
+ // if the step to render is already passed in, use that
+ const wizardStepProps = this.props.stepToShow ? this.props.stepToShow : getStepToShow(this.props);
const currentStepIndex = getStepIndex(this.props.steps, wizardStepProps.id);
- const isDestStepAhead = isDestinationStepAhead(currentStepIndex, this.lastStepIndexShown);
+ const isDestStepAhead = isDestinationStepAhead(currentStepIndex, this.lastStepIndexShown);
- this.clickedForward = isDestStepAhead === true || isDestStepAhead !== undefined;
+ this.clickedForward = isDestStepAhead === true || isDestStepAhead !== undefined;
this.clickedBackward = isDestStepAhead === false || isDestStepAhead !== undefined;
- this.isSubStep = wizardStepProps.isSubStep!;
+ this.isSubStep = wizardStepProps.isSubStep!;
this.isFirstSubStep = wizardStepProps.isFirstSubStep!;
- let stepsClone = steps;
+ let stepsClone = steps;
- if (isNarrow) {
+ if (isNarrow) {
// Parents with sub steps shouldn't close the panel.
- // Only sub steps and steps without sub steps.
+ // Only sub steps and steps without sub steps.
stepsClone = steps.map((step: IWizardStepProps) => {
- if (step.subSteps === undefined) {
+ if (step.subSteps === undefined) {
return {
...step,
- onClickStep: wrapStepClickWithCloseFunction(
+ onClickStep: wrapStepClickWithCloseFunction(
step,
// eslint-disable-next-line @typescript-eslint/unbound-method
this._onCalloutDismiss,
- step.onClickStep,
- ),
+ step.onClickStep
+ ),
};
} else {
- return {
+ return {
...step,
subSteps: step.subSteps.map((subStep: IWizardStepProps) => {
- return {
+ return {
...subStep,
onClickStep: wrapStepClickWithCloseFunction(
subStep,
// eslint-disable-next-line @typescript-eslint/unbound-method
this._onCalloutDismiss,
- subStep.onClickStep,
+ subStep.onClickStep
),
};
}),
};
- }
+ }
});
}
- let offsetIndex = 0;
+ let offsetIndex = 0;
- if (this.isSubStep) {
+ if (this.isSubStep) {
stepsClone.forEach((value: IWizardStepProps) => {
if (value.subSteps) {
value.subSteps.forEach((subStep: IWizardStepProps, index: number) => {
- if (wizardStepProps.id === subStep.id) {
+ if (wizardStepProps.id === subStep.id) {
offsetIndex = index;
}
});
- }
+ }
});
}
- const contentSectionKey = 'contentSection-' + wizardStepProps.id;
+ const contentSectionKey = 'contentSection-' + wizardStepProps.id;
- // Update the step index showing
+ // Update the step index showing
this.lastStepIndexShown = currentStepIndex;
this.isLastStepSubStep = wizardStepProps.isSubStep!;
- // Update previous step visited is a sub step
- this.isLastStepSubStep = this.isSubStep;
+ // Update previous step visited is a sub step
+ this.isLastStepSubStep = this.isSubStep;
/* tslint:disable-next-line:deprecation */
const showLoading = !!(isLoading ?? showProgressIndicator);
const wizardStyleProps = {
- theme: theme!,
+ theme: theme!,
isSubStep: this.isSubStep,
isFirstSubStep: this.isFirstSubStep,
clickedForward: this.clickedForward,
- backgroundImageUrl: wizardStepProps.backgroundImageUrl
- ? wizardStepProps.backgroundImageUrl
- : '',
+ backgroundImageUrl: wizardStepProps.backgroundImageUrl ? wizardStepProps.backgroundImageUrl : '',
stepBackgroundIndex: offsetIndex,
isLastStepSubStep: this.isLastStepSubStep,
isContentScrollBarPresent: isContentScrollBarPresent,
@@ -252,16 +250,16 @@ export class WizardBase extends React.Component {
isLoading: showLoading,
};
- this._classNames = getClassNames(styles, wizardStyleProps);
+ this._classNames = getClassNames(styles, wizardStyleProps);
- if ((isLoading || this.clickedBackward || this.clickedForward) && !optOutOfFocusBehavior) {
- this._contentSectionRef.current?.focus();
+ if ((isLoading || this.clickedBackward || this.clickedForward) && !optOutOfFocusBehavior) {
+ this._contentSectionRef.current?.focus();
}
- return (
+ return (
<>
- {wizardStepProps.announcedProps && }
- {isNarrow && (
+ {wizardStepProps.announcedProps && }
+ {isNarrow && (
<>
{
disabled={showLoading}
// eslint-disable-next-line @typescript-eslint/unbound-method
onRenderTitle={this._onRenderCollapsibleTitle}
- {...collapsibleProps}
+ {...collapsibleProps}
// eslint-disable-next-line @typescript-eslint/unbound-method
onToggle={this._toggleCallout}
styles={this._classNames.subComponentStyles.collapsible}
- />
+ />
{isCalloutExpanded && (
{
directionalHint={DirectionalHint.bottomLeftEdge}
directionalHintFixed={true}
target={this._collapsibleElement}
- {...calloutProps}
+ {...calloutProps}
// eslint-disable-next-line @typescript-eslint/unbound-method
onPositioned={this._onCalloutPositioned}
// eslint-disable-next-line @typescript-eslint/unbound-method
- onDismiss={this._onCalloutDismiss}
+ onDismiss={this._onCalloutDismiss}
styles={this._classNames.subComponentStyles.calloutContent}
- >
+ >
+ />
)}
>
)}
- {!isNarrow && (
+ {!isNarrow && (
)}
{onRenderContent(this.props)}
{onRenderLoading(this.props)}
-
+
>
);
}
- private _onRenderCollapsibleTitle(): JSX.Element {
+ private _onRenderCollapsibleTitle(): JSX.Element {
return (