@wix/design-system
Version:
@wix/design-system
28 lines • 1.31 kB
JavaScript
import React from 'react';
import { Confirm, StatusAlertFilled } from '@wix/wix-ui-icons-common';
import { FormFieldErrorSmall } from '@wix/wix-ui-icons-common/system';
import { Type, StepType } from '../constants';
import { st, classes } from './StepMarker.st.css.js';
import { useIcons } from '../../WixDesignSystemIconThemeProvider';
const StepMarker = ({ number, active, type, styleType, hovered, disabled, className, ...otherProps }) => {
const icons = useIcons('StepMarker', {
Confirm,
StatusAlertFilled,
FormFieldErrorSmall,
});
const renderCompleted = () => React.createElement(icons.Confirm, null);
const renderNumber = () => `${number}${styleType === Type.Text ? '.' : ''}`;
const renderError = () => styleType === Type.Text ? (React.createElement(icons.StatusAlertFilled, null)) : (React.createElement(icons.FormFieldErrorSmall, { size: "12px" }));
return (React.createElement("div", { className: st(classes.root, {
type,
styleType,
selected: active,
hovered,
}, className) }, type === StepType.Error
? renderError()
: type === StepType.Completed
? renderCompleted()
: renderNumber()));
};
export default StepMarker;
//# sourceMappingURL=StepMarker.js.map