@cloudscape-design/components 3.0.0

package/wizard/unmount.js

@@ -0,0 +1,19 @@
+import { __extends } from "tslib";
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+var Unmount = /** @class */ (function (_super) {
+    __extends(Unmount, _super);
+    function Unmount() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Unmount.prototype.componentWillUnmount = function () {
+        this.props.onUnmount();
+    };
+    Unmount.prototype.render = function () {
+        return this.props.children;
+    };
+    return Unmount;
+}(React.Component));
+export default Unmount;
+//# sourceMappingURL=unmount.js.map

package/wizard/unmount.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"unmount.js","sourceRoot":"","sources":["../../../src/wizard/unmount.ts"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;IAAqC,2BAAqE;IAA1G;;IAQA,CAAC;IAPC,sCAAoB,GAApB;QACE,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC;IACzB,CAAC;IAED,wBAAM,GAAN;QACE,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;IAC7B,CAAC;IACH,cAAC;AAAD,CAAC,AARD,CAAqC,KAAK,CAAC,SAAS,GAQnD","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nexport default class Unmount extends React.Component<{ onUnmount: () => void; children: React.ReactNode }> {\n  componentWillUnmount() {\n    this.props.onUnmount();\n  }\n\n  render() {\n    return this.props.children;\n  }\n}\n"]}

package/wizard/wizard-actions.d.ts

@@ -0,0 +1,16 @@
+interface WizardActionsProps {
+    cancelButtonText: string;
+    onCancelClick: () => void;
+    isPrimaryLoading: boolean;
+    primaryButtonText: string;
+    onPrimaryClick: () => void;
+    showPrevious: boolean;
+    previousButtonText: string;
+    onPreviousClick: () => void;
+    showSkipTo: boolean;
+    skipToButtonText?: string;
+    onSkipToClick: () => void;
+}
+export default function WizardActions({ cancelButtonText, onCancelClick, isPrimaryLoading, primaryButtonText, onPrimaryClick, showPrevious, previousButtonText, onPreviousClick, showSkipTo, skipToButtonText, onSkipToClick, }: WizardActionsProps): JSX.Element;
+export {};
+//# sourceMappingURL=wizard-actions.d.ts.map

package/wizard/wizard-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"wizard-actions.d.ts","sourceRoot":"","sources":["../../../src/wizard/wizard-actions.tsx"],"names":[],"mappings":"AASA,UAAU,kBAAkB;IAC1B,gBAAgB,EAAE,MAAM,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,YAAY,EAAE,OAAO,CAAC;IACtB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,gBAAgB,EAChB,aAAa,EACb,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,EACd,YAAY,EACZ,kBAAkB,EAClB,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,aAAa,GACd,EAAE,kBAAkB,eA2DpB"}

package/wizard/wizard-actions.js

