@codex-storage/marketplace-ui-components
Version:
Marketplace UI components for Codex decentralized storage network.
50 lines (49 loc) • 1.6 kB
JavaScript
import { jsxs as r, jsx as s } from "react/jsx-runtime";
import * as a from "react";
import { useRef as c, useEffect as p } from "react";
import { attributes as o } from "../utils/attributes.js";
import { classnames as h } from "../utils/classnames.js";
import '../../assets/Step.css';const u = (e) => /* @__PURE__ */ a.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "none", ...e }, /* @__PURE__ */ a.createElement("path", { fill: "#1FC16B", d: "M0 10a10 10 0 1 1 20 0 10 10 0 0 1-20 0" }), /* @__PURE__ */ a.createElement("path", { fill: "#fff", d: "m15.1 7.45-6.37 6.37L4.9 10l1.27-1.27 2.56 2.54 5.1-5.09z" }));
function x({
step: e,
isActive: n,
isLast: i,
isDone: l,
title: d,
index: f,
onClick: t
}) {
const m = c(!1);
return p(() => {
m.current = !0;
}, []), /* @__PURE__ */ r(
"div",
{
className: h(
["step", !0],
["step--active", n],
["step--done", l],
["step--,mounted", m.current]
),
onClick: () => t == null ? void 0 : t(e),
...o({ disabled: !t }),
children: [
/* @__PURE__ */ r("div", { children: [
/* @__PURE__ */ s("span", { children: l ? /* @__PURE__ */ s(u, {}) : e + 1 }),
/* @__PURE__ */ s("hr", {})
] }),
!i && /* @__PURE__ */ r("div", { children: [
/* @__PURE__ */ r("small", { children: [
"STEP ",
f
] }),
/* @__PURE__ */ s("span", { children: d })
] })
]
}
);
}
export {
x as Step
};
//# sourceMappingURL=Step.js.map