"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
module.exports = LoadingButton;
var _jsxRuntime = require("react/jsx-runtime");
var _material = require("@mui/material");
function LoadingButton({
  ref = void 0,
  children,
  loading = false,
  loadingPosition = "start",
  loadingIndicator = void 0,
  loadingProps = {},
  loadingOnly = false,
  onClick,
  sx,
  ...props
}) {
  const handleClick = e => {
    if (loading) {
      return;
    }
    onClick?.(e);
  };
  const getPositionStyles = position => {
    return {
      color: "inherit",
      ...(position === "start" && {
        mr: 1
      }),
      ...(position === "end" && {
        ml: 1
      }),
      ...(position === "center" && {
        position: "absolute",
        left: "50%",
        transform: "translateY(-50%) translateX(-50%)",
        top: "50%"
      }),
      display: "inline-flex",
      alignItems: "center"
    };
  };
  const defaultIndicator = /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.CircularProgress, {
    size: 16,
    ...loadingProps,
    sx: {
      color: "inherit",
      ...(loadingProps?.sx || {})
    }
  });
  const indicator = /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
    sx: getPositionStyles(loadingPosition),
    children: loadingIndicator || defaultIndicator
  });
  return /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Button, {
    ref,
    disabled: props.disabled || loading,
    onClick: handleClick,
    sx: {
      position: "relative",
      display: "inline-flex",
      alignItems: "center",
      justifyContent: "center",
      ...sx
    },
    ...props,
    children: [loading && loadingPosition === "start" && indicator, /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
      sx: {
        visibility: loading && loadingOnly ? "hidden" : "visible"
      },
      children
    }), loading && loadingPosition === "center" && indicator, loading && loadingPosition === "end" && indicator]
  });
}
LoadingButton.displayName = "LoadingButton";