laif-ds
Version:
Design System di Laif con componenti React basati su principi di Atomic Design
75 lines (74 loc) • 1.87 kB
JavaScript
"use client";
import { jsxs as i, jsx as c } from "react/jsx-runtime";
import { cn as a } from "../../../lib/utils.js";
function v({
value: t,
renderLabel: o,
className: l,
progressClassName: m,
labelClassName: h,
showLabel: f,
shape: d = "round",
size: r = 100,
strokeWidth: n,
circleStrokeWidth: p = 10,
progressStrokeWidth: x = 10
}) {
const e = r / 2 - 10, s = Math.ceil(3.14 * e * 2), k = Math.ceil(s * ((100 - t) / 100)), y = `-${r * 0.125} -${r * 0.125} ${r * 1.25} ${r * 1.25}`;
return /* @__PURE__ */ i("div", { className: "relative", children: [
/* @__PURE__ */ i(
"svg",
{
width: r,
height: r,
viewBox: y,
version: "1.1",
xmlns: "http://www.w3.org/2000/svg",
style: { transform: "rotate(-90deg)" },
className: "relative",
children: [
/* @__PURE__ */ c(
"circle",
{
r: e,
cx: r / 2,
cy: r / 2,
fill: "transparent",
strokeWidth: n ?? p,
strokeDasharray: s,
strokeDashoffset: "0",
className: a("stroke-d-primary/25", l)
}
),
/* @__PURE__ */ c(
"circle",
{
r: e,
cx: r / 2,
cy: r / 2,
strokeWidth: n ?? x,
strokeLinecap: d,
strokeDashoffset: k,
fill: "transparent",
strokeDasharray: s,
className: a("stroke-d-primary", m)
}
)
]
}
),
f && /* @__PURE__ */ c(
"div",
{
className: a(
"text-md absolute inset-0 flex items-center justify-center",
h
),
children: o ? o(t) : t
}
)
] });
}
export {
v as CircularProgress
};