import "../Button.css";
import { jsx, jsxs } from "react/jsx-runtime";
import { Button as Button$1 } from "antd";
import { forwardRef } from "react";
import Icon from "./Icon.js";
import { ConditionalWrapper } from "./internal/ConditionalWrapper.js";
import { useTheme } from "./Theme/UI.js";
import "./Theme/themeUtils.js";
import "./Theme/themes.js";
import Tooltip from "./Tooltip.js";
const base = "Button_base_dd0d6";
const selected = "Button_selected_dd0d6";
const content = "Button_content_dd0d6";
const icon = "Button_icon_dd0d6";
const children = "Button_children_dd0d6";
const column = "Button_column_dd0d6";
const circle = "Button_circle_dd0d6";
const status = "Button_status_dd0d6";
const css = {
  base,
  selected,
  content,
  icon,
  children,
  column,
  circle,
  "ant-btn-sm": "Button_ant-btn-sm_dd0d6",
  status
};
const Button = forwardRef(
  ({
    size = "middle",
    tooltip = "",
    className,
    // do not include className in {...props} below.
    hideChildren = false,
    children: children2,
    icon: icon2,
    loading,
    column: column2,
    ...props
  }, ref) => {
    const {
      themeSettings: { className: themeClass }
    } = useTheme();
    const classes = [css.base, themeClass];
    if (className)
      classes.push(className);
    if (props.selected)
      classes.push(css.selected);
    if (column2)
      classes.push(css.column);
    if (props.shape === "circle")
      classes.push(css.circle);
    if (props.status)
      classes.push(css.status);
    if (loading) {
      icon2 = /* @__PURE__ */ jsx(Icon, { decorative: true, name: "spinner" });
      children2 = "Loading";
    }
    return /* @__PURE__ */ jsx(
      ConditionalWrapper,
      {
        condition: tooltip.length > 0,
        wrapper: (children22) => /* @__PURE__ */ jsx(Tooltip, { content: tooltip, children: children22 }),
        children: /* @__PURE__ */ jsx(
          Button$1,
          {
            className: classes.join(" "),
            ref,
            size,
            style: {
              backgroundColor: props.status ? `var(--theme-status-${props.status}` : void 0,
              borderColor: props.status ? "transparent" : void 0,
              color: props.status ? `var(--theme-status-${props.status}-on-strong` : void 0
            },
            tabIndex: props.disabled ? -1 : 0,
            ...props,
            children: /* @__PURE__ */ jsxs("div", { className: css.content, children: [
              icon2 && /* @__PURE__ */ jsx("div", { className: css.icon, children: icon2 }),
              !hideChildren && children2 && /* @__PURE__ */ jsx("div", { className: css.children, children: children2 })
            ] })
          }
        )
      }
    );
  }
);
export {
  Button as default
};
