"use client";
import { j as f } from "./index.esm38.js";
import h, { forwardRef as l } from "react";
import c from "./index.esm40.js";
import r from "./index.esm41.js";
const d = l(
  ({ variant: t = "body", size: e, color: p, font: y, as: o, children: m, className: s, ...n }, u) => {
    const a = h.useMemo(() => o || (t.startsWith("h") ? t : t === "body" ? "p" : "span"), [o, t]);
    return /* @__PURE__ */ f.jsx(
      a,
      {
        ref: u,
        "data-atme-ui": !0,
        className: c(
          r.typography,
          r[`typography--${t}`],
          e && r[`typography--${e}`],
          p && r[`typography--color-${p}`],
          y && r[`typography--font-${y}`],
          s
        ),
        ...n,
        children: m
      }
    );
  }
);
d.displayName = "Typography";
export {
  d as Typography
};
//# sourceMappingURL=index.esm9.js.map
