@activecollab/components
Version:
ActiveCollab Components
38 lines • 1.24 kB
JavaScript
import React, { useMemo, forwardRef } from "react";
import classnames from "classnames";
import { StyledStep, StyledSteps } from "./Styles";
export const Steps = /*#__PURE__*/forwardRef((_ref, ref) => {
let numberOfSteps = _ref.numberOfSteps,
activeStep = _ref.activeStep,
_ref$progressive = _ref.progressive,
progressive = _ref$progressive === void 0 ? false : _ref$progressive,
wrapperClassName = _ref.wrapperClassName;
const steps = useMemo(() => {
// fastest way to generate an array of N numbers
const a = [];
let b = numberOfSteps;
while (b--) {
a[b] = b + 1;
}
return a;
}, [numberOfSteps]);
const activeSteps = useMemo(() => {
if (!progressive) {
return [activeStep];
}
return steps.filter(step => {
return step <= activeStep;
});
}, [activeStep, progressive, steps]);
return /*#__PURE__*/React.createElement(StyledSteps, {
className: classnames("c-steps-wrapper", wrapperClassName),
ref: ref
}, steps.map(step => {
return /*#__PURE__*/React.createElement(StyledStep, {
key: "step-" + step,
$isActiveStep: activeSteps.indexOf(step) > -1
});
}));
});
Steps.displayName = "Steps";
//# sourceMappingURL=Steps.js.map