import { jsx as t } from "react/jsx-runtime";
import { classNames as g } from "./index-classNames.js";
import { parseCssVariable as i } from "./index-css-variables-parser.js";
import { ComponentContainer as u } from "./index-ComponentContainer.js";
import "react";
import m from "./index-ProgressBar.module.scss.js";
import d from "./index-LinearProgress.js";
const B = (e) => {
  const {
    progressValue: n,
    width: l = "100%",
    className: c,
    variant: p = "determinate"
  } = e;
  let {
    bgColor: r,
    color: o,
    height: s = "12px"
  } = e;
  const {
    isBlurred: a
  } = e;
  return o = i(o), r = i(r), s = a ? "5px" : s, t(u, {
    className: m.progressBar,
    children: t(d, {
      variant: p,
      value: a ? 100 : n,
      className: g(m.root, c),
      sx: {
        filter: a ? "blur(15px)" : "",
        backgroundColor: r || "var(--n200)",
        height: {
          height: s
        },
        width: {
          width: l
        },
        "& .MuiLinearProgress-bar": {
          backgroundColor: a ? "var(--n500)" : o || "var(--i500)"
          // backgroundColor: color ? color : `var(--i500)`,
        }
      }
    })
  });
};
export {
  B as ProgressBar
};
