'use client';
import { jsx as n, jsxs as v } from "react/jsx-runtime";
import h from "react";
import { motion as m } from "framer-motion";
import { Spinner as H } from "@heroui/react";
import { useTheme as O } from "../../../hooks/use-theme.js";
import { useConfig as $ } from "../../../hooks/use-config.js";
const D = ({ size: e, color: s, duration: t = 1 }) => /* @__PURE__ */ n(
  m.div,
  {
    className: `border-2 border-transparent border-t-current border-r-current rounded-full ${e}`,
    animate: { rotate: 360 },
    transition: { duration: t, repeat: 1 / 0, ease: "linear" },
    style: { color: `var(--${s})` }
  }
), E = ({ size: e, color: s, duration: t = 1.4 }) => {
  const r = {
    "w-2 h-2": "w-2 h-2",
    "w-3 h-3": "w-3 h-3",
    "w-4 h-4": "w-4 h-4",
    "w-6 h-6": "w-6 h-6"
  }[e] || "w-3 h-3";
  return /* @__PURE__ */ n("div", { className: "flex gap-1", children: [0, 1, 2].map((a) => /* @__PURE__ */ n(
    m.div,
    {
      className: `${r} rounded-full bg-current`,
      style: { color: `var(--${s})` },
      animate: { scale: [1, 1.2, 1], opacity: [0.5, 1, 0.5] },
      transition: {
        duration: t,
        repeat: 1 / 0,
        delay: a * 0.2,
        ease: "easeInOut"
      }
    },
    a
  )) });
}, P = ({ size: e, color: s, duration: t = 1.5 }) => /* @__PURE__ */ n(
  m.div,
  {
    className: `rounded-full bg-current ${e}`,
    style: { color: `var(--${s})` },
    animate: { scale: [1, 1.2, 1], opacity: [0.5, 1, 0.5] },
    transition: { duration: t, repeat: 1 / 0, ease: "easeInOut" }
  }
), R = ({ size: e, color: s, duration: t = 1.2 }) => {
  const r = {
    "w-2 h-2": "w-1 h-4",
    "w-3 h-3": "w-1 h-6",
    "w-4 h-4": "w-1 h-8",
    "w-6 h-6": "w-2 h-12"
  }[e] || "w-1 h-6";
  return /* @__PURE__ */ n("div", { className: "flex items-end gap-1", children: [0, 1, 2, 3].map((a) => /* @__PURE__ */ n(
    m.div,
    {
      className: `${r} bg-current rounded-sm`,
      style: { color: `var(--${s})` },
      animate: { scaleY: [1, 2, 1] },
      transition: {
        duration: t,
        repeat: 1 / 0,
        delay: a * 0.1,
        ease: "easeInOut"
      }
    },
    a
  )) });
};
function b({
  variant: e = "spinner",
  size: s = "md",
  color: t = "primary",
  text: i = "Loading...",
  showText: r = !1,
  textPosition: a = "bottom",
  centered: o = !1,
  overlay: c = !1,
  className: g = "",
  children: p,
  duration: l = 1,
  backdrop: f = !1,
  backdropOpacity: x = 0.5
}) {
  const { getColorValue: S } = O(), { components: C } = $(), w = C.LoadingSpinner;
  if (w)
    return /* @__PURE__ */ n(w, { variant: e, size: s, color: t, text: i, showText: r, textPosition: a, centered: o, overlay: c, className: g, children: p, duration: l, backdrop: f, backdropOpacity: x });
  const N = {
    sm: "w-4 h-4",
    md: "w-6 h-6",
    lg: "w-8 h-8",
    xl: "w-12 h-12"
  }, z = {
    sm: "text-xs",
    md: "text-sm",
    lg: "text-base",
    xl: "text-lg"
  };
  S(t);
  const I = () => {
    const d = N[s], u = `text-${t}-600 dark:text-${t}-400`;
    switch (e) {
      case "dots":
        return /* @__PURE__ */ n(E, { size: d, color: u, duration: l });
      case "pulse":
        return /* @__PURE__ */ n(P, { size: d, color: u, duration: l });
      case "bars":
        return /* @__PURE__ */ n(R, { size: d, color: u, duration: l });
      case "custom":
        return p || /* @__PURE__ */ n(D, { size: d, color: u, duration: l });
      case "spinner":
      default:
        return /* @__PURE__ */ n(H, { size: s, color: t });
    }
  }, j = () => !r || !i ? null : /* @__PURE__ */ n("span", { className: `${z[s]} text-${t}-600 dark:text-${t}-400 font-medium`, children: i }), V = () => {
    const d = I(), u = j();
    if (!r)
      return d;
    const k = {
      top: "flex-col-reverse",
      bottom: "flex-col",
      left: "flex-row-reverse",
      right: "flex-row"
    }, B = {
      top: "gap-2",
      bottom: "gap-2",
      left: "gap-3",
      right: "gap-3"
    };
    return /* @__PURE__ */ v("div", { className: `flex items-center justify-center ${k[a]} ${B[a]}`, children: [
      d,
      u
    ] });
  }, y = /* @__PURE__ */ n("div", { className: `
      ${o ? "flex items-center justify-center" : ""}
      ${g}
    `, children: V() });
  return c ? /* @__PURE__ */ v("div", { className: "fixed inset-0 z-50 flex items-center justify-center", children: [
    f && /* @__PURE__ */ n(
      m.div,
      {
        initial: { opacity: 0 },
        animate: { opacity: x },
        exit: { opacity: 0 },
        className: "absolute inset-0 bg-background/80 backdrop-blur-sm"
      }
    ),
    /* @__PURE__ */ n(
      m.div,
      {
        initial: { opacity: 0, scale: 0.8 },
        animate: { opacity: 1, scale: 1 },
        exit: { opacity: 0, scale: 0.8 },
        className: "relative z-10",
        children: y
      }
    )
  ] }) : y;
}
function F({
  isLoading: e = !1,
  loadingText: s = "Loading...",
  spinnerProps: t = {},
  variant: i = "solid",
  color: r = "primary",
  size: a = "md",
  children: o,
  disabled: c,
  className: g = "",
  ...p
}) {
  const { components: l } = $(), f = l.LoadingButton;
  if (f)
    return /* @__PURE__ */ n(f, { isLoading: e, loadingText: s, spinnerProps: t, variant: i, color: r, size: a, children: o, disabled: c, className: g, ...p });
  const x = {
    sm: "sm",
    md: "sm",
    lg: "md"
  };
  return /* @__PURE__ */ v(
    "button",
    {
      ...p,
      disabled: c || e,
      className: `
        relative inline-flex items-center justify-center gap-2 px-4 py-2 
        text-sm font-medium rounded-md transition-colors
        ${i === "solid" ? `bg-${r}-600 text-white hover:bg-${r}-700` : ""}
        ${i === "bordered" ? `border border-${r}-600 text-${r}-600 hover:bg-${r}-50` : ""}
        ${i === "light" ? `text-${r}-600 hover:bg-${r}-50` : ""}
        disabled:opacity-50 disabled:cursor-not-allowed
        ${g}
      `,
      children: [
        e && /* @__PURE__ */ n(
          b,
          {
            variant: "spinner",
            size: x[a],
            color: i === "solid" ? "default" : r,
            ...t
          }
        ),
        /* @__PURE__ */ n("span", { className: e ? "opacity-70" : "", children: e ? s : o })
      ]
    }
  );
}
const G = {
  signIn: {
    text: "Signing in...",
    variant: "spinner"
  },
  signUp: {
    text: "Creating account...",
    variant: "spinner"
  },
  signOut: {
    text: "Signing out...",
    variant: "dots"
  },
  verifying: {
    text: "Verifying...",
    variant: "pulse"
  },
  processing: {
    text: "Processing...",
    variant: "bars"
  },
  loading: {
    text: "Loading...",
    variant: "spinner"
  },
  sending: {
    text: "Sending...",
    variant: "dots"
  },
  redirecting: {
    text: "Redirecting...",
    variant: "pulse"
  }
}, L = h.createContext(null);
function J({ children: e }) {
  const [s, t] = h.useState(!1), [i, r] = h.useState("Loading..."), a = h.useCallback((o, c = "Loading...") => {
    t(o), r(c);
  }, []);
  return /* @__PURE__ */ v(L.Provider, { value: { isLoading: s, loadingText: i, setLoading: a }, children: [
    e,
    s && /* @__PURE__ */ n(
      b,
      {
        overlay: !0,
        backdrop: !0,
        showText: !0,
        text: i,
        variant: "spinner",
        size: "lg",
        color: "primary"
      }
    )
  ] });
}
function K() {
  const e = h.useContext(L);
  if (!e)
    throw new Error("useLoading must be used within a LoadingProvider");
  return e;
}
var M = b;
export {
  F as LoadingButton,
  J as LoadingProvider,
  b as LoadingSpinner,
  G as LoadingStates,
  M as default,
  K as useLoading
};
//# sourceMappingURL=loading-spinner.js.map
