import { jsx as e, jsxs as i } from "react/jsx-runtime";
/* empty css                       */
import { classNames as c } from "./index-classNames.js";
import { AnimatedConditional as T } from "./index-AnimatedConditional.js";
import { Button as C, ButtonSizes as S, ButtonTypes as g } from "./index-Button.js";
import { Icon as l, IconSize as r } from "./index-Icon.js";
import { TextTypes as v, Text as N, FontWeights as w } from "./index-Text.js";
import { useCallback as B } from "react";
import { IconNames as t } from "./index-IconNames.js";
const A = (s) => {
  const {
    children: d,
    closeFn: n,
    className: m,
    type: o = "default",
    hideCloseButtonOnMobile: p = !0,
    hideHeaderCloseBtn: h = !1,
    hideTypeIcon: u = !1,
    title: f,
    titleTextType: y = v.heading3,
    replacements: b
  } = s, a = B((x) => {
    switch (x) {
      case "danger":
        return {
          color: "--e500",
          containerStyle: {
            borderTop: "2px solid var(--e500)",
            borderRadius: 8
          },
          icon: e(l, {
            type: r.small,
            color: "--e500",
            hasCircle: !0,
            children: t.exclamation
          })
        };
      case "warn":
        return {
          color: "--w500",
          containerStyle: {
            borderTop: "2px solid var(--w500)",
            borderRadius: 8
          },
          icon: e(l, {
            type: r.large,
            color: "--w500",
            hasCircle: !1,
            children: t.warning
          })
        };
      case "success":
        return {
          color: "--s500",
          containerStyle: {
            borderTop: "2px solid var(--s500)",
            borderRadius: 8
          },
          icon: e(l, {
            type: r.small,
            color: "--s500",
            hasCircle: !0,
            children: t.check
          })
        };
      case "info":
        return {
          color: "--p500",
          containerStyle: {
            borderTop: "2px solid var(--p500)",
            borderRadius: 8
          },
          icon: e(l, {
            type: r.small,
            color: "--p500",
            hasCircle: !0,
            children: t.info
          })
        };
      default:
        return {
          color: "transparent",
          containerStyle: {
            borderTop: "2px solid transparent"
          },
          icon: null
        };
    }
  }, [o]);
  return i("div", {
    className: c("modal-header", m),
    style: a(o).containerStyle,
    children: [i("div", {
      className: "modal-header-title-container",
      children: [e(T, {
        condition: o !== "default" && !u,
        children: e("div", {
          className: "modal-header-icon-container",
          children: a(o).icon
        })
      }), e(N, {
        type: y,
        fontWeight: w.bold,
        replacements: b,
        children: f
      }), d]
    }), !h && n && typeof n == "function" ? e(C, {
      className: c("modal-header-close-btn", p ? "modal-header-close-btn-hidden-mobile" : ""),
      testId: "modal-close-header-cta",
      type: g.default,
      size: S.small,
      iconLeft: t.close,
      iconSize: r.large,
      iconColor: "--n500",
      iconHoverColor: "--n700",
      onClick: () => n()
    }) : null]
  }, o);
};
export {
  A as ModalHeader
};
