"use client";
import { j as o } from "../../../node_modules/.pnpm/react@19.1.0/node_modules/react/jsx-runtime.mjs";
import { useState as g } from "react";
import { Tooltip as M, Popover as l } from "@mantine/core";
import i from "../../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.mjs";
import e from "./IconsStack.module.scss.mjs";
const k = ({
  title: d,
  icons: c,
  maxVisible: s = 8,
  showMore: v = !0,
  forceShowMore: u = !1,
  classNames: r,
  i18n: a = { more: "More" },
  ...x
}) => {
  const [j, h] = g(!1), m = c.slice(0, s), t = c.slice(s), f = t.length > 0, w = u || f && v;
  return /* @__PURE__ */ o.jsxs("div", { className: i(e.iconsStack, r == null ? void 0 : r.root), ...x, children: [
    d ? /* @__PURE__ */ o.jsx("span", { className: e.title, children: d }) : null,
    /* @__PURE__ */ o.jsxs("div", { className: i(e.iconsContainer, r == null ? void 0 : r.iconsContainer), children: [
      m.map((n, p) => /* @__PURE__ */ o.jsx(
        M,
        {
          label: n.title,
          className: e.tooltip,
          events: { hover: !0, touch: !0, focus: !1 },
          children: /* @__PURE__ */ o.jsx("div", { className: e.icon, children: n.icon })
        },
        `icon-${p}`
      )),
      w && /* @__PURE__ */ o.jsxs(
        l,
        {
          opened: j,
          position: "top",
          withArrow: !0,
          classNames: {
            dropdown: i(e.popover, r == null ? void 0 : r.popover),
            arrow: e.popoverArrow
          },
          children: [
            /* @__PURE__ */ o.jsx(l.Target, { children: /* @__PURE__ */ o.jsx(
              "div",
              {
                className: e.more,
                "data-testid": "icons-more-button",
                onMouseEnter: () => h(!0),
                onMouseLeave: () => h(!1),
                children: /* @__PURE__ */ o.jsxs(
                  "span",
                  {
                    style: {
                      cursor: t.length ? "pointer" : "default"
                    },
                    className: e.moreText,
                    children: [
                      "+",
                      a.more
                    ]
                  }
                )
              }
            ) }),
            t.length ? /* @__PURE__ */ o.jsx(l.Dropdown, { children: /* @__PURE__ */ o.jsx("div", { className: e.popoverContent, children: t.map((n, p) => /* @__PURE__ */ o.jsxs(
              "div",
              {
                className: i(
                  e.popoverItem,
                  r == null ? void 0 : r.popoverDropdown
                ),
                children: [
                  /* @__PURE__ */ o.jsx("div", { className: e.popoverIcon, children: n.icon }),
                  /* @__PURE__ */ o.jsx("span", { className: e.popoverIconName, children: n.title })
                ]
              },
              `remaining-${p}`
            )) }) }) : null
          ]
        }
      )
    ] })
  ] });
};
export {
  k as default
};
//# sourceMappingURL=index.mjs.map
