import { jsxs as p, jsx as t } from "react/jsx-runtime";
import { Children as b } from "react";
import f from "../../../foundation/Icon/Generated/IconGrabHandle12.es.js";
import { merge as i } from "../../../utilities/merge.es.js";
import { INDENTATION_WIDTH as x } from "../helpers/constants.es.js";
const h = ({
  id: d,
  label: e,
  level: r = 0,
  children: s,
  contentComponent: w,
  isSelected: n,
  dragHandlerPosition: o = "left",
  showContentWhileDragging: l = !1
}) => {
  const m = b.count(s) > 0, c = { marginLeft: r * x }, a = /* @__PURE__ */ t("button", { tabIndex: -1, className: "tw-p-1 tw-touch-none", children: /* @__PURE__ */ t(f, {}) });
  return /* @__PURE__ */ p(
    "li",
    {
      role: "treeitem",
      style: c,
      id: d.toString(),
      "aria-label": e,
      "aria-level": r + 1,
      "aria-selected": n,
      "data-test-id": "fondue-tree-item-overlay",
      className: i([
        "tw-pointer-events-none tw-bg-white tw-flex tw-items-center tw-gap-x-1 tw-p-2 tw-no-underline tw-leading-5 tw-box-border tw-w-fit tw-drop-shadow-xl tw-rounded",
        l ? "tw-opacity-90" : ""
      ]),
      children: [
        o === "left" && a,
        m && /* @__PURE__ */ t("button", { tabIndex: -1, "data-test-id": "tree-item-toggle", className: "tw-p-1", children: /* @__PURE__ */ t(
          "div",
          {
            className: i([
              "tw-transition-transform tw-w-0 tw-h-0 tw-text-black-100 tw-text-opacity-40 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong",
              n && "tw-text-box-selected-strong-inverse"
            ])
          }
        ) }),
        e !== void 0 && /* @__PURE__ */ t("span", { children: e }),
        w,
        o === "right" && a
      ]
    }
  );
};
h.displayName = "FondueTreeItemOverlay";
export {
  h as TreeItemOverlay
};
//# sourceMappingURL=TreeItemOverlay.es.js.map
