@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
71 lines (70 loc) • 2.02 kB
JavaScript
"use client";
import React, { useCallback, useContext, useReducer } from 'react';
import WizardContext from "../Context/index.js";
import StepIndicator from "../../../../components/StepIndicator.js";
import { useTranslation } from "../../hooks/index.js";
import { jsx as _jsx } from "react/jsx-runtime";
export function DisplaySteps({
mode,
noAnimation,
handleChange,
expandedInitially,
outset
}) {
var _getStepIndicatorStat;
const [, forceUpdate] = useReducer(() => ({}), {});
const {
activeIndexRef,
stepsRef,
updateTitlesRef,
hasErrorInOtherStepRef,
hasInvalidStepsState
} = useContext(WizardContext) || {};
updateTitlesRef.current = () => {
forceUpdate();
};
const translations = useTranslation();
const getStepIndicatorStatus = useCallback(() => {
if (!hasErrorInOtherStepRef.current) {
return undefined;
}
if (hasInvalidStepsState(undefined, ['error'])) {
return {
status: translations.Step.stepHasError,
statusState: 'error'
};
}
return {};
}, [hasErrorInOtherStepRef, hasInvalidStepsState, translations.Step.stepHasError]);
const {
status,
statusState
} = (_getStepIndicatorStat = getStepIndicatorStatus()) !== null && _getStepIndicatorStat !== void 0 ? _getStepIndicatorStat : {};
return _jsx("div", {
className: "dnb-forms-wizard-layout__indicator",
children: _jsx(StepIndicator, {
bottom: true,
currentStep: activeIndexRef.current,
data: Array.from(stepsRef.current.values()).map(({
stringifiedTitle,
title,
inactive,
status,
statusState
}) => ({
title: stringifiedTitle || title,
inactive,
status,
statusState: statusState
})),
mode: mode,
noAnimation: noAnimation,
expandedInitially: expandedInitially,
onChange: handleChange,
outset: outset,
status: status,
statusState: statusState
})
});
}
//# sourceMappingURL=DisplaySteps.js.map