@hitachivantara/uikit-react-lab
Version:
Contributed React components for the NEXT UI Kit.
79 lines (78 loc) • 2.1 kB
JavaScript
"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const uikitReactCore = require("@hitachivantara/uikit-react-core");
const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
const utils = require("../utils.cjs");
const Step_styles = require("./Step.styles.cjs");
const iconSizeObject = {
xs: "XS",
sm: "XS",
md: "S",
lg: "M",
xl: "M"
};
const stateObject = {
Pending: 16,
Failed: 24,
Completed: 24
};
const iconStateObject = {
Pending: uikitReactIcons.HourGlass,
Failed: uikitReactIcons.Level3Bad,
Completed: uikitReactIcons.Level0Good
};
const HvStep = ({
className,
classes: classesProp,
state,
title,
onClick,
disabled,
size = "md",
number = 1
}) => {
const { classes, cx } = Step_styles.useClasses(classesProp);
const iconSize = iconSizeObject[size];
const squareL = stateObject[state];
const svgSize = {
xs: squareL - 8,
sm: squareL,
md: squareL + 8,
lg: squareL + 16,
xl: squareL + 24
}[size];
const backgroundColor = utils.getColor(state);
const color = state === "Pending" ? "bgPage" : utils.getSemantic(state);
const status = state === "Current" ? "textDisabled" : void 0;
const IconComponent = iconStateObject[state];
return /* @__PURE__ */ jsxRuntime.jsx(
uikitReactCore.HvButtonBase,
{
className: cx(classes.root, className, {
[classes.notCurrent]: state !== "Current"
}),
"aria-label": title,
disabled: disabled ?? ["Current", "Disabled"].includes(state),
onClick,
children: /* @__PURE__ */ jsxRuntime.jsx(
uikitReactCore.HvAvatar,
{
className: cx(classes.avatar, classes[size]),
backgroundColor,
status,
size,
children: IconComponent ? /* @__PURE__ */ jsxRuntime.jsx(
IconComponent,
{
color,
style: { fontSize: svgSize },
size: iconSize
}
) : number
}
)
}
);
};
exports.HvStep = HvStep;