"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import Link from "next/link";
import { useT } from "@open-mercato/shared/lib/i18n/context";
import { translateWithFallback } from "@open-mercato/shared/lib/i18n/translate";
const VIEW_KANBAN_HREF = "/backend/customers/deals/pipeline";
const VIEW_LIST_HREF = "/backend/customers/deals";
const VIEW_MAP_HREF = "/backend/customers/deals/map";
function ViewTabsRow({ active, className }) {
  const t = useT();
  const labels = {
    kanban: translateWithFallback(t, "customers.deals.kanban.view.kanban", "Kanban"),
    list: translateWithFallback(t, "customers.deals.kanban.view.list", "List"),
    map: translateWithFallback(t, "customers.deals.kanban.view.map", "Map")
  };
  const baseTab = "inline-flex items-center px-3.5 py-2.5 text-sm leading-normal transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";
  const activeTab = "border-b-2 border-foreground font-semibold text-foreground";
  const inactiveTab = "border-b-2 border-transparent font-normal text-muted-foreground hover:text-foreground";
  const isKanbanActive = active === "kanban";
  const isListActive = active === "list";
  const isMapActive = active === "map";
  return /* @__PURE__ */ jsxs(
    "div",
    {
      role: "tablist",
      "aria-label": translateWithFallback(t, "customers.deals.kanban.view.tablistLabel", "Deals views"),
      className: `flex items-end gap-1 border-b border-border ${className ?? ""}`.trim(),
      children: [
        isKanbanActive ? /* @__PURE__ */ jsx(
          "span",
          {
            role: "tab",
            "aria-selected": true,
            className: `${baseTab} ${activeTab}`,
            children: labels.kanban
          }
        ) : /* @__PURE__ */ jsx(
          Link,
          {
            href: VIEW_KANBAN_HREF,
            role: "tab",
            "aria-selected": false,
            className: `${baseTab} ${inactiveTab}`,
            children: labels.kanban
          }
        ),
        isListActive ? /* @__PURE__ */ jsx(
          "span",
          {
            role: "tab",
            "aria-selected": true,
            className: `${baseTab} ${activeTab}`,
            children: labels.list
          }
        ) : /* @__PURE__ */ jsx(
          Link,
          {
            href: VIEW_LIST_HREF,
            role: "tab",
            "aria-selected": false,
            className: `${baseTab} ${inactiveTab}`,
            children: labels.list
          }
        ),
        isMapActive ? /* @__PURE__ */ jsx(
          "span",
          {
            role: "tab",
            "aria-selected": true,
            className: `${baseTab} ${activeTab}`,
            children: labels.map
          }
        ) : /* @__PURE__ */ jsx(
          Link,
          {
            href: VIEW_MAP_HREF,
            role: "tab",
            "aria-selected": false,
            className: `${baseTab} ${inactiveTab}`,
            children: labels.map
          }
        )
      ]
    }
  );
}
var ViewTabsRow_default = ViewTabsRow;
export {
  ViewTabsRow,
  ViewTabsRow_default as default
};
//# sourceMappingURL=ViewTabsRow.js.map
