"use client";
import { j as e } from "../../../node_modules/.pnpm/react@19.1.0/node_modules/react/jsx-runtime.mjs";
import D, { useState as F } from "react";
import { Menu as o } from "@mantine/core";
import h from "../../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.mjs";
import M from "../TextInput/index.mjs";
import L from "./components/ClickableGameItem/index.mjs";
import U from "./components/GameItem/index.mjs";
import s from "./index.module.scss.mjs";
function P({
  isLoading: g,
  selectedGames: n,
  searchResultGames: f,
  onSearchInput: x,
  inputProps: j,
  maxGames: S = 1 / 0,
  menuProps: N,
  i18n: r = {
    selectGame: "Select Game",
    selectUpTo: "(select up to 15 games)",
    searchForGames: "Search for game(s)",
    loading: "Loading...",
    emptySearchResults: "Nothing found..."
  }
}) {
  var u;
  const l = D.useRef(null), [y, I] = F(!1), R = ((u = l.current) == null ? void 0 : u.value) === "", m = new Map(
    n.map((t) => [t.gameId, !0])
  ), G = /* @__PURE__ */ e.jsx("div", { className: s.messageContainer, children: r.loading }), C = /* @__PURE__ */ e.jsx("div", { className: s.messageContainer, children: r.emptySearchResults });
  function i(t, T) {
    return t === void 0 || t.length === 0 ? null : t.map((a, k) => {
      const c = {};
      if (c[s.underline] = k < t.length - 1, T) {
        const p = `clickable-${a.gameId}`;
        return /* @__PURE__ */ e.jsx(
          L,
          {
            game: a,
            disabled: n.length >= S && !m.has(a.gameId),
            selected: m.has(a.gameId),
            className: h(c),
            "data-testid": p
          },
          p
        );
      }
      return /* @__PURE__ */ e.jsx(
        U,
        {
          game: a,
          className: h(c)
        },
        `selected-${a.gameId}`
      );
    });
  }
  const b = i(n), E = /* @__PURE__ */ e.jsxs("div", { className: s.searchLabel, children: [
    /* @__PURE__ */ e.jsx("div", { className: "caption", children: r.selectGame }),
    /* @__PURE__ */ e.jsx("div", { className: s.selectDetails, children: r.selectUpTo })
  ] }), d = i(f, !0), v = d === null && !R ? C : d, w = /* @__PURE__ */ e.jsx(
    M,
    {
      ref: l,
      placeholder: r.searchForGames,
      enterKeyHint: "search",
      onChange: (t) => x(t.target.value),
      label: E,
      "data-autofocus": "true",
      "data-testid": "search-input",
      ...j
    }
  );
  return /* @__PURE__ */ e.jsxs("div", { className: s.selectorContainer, children: [
    /* @__PURE__ */ e.jsxs(
      o,
      {
        opened: y,
        onChange: I,
        trapFocus: !1,
        position: "bottom-start",
        width: "target",
        offset: 8,
        ...N,
        children: [
          /* @__PURE__ */ e.jsx(o.Target, { children: w }),
          /* @__PURE__ */ e.jsx(o.Dropdown, { className: s.menuDropdown, children: g ? G : v })
        ]
      }
    ),
    /* @__PURE__ */ e.jsx("div", { className: s.selectedGamesContainer, children: b })
  ] });
}
export {
  P as GameSelector
};
//# sourceMappingURL=index.mjs.map
