import { jsx as t, jsxs as d } from "react/jsx-runtime";
import { useState as f, useEffect as g } from "react";
import i from "prop-types";
import { green as m, blue as p } from "@mui/material/colors";
import h from "../Logo/index.js";
import { styled as c } from "../Theme/index.js";
import { useTheme as x } from "@mui/material";
function b({ messages: e = ["Loading data..."], interval: n = 3e3, ...s }) {
  const [r, a] = f(0), { palette: l } = x();
  return g(() => {
    const u = setInterval(() => {
      a((r + 1) % e.length);
    }, n);
    return () => {
      clearTimeout(u);
    };
  }), /* @__PURE__ */ t(y, { ...s, children: /* @__PURE__ */ d("div", { className: "pm-loader-container", children: [
    /* @__PURE__ */ t("div", { className: "pm-loader-text", children: /* @__PURE__ */ t("p", { children: e[r] }) }),
    /* @__PURE__ */ d("div", { className: "pm-loader-atoms", children: [
      /* @__PURE__ */ t(h, { style: { transform: "scale(0.6)" }, showText: !1 }),
      /* @__PURE__ */ t(o, { size: 56, orbitColor: m[500], atomColor: m[500], duration: 1 }),
      /* @__PURE__ */ t(o, { size: 80, orbitColor: p[800], atomColor: p[800], duration: 1.5 }),
      /* @__PURE__ */ t(o, { size: 100, orbitColor: l.grey[900], atomColor: l.grey[900] })
    ] })
  ] }) });
}
b.propTypes = {
  interval: i.number,
  messages: i.arrayOf(i.string.isRequired)
};
const y = c("div")`
  && {
    box-sizing: border-box;
    padding: 20px;
    width: 100%;
    height: 100%;
    min-height: 360px;
    z-index: 100;
    transition: opacity 0.5s linear;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
  }

  .pm-loader-text {
    color: ${({ theme: e }) => e.palette.grey[900]};
    font-size: 14px;
    text-align: center;
    position: relative;
    height: 70px;
    -webkit-user-select: none;
  }

  .pm-loader-container {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    flex: 1;
  }

  .pm-loader-atoms {
    width: 100px;
    height: 100px;
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
  }
`;
function o({ size: e, orbitColor: n, atomColor: s, duration: r = 2, ...a }) {
  return /* @__PURE__ */ t(v, { $duration: r, style: { width: e, height: e, border: `1px solid ${n}` }, ...a, children: /* @__PURE__ */ t("div", { style: { background: s } }) });
}
o.propTypes = {
  size: i.number.isRequired,
  orbitColor: i.string.isRequired,
  atomColor: i.string.isRequired,
  duration: i.number
};
const v = c("div")`
  @keyframes orbit {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }

  position: absolute;
  border-radius: 50%;
  animation: orbit ${({ $duration: e }) => e}s infinite;
  animation-timing-function: linear;
  transform-origin: center;

  > div {
    position: absolute;
    top: 50%;
    width: 6px;
    height: 6px;
    transform: translateX(-50%);
    border-radius: 50%;
  }
`;
export {
  b as default
};
