"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import Link from "next/link";
import { ProjectColorDot } from "../timesheets-ui/ProjectColorDot.js";
import { resolveProjectColorHex } from "../timesheets-ui/colors.js";
import { HoursSparkline } from "./HoursSparkline.js";
import { ProjectMembersAvatarStack } from "./ProjectMembersAvatarStack.js";
const STATUS_BADGE_CLASSES = {
  active: "bg-lime-100 text-lime-800 dark:bg-lime-900/30 dark:text-lime-300",
  on_hold: "bg-amber-100 text-amber-800 dark:bg-amber-900/30 dark:text-amber-300",
  completed: "bg-muted text-muted-foreground"
};
function ProjectCard({ data, labels, showTeam, href }) {
  const badgeClass = STATUS_BADGE_CLASSES[data.status] ?? "bg-muted text-muted-foreground";
  const statusLabel = labels.statuses[data.status] ?? data.status;
  const stripeColor = resolveProjectColorHex(data.color, data.name);
  const hoursPanelLabel = showTeam ? labels.hoursPanelPm : labels.hoursPanelCollab;
  return /* @__PURE__ */ jsxs(
    Link,
    {
      href,
      className: "group relative flex flex-col overflow-hidden rounded-lg border border-border bg-card transition-colors hover:border-foreground/30",
      children: [
        /* @__PURE__ */ jsx("div", { className: "h-[3px] w-full", style: { backgroundColor: stripeColor }, "aria-hidden": "true" }),
        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-3 p-4", children: [
          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
            /* @__PURE__ */ jsx(
              "span",
              {
                className: `inline-flex items-center rounded-full px-2 py-0.5 text-[11px] font-medium ${badgeClass}`,
                children: statusLabel
              }
            ),
            /* @__PURE__ */ jsx(ProjectColorDot, { colorKey: data.color, projectName: data.name, size: "sm" })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
            /* @__PURE__ */ jsx("h3", { className: "truncate text-sm font-semibold text-foreground", title: data.name, children: data.name }),
            /* @__PURE__ */ jsxs("p", { className: "truncate font-mono text-[11px] text-muted-foreground", children: [
              data.code ?? "\u2014",
              data.customerName ? ` \xB7 ${data.customerName}` : ""
            ] })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-border/50 bg-muted/40 p-3", children: [
            /* @__PURE__ */ jsx("p", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: hoursPanelLabel }),
            /* @__PURE__ */ jsxs("div", { className: "mt-1 flex items-end justify-between gap-3", children: [
              /* @__PURE__ */ jsx("p", { className: "text-xl font-semibold tabular-nums text-foreground", children: data.hoursWeek > 0 ? `${data.hoursWeek}h` : "\u2014" }),
              /* @__PURE__ */ jsx(
                HoursSparkline,
                {
                  values: data.hoursTrend,
                  color: stripeColor,
                  width: 80,
                  height: 26,
                  ariaLabel: labels.sparklineAria
                }
              )
            ] })
          ] }),
          /* @__PURE__ */ jsx("div", { className: "mt-auto flex items-center justify-between pt-1", children: showTeam ? /* @__PURE__ */ jsx(
            ProjectMembersAvatarStack,
            {
              members: data.members,
              total: data.memberCount,
              peopleCountLabel: labels.peopleCount(data.memberCount)
            }
          ) : /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
            /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground/70", children: [
              labels.role,
              ": "
            ] }),
            data.myRole ?? "\u2014"
          ] }) })
        ] })
      ]
    }
  );
}
export {
  ProjectCard
};
//# sourceMappingURL=ProjectCard.js.map
