@intility/bifrost-react
Version:
React library for Intility's design system, Bifrost.
36 lines (35 loc) • 1.32 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { faArrowRight } from "@fortawesome/free-solid-svg-icons/faArrowRight";
import { faCheck } from "@fortawesome/free-solid-svg-icons/faCheck";
import classNames from "classnames";
import Icon from "../Icon/Icon.js";
/**
* Step icon, used in menus for step-by step wizards.
* @example
* <Icon.Step variant="default" />
* @example
* // inside a menu item
* <a href="/step1">
* <Menu.Item>
* <Icon.Step variant="completed" marginRight />
* Step 1
* </Menu.Item>
* </a>
*/ const IconStep = ({ variant = "default", marginRight = false, marginLeft = false, className = "" })=>/*#__PURE__*/ _jsx("span", {
role: "img",
"aria-label": variant,
className: classNames("bf-step-icon bf-step-" + variant, className, {
"bf-icon-margin-left": marginLeft,
"bf-icon-margin-right": marginRight
}),
children: variant === "active" ? /*#__PURE__*/ _jsx(Icon, {
icon: faArrowRight
}) : variant === "completed" ? /*#__PURE__*/ _jsx(Icon, {
icon: faCheck
}) : // add content so we can vertically align .bf-step-icon
/*#__PURE__*/ _jsx("span", {
children: " "
})
});
IconStep.displayName = "Icon.Step";
export default IconStep;