import { jsxs as x, jsx as d } from "react/jsx-runtime";
import { useId as _, useMemo as L } from "react";
import q from "../../utils/classNames.js";
import { useReducedMotion as G } from "../../node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion.js";
import { motion as z } from "../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js";
const k = (e, r, n) => Math.min(n, Math.max(r, e)), H = (e) => {
  switch (e) {
    case "xs":
      return 32;
    case "sm":
      return 48;
    case "lg":
      return 80;
    case "xl":
      return 120;
    default:
      return 64;
  }
}, J = (e) => {
  switch (e) {
    case "success":
      return "var(--brand-success)";
    case "info":
      return "var(--brand-info)";
    case "warning":
      return "var(--brand-warning)";
    case "danger":
      return "var(--brand-danger)";
    case "secondary":
      return "var(--brand-secondary)";
    case "default":
      return "var(--gray)";
    case "white":
      return "var(--color-white)";
    default:
      return "var(--brand-primary)";
  }
}, K = (e) => {
  switch (e) {
    case "decent":
      return "var(--gray-decent)";
    case "lightest":
      return "var(--gray-lightest)";
    case "lighter":
      return "var(--gray-lighter)";
    case "light":
      return "var(--gray-light)";
    case "gray":
      return "var(--gray)";
    case "dark":
      return "var(--gray-dark)";
    case "darker":
      return "var(--gray-darker)";
    case "darkest":
      return "var(--gray-darkest)";
    case "white":
      return "var(--color-white)";
  }
}, Q = (e, r, n, h) => {
  const u = {
    maximumFractionDigits: 0,
    ...h
  }, t = new Intl.NumberFormat(void 0, u);
  if (u.style === "percent") {
    const i = n - r, m = i === 0 ? 0 : (e - r) / i;
    return t.format(k(m, 0, 1));
  }
  return t.format(e);
}, oe = (e) => {
  const {
    label: r,
    size: n = "md",
    color: h = "primary",
    value: u = 0,
    valueLabel: t,
    minValue: i = 0,
    maxValue: m = 100,
    formatOptions: b,
    isIndeterminate: s = !1,
    showValueLabel: w = !0,
    strokeWidth: c = 8,
    trackColor: O = "lighter",
    trackClassName: R,
    disableAnimation: S = !1,
    animationDelay: N = 0,
    className: B,
    ringWrapClassName: F,
    valueLabelClassName: T,
    labelClassName: j
  } = e, I = `circular-progress-label-${_()}`, A = G(), f = !(S || A), g = H(n), C = J(h), W = K(O), a = Math.min(i, m), o = Math.max(i, m), l = k(u, a, o), { radius: p, circumference: M, strokeDasharray: $, strokeDashoffset: E, ratio: X } = L(() => {
    const D = (100 - c) / 2, y = 2 * Math.PI * D, P = o - a, Y = P === 0 ? 0 : (l - a) / P, V = k(Y, 0, 1);
    return {
      radius: D,
      circumference: y,
      strokeDasharray: y,
      strokeDashoffset: y * (1 - V),
      ratio: V
    };
  }, [o, a, l, c]), v = L(() => w ? t || Q(l, a, o, b) : null, [b, o, a, l, w, t]);
  return /* @__PURE__ */ x(
    "div",
    {
      className: `display-flex flex-column align-items-center text-center gap-10 ${B ?? ""}`,
      "aria-labelledby": r ? I : void 0,
      children: [
        /* @__PURE__ */ x(
          "div",
          {
            className: F ?? "",
            role: "progressbar",
            "aria-busy": s || void 0,
            "aria-valuemin": s ? void 0 : a,
            "aria-valuemax": s ? void 0 : o,
            "aria-valuenow": s ? void 0 : l,
            "aria-valuetext": !s && typeof v == "string" ? v : void 0,
            style: {
              width: g,
              height: g,
              position: "relative",
              display: "grid",
              placeItems: "center"
            },
            children: [
              /* @__PURE__ */ x("svg", { width: g, height: g, viewBox: "0 0 100 100", style: { transform: "rotate(-90deg)" }, children: [
                /* @__PURE__ */ d(
                  "circle",
                  {
                    cx: "50",
                    cy: "50",
                    r: p,
                    fill: "none",
                    stroke: W,
                    strokeWidth: c,
                    className: R ?? ""
                  }
                ),
                s ? /* @__PURE__ */ d(
                  z.circle,
                  {
                    cx: "50",
                    cy: "50",
                    r: p,
                    fill: "none",
                    stroke: C,
                    strokeWidth: c,
                    strokeLinecap: "round",
                    strokeDasharray: M * 0.35,
                    strokeDashoffset: 0,
                    animate: f ? { rotate: 360 } : void 0,
                    transition: f ? {
                      repeat: Number.POSITIVE_INFINITY,
                      ease: "linear",
                      duration: 1,
                      delay: N
                    } : void 0,
                    style: { transformOrigin: "50px 50px" }
                  }
                ) : /* @__PURE__ */ d(
                  z.circle,
                  {
                    cx: "50",
                    cy: "50",
                    r: p,
                    fill: "none",
                    stroke: C,
                    strokeWidth: c,
                    strokeLinecap: "round",
                    strokeDasharray: $,
                    initial: f ? { strokeDashoffset: M } : !1,
                    animate: { strokeDashoffset: E },
                    transition: f ? { duration: 0.6, ease: "easeOut", delay: N } : void 0
                  }
                )
              ] }),
              v != null && /* @__PURE__ */ d(
                "div",
                {
                  className: q(
                    "position-absolute",
                    "display-grid place-items-center",
                    T
                  ),
                  children: v
                }
              )
            ]
          }
        ),
        r != null && /* @__PURE__ */ d("div", { id: I, className: j ?? "", children: r })
      ]
    }
  );
};
export {
  oe as default
};
//# sourceMappingURL=CircularProgress.js.map
