wix-style-react/dist/es/src/Stepper/components/StepMarker.js

wix-style-react

import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["number", "active", "type", "styleType", "hovered", "disabled", "className"];
import React from 'react';
import Confirm from 'wix-ui-icons-common/Confirm';
import FormFieldErrorSmall from 'wix-ui-icons-common/system/FormFieldErrorSmall';
import StatusAlertFilled from 'wix-ui-icons-common/StatusAlertFilled';
import { Type, StepType } from '../constants';
import { st, classes } from './StepMarker.st.css';

var StepMarker = function StepMarker(_ref) {
  var number = _ref.number,
      active = _ref.active,
      type = _ref.type,
      styleType = _ref.styleType,
      hovered = _ref.hovered,
      disabled = _ref.disabled,
      className = _ref.className,
      otherProps = _objectWithoutProperties(_ref, _excluded);

  var renderCompleted = function renderCompleted() {
    return /*#__PURE__*/React.createElement(Confirm, null);
  };

  var renderNumber = function renderNumber() {
    return "".concat(number).concat(styleType === Type.Text ? '.' : '');
  };

  var renderError = function renderError() {
    return styleType === Type.Text ? /*#__PURE__*/React.createElement(StatusAlertFilled, null) : /*#__PURE__*/React.createElement(FormFieldErrorSmall, {
      size: "12px"
    });
  };

  return /*#__PURE__*/React.createElement("div", {
    className: st(classes.root, {
      type: type,
      styleType: styleType,
      selected: active,
      hovered: hovered
    }, className)
  }, type === StepType.Error ? renderError() : type === StepType.Completed ? renderCompleted() : renderNumber());
};

export default StepMarker;