import { jsx as l, jsxs as e, Fragment as p } from "react/jsx-runtime";
import { forwardRef as G } from "react";
import { cx as c } from "../../utils/classNames.js";
import { useArrowTheme as q } from "../../hooks/useArrowTheme.js";
import { ButtonGroup as z } from "../button-group/ButtonGroup.js";
import { IconButton as D } from "../icon-button/IconButton.js";
import { Button as B } from "../button/Button.js";
const E = G(
  ({
    children: u,
    closeAction: g = !1,
    eyebrow: _,
    headline: a,
    primaryActionLabel: n,
    secondaryActionLabel: h,
    isOpen: N = !1,
    isButtonTraySticky: y = !1,
    primaryActionOnRight: o = !1,
    inverse: b,
    ariaLabel: w,
    closeIcon: x,
    onClose: C,
    onPrimaryAction: I,
    onSecondaryAction: k,
    focused: d = !1,
    id: r,
    className: S,
    ...j
  }, M) => {
    const T = q(), t = b ?? T.inverse, s = r ? r + "_headline" : void 0;
    let m = g;
    !m && !n && (m = !0);
    const i = !!n, v = i ? /* @__PURE__ */ l(
      B,
      {
        variant: "primary",
        inverse: t,
        focused: d,
        onClick: I,
        children: n
      }
    ) : null, f = i && h ? /* @__PURE__ */ l(
      B,
      {
        variant: "secondary",
        inverse: t,
        focused: d,
        onClick: k,
        children: h
      }
    ) : null, F = i ? /* @__PURE__ */ l(
      "div",
      {
        className: c("tdds-modal__tray", {
          "tdds-modal__tray--sticky": y,
          "tdds-modal__tray--flex": o
        }),
        children: /* @__PURE__ */ l(
          z,
          {
            inverse: t,
            arrangement: "row",
            smallButtonSpan: o ? "hug" : "fill",
            smallButtonArrangement: o ? "row" : "column",
            mediumButtonSpan: "hug",
            mediumButtonArrangement: "row",
            largeButtonSpan: "hug",
            largeButtonArrangement: "row",
            children: o ? /* @__PURE__ */ e(p, { children: [
              f,
              v
            ] }) : /* @__PURE__ */ e(p, { children: [
              v,
              f
            ] })
          }
        )
      }
    ) : null;
    return /* @__PURE__ */ l(
      "div",
      {
        ref: M,
        className: c("tdds-modal", { "tdds-modal--open": N }, S),
        id: r,
        ...t ? { "data-inverse": "true" } : {},
        ...j,
        children: /* @__PURE__ */ e(
          "dialog",
          {
            className: "tdds-modal__dialog",
            tabIndex: -1,
            "aria-modal": "true",
            role: "dialog",
            "aria-labelledby": a ? s : void 0,
            "aria-label": a ? void 0 : w,
            children: [
              m ? /* @__PURE__ */ l("div", { className: "tdds-modal__close", children: /* @__PURE__ */ l(
                D,
                {
                  icon: x,
                  a11yLabel: "Close",
                  focused: d,
                  onClick: C
                }
              ) }) : null,
              /* @__PURE__ */ e(
                "div",
                {
                  className: c("tdds-modal__content", {
                    "force-focus": d
                  }),
                  tabIndex: 0,
                  role: "region",
                  "aria-labelledby": s,
                  children: [
                    a ? /* @__PURE__ */ e("div", { className: "tdds-modal__header", children: [
                      _ ? /* @__PURE__ */ l("p", { className: "tdds-modal__eyebrow", children: _ }) : null,
                      /* @__PURE__ */ l("h2", { className: "tdds-modal__headline", id: s, children: a })
                    ] }) : null,
                    u ? /* @__PURE__ */ l("div", { className: "tdds-modal__body", children: u }) : null,
                    F
                  ]
                }
              )
            ]
          }
        )
      }
    );
  }
);
E.displayName = "Modal";
export {
  E as Modal
};
//# sourceMappingURL=Modal.js.map
