"use client";
import { j as e } from "./index.esm38.js";
import { forwardRef as f } from "react";
import o from "./index.esm40.js";
import r from "./index.esm55.js";
import { Root as h } from "./index.esm8.js";
import { Typography as n } from "./index.esm9.js";
const v = f(
  ({ items: i, activeId: t, title: a = "Содержание", className: c, testId: m }, p) => i.length === 0 ? null : /* @__PURE__ */ e.jsxs(
    h,
    {
      ref: p,
      as: "nav",
      className: o(r.root, c),
      testId: m,
      "aria-label": a,
      children: [
        a && /* @__PURE__ */ e.jsx(
          n,
          {
            variant: "overline",
            size: "sm",
            as: "h2",
            className: r.title,
            children: a
          }
        ),
        /* @__PURE__ */ e.jsx("ol", { className: r.list, role: "list", children: i.map((s) => {
          const l = t === s.id, d = s.level ?? 2;
          return /* @__PURE__ */ e.jsx(
            "li",
            {
              className: o(r.item, r[`item--level${d}`]),
              children: /* @__PURE__ */ e.jsx(
                "a",
                {
                  href: s.href,
                  className: o(r.link, l && r["link--active"]),
                  "aria-current": l ? "location" : void 0,
                  children: /* @__PURE__ */ e.jsx(
                    n,
                    {
                      variant: "body",
                      size: "sm",
                      color: l ? "primary" : "secondary",
                      as: "span",
                      className: r.linkText,
                      children: s.label
                    }
                  )
                }
              )
            },
            s.id
          );
        }) })
      ]
    }
  )
);
v.displayName = "TableOfContents";
export {
  v as TableOfContents
};
//# sourceMappingURL=index.esm31.js.map
