import { jsxs as l, Fragment as v, jsx as t } from "react/jsx-runtime";
import { forwardRef as S, useId as k } from "react";
import { cx as f } from "../../utils/classNames.js";
import { useArrowTheme as q } from "../../hooks/useArrowTheme.js";
import { Divider as s } from "../divider/Divider.js";
import { StatusLabel as z } from "../status-label/StatusLabel.js";
const B = S(
  ({
    label: c,
    labelId: p,
    body: r,
    status: o,
    leadingDecorationType: i,
    leadingImage: a,
    leadingIcon: d,
    leadingDecorationA11yLabel: N,
    dividerPosition: n = "bottom",
    inverse: I,
    focused: g,
    navigationUrl: u,
    trailingIcon: b,
    trailingWifiIcon: L,
    trailingIconA11yLabel: E,
    className: x
  }, j) => {
    const w = q(), e = I ?? w.inverse, A = k(), m = p || A;
    if (!c)
      return null;
    const C = /* @__PURE__ */ l(v, { children: [
      /* @__PURE__ */ t("div", { className: "tdds-list-item__label", children: c }),
      r == null ? void 0 : r.map(
        ({ text: _, icon: F }, R) => _ ? /* @__PURE__ */ l("div", { className: "tdds-list-item__optional-copy", children: [
          F ?? null,
          _
        ] }, R) : null
      )
    ] }), $ = /* @__PURE__ */ t(
      "div",
      {
        className: "tdds-list-item__trailing-decoration",
        id: `${m}-trailing-decoration`,
        children: b ?? L ?? null
      }
    ), h = /* @__PURE__ */ l("div", { className: "tdds-list-item__content", children: [
      i ? /* @__PURE__ */ l(
        "div",
        {
          className: "tdds-list-item__leading-decoration",
          "data-image-type": i,
          id: `${m}-leading-decoration`,
          children: [
            i === "icon" && d ? d : null,
            i !== "icon" && a ? /* @__PURE__ */ t("img", { src: a, alt: N || "" }) : null
          ]
        }
      ) : null,
      /* @__PURE__ */ l("div", { className: "tdds-list-item__main-content", id: m, children: [
        C,
        o ? /* @__PURE__ */ t(z, { ...o, inverse: e }) : null
      ] }),
      /* @__PURE__ */ t("div", { className: "tdds-list-item__trailing-content", children: $ })
    ] });
    return /* @__PURE__ */ t(
      "li",
      {
        ref: j,
        className: f("tdds-list-item", x),
        "data-inverse": e ? "true" : void 0,
        role: "listitem",
        children: u ? /* @__PURE__ */ l(
          "a",
          {
            href: u,
            className: f({ "force-focus": !!g }),
            children: [
              n === "top" ? /* @__PURE__ */ t(s, { inverse: e }) : null,
              h,
              n === "bottom" ? /* @__PURE__ */ t(s, { inverse: e }) : null
            ]
          }
        ) : /* @__PURE__ */ l(v, { children: [
          n === "top" ? /* @__PURE__ */ t(s, { inverse: e }) : null,
          h,
          n === "bottom" ? /* @__PURE__ */ t(s, { inverse: e }) : null
        ] })
      }
    );
  }
);
B.displayName = "ListItemTrailingIcon";
export {
  B as ListItemTrailingIcon
};
//# sourceMappingURL=ListItemTrailingIcon.js.map
