import { jsxs as p, jsx as x } from "react/jsx-runtime";
import { forwardRef as f, createElement as u } from "react";
import { cx as h } from "../../utils/classNames.js";
import { useArrowTheme as y } from "../../hooks/useArrowTheme.js";
const v = f(
  ({
    headline: t,
    hierarchy: e = "primary",
    heading: r = "h1",
    alignment: d = "leading",
    optionalBody: s,
    inverse: i,
    className: m
  }, a) => {
    const l = y(), n = i ?? l.inverse;
    if (!t)
      return null;
    const o = e === "primary" ? "tdds:text-title-1" : "tdds:text-title-2", c = e === "primary" ? "tdds:text-body-1 tdds:pt-h" : "tdds:text-body-2 tdds:pt-h";
    return /* @__PURE__ */ p(
      "div",
      {
        ref: a,
        className: h(
          "tdds-title",
          { "tdds:ta-center": d === "center" },
          m
        ),
        ...n ? { "data-inverse": "true" } : {},
        children: [
          u(r, { className: o }, t),
          s ? /* @__PURE__ */ x("p", { className: c, children: s }) : null
        ]
      }
    );
  }
);
v.displayName = "Title";
export {
  v as Title
};
//# sourceMappingURL=Title.js.map
