brightyui
Version:
Brighty UI library
16 lines • 1.42 kB
JavaScript
var _this = this;
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import styles from '../../../src/styles/Steps.module.scss';
import { CheckIcon } from '../../images/IconComponents/CheckIcon';
import { EColors } from '../../types/EColors';
import Typography from '../Typography/Typography';
var Steps = function (_a) {
var steps = _a.steps, activeStep = _a.activeStep, onClick = _a.onClick;
var handleClick = function (index) {
onClick(index);
};
return (_jsx("div", { className: styles.root, children: steps.map(function (step, index) { return (_jsxs(React.Fragment, { children: [_jsxs("div", { className: styles.step, onClick: handleClick.bind(_this, index), children: [index < activeStep && (_jsx("div", { className: styles.checkWrapper, children: _jsx(CheckIcon, {}) })), index === activeStep && (_jsx("div", { className: styles.activeStepWrapper, children: _jsx("div", { className: styles.activeStep }) })), index > activeStep && (_jsx("div", { className: styles.activeStepWrapper, children: _jsx("div", { className: styles.inactiveStep }) })), _jsx(Typography, { color: index > activeStep ? EColors.text2 : EColors.text0, className: styles.text, variant: 'captionRegular', children: step })] }), index !== steps.length - 1 && _jsx("hr", { className: styles.line })] }, step)); }) }));
};
export default Steps;
//# sourceMappingURL=Steps.js.map