import { jsx as n } from "@emotion/react/jsx-runtime";
import k from "clsx";
import { useModuleSkeleton as w } from "@m4l/core";
import { useComponentSize as y } from "../../../../hooks/useComponentSize/index.js";
import { getComponentSlotRoot as z } from "../../../../utils/getComponentSlotRoot.js";
import { SkeletonLoadingButtonStyled as h, RootStyled as B, CircularProgressStyled as C } from "./slots/LoadingButtonSlots.js";
import { LOADING_BUTTON_KEY_COMPONENT as O } from "./constants.js";
const j = (l) => {
  const {
    className: m,
    endIcon: d,
    label: c,
    startIcon: S,
    color: s = "primary",
    disabled: i = !1,
    size: t,
    variant: a = "contained",
    skeletonWidth: u = "100%",
    loading: o = !1,
    ...p
  } = l, { currentSize: e } = y(t), f = w(), N = e === "small" || e === "medium" ? e : "medium", r = {
    size: t,
    variant: a,
    disabled: i,
    color: s,
    loading: o
  };
  if (f)
    return /* @__PURE__ */ n(h, { "data-testid": "SkeletonButton", width: u, ownerState: { ...r } });
  const g = z(O);
  return /* @__PURE__ */ n(
    B,
    {
      color: s,
      variant: a,
      size: t,
      label: c,
      disabled: o || i,
      ownerState: { ...r },
      className: k(m, g),
      startIcon: S,
      endIcon: d,
      ...p,
      children: o === !0 && /* @__PURE__ */ n(C, { color: "primary", ownerState: { ...r }, size: N })
    }
  );
};
export {
  j as LoadingButton
};
