import "../Spinner.css";
import { jsx, Fragment } from "react/jsx-runtime";
import { Spin } from "antd";
import Icon from "./Icon.js";
import { useTheme } from "./Theme/UI.js";
import "./Theme/themeUtils.js";
import "./Theme/themes.js";
import { Loadable } from "./utils/loadable.js";
const base = "Spinner_base_bfbc6";
const spin = "Spinner_spin_bfbc6";
const rotate = "Spinner_rotate_bfbc6";
const center = "Spinner_center_bfbc6";
const css = {
  base,
  spin,
  rotate,
  center
};
function Spinner({
  center: center2,
  children,
  conditionalRender,
  size = "medium",
  spinning = true,
  tip,
  data
}) {
  const {
    themeSettings: { className }
  } = useTheme();
  const classes = [className, css.base];
  if (center2 || tip)
    classes.push(css.center);
  const spinner = /* @__PURE__ */ jsx("div", { className: classes.join(" "), children: /* @__PURE__ */ jsx(
    Spin,
    {
      "data-testid": "custom-spinner",
      indicator: /* @__PURE__ */ jsx("div", { className: css.spin, children: /* @__PURE__ */ jsx(Icon, { name: "spinner", size, title: "Spinner" }) }),
      spinning,
      tip,
      children: data !== void 0 || conditionalRender && spinning ? null : children
    }
  ) });
  if (!data) {
    return spinner;
  } else {
    return Loadable.match(data, {
      Failed: () => /* @__PURE__ */ jsx(Fragment, {}),
      Loaded: children,
      NotLoaded: () => spinner
      // TODO circle back with design to find an appropriate error state here
    });
  }
}
export {
  Spinner as default
};
