import {
  TextIconAligner
} from "./chunk-TH42CNH3.js";
import {
  UnstyledButton
} from "./chunk-5NUOBJXP.js";
import {
  getFocusOutline
} from "./chunk-HGZGGJQB.js";
import {
  Link
} from "./chunk-SWMGDTQN.js";
import {
  elide
} from "./chunk-HAC5YAGQ.js";
import {
  __spreadProps,
  __spreadValues
} from "./chunk-W7FAWX6T.js";

// src/components/TextButton.tsx
import { css } from "@emotion/react";
import styled from "@emotion/styled";
import { jsx } from "@emotion/react/jsx-runtime";
function TextButton({
  text: textProp,
  to,
  href,
  toParams,
  onClick,
  rightIcon,
  leftIcon,
  elide: elideArgs,
  disabled = false,
  mt = 0,
  ml = 0,
  mr = 0,
  padding = "0",
  iconMatchTextColor = false,
  typography
}) {
  const text = elideArgs ? elide(textProp, elideArgs) : textProp;
  let rightIconProp = rightIcon;
  if (typeof rightIcon === "undefined" && typeof leftIcon === "undefined") {
    rightIconProp = {
      name: "ArrowRight"
    };
  }
  const defaultIconColor = iconMatchTextColor ? void 0 : "mcNeutral";
  const content = /* @__PURE__ */ jsx(
    TextIconAligner,
    {
      onClick,
      leftIcon: leftIcon ? {
        name: leftIcon.name,
        color: leftIcon.color || defaultIconColor,
        width: leftIcon.width
      } : null,
      content: text,
      typography: __spreadValues({ size: "ExtraSmall" }, typography),
      rightIcon: rightIconProp ? {
        name: rightIconProp.name,
        color: rightIconProp.color || defaultIconColor,
        width: rightIconProp.width
      } : null
    }
  );
  const commonProps = {
    type: "button",
    onClick,
    disabled,
    padding,
    css: {
      marginTop: mt ? `${mt}px` : void 0,
      marginLeft: ml ? `${ml}px` : void 0,
      marginRight: mr ? `${mr}px` : void 0
    }
  };
  if (to) {
    return /* @__PURE__ */ jsx(ButtonLink, __spreadProps(__spreadValues({}, commonProps), { to, params: toParams, children: content }));
  }
  return href ? /* @__PURE__ */ jsx(ButtonHrefLink, __spreadProps(__spreadValues({}, commonProps), { href, target: "_blank", children: content })) : /* @__PURE__ */ jsx(StyledButton, __spreadProps(__spreadValues({}, commonProps), { children: content }));
}
var buttonStyle = ({
  theme,
  disabled,
  padding
}) => css`
  display: inline-flex;
  opacity: ${disabled ? 0.2 : 1};
  align-items: center;
  transition: opacity 0.2s;
  padding: ${padding};

  &:focus-visible {
    outline: ${getFocusOutline({ theme })};
  }

  & > * {
    width: 100%;
    text-align: center;
    white-space: nowrap;
    cursor: ${disabled ? "not-allowed" : "pointer"};
  }
`;
var StyledButton = styled(UnstyledButton)`
  ${(props) => buttonStyle(props)}
`;
var ButtonLink = styled(Link)`
  ${(props) => buttonStyle(props)}
`;
var ButtonHrefLink = styled.a`
  ${(props) => buttonStyle(props)}
`;

export {
  TextButton
};
