import { jsx as s, jsxs as d } from "react/jsx-runtime";
import { forwardRef as i } from "react";
import { cx as p } from "../../utils/classNames.js";
import { useArrowTheme as u } from "../../hooks/useArrowTheme.js";
const _ = ({ item: e }) => /* @__PURE__ */ d("span", { children: [
  /* @__PURE__ */ d("span", { className: "tdds-legend__label", children: [
    /* @__PURE__ */ s("span", { className: `tdds-legend__symbol tdds-legend__symbol--${e.type}` }),
    /* @__PURE__ */ d("span", { className: "tdds-legend__label-text", children: [
      " ",
      e.label,
      " "
    ] })
  ] }),
  e.value ? /* @__PURE__ */ s("span", { className: "tdds-legend__value", children: e.value }) : null
] }), g = i(
  ({ inverse: e, items: l, position: n, className: a }, r) => {
    const t = u(), o = e ?? t.inverse;
    return l ? /* @__PURE__ */ s(
      "div",
      {
        ref: r,
        className: p("tdds-legend", a),
        "data-inverse": o ? "true" : void 0,
        "data-position": n ?? void 0,
        children: l.map((m, c) => /* @__PURE__ */ s(_, { item: m }, c))
      }
    ) : null;
  }
);
g.displayName = "Legend";
export {
  g as Legend
};
//# sourceMappingURL=Legend.js.map
