import "@emotion/react";
import "react";
import { jsxs, jsx } from "@emotion/react/jsx-runtime";
import { SmallButtonContainer } from "./style.js";
import loadingSvg from "../../../assets/icon/loading_black.svg.js";
const SmallButton = function({
  loading,
  onClick,
  content,
  contentType = "image",
  tip,
  skin = "default",
  borderless = false,
  cssStyle,
  className,
  style
}) {
  return /* @__PURE__ */ jsxs(
    SmallButtonContainer,
    {
      borderless,
      skin,
      cssStyle,
      className,
      style,
      onClick,
      children: [
        contentType === "font" ? /* @__PURE__ */ jsx("text", { className: "small-button-font", children: content }) : contentType === "diy" ? /* @__PURE__ */ jsx("div", { className: "diy", children: content }) : /* @__PURE__ */ jsx("img", { src: content, style: { display: loading ? "none" : "block" } }),
        /* @__PURE__ */ jsx("img", { src: loadingSvg, style: { display: loading ? "block" : "none" } }),
        /* @__PURE__ */ jsx("div", { className: "tip", children: /* @__PURE__ */ jsx("span", { children: tip }) })
      ]
    }
  );
};
export {
  SmallButton
};
//# sourceMappingURL=index.js.map