@@ -0,0 +1,33 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React, { useRef } from 'react';
+import { InternalButton } from '../button/internal';
+import InternalSpaceBetween from '../space-between/internal';
+import styles from './styles.css.js';
+import Unmount from './unmount';
+export default function WizardActions(_a) {
+    var cancelButtonText = _a.cancelButtonText, onCancelClick = _a.onCancelClick, isPrimaryLoading = _a.isPrimaryLoading, primaryButtonText = _a.primaryButtonText, onPrimaryClick = _a.onPrimaryClick, showPrevious = _a.showPrevious, previousButtonText = _a.previousButtonText, onPreviousClick = _a.onPreviousClick, showSkipTo = _a.showSkipTo, skipToButtonText = _a.skipToButtonText, onSkipToClick = _a.onSkipToClick;
+    var containerRef = useRef(null);
+    var primaryButtonRef = useRef(null);
+    var onPreviousUnmount = function () {
+        var _a, _b;
+        if (((_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.querySelector(".".concat(styles['previous-button']))) === document.activeElement) {
+            (_b = primaryButtonRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+        }
+    };
+    var onSkipUnmount = function () {
+        var _a, _b;
+        if (((_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.querySelector(".".concat(styles['skip-to-button']))) === document.activeElement) {
+            (_b = primaryButtonRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+        }
+    };
+    return (React.createElement("div", { ref: containerRef },
+        React.createElement(InternalSpaceBetween, { direction: "horizontal", size: "xs", className: styles['action-buttons'] },
+            React.createElement(InternalButton, { className: styles['cancel-button'], variant: "link", formAction: "none", onClick: onCancelClick }, cancelButtonText),
+            showSkipTo && skipToButtonText && (React.createElement(Unmount, { onUnmount: onSkipUnmount },
+                React.createElement(InternalButton, { className: styles['skip-to-button'], onClick: onSkipToClick, formAction: "none", disabled: isPrimaryLoading }, skipToButtonText))),
+            showPrevious && (React.createElement(Unmount, { onUnmount: onPreviousUnmount },
+                React.createElement(InternalButton, { className: styles['previous-button'], onClick: onPreviousClick, formAction: "none", disabled: isPrimaryLoading }, previousButtonText))),
+            React.createElement(InternalButton, { ref: primaryButtonRef, className: styles['primary-button'], variant: "primary", formAction: "none", onClick: onPrimaryClick, loading: isPrimaryLoading }, primaryButtonText))));
+}
+//# sourceMappingURL=wizard-actions.js.map

package/wizard/wizard-actions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wizard-actions.js","sourceRoot":"","sources":["../../../src/wizard/wizard-actions.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,oBAAoB,MAAM,2BAA2B,CAAC;AAC7D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,OAAO,MAAM,WAAW,CAAC;AAgBhC,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAYjB;QAXnB,gBAAgB,sBAAA,EAChB,aAAa,mBAAA,EACb,gBAAgB,sBAAA,EAChB,iBAAiB,uBAAA,EACjB,cAAc,oBAAA,EACd,YAAY,kBAAA,EACZ,kBAAkB,wBAAA,EAClB,eAAe,qBAAA,EACf,UAAU,gBAAA,EACV,gBAAgB,sBAAA,EAChB,aAAa,mBAAA;IAEb,IAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,IAAM,gBAAgB,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAEvD,IAAM,iBAAiB,GAAG;;QACxB,IAAI,CAAA,MAAA,YAAY,CAAC,OAAO,0CAAE,aAAa,CAAC,WAAI,MAAM,CAAC,iBAAiB,CAAC,CAAE,CAAC,MAAK,QAAQ,CAAC,aAAa,EAAE;YACnG,MAAA,gBAAgB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;SACnC;IACH,CAAC,CAAC;IAEF,IAAM,aAAa,GAAG;;QACpB,IAAI,CAAA,MAAA,YAAY,CAAC,OAAO,0CAAE,aAAa,CAAC,WAAI,MAAM,CAAC,gBAAgB,CAAC,CAAE,CAAC,MAAK,QAAQ,CAAC,aAAa,EAAE;YAClG,MAAA,gBAAgB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;SACnC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,6BAAK,GAAG,EAAE,YAAY;QACpB,oBAAC,oBAAoB,IAAC,SAAS,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI,EAAC,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC;YACxF,oBAAC,cAAc,IAAC,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,EAAE,OAAO,EAAC,MAAM,EAAC,UAAU,EAAC,MAAM,EAAC,OAAO,EAAE,aAAa,IACxG,gBAAgB,CACF;YAChB,UAAU,IAAI,gBAAgB,IAAI,CACjC,oBAAC,OAAO,IAAC,SAAS,EAAE,aAAa;gBAC/B,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,EACnC,OAAO,EAAE,aAAa,EACtB,UAAU,EAAC,MAAM,EACjB,QAAQ,EAAE,gBAAgB,IAEzB,gBAAgB,CACF,CACT,CACX;YACA,YAAY,IAAI,CACf,oBAAC,OAAO,IAAC,SAAS,EAAE,iBAAiB;gBACnC,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC,EACpC,OAAO,EAAE,eAAe,EACxB,UAAU,EAAC,MAAM,EACjB,QAAQ,EAAE,gBAAgB,IAEzB,kBAAkB,CACJ,CACT,CACX;YACD,oBAAC,cAAc,IACb,GAAG,EAAE,gBAAgB,EACrB,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,EACnC,OAAO,EAAC,SAAS,EACjB,UAAU,EAAC,MAAM,EACjB,OAAO,EAAE,cAAc,EACvB,OAAO,EAAE,gBAAgB,IAExB,iBAAiB,CACH,CACI,CACnB,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport { InternalButton } from '../button/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport styles from './styles.css.js';\nimport { ButtonProps } from '../button/interfaces';\nimport Unmount from './unmount';\n\ninterface WizardActionsProps {\n  cancelButtonText: string;\n  onCancelClick: () => void;\n  isPrimaryLoading: boolean;\n  primaryButtonText: string;\n  onPrimaryClick: () => void;\n  showPrevious: boolean;\n  previousButtonText: string;\n  onPreviousClick: () => void;\n  showSkipTo: boolean;\n  skipToButtonText?: string;\n  onSkipToClick: () => void;\n}\n\nexport default function WizardActions({\n  cancelButtonText,\n  onCancelClick,\n  isPrimaryLoading,\n  primaryButtonText,\n  onPrimaryClick,\n  showPrevious,\n  previousButtonText,\n  onPreviousClick,\n  showSkipTo,\n  skipToButtonText,\n  onSkipToClick,\n}: WizardActionsProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const primaryButtonRef = useRef<ButtonProps.Ref>(null);\n\n  const onPreviousUnmount = () => {\n    if (containerRef.current?.querySelector(`.${styles['previous-button']}`) === document.activeElement) {\n      primaryButtonRef.current?.focus();\n    }\n  };\n\n  const onSkipUnmount = () => {\n    if (containerRef.current?.querySelector(`.${styles['skip-to-button']}`) === document.activeElement) {\n      primaryButtonRef.current?.focus();\n    }\n  };\n\n  return (\n    <div ref={containerRef}>\n      <InternalSpaceBetween direction=\"horizontal\" size=\"xs\" className={styles['action-buttons']}>\n        <InternalButton className={styles['cancel-button']} variant=\"link\" formAction=\"none\" onClick={onCancelClick}>\n          {cancelButtonText}\n        </InternalButton>\n        {showSkipTo && skipToButtonText && (\n          <Unmount onUnmount={onSkipUnmount}>\n            <InternalButton\n              className={styles['skip-to-button']}\n              onClick={onSkipToClick}\n              formAction=\"none\"\n              disabled={isPrimaryLoading}\n            >\n              {skipToButtonText}\n            </InternalButton>\n          </Unmount>\n        )}\n        {showPrevious && (\n          <Unmount onUnmount={onPreviousUnmount}>\n            <InternalButton\n              className={styles['previous-button']}\n              onClick={onPreviousClick}\n              formAction=\"none\"\n              disabled={isPrimaryLoading}\n            >\n              {previousButtonText}\n            </InternalButton>\n          </Unmount>\n        )}\n        <InternalButton\n          ref={primaryButtonRef}\n          className={styles['primary-button']}\n          variant=\"primary\"\n          formAction=\"none\"\n          onClick={onPrimaryClick}\n          loading={isPrimaryLoading}\n        >\n          {primaryButtonText}\n        </InternalButton>\n      </InternalSpaceBetween>\n    </div>\n  );\n}\n"]}

package/wizard/wizard-form-header.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface WizardFormHeaderProps {
+    children: React.ReactNode;
+    isMobile: boolean;
+    isVisualRefresh: boolean;
+}
+export default function WizardFormHeader({ children, isVisualRefresh }: WizardFormHeaderProps): JSX.Element;
+export {};
+//# sourceMappingURL=wizard-form-header.d.ts.map

package/wizard/wizard-form-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"wizard-form-header.d.ts","sourceRoot":"","sources":["../../../src/wizard/wizard-form-header.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAK3D,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EAAE,QAAQ,EAAE,eAAe,EAAE,EAAE,qBAAqB,eA6B5F"}

package/wizard/wizard-form-header.js

@@ -0,0 +1,24 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import clsx from 'clsx';
+import React, { useContext, useLayoutEffect } from 'react';
+import { AppLayoutContext } from '../app-layout/visual-refresh/context.js';
+import { useContainerQuery } from '../internal/hooks/container-queries';
+import styles from './styles.css.js';
+export default function WizardFormHeader(_a) {
+    var children = _a.children, isVisualRefresh = _a.isVisualRefresh;
+    /**
+     * Observe the dynamic height of the Wizard header in visual refresh and
+     * update the AppLayout dynamicOverlapHeight property.
+     */
+    var setDynamicOverlapHeight = useContext(AppLayoutContext).setDynamicOverlapHeight;
+    var _b = useContainerQuery(function (rect) { return rect.height; }), overlapContainerQuery = _b[0], overlapElement = _b[1];
+    useLayoutEffect(function handleDynamicOverlapHeight() {
+        if (isVisualRefresh) {
+            setDynamicOverlapHeight(overlapContainerQuery !== null && overlapContainerQuery !== void 0 ? overlapContainerQuery : 0);
+        }
+    }, [isVisualRefresh, overlapContainerQuery, setDynamicOverlapHeight]);
+    return (React.createElement("div", { className: clsx(styles['form-header'], isVisualRefresh && styles['form-header-refresh'], isVisualRefresh && 'awsui-context-content-header'), ref: overlapElement },
+        React.createElement("div", { className: clsx(styles['form-header-content']) }, children)));
+}
+//# sourceMappingURL=wizard-form-header.js.map

package/wizard/wizard-form-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wizard-form-header.js","sourceRoot":"","sources":["../../../src/wizard/wizard-form-header.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AACxE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAQrC,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EAAoD;QAAlD,QAAQ,cAAA,EAAE,eAAe,qBAAA;IAClE;;;OAGG;IACK,IAAA,uBAAuB,GAAK,UAAU,CAAC,gBAAgB,CAAC,wBAAjC,CAAkC;IAC3D,IAAA,KAA0C,iBAAiB,CAAC,UAAA,IAAI,IAAI,OAAA,IAAI,CAAC,MAAM,EAAX,CAAW,CAAC,EAA/E,qBAAqB,QAAA,EAAE,cAAc,QAA0C,CAAC;IAEvF,eAAe,CACb,SAAS,0BAA0B;QACjC,IAAI,eAAe,EAAE;YACnB,uBAAuB,CAAC,qBAAqB,aAArB,qBAAqB,cAArB,qBAAqB,GAAI,CAAC,CAAC,CAAC;SACrD;IACH,CAAC,EACD,CAAC,eAAe,EAAE,qBAAqB,EAAE,uBAAuB,CAAC,CAClE,CAAC;IAEF,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,aAAa,CAAC,EACrB,eAAe,IAAI,MAAM,CAAC,qBAAqB,CAAC,EAChD,eAAe,IAAI,8BAA8B,CAClD,EACD,GAAG,EAAE,cAAc;QAEnB,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,IAAG,QAAQ,CAAO,CACjE,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useContext, useLayoutEffect } from 'react';\nimport { AppLayoutContext } from '../app-layout/visual-refresh/context.js';\nimport { useContainerQuery } from '../internal/hooks/container-queries';\nimport styles from './styles.css.js';\n\ninterface WizardFormHeaderProps {\n  children: React.ReactNode;\n  isMobile: boolean;\n  isVisualRefresh: boolean;\n}\n\nexport default function WizardFormHeader({ children, isVisualRefresh }: WizardFormHeaderProps) {\n  /**\n   * Observe the dynamic height of the Wizard header in visual refresh and\n   * update the AppLayout dynamicOverlapHeight property.\n   */\n  const { setDynamicOverlapHeight } = useContext(AppLayoutContext);\n  const [overlapContainerQuery, overlapElement] = useContainerQuery(rect => rect.height);\n\n  useLayoutEffect(\n    function handleDynamicOverlapHeight() {\n      if (isVisualRefresh) {\n        setDynamicOverlapHeight(overlapContainerQuery ?? 0);\n      }\n    },\n    [isVisualRefresh, overlapContainerQuery, setDynamicOverlapHeight]\n  );\n\n  return (\n    <div\n      className={clsx(\n        styles['form-header'],\n        isVisualRefresh && styles['form-header-refresh'],\n        isVisualRefresh && 'awsui-context-content-header'\n      )}\n      ref={overlapElement}\n    >\n      <div className={clsx(styles['form-header-content'])}>{children}</div>\n    </div>\n  );\n}\n"]}

package/wizard/wizard-form.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { WizardProps } from './interfaces';
+interface WizardFormProps {
+    steps: ReadonlyArray<WizardProps.Step>;
+    activeStepIndex: number;
+    isVisualRefresh: boolean;
+    showCollapsedSteps: boolean;
+    i18nStrings: WizardProps.I18nStrings;
+    isPrimaryLoading: boolean;
+    allowSkipTo: boolean;
+    secondaryActions?: React.ReactNode;
+    onCancelClick: () => void;
+    onPreviousClick: () => void;
+    onPrimaryClick: () => void;
+    onSkipToClick: (stepIndex: number) => void;
+}
+export default function WizardForm({ steps, activeStepIndex, isVisualRefresh, showCollapsedSteps, i18nStrings, isPrimaryLoading, allowSkipTo, secondaryActions, onCancelClick, onPreviousClick, onPrimaryClick, onSkipToClick, }: WizardFormProps): JSX.Element;
+export {};
+//# sourceMappingURL=wizard-form.d.ts.map

package/wizard/wizard-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"wizard-form.d.ts","sourceRoot":"","sources":["../../../src/wizard/wizard-form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAI3C,UAAU,eAAe;IACvB,KAAK,EAAE,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IACvC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC;IACrC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,aAAa,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,KAAK,EACL,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,WAAW,EACX,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,eAAe,EACf,cAAc,EACd,aAAa,GACd,EAAE,eAAe,eAqDjB"}

package/wizard/wizard-form.js

@@ -0,0 +1,36 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import clsx from 'clsx';
+import InternalForm from '../form/internal';
+import InternalHeader from '../header/internal';
+import { useMobile } from '../internal/hooks/use-mobile';
+import WizardActions from './wizard-actions';
+import WizardFormHeader from './wizard-form-header';
+import styles from './styles.css.js';
+export default function WizardForm(_a) {
+    var steps = _a.steps, activeStepIndex = _a.activeStepIndex, isVisualRefresh = _a.isVisualRefresh, showCollapsedSteps = _a.showCollapsedSteps, i18nStrings = _a.i18nStrings, isPrimaryLoading = _a.isPrimaryLoading, allowSkipTo = _a.allowSkipTo, secondaryActions = _a.secondaryActions, onCancelClick = _a.onCancelClick, onPreviousClick = _a.onPreviousClick, onPrimaryClick = _a.onPrimaryClick, onSkipToClick = _a.onSkipToClick;
+    var _b = steps[activeStepIndex] || {}, title = _b.title, info = _b.info, description = _b.description, content = _b.content, errorText = _b.errorText, isOptional = _b.isOptional;
+    var isLastStep = activeStepIndex >= steps.length - 1;
+    var skipToTargetIndex = findSkipToTargetIndex(steps, activeStepIndex);
+    var isMobile = useMobile();
+    var showSkipTo = allowSkipTo && skipToTargetIndex !== -1;
+    var skipToButtonText = skipToTargetIndex !== -1 && i18nStrings.skipToButtonLabel
+        ? i18nStrings.skipToButtonLabel(steps[skipToTargetIndex], skipToTargetIndex + 1)
+        : undefined;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(WizardFormHeader, { isMobile: isMobile || showCollapsedSteps, isVisualRefresh: isVisualRefresh },
+            React.createElement("div", { className: clsx(styles['collapsed-steps'], !showCollapsedSteps && styles['collapsed-steps-hidden'], isVisualRefresh && isMobile && styles['collapsed-steps-extra-padding']) }, i18nStrings.collapsedStepsLabel(activeStepIndex + 1, steps.length)),
+            React.createElement(InternalHeader, { className: styles['form-header-component'], variant: "h1", description: description, info: info },
+                title,
+                isOptional && React.createElement("i", null, " - ".concat(i18nStrings.optional)))),
+        React.createElement(InternalForm, { className: clsx(styles['form-component']), actions: React.createElement(WizardActions, { cancelButtonText: i18nStrings.cancelButton, primaryButtonText: isLastStep ? i18nStrings.submitButton : i18nStrings.nextButton, previousButtonText: i18nStrings.previousButton, onCancelClick: onCancelClick, onPreviousClick: onPreviousClick, onPrimaryClick: onPrimaryClick, onSkipToClick: function () { return onSkipToClick(skipToTargetIndex); }, showPrevious: activeStepIndex !== 0, isPrimaryLoading: isPrimaryLoading, showSkipTo: showSkipTo, skipToButtonText: skipToButtonText }), secondaryActions: secondaryActions, errorText: errorText }, content)));
+}
+function findSkipToTargetIndex(steps, activeStepIndex) {
+    var nextRequiredStepIndex = activeStepIndex;
+    do {
+        nextRequiredStepIndex++;
+    } while (nextRequiredStepIndex < steps.length - 1 && steps[nextRequiredStepIndex].isOptional);
+    return nextRequiredStepIndex > activeStepIndex + 1 ? nextRequiredStepIndex : -1;
+}
+//# sourceMappingURL=wizard-form.js.map

package/wizard/wizard-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wizard-form.js","sourceRoot":"","sources":["../../../src/wizard/wizard-form.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport InternalForm from '../form/internal';\nimport InternalHeader from '../header/internal';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport WizardActions from './wizard-actions';\nimport { WizardProps } from './interfaces';\nimport WizardFormHeader from './wizard-form-header';\nimport styles from './styles.css.js';\n\ninterface WizardFormProps {\n  steps: ReadonlyArray<WizardProps.Step>;\n  activeStepIndex: number;\n  isVisualRefresh: boolean;\n  showCollapsedSteps: boolean;\n  i18nStrings: WizardProps.I18nStrings;\n  isPrimaryLoading: boolean;\n  allowSkipTo: boolean;\n  secondaryActions?: React.ReactNode;\n  onCancelClick: () => void;\n  onPreviousClick: () => void;\n  onPrimaryClick: () => void;\n  onSkipToClick: (stepIndex: number) => void;\n}\n\nexport default function WizardForm({\n  steps,\n  activeStepIndex,\n  isVisualRefresh,\n  showCollapsedSteps,\n  i18nStrings,\n  isPrimaryLoading,\n  allowSkipTo,\n  secondaryActions,\n  onCancelClick,\n  onPreviousClick,\n  onPrimaryClick,\n  onSkipToClick,\n}: WizardFormProps) {\n  const { title, info, description, content, errorText, isOptional } = steps[activeStepIndex] || {};\n  const isLastStep = activeStepIndex >= steps.length - 1;\n  const skipToTargetIndex = findSkipToTargetIndex(steps, activeStepIndex);\n  const isMobile = useMobile();\n\n  const showSkipTo = allowSkipTo && skipToTargetIndex !== -1;\n  const skipToButtonText =\n    skipToTargetIndex !== -1 && i18nStrings.skipToButtonLabel\n      ? i18nStrings.skipToButtonLabel(steps[skipToTargetIndex], skipToTargetIndex + 1)\n      : undefined;\n\n  return (\n    <>\n      <WizardFormHeader isMobile={isMobile || showCollapsedSteps} isVisualRefresh={isVisualRefresh}>\n        <div\n          className={clsx(\n            styles['collapsed-steps'],\n            !showCollapsedSteps && styles['collapsed-steps-hidden'],\n            isVisualRefresh && isMobile && styles['collapsed-steps-extra-padding']\n          )}\n        >\n          {i18nStrings.collapsedStepsLabel(activeStepIndex + 1, steps.length)}\n        </div>\n        <InternalHeader className={styles['form-header-component']} variant=\"h1\" description={description} info={info}>\n          {title}\n          {isOptional && <i>{` - ${i18nStrings.optional}`}</i>}\n        </InternalHeader>\n      </WizardFormHeader>\n      <InternalForm\n        className={clsx(styles['form-component'])}\n        actions={\n          <WizardActions\n            cancelButtonText={i18nStrings.cancelButton}\n            primaryButtonText={isLastStep ? i18nStrings.submitButton : i18nStrings.nextButton}\n            previousButtonText={i18nStrings.previousButton}\n            onCancelClick={onCancelClick}\n            onPreviousClick={onPreviousClick}\n            onPrimaryClick={onPrimaryClick}\n            onSkipToClick={() => onSkipToClick(skipToTargetIndex)}\n            showPrevious={activeStepIndex !== 0}\n            isPrimaryLoading={isPrimaryLoading}\n            showSkipTo={showSkipTo}\n            skipToButtonText={skipToButtonText}\n          />\n        }\n        secondaryActions={secondaryActions}\n        errorText={errorText}\n      >\n        {content}\n      </InternalForm>\n    </>\n  );\n}\n\nfunction findSkipToTargetIndex(steps: ReadonlyArray<WizardProps.Step>, activeStepIndex: number): number {\n  let nextRequiredStepIndex = activeStepIndex;\n  do {\n    nextRequiredStepIndex++;\n  } while (nextRequiredStepIndex < steps.length - 1 && steps[nextRequiredStepIndex].isOptional);\n\n  return nextRequiredStepIndex > activeStepIndex + 1 ? nextRequiredStepIndex : -1;\n}\n"]}

package/wizard/wizard-navigation.d.ts

@@ -0,0 +1,16 @@
+import { WizardProps } from './interfaces';
+interface NavigationProps {
+    activeStepIndex: number;
+    farthestStepIndex: number;
+    allowSkipTo: boolean;
+    hidden: boolean;
+    i18nStrings: WizardProps.I18nStrings;
+    isVisualRefresh: boolean;
+    isLoadingNextStep: boolean;
+    onStepClick: (stepIndex: number) => void;
+    onSkipToClick: (stepIndex: number) => void;
+    steps: ReadonlyArray<WizardProps.Step>;
+}
+export default function Navigation({ activeStepIndex, farthestStepIndex, allowSkipTo, hidden, i18nStrings, isVisualRefresh, isLoadingNextStep, onStepClick, onSkipToClick, steps, }: NavigationProps): JSX.Element;
+export {};
+//# sourceMappingURL=wizard-navigation.d.ts.map

package/wizard/wizard-navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"wizard-navigation.d.ts","sourceRoot":"","sources":["../../../src/wizard/wizard-navigation.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAG3C,UAAU,eAAe;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC;IACrC,eAAe,EAAE,OAAO,CAAC;IACzB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,WAAW,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,aAAa,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,KAAK,EAAE,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;CACxC;AAkBD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,eAAe,EACf,iBAAiB,EACjB,WAAW,EACX,MAAM,EACN,WAAW,EACX,eAAe,EACf,iBAAiB,EACjB,WAAW,EACX,aAAa,EACb,KAAK,GACN,EAAE,eAAe,eAyDjB"}

package/wizard/wizard-navigation.js

@@ -0,0 +1,105 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import clsx from 'clsx';
+import InternalLink from '../link/internal';
+import InternalBox from '../box/internal';
+import styles from './styles.css.js';
+var Statuses;
+(function (Statuses) {
+    Statuses["Active"] = "active";
+    Statuses["Unvisited"] = "unvisited";
+    Statuses["Visited"] = "visited";
+    Statuses["Next"] = "next";
+})(Statuses || (Statuses = {}));
+export default function Navigation(_a) {
+    var activeStepIndex = _a.activeStepIndex, farthestStepIndex = _a.farthestStepIndex, allowSkipTo = _a.allowSkipTo, hidden = _a.hidden, i18nStrings = _a.i18nStrings, isVisualRefresh = _a.isVisualRefresh, isLoadingNextStep = _a.isLoadingNextStep, onStepClick = _a.onStepClick, onSkipToClick = _a.onSkipToClick, steps = _a.steps;
+    return (React.createElement("nav", { className: clsx(styles.navigation, hidden && styles.hidden, isVisualRefresh && styles.refresh) },
+        React.createElement("ul", null, steps.map(function (step, index) {
+            return isVisualRefresh ? (React.createElement(NavigationStepVisualRefresh, { i18nStrings: i18nStrings, index: index, key: index, onStepClick: onStepClick, onSkipToClick: onSkipToClick, status: getStatus(index), step: step })) : (React.createElement(NavigationStepClassic, { i18nStrings: i18nStrings, index: index, key: index, onStepClick: onStepClick, onSkipToClick: onSkipToClick, status: getStatus(index), step: step }));
+        }))));
+    function getStatus(index) {
+        if (activeStepIndex === index) {
+            return Statuses.Active;
+        }
+        if (isLoadingNextStep) {
+            return Statuses.Unvisited;
+        }
+        if (farthestStepIndex >= index) {
+            return Statuses.Visited;
+        }
+        if (allowSkipTo && canSkip(activeStepIndex + 1, index)) {
+            return Statuses.Next;
+        }
+        return Statuses.Unvisited;
+    }
+    function canSkip(fromIndex, toIndex) {
+        var index = fromIndex;
+        do {
+            if (!steps[index].isOptional) {
+                return false;
+            }
+            index++;
+        } while (index < toIndex);
+        return true;
+    }
+}
+function NavigationStepVisualRefresh(_a) {
+    var _b;
+    var i18nStrings = _a.i18nStrings, index = _a.index, onStepClick = _a.onStepClick, onSkipToClick = _a.onSkipToClick, status = _a.status, step = _a.step;
+    function handleStepInteraction() {
+        if (status === Statuses.Visited) {
+            onStepClick(index);
+        }
+        if (status === Statuses.Next) {
+            onSkipToClick(index);
+        }
+    }
+    var state = {
+        active: 'active',
+        unvisited: 'disabled',
+        visited: 'enabled',
+        next: 'enabled'
+    }[status];
+    var linkClassName = clsx(styles['navigation-link'], (_b = {},
+        _b[styles['navigation-link-active']] = status === Statuses.Active,
+        _b[styles['navigation-link-disabled']] = status === Statuses.Unvisited,
+        _b));
+    return (React.createElement("li", { className: clsx(styles["".concat(state)], styles['navigation-link-item']) },
+        React.createElement("hr", null),
+        React.createElement("span", { className: clsx(styles.number, styles['navigation-link-label']) },
+            i18nStrings.stepNumberLabel && i18nStrings.stepNumberLabel(index + 1),
+            step.isOptional && React.createElement("i", null, " - ".concat(i18nStrings.optional))),
+        React.createElement("a", { className: linkClassName, "aria-current": status === Statuses.Active ? 'step' : undefined, "aria-disabled": status === Statuses.Unvisited ? 'true' : undefined, onClick: function (event) {
+                event.preventDefault();
+                handleStepInteraction();
+            }, onKeyDown: function (event) {
+                if (event.key === ' ' || event.key === 'Enter') {
+                    event.preventDefault();
+                }
+                // Enter activates the button on key down instead of key up.
+                if (event.key === 'Enter') {
+                    handleStepInteraction();
+                }
+            }, onKeyUp: function (event) {
+                // Emulate button behavior, which also fires on space.
+                if (event.key === ' ') {
+                    handleStepInteraction();
+                }
+            }, role: "button", tabIndex: status === Statuses.Visited || status === Statuses.Next ? 0 : undefined },
+            React.createElement("div", { className: clsx(styles.circle) }),
+            React.createElement("span", { className: clsx(styles.title) }, step.title))));
+}
+function NavigationStepClassic(_a) {
+    var i18nStrings = _a.i18nStrings, index = _a.index, onStepClick = _a.onStepClick, onSkipToClick = _a.onSkipToClick, status = _a.status, step = _a.step;
+    var spanClassName = clsx(styles['navigation-link'], status === Statuses.Active ? styles['navigation-link-active'] : styles['navigation-link-disabled']);
+    return (React.createElement("li", { className: styles['navigation-link-item'] },
+        React.createElement(InternalBox, { variant: "small", className: styles['navigation-link-label'], display: "block", margin: { bottom: 'xxs' } },
+            i18nStrings.stepNumberLabel && i18nStrings.stepNumberLabel(index + 1),
+            step.isOptional && React.createElement("i", null, " - ".concat(i18nStrings.optional))),
+        React.createElement("div", null, status === Statuses.Visited || status === Statuses.Next ? (React.createElement(InternalLink, { className: clsx(styles['navigation-link']), onFollow: function (evt) {
+                evt.preventDefault();
+                status === Statuses.Visited ? onStepClick(index) : onSkipToClick(index);
+            } }, step.title)) : (React.createElement("span", { className: spanClassName, "aria-current": status === Statuses.Active ? 'step' : undefined, "aria-disabled": status === Statuses.Active ? undefined : 'true' }, step.title)))));
+}
+//# sourceMappingURL=wizard-navigation.js.map

package/wizard/wizard-navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wizard-navigation.js","sourceRoot":"","sources":["../../../src/wizard/wizard-navigation.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAC5C,OAAO,WAAW,MAAM,iBAAiB,CAAC;AAE1C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAwBrC,IAAK,QAKJ;AALD,WAAK,QAAQ;IACX,6BAAiB,CAAA;IACjB,mCAAuB,CAAA;IACvB,+BAAmB,CAAA;IACnB,yBAAa,CAAA;AACf,CAAC,EALI,QAAQ,KAAR,QAAQ,QAKZ;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAWjB;QAVhB,eAAe,qBAAA,EACf,iBAAiB,uBAAA,EACjB,WAAW,iBAAA,EACX,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,iBAAiB,uBAAA,EACjB,WAAW,iBAAA,EACX,aAAa,mBAAA,EACb,KAAK,WAAA;IAEL,OAAO,CACL,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,IAAI,MAAM,CAAC,MAAM,EAAE,eAAe,IAAI,MAAM,CAAC,OAAO,CAAC;QACjG,gCACG,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,KAAa;YAC7B,OAAA,eAAe,CAAC,CAAC,CAAC,CAChB,oBAAC,2BAA2B,IAC1B,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,KAAK,EACV,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,MAAM,EAAE,SAAS,CAAC,KAAK,CAAC,EACxB,IAAI,EAAE,IAAI,GACV,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,qBAAqB,IACpB,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,KAAK,EACV,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,MAAM,EAAE,SAAS,CAAC,KAAK,CAAC,EACxB,IAAI,EAAE,IAAI,GACV,CACH;QApBD,CAoBC,CACF,CACE,CACD,CACP,CAAC;IAEF,SAAS,SAAS,CAAC,KAAa;QAC9B,IAAI,eAAe,KAAK,KAAK,EAAE;YAC7B,OAAO,QAAQ,CAAC,MAAM,CAAC;SACxB;QACD,IAAI,iBAAiB,EAAE;YACrB,OAAO,QAAQ,CAAC,SAAS,CAAC;SAC3B;QACD,IAAI,iBAAiB,IAAI,KAAK,EAAE;YAC9B,OAAO,QAAQ,CAAC,OAAO,CAAC;SACzB;QACD,IAAI,WAAW,IAAI,OAAO,CAAC,eAAe,GAAG,CAAC,EAAE,KAAK,CAAC,EAAE;YACtD,OAAO,QAAQ,CAAC,IAAI,CAAC;SACtB;QACD,OAAO,QAAQ,CAAC,SAAS,CAAC;IAC5B,CAAC;IAED,SAAS,OAAO,CAAC,SAAiB,EAAE,OAAe;QACjD,IAAI,KAAK,GAAG,SAAS,CAAC;QACtB,GAAG;YACD,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,UAAU,EAAE;gBAC5B,OAAO,KAAK,CAAC;aACd;YACD,KAAK,EAAE,CAAC;SACT,QAAQ,KAAK,GAAG,OAAO,EAAE;QAC1B,OAAO,IAAI,CAAC;IACd,CAAC;AACH,CAAC;AAED,SAAS,2BAA2B,CAAC,EAOf;;QANpB,WAAW,iBAAA,EACX,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,aAAa,mBAAA,EACb,MAAM,YAAA,EACN,IAAI,UAAA;IAEJ,SAAS,qBAAqB;QAC5B,IAAI,MAAM,KAAK,QAAQ,CAAC,OAAO,EAAE;YAC/B,WAAW,CAAC,KAAK,CAAC,CAAC;SACpB;QACD,IAAI,MAAM,KAAK,QAAQ,CAAC,IAAI,EAAE;YAC5B,aAAa,CAAC,KAAK,CAAC,CAAC;SACtB;IACH,CAAC;IAED,IAAM,KAAK,GAAG;QACZ,MAAM,EAAE,QAAQ;QAChB,SAAS,EAAE,UAAU;QACrB,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB,CAAC,MAAM,CAAC,CAAC;IAEV,IAAM,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC;QAClD,GAAC,MAAM,CAAC,wBAAwB,CAAC,IAAG,MAAM,KAAK,QAAQ,CAAC,MAAM;QAC9D,GAAC,MAAM,CAAC,0BAA0B,CAAC,IAAG,MAAM,KAAK,QAAQ,CAAC,SAAS;YACnE,CAAC;IAEH,OAAO,CACL,4BAAI,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,UAAG,KAAK,CAAE,CAAC,EAAE,MAAM,CAAC,sBAAsB,CAAC,CAAC;QACrE,+BAAM;QAEN,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,uBAAuB,CAAC,CAAC;YAClE,WAAW,CAAC,eAAe,IAAI,WAAW,CAAC,eAAe,CAAC,KAAK,GAAG,CAAC,CAAC;YACrE,IAAI,CAAC,UAAU,IAAI,+BAAI,aAAM,WAAW,CAAC,QAAQ,CAAE,CAAK,CACpD;QAEP,2BACE,SAAS,EAAE,aAAa,kBACV,MAAM,KAAK,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,mBAC9C,MAAM,KAAK,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EACjE,OAAO,EAAE,UAAA,KAAK;gBACZ,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,qBAAqB,EAAE,CAAC;YAC1B,CAAC,EACD,SAAS,EAAE,UAAA,KAAK;gBACd,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE;oBAC9C,KAAK,CAAC,cAAc,EAAE,CAAC;iBACxB;gBACD,4DAA4D;gBAC5D,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE;oBACzB,qBAAqB,EAAE,CAAC;iBACzB;YACH,CAAC,EACD,OAAO,EAAE,UAAA,KAAK;gBACZ,sDAAsD;gBACtD,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;oBACrB,qBAAqB,EAAE,CAAC;iBACzB;YACH,CAAC,EACD,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,MAAM,KAAK,QAAQ,CAAC,OAAO,IAAI,MAAM,KAAK,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;YAEjF,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,GAAI;YAEvC,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAG,IAAI,CAAC,KAAK,CAAQ,CACtD,CACD,CACN,CAAC;AACJ,CAAC;AAED,SAAS,qBAAqB,CAAC,EAAqF;QAAnF,WAAW,iBAAA,EAAE,KAAK,WAAA,EAAE,WAAW,iBAAA,EAAE,aAAa,mBAAA,EAAE,MAAM,YAAA,EAAE,IAAI,UAAA;IAC3F,IAAM,aAAa,GAAG,IAAI,CACxB,MAAM,CAAC,iBAAiB,CAAC,EACzB,MAAM,KAAK,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CACnG,CAAC;IAEF,OAAO,CACL,4BAAI,SAAS,EAAE,MAAM,CAAC,sBAAsB,CAAC;QAC3C,oBAAC,WAAW,IACV,OAAO,EAAC,OAAO,EACf,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,EAC1C,OAAO,EAAC,OAAO,EACf,MAAM,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE;YAExB,WAAW,CAAC,eAAe,IAAI,WAAW,CAAC,eAAe,CAAC,KAAK,GAAG,CAAC,CAAC;YACrE,IAAI,CAAC,UAAU,IAAI,+BAAI,aAAM,WAAW,CAAC,QAAQ,CAAE,CAAK,CAC7C;QACd,iCACG,MAAM,KAAK,QAAQ,CAAC,OAAO,IAAI,MAAM,KAAK,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CACzD,oBAAC,YAAY,IACX,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,EAC1C,QAAQ,EAAE,UAAA,GAAG;gBACX,GAAG,CAAC,cAAc,EAAE,CAAC;gBACrB,MAAM,KAAK,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAC1E,CAAC,IAEA,IAAI,CAAC,KAAK,CACE,CAChB,CAAC,CAAC,CAAC,CACF,8BACE,SAAS,EAAE,aAAa,kBACV,MAAM,KAAK,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,mBAC9C,MAAM,KAAK,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,IAE7D,IAAI,CAAC,KAAK,CACN,CACR,CACG,CACH,CACN,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport InternalLink from '../link/internal';\nimport InternalBox from '../box/internal';\nimport { WizardProps } from './interfaces';\nimport styles from './styles.css.js';\n\ninterface NavigationProps {\n  activeStepIndex: number;\n  farthestStepIndex: number;\n  allowSkipTo: boolean;\n  hidden: boolean;\n  i18nStrings: WizardProps.I18nStrings;\n  isVisualRefresh: boolean;\n  isLoadingNextStep: boolean;\n  onStepClick: (stepIndex: number) => void;\n  onSkipToClick: (stepIndex: number) => void;\n  steps: ReadonlyArray<WizardProps.Step>;\n}\n\ninterface NavigationStepProps {\n  i18nStrings: WizardProps.I18nStrings;\n  index: number;\n  onStepClick: (stepIndex: number) => void;\n  onSkipToClick: (stepIndex: number) => void;\n  status: string;\n  step: WizardProps.Step;\n}\n\nenum Statuses {\n  Active = 'active',\n  Unvisited = 'unvisited',\n  Visited = 'visited',\n  Next = 'next',\n}\n\nexport default function Navigation({\n  activeStepIndex,\n  farthestStepIndex,\n  allowSkipTo,\n  hidden,\n  i18nStrings,\n  isVisualRefresh,\n  isLoadingNextStep,\n  onStepClick,\n  onSkipToClick,\n  steps,\n}: NavigationProps) {\n  return (\n    <nav className={clsx(styles.navigation, hidden && styles.hidden, isVisualRefresh && styles.refresh)}>\n      <ul>\n        {steps.map((step, index: number) =>\n          isVisualRefresh ? (\n            <NavigationStepVisualRefresh\n              i18nStrings={i18nStrings}\n              index={index}\n              key={index}\n              onStepClick={onStepClick}\n              onSkipToClick={onSkipToClick}\n              status={getStatus(index)}\n              step={step}\n            />\n          ) : (\n            <NavigationStepClassic\n              i18nStrings={i18nStrings}\n              index={index}\n              key={index}\n              onStepClick={onStepClick}\n              onSkipToClick={onSkipToClick}\n              status={getStatus(index)}\n              step={step}\n            />\n          )\n        )}\n      </ul>\n    </nav>\n  );\n\n  function getStatus(index: number) {\n    if (activeStepIndex === index) {\n      return Statuses.Active;\n    }\n    if (isLoadingNextStep) {\n      return Statuses.Unvisited;\n    }\n    if (farthestStepIndex >= index) {\n      return Statuses.Visited;\n    }\n    if (allowSkipTo && canSkip(activeStepIndex + 1, index)) {\n      return Statuses.Next;\n    }\n    return Statuses.Unvisited;\n  }\n\n  function canSkip(fromIndex: number, toIndex: number) {\n    let index = fromIndex;\n    do {\n      if (!steps[index].isOptional) {\n        return false;\n      }\n      index++;\n    } while (index < toIndex);\n    return true;\n  }\n}\n\nfunction NavigationStepVisualRefresh({\n  i18nStrings,\n  index,\n  onStepClick,\n  onSkipToClick,\n  status,\n  step,\n}: NavigationStepProps) {\n  function handleStepInteraction() {\n    if (status === Statuses.Visited) {\n      onStepClick(index);\n    }\n    if (status === Statuses.Next) {\n      onSkipToClick(index);\n    }\n  }\n\n  const state = {\n    active: 'active',\n    unvisited: 'disabled',\n    visited: 'enabled',\n    next: 'enabled',\n  }[status];\n\n  const linkClassName = clsx(styles['navigation-link'], {\n    [styles['navigation-link-active']]: status === Statuses.Active,\n    [styles['navigation-link-disabled']]: status === Statuses.Unvisited,\n  });\n\n  return (\n    <li className={clsx(styles[`${state}`], styles['navigation-link-item'])}>\n      <hr />\n\n      <span className={clsx(styles.number, styles['navigation-link-label'])}>\n        {i18nStrings.stepNumberLabel && i18nStrings.stepNumberLabel(index + 1)}\n        {step.isOptional && <i>{` - ${i18nStrings.optional}`}</i>}\n      </span>\n\n      <a\n        className={linkClassName}\n        aria-current={status === Statuses.Active ? 'step' : undefined}\n        aria-disabled={status === Statuses.Unvisited ? 'true' : undefined}\n        onClick={event => {\n          event.preventDefault();\n          handleStepInteraction();\n        }}\n        onKeyDown={event => {\n          if (event.key === ' ' || event.key === 'Enter') {\n            event.preventDefault();\n          }\n          // Enter activates the button on key down instead of key up.\n          if (event.key === 'Enter') {\n            handleStepInteraction();\n          }\n        }}\n        onKeyUp={event => {\n          // Emulate button behavior, which also fires on space.\n          if (event.key === ' ') {\n            handleStepInteraction();\n          }\n        }}\n        role=\"button\"\n        tabIndex={status === Statuses.Visited || status === Statuses.Next ? 0 : undefined}\n      >\n        <div className={clsx(styles.circle)} />\n\n        <span className={clsx(styles.title)}>{step.title}</span>\n      </a>\n    </li>\n  );\n}\n\nfunction NavigationStepClassic({ i18nStrings, index, onStepClick, onSkipToClick, status, step }: NavigationStepProps) {\n  const spanClassName = clsx(\n    styles['navigation-link'],\n    status === Statuses.Active ? styles['navigation-link-active'] : styles['navigation-link-disabled']\n  );\n\n  return (\n    <li className={styles['navigation-link-item']}>\n      <InternalBox\n        variant=\"small\"\n        className={styles['navigation-link-label']}\n        display=\"block\"\n        margin={{ bottom: 'xxs' }}\n      >\n        {i18nStrings.stepNumberLabel && i18nStrings.stepNumberLabel(index + 1)}\n        {step.isOptional && <i>{` - ${i18nStrings.optional}`}</i>}\n      </InternalBox>\n      <div>\n        {status === Statuses.Visited || status === Statuses.Next ? (\n          <InternalLink\n            className={clsx(styles['navigation-link'])}\n            onFollow={evt => {\n              evt.preventDefault();\n              status === Statuses.Visited ? onStepClick(index) : onSkipToClick(index);\n            }}\n          >\n            {step.title}\n          </InternalLink>\n        ) : (\n          <span\n            className={spanClassName}\n            aria-current={status === Statuses.Active ? 'step' : undefined}\n            aria-disabled={status === Statuses.Active ? undefined : 'true'}\n          >\n            {step.title}\n          </span>\n        )}\n      </div>\n    </li>\n  );\n}\n"]}