import { jsxs as o, jsx as a, Fragment as ge } from "react/jsx-runtime";
import { useState as m, useMemo as xe, useCallback as ye, useEffect as X } from "react";
import { useTranslation as we } from "react-i18next";
import { Users as B, Building2 as G, Briefcase as Ne, MapPin as Te, GitMerge as J, History as Se, Plus as $e, Globe as ke, AlertCircle as Ce, X as Me, Search as Ae, Loader2 as Ie, Check as je, MoreHorizontal as Pe, Edit2 as Re, Trash2 as Fe, Database as De } from "lucide-react";
import { p as A, o as Ee, a as Ue, P as ze } from "./index-CeEMms9z.js";
import { U as He } from "./UnderlinedTabs-BEbz4Kre.js";
import { u as Le } from "./useAdminTenants-C2kw_MWU.js";
import { T as Oe } from "./TenantScopeSelector-C_McRF0W.js";
const Xe = (r) => ({
  get: (s, d) => A.get(s, {
    ...d,
    headers: r ? { ...d?.headers, "X-Tenant-Slug": r } : d?.headers
  }).then((t) => t.data),
  post: (s, d, t) => A.post(s, d, {
    ...t,
    headers: r ? { ...t?.headers, "X-Tenant-Slug": r } : t?.headers
  }).then((n) => n.data),
  put: (s, d, t) => A.put(s, d, {
    ...t,
    headers: r ? { ...t?.headers, "X-Tenant-Slug": r } : t?.headers
  }).then((n) => n.data),
  patch: (s, d, t) => A.patch(s, d, {
    ...t,
    headers: r ? { ...t?.headers, "X-Tenant-Slug": r } : t?.headers
  }).then((n) => n.data),
  delete: (s, d) => A.delete(s, {
    ...d,
    headers: r ? { ...d?.headers, "X-Tenant-Slug": r } : d?.headers
  }).then((t) => t.data)
}), R = {
  Company: 0,
  Department: 1,
  JobTitle: 2,
  Office: 3
}, h = "/api/administration/users/references", Be = (r) => {
  const s = r ? Xe(r) : Ee, d = (t, n, i) => {
    const f = new URLSearchParams();
    n && f.append("tenantId", n), i && Object.entries(i).forEach(([v, u]) => {
      u !== void 0 && f.append(v, String(u));
    });
    const c = f.toString();
    return c ? `${h}/${t}?${c}` : `${h}/${t}`;
  };
  return {
    // === COMPANIES ===
    companies: {
      getAll: async (t, n, i, f, c = 1, v = 20) => {
        const u = d("companies", t, { search: n, isActive: i, source: f, page: c, pageSize: v });
        return s.get(u);
      },
      create: async (t, n) => {
        const i = d("companies", t);
        return s.post(i, n);
      },
      update: async (t, n) => {
        await s.put(`${h}/companies/${t}`, n);
      },
      activate: async (t) => {
        await s.patch(`${h}/companies/${t}/activate`);
      },
      deactivate: async (t) => {
        await s.patch(`${h}/companies/${t}/deactivate`);
      },
      delete: async (t) => {
        await s.delete(`${h}/companies/${t}`);
      }
    },
    // === DEPARTMENTS ===
    departments: {
      getAll: async (t, n, i, f, c = 1, v = 20) => {
        const u = d("departments", t, { search: n, isActive: i, source: f, page: c, pageSize: v });
        return s.get(u);
      },
      create: async (t, n) => {
        const i = d("departments", t);
        return s.post(i, n);
      },
      update: async (t, n) => {
        await s.put(`${h}/departments/${t}`, n);
      },
      activate: async (t) => {
        await s.patch(`${h}/departments/${t}/activate`);
      },
      deactivate: async (t) => {
        await s.patch(`${h}/departments/${t}/deactivate`);
      },
      delete: async (t) => {
        await s.delete(`${h}/departments/${t}`);
      }
    },
    // === JOB TITLES ===
    jobTitles: {
      getAll: async (t, n, i, f, c = 1, v = 20) => {
        const u = d("job-titles", t, { search: n, isActive: i, source: f, page: c, pageSize: v });
        return s.get(u);
      },
      create: async (t, n) => {
        const i = d("job-titles", t);
        return s.post(i, n);
      },
      update: async (t, n) => {
        await s.put(`${h}/job-titles/${t}`, n);
      },
      activate: async (t) => {
        await s.patch(`${h}/job-titles/${t}/activate`);
      },
      deactivate: async (t) => {
        await s.patch(`${h}/job-titles/${t}/deactivate`);
      },
      delete: async (t) => {
        await s.delete(`${h}/job-titles/${t}`);
      }
    },
    // === OFFICES ===
    offices: {
      getAll: async (t, n, i, f, c = 1, v = 20) => {
        const u = d("offices", t, { search: n, isActive: i, source: f, page: c, pageSize: v });
        return s.get(u);
      },
      create: async (t, n) => {
        const i = d("offices", t);
        return s.post(i, n);
      },
      update: async (t, n) => {
        await s.put(`${h}/offices/${t}`, n);
      },
      activate: async (t) => {
        await s.patch(`${h}/offices/${t}/activate`);
      },
      deactivate: async (t) => {
        await s.patch(`${h}/offices/${t}/deactivate`);
      },
      delete: async (t) => {
        await s.delete(`${h}/offices/${t}`);
      }
    },
    // === MERGE OPERATIONS ===
    merge: {
      execute: async (t) => s.post(`${h}/merge`, t),
      preview: async (t) => s.post(`${h}/merge/preview`, t),
      getHistory: async (t, n, i, f) => {
        const c = new URLSearchParams();
        t && c.append("tenantId", t), n !== void 0 && c.append("referenceType", String(n)), i && c.append("from", i), f && c.append("to", f);
        const v = c.toString(), u = v ? `${h}/merge/history?${v}` : `${h}/merge/history`;
        return s.get(u);
      }
    }
  };
}, _ = Be;
function st() {
  const { t: r } = we("admin"), { currentTenant: s, userTenants: d, switchTenant: t } = Ue(), { tenants: n } = Le(), [i, f] = m(
    s ? { tenantId: s.id, tenantSlug: s.slug, tenantUserId: "", tenantName: s.name } : "global"
  ), c = i === "global", v = c ? null : i.tenantId, u = c ? void 0 : i.tenantSlug, b = xe(() => _(u), [u]), [y, q] = m("departments"), [w, K] = m([]), [F, D] = m(!0), [N, Q] = m(""), [I, V] = m(!1), [x, C] = m(/* @__PURE__ */ new Set()), [g, j] = m(1), [T] = m(20), [E, W] = m(0), [$, Y] = m(0), [, Z] = m(!1), [, ee] = m(!1), [, te] = m(!1), [, ae] = m(!1), [Ge, re] = m(null), [Je, se] = m(null), [, ne] = m([]), [U, P] = m(null), [_e, z] = m({ code: "", name: "" }), [qe, ce] = m(null), [Ke, oe] = m(""), [, Qe] = m(!1), [H, k] = m(null), L = [
    { id: "departments", label: r("references.tabs.departments", "Departments"), icon: B, referenceType: R.Department },
    { id: "companies", label: r("references.tabs.companies", "Companies"), icon: G, referenceType: R.Company },
    { id: "jobTitles", label: r("references.tabs.jobTitles", "Job Titles"), icon: Ne, referenceType: R.JobTitle },
    { id: "offices", label: r("references.tabs.offices", "Offices"), icon: Te, referenceType: R.Office }
  ], O = L.find((e) => e.id === y), S = v, M = ye(async () => {
    try {
      D(!0);
      const e = _(u ?? void 0), l = I ? void 0 : !0;
      let p;
      switch (y) {
        case "companies":
          p = await e.companies.getAll(S, N || void 0, l, void 0, g, T);
          break;
        case "departments":
          p = await e.departments.getAll(S, N || void 0, l, void 0, g, T);
          break;
        case "jobTitles":
          p = await e.jobTitles.getAll(S, N || void 0, l, void 0, g, T);
          break;
        case "offices":
          p = await e.offices.getAll(S, N || void 0, l, void 0, g, T);
          break;
        default:
          p = { items: [], totalCount: 0, page: 1, pageSize: 20, totalPages: 0, hasPreviousPage: !1, hasNextPage: !1 };
      }
      K(p.items), W(p.totalCount), Y(p.totalPages), C(/* @__PURE__ */ new Set());
    } catch (e) {
      console.error("Failed to load references:", e), k("Failed to load references");
    } finally {
      D(!1);
    }
  }, [u, y, S, N, I, g, T]);
  X(() => {
    M();
  }, [M]), X(() => {
    j(1);
  }, [y, N, I, i]);
  const ie = (e) => {
    const l = new Set(x);
    l.has(e) ? l.delete(e) : l.add(e), C(l);
  }, le = () => {
    x.size === w.length ? C(/* @__PURE__ */ new Set()) : C(new Set(w.map((e) => e.id)));
  }, de = async (e) => {
    try {
      await t(e);
      const l = d.find((p) => p.id === e);
      l && f({ tenantId: l.id, tenantSlug: l.slug, tenantUserId: "", tenantName: l.name });
    } catch (l) {
      console.error("Failed to switch tenant:", l);
    }
  }, me = async (e) => {
    if (confirm(r("references.confirmDelete", "Are you sure you want to delete this reference?")))
      try {
        switch (y) {
          case "companies":
            await b.companies.delete(e);
            break;
          case "departments":
            await b.departments.delete(e);
            break;
          case "jobTitles":
            await b.jobTitles.delete(e);
            break;
          case "offices":
            await b.offices.delete(e);
            break;
        }
        M();
      } catch (l) {
        const p = l instanceof Error ? l.message : "Failed to delete";
        k(p);
      }
  }, pe = async (e) => {
    try {
      if (e.isActive)
        switch (y) {
          case "companies":
            await b.companies.deactivate(e.id);
            break;
          case "departments":
            await b.departments.deactivate(e.id);
            break;
          case "jobTitles":
            await b.jobTitles.deactivate(e.id);
            break;
          case "offices":
            await b.offices.deactivate(e.id);
            break;
        }
      else
        switch (y) {
          case "companies":
            await b.companies.activate(e.id);
            break;
          case "departments":
            await b.departments.activate(e.id);
            break;
          case "jobTitles":
            await b.jobTitles.activate(e.id);
            break;
          case "offices":
            await b.offices.activate(e.id);
            break;
        }
      M();
    } catch (l) {
      const p = l instanceof Error ? l.message : "Failed to toggle status";
      k(p);
    }
  }, he = async () => {
    if (!(x.size < 2))
      try {
        const e = await b.merge.preview({
          tenantId: S,
          referenceType: O.referenceType,
          sourceIds: Array.from(x)
        });
        se(e), ce(null), oe(""), te(!0);
      } catch (e) {
        console.error("Failed to get merge preview:", e), k("Failed to preview merge");
      }
  }, fe = async () => {
    try {
      const e = await b.merge.getHistory(S, O.referenceType);
      ne(e), ae(!0);
    } catch (e) {
      console.error("Failed to load merge history:", e), k("Failed to load merge history");
    }
  }, ue = (e) => {
    re(e), z({
      code: e.code,
      name: e.name,
      shortName: e.shortName,
      description: e.description
    }), ee(!0), P(null);
  }, ve = (e) => e.isMerged ? /* @__PURE__ */ o("span", { className: "inline-flex items-center gap-1 px-2 py-1 text-xs font-medium rounded-full bg-[var(--info-bg)] text-[var(--info-text)]", children: [
    /* @__PURE__ */ a(J, { className: "w-3 h-3" }),
    r("references.merged", "Merged")
  ] }) : e.isActive ? null : /* @__PURE__ */ a("span", { className: "inline-flex items-center gap-1 px-2 py-1 text-xs font-medium rounded-full bg-[var(--bg-secondary)] text-[var(--text-secondary)]", children: r("references.inactive", "Inactive") }), be = /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
    x.size >= 2 && !c && /* @__PURE__ */ o(
      "button",
      {
        onClick: he,
        className: "flex items-center gap-2 px-4 py-2 bg-[var(--info-dot)] text-white rounded-[var(--radius-button)] hover:opacity-90 transition-opacity",
        children: [
          /* @__PURE__ */ a(J, { className: "w-4 h-4" }),
          r("references.merge", "Merge"),
          " (",
          x.size,
          ")"
        ]
      }
    ),
    !c && /* @__PURE__ */ o(
      "button",
      {
        onClick: fe,
        className: "flex items-center gap-2 px-4 py-2 border border-[var(--border-color)] text-[var(--text-primary)] rounded-[var(--radius-button)] hover:bg-[var(--bg-hover)] transition-colors",
        children: [
          /* @__PURE__ */ a(Se, { className: "w-4 h-4" }),
          r("references.history", "History")
        ]
      }
    ),
    /* @__PURE__ */ o(
      "button",
      {
        onClick: () => {
          z({ code: "", name: "" }), Z(!0);
        },
        disabled: c,
        title: c ? r("references.selectTenantToCreate", "Select a tenant to create a reference") : void 0,
        className: `flex items-center gap-2 px-4 py-2 rounded-[var(--radius-button)] transition-colors ${c ? "bg-[var(--bg-secondary)] text-[var(--text-tertiary)] cursor-not-allowed" : "bg-[var(--color-accent-600)] text-white hover:bg-[var(--color-accent-700)]"}`,
        children: [
          /* @__PURE__ */ a($e, { className: "w-4 h-4" }),
          r("common.create", "Create")
        ]
      }
    )
  ] });
  return /* @__PURE__ */ o(
    ze,
    {
      title: r("references.title", "Reference Data Management"),
      subtitle: r("references.description", "Manage companies, departments, job titles, and offices for your organization"),
      icon: /* @__PURE__ */ a(De, { className: "h-6 w-6" }),
      breadcrumbs: [
        { label: r("admin.title", "Administration"), href: "/administration" },
        { label: r("users.title", "Users"), href: "/administration/users" },
        { label: r("references.title", "References") }
      ],
      actions: be,
      children: [
        /* @__PURE__ */ o("div", { className: "mt-4", children: [
          /* @__PURE__ */ a(
            Oe,
            {
              value: i,
              onChange: f,
              adminTenants: n.map((e) => ({
                tenantId: e.id,
                tenantSlug: e.slug,
                tenantName: e.name,
                tenantType: e.type
              }))
            }
          ),
          c && /* @__PURE__ */ o("p", { className: "mt-2 text-sm text-[var(--text-secondary)] flex items-center gap-1.5", children: [
            /* @__PURE__ */ a(ke, { className: "w-4 h-4" }),
            r("references.globalModeInfo", "Showing references from all tenants. Select a tenant to manage its data.")
          ] })
        ] }),
        H && /* @__PURE__ */ o("div", { className: "mb-4 p-4 bg-[var(--error-bg)] border border-[var(--error-border)] rounded-[var(--radius-card)]", children: [
          /* @__PURE__ */ o("div", { className: "flex items-center", children: [
            /* @__PURE__ */ a(Ce, { className: "w-5 h-5 text-[var(--error-text)]" }),
            /* @__PURE__ */ a("span", { className: "ml-2 text-[var(--error-text)]", children: H }),
            /* @__PURE__ */ a("button", { onClick: () => k(null), className: "ml-auto text-[var(--error-text)]", children: /* @__PURE__ */ a(Me, { className: "w-4 h-4" }) })
          ] }),
          /* @__PURE__ */ a(
            "button",
            {
              onClick: () => M(),
              className: "mt-2 text-sm text-[var(--error-text)] hover:opacity-80 underline",
              children: r("common.retry", "Retry")
            }
          )
        ] }),
        /* @__PURE__ */ a("div", { className: "mb-6", children: /* @__PURE__ */ a(
          He,
          {
            tabs: L.map((e) => ({
              id: e.id,
              label: e.label,
              icon: /* @__PURE__ */ a(e.icon, { className: "w-4 h-4" })
            })),
            activeTab: y,
            onTabChange: (e) => {
              q(e), C(/* @__PURE__ */ new Set());
            },
            ariaLabel: r("references.tabs.label", "Onglets des références")
          }
        ) }),
        /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-4 mb-4", children: /* @__PURE__ */ o("div", { className: "flex items-center gap-4", children: [
          /* @__PURE__ */ o("div", { className: "relative", children: [
            /* @__PURE__ */ a(Ae, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-[var(--text-tertiary)]" }),
            /* @__PURE__ */ a(
              "input",
              {
                type: "text",
                value: N,
                onChange: (e) => Q(e.target.value),
                placeholder: r("common.search", "Search..."),
                className: "pl-10 pr-4 py-2 border border-[var(--border-color)] rounded-[var(--radius-input)] bg-[var(--bg-primary)] text-[var(--text-primary)] focus:ring-2 focus:ring-[var(--color-accent-500)]"
              }
            )
          ] }),
          /* @__PURE__ */ o("label", { className: "flex items-center gap-2 text-sm text-[var(--text-secondary)]", children: [
            /* @__PURE__ */ a(
              "input",
              {
                type: "checkbox",
                checked: I,
                onChange: (e) => V(e.target.checked),
                className: "rounded border-[var(--border-color)]"
              }
            ),
            r("references.showInactive", "Show inactive")
          ] })
        ] }) }),
        /* @__PURE__ */ o("div", { className: "card overflow-hidden", children: [
          F && /* @__PURE__ */ a("div", { className: "flex items-center justify-center py-12", children: /* @__PURE__ */ a(Ie, { className: "w-8 h-8 animate-spin text-[var(--color-accent-500)]" }) }),
          !F && w.length === 0 && /* @__PURE__ */ a("div", { className: "text-center py-12 text-[var(--text-secondary)]", children: r("references.noItems", "No items found") }),
          !F && w.length > 0 && /* @__PURE__ */ o(ge, { children: [
            /* @__PURE__ */ o("table", { className: "w-full", children: [
              /* @__PURE__ */ a("thead", { className: "bg-[var(--bg-secondary)] border-b border-[var(--border-color)]", children: /* @__PURE__ */ o("tr", { children: [
                /* @__PURE__ */ a("th", { className: "w-12 px-4 py-3", children: !c && /* @__PURE__ */ a(
                  "input",
                  {
                    type: "checkbox",
                    checked: x.size === w.length && w.length > 0,
                    onChange: le,
                    className: "rounded border-[var(--border-color)]"
                  }
                ) }),
                /* @__PURE__ */ a("th", { className: "px-4 py-3 text-left text-sm font-medium text-[var(--text-secondary)]", children: r("references.code", "Code") }),
                /* @__PURE__ */ a("th", { className: "px-4 py-3 text-left text-sm font-medium text-[var(--text-secondary)]", children: r("references.name", "Name") }),
                c && /* @__PURE__ */ a("th", { className: "px-4 py-3 text-left text-sm font-medium text-[var(--text-secondary)]", children: r("references.tenant", "Tenant") }),
                /* @__PURE__ */ a("th", { className: "px-4 py-3 text-left text-sm font-medium text-[var(--text-secondary)]", children: r("references.shortName", "Short Name") }),
                /* @__PURE__ */ a("th", { className: "px-4 py-3 text-center text-sm font-medium text-[var(--text-secondary)]", children: r("references.users", "Users") }),
                /* @__PURE__ */ a("th", { className: "px-4 py-3 text-center text-sm font-medium text-[var(--text-secondary)]", children: r("references.status", "Status") }),
                /* @__PURE__ */ a("th", { className: "w-20 px-4 py-3" })
              ] }) }),
              /* @__PURE__ */ a("tbody", { className: "divide-y divide-[var(--border-color)]", children: w.map((e) => /* @__PURE__ */ o(
                "tr",
                {
                  className: `hover:bg-[var(--bg-hover)] transition-colors ${x.has(e.id) ? "bg-[var(--info-bg)]" : ""} ${e.isMerged ? "opacity-60" : ""}`,
                  children: [
                    /* @__PURE__ */ a("td", { className: "px-4 py-3", children: !c && /* @__PURE__ */ a(
                      "input",
                      {
                        type: "checkbox",
                        checked: x.has(e.id),
                        onChange: () => ie(e.id),
                        disabled: e.isMerged,
                        className: "rounded border-[var(--border-color)]"
                      }
                    ) }),
                    /* @__PURE__ */ a("td", { className: "px-4 py-3 font-mono text-sm text-[var(--text-primary)]", children: e.code }),
                    /* @__PURE__ */ a("td", { className: "px-4 py-3 text-[var(--text-primary)]", children: e.name }),
                    c && /* @__PURE__ */ a("td", { className: "px-4 py-3", children: e.tenantName ? /* @__PURE__ */ o(
                      "button",
                      {
                        onClick: () => e.tenantId && de(e.tenantId),
                        className: "inline-flex items-center gap-1.5 px-2 py-1 text-xs font-medium rounded-full bg-[var(--info-bg)] text-[var(--info-text)] hover:opacity-80 transition-opacity",
                        title: r("references.switchToTenant", "Switch to this tenant"),
                        children: [
                          /* @__PURE__ */ a(G, { className: "w-3 h-3" }),
                          e.tenantName
                        ]
                      }
                    ) : /* @__PURE__ */ a("span", { className: "text-[var(--text-tertiary)]", children: "-" }) }),
                    /* @__PURE__ */ a("td", { className: "px-4 py-3 text-[var(--text-secondary)]", children: e.shortName || "-" }),
                    /* @__PURE__ */ a("td", { className: "px-4 py-3 text-center", children: /* @__PURE__ */ o("span", { className: "inline-flex items-center gap-1 text-[var(--text-secondary)]", children: [
                      /* @__PURE__ */ a(B, { className: "w-4 h-4" }),
                      e.userCount
                    ] }) }),
                    /* @__PURE__ */ o("td", { className: "px-4 py-3 text-center", children: [
                      ve(e),
                      e.isActive && !e.isMerged && /* @__PURE__ */ o("span", { className: "inline-flex items-center gap-1 px-2 py-1 text-xs font-medium rounded-full bg-[var(--success-bg)] text-[var(--success-text)]", children: [
                        /* @__PURE__ */ a(je, { className: "w-3 h-3" }),
                        r("references.active", "Active")
                      ] })
                    ] }),
                    /* @__PURE__ */ a("td", { className: "px-4 py-3", children: /* @__PURE__ */ o("div", { className: "relative", children: [
                      /* @__PURE__ */ a(
                        "button",
                        {
                          onClick: () => P(U === e.id ? null : e.id),
                          className: "p-2 hover:bg-[var(--bg-secondary)] rounded-[var(--radius-button)] transition-colors",
                          disabled: e.isMerged || c,
                          children: /* @__PURE__ */ a(Pe, { className: "w-4 h-4" })
                        }
                      ),
                      U === e.id && /* @__PURE__ */ o("div", { className: "absolute right-0 top-full mt-1 w-48 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-[var(--radius-card)] shadow-lg z-10", children: [
                        /* @__PURE__ */ o(
                          "button",
                          {
                            onClick: () => ue(e),
                            className: "flex items-center gap-2 w-full px-4 py-2 text-left text-sm text-[var(--text-primary)] hover:bg-[var(--bg-hover)]",
                            children: [
                              /* @__PURE__ */ a(Re, { className: "w-4 h-4" }),
                              r("common.edit", "Edit")
                            ]
                          }
                        ),
                        /* @__PURE__ */ a(
                          "button",
                          {
                            onClick: () => {
                              pe(e), P(null);
                            },
                            className: "flex items-center gap-2 w-full px-4 py-2 text-left text-sm text-[var(--text-primary)] hover:bg-[var(--bg-hover)]",
                            children: e.isActive ? r("common.deactivate", "Deactivate") : r("common.activate", "Activate")
                          }
                        ),
                        e.userCount === 0 && /* @__PURE__ */ o(
                          "button",
                          {
                            onClick: () => {
                              me(e.id), P(null);
                            },
                            className: "flex items-center gap-2 w-full px-4 py-2 text-left text-sm text-[var(--error-text)] hover:bg-[var(--error-bg)]",
                            children: [
                              /* @__PURE__ */ a(Fe, { className: "w-4 h-4" }),
                              r("common.delete", "Delete")
                            ]
                          }
                        )
                      ] })
                    ] }) })
                  ]
                },
                e.id
              )) })
            ] }),
            /* @__PURE__ */ o("div", { className: "flex items-center justify-between px-6 py-4 border-t border-[var(--border-color)] bg-[var(--bg-secondary)]", children: [
              /* @__PURE__ */ o("div", { className: "text-sm text-[var(--text-secondary)]", children: [
                r("references.showing", "Showing"),
                " ",
                (g - 1) * T + 1,
                " ",
                r("references.to", "to"),
                " ",
                Math.min(g * T, E),
                " ",
                r("references.of", "of"),
                " ",
                E,
                " ",
                r("references.results", "results")
              ] }),
              /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
                /* @__PURE__ */ a(
                  "button",
                  {
                    onClick: () => j((e) => Math.max(1, e - 1)),
                    disabled: g === 1,
                    className: "px-3 py-1.5 border border-[var(--border-color)] rounded-[var(--radius-button)] text-[var(--text-primary)] hover:bg-[var(--bg-hover)] transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
                    children: r("common.previous", "Previous")
                  }
                ),
                /* @__PURE__ */ a("div", { className: "flex items-center gap-1", children: Array.from({ length: Math.min(5, $) }, (e, l) => {
                  let p;
                  return $ <= 5 || g <= 3 ? p = l + 1 : g >= $ - 2 ? p = $ - 4 + l : p = g - 2 + l, /* @__PURE__ */ a(
                    "button",
                    {
                      onClick: () => j(p),
                      className: `px-3 py-1.5 rounded-[var(--radius-button)] transition-colors ${g === p ? "bg-[var(--color-accent-600)] text-white" : "border border-[var(--border-color)] text-[var(--text-primary)] hover:bg-[var(--bg-hover)]"}`,
                      children: p
                    },
                    p
                  );
                }) }),
                /* @__PURE__ */ a(
                  "button",
                  {
                    onClick: () => j((e) => Math.min($, e + 1)),
                    disabled: g === $,
                    className: "px-3 py-1.5 border border-[var(--border-color)] rounded-[var(--radius-button)] text-[var(--text-primary)] hover:bg-[var(--bg-hover)] transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
                    children: r("common.next", "Next")
                  }
                )
              ] })
            ] })
          ] })
        ] })
      ]
    }
  );
}
export {
  st as ReferencesManagementPage
};
//# sourceMappingURL=ReferencesManagementPage-DQnTJlm_.js.map
