@open-mercato/core 0.6.4-develop.4217.1.c9aa050183 → 0.6.4-develop.4239.1.4a264a5828

package/dist/modules/staff/lib/timesheets-projects-ui/ProjectMembersAvatarStack.js

@@ -0,0 +1,58 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+const AVATAR_PALETTE = [
+  "bg-blue-100 text-blue-800 dark:bg-blue-900/40 dark:text-blue-200",
+  "bg-emerald-100 text-emerald-800 dark:bg-emerald-900/40 dark:text-emerald-200",
+  "bg-amber-100 text-amber-800 dark:bg-amber-900/40 dark:text-amber-200",
+  "bg-rose-100 text-rose-800 dark:bg-rose-900/40 dark:text-rose-200",
+  "bg-violet-100 text-violet-800 dark:bg-violet-900/40 dark:text-violet-200",
+  "bg-cyan-100 text-cyan-800 dark:bg-cyan-900/40 dark:text-cyan-200"
+];
+function pickPalette(id) {
+  let hash = 0;
+  for (let i = 0; i < id.length; i++) {
+    hash = hash * 31 + id.charCodeAt(i) | 0;
+  }
+  return AVATAR_PALETTE[Math.abs(hash) % AVATAR_PALETTE.length];
+}
+function ProjectMembersAvatarStack({
+  members,
+  total,
+  peopleCountLabel,
+  className
+}) {
+  const visible = members.slice(0, 4);
+  const overflow = Math.max(0, total - visible.length);
+  if (total === 0) {
+    return /* @__PURE__ */ jsx("span", { className: `text-xs text-muted-foreground ${className ?? ""}`, children: "\u2014" });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-2 ${className ?? ""}`, children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex -space-x-1.5", children: [
+      visible.map((member) => /* @__PURE__ */ jsx(
+        "span",
+        {
+          title: member.name,
+          className: `inline-flex h-6 w-6 items-center justify-center rounded-full border border-background text-[10px] font-semibold ${pickPalette(member.id)}`,
+          children: member.initials
+        },
+        member.id
+      )),
+      overflow > 0 ? /* @__PURE__ */ jsxs(
+        "span",
+        {
+          className: "inline-flex h-6 w-6 items-center justify-center rounded-full border border-background bg-muted text-[10px] font-semibold text-foreground",
+          title: `+${overflow}`,
+          children: [
+            "+",
+            overflow
+          ]
+        }
+      ) : null
+    ] }),
+    /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: peopleCountLabel })
+  ] });
+}
+export {
+  ProjectMembersAvatarStack
+};
+//# sourceMappingURL=ProjectMembersAvatarStack.js.map

package/dist/modules/staff/lib/timesheets-projects-ui/ProjectMembersAvatarStack.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/staff/lib/timesheets-projects-ui/ProjectMembersAvatarStack.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\n\nexport type AvatarMember = {\n  id: string\n  name: string\n  initials: string\n  avatarUrl?: string | null\n}\n\nexport type ProjectMembersAvatarStackProps = {\n  members: AvatarMember[]\n  total: number\n  peopleCountLabel: string\n  className?: string\n}\n\nconst AVATAR_PALETTE = [\n  'bg-blue-100 text-blue-800 dark:bg-blue-900/40 dark:text-blue-200',\n  'bg-emerald-100 text-emerald-800 dark:bg-emerald-900/40 dark:text-emerald-200',\n  'bg-amber-100 text-amber-800 dark:bg-amber-900/40 dark:text-amber-200',\n  'bg-rose-100 text-rose-800 dark:bg-rose-900/40 dark:text-rose-200',\n  'bg-violet-100 text-violet-800 dark:bg-violet-900/40 dark:text-violet-200',\n  'bg-cyan-100 text-cyan-800 dark:bg-cyan-900/40 dark:text-cyan-200',\n]\n\nfunction pickPalette(id: string): string {\n  let hash = 0\n  for (let i = 0; i < id.length; i++) {\n    hash = (hash * 31 + id.charCodeAt(i)) | 0\n  }\n  return AVATAR_PALETTE[Math.abs(hash) % AVATAR_PALETTE.length]\n}\n\nexport function ProjectMembersAvatarStack({\n  members,\n  total,\n  peopleCountLabel,\n  className,\n}: ProjectMembersAvatarStackProps) {\n  const visible = members.slice(0, 4)\n  const overflow = Math.max(0, total - visible.length)\n\n  if (total === 0) {\n    return <span className={`text-xs text-muted-foreground ${className ?? ''}`}>\u2014</span>\n  }\n\n  return (\n    <div className={`flex items-center gap-2 ${className ?? ''}`}>\n      <div className=\"flex -space-x-1.5\">\n        {visible.map((member) => (\n          <span\n            key={member.id}\n            title={member.name}\n            className={`inline-flex h-6 w-6 items-center justify-center rounded-full border border-background text-[10px] font-semibold ${pickPalette(member.id)}`}\n          >\n            {member.initials}\n          </span>\n        ))}\n        {overflow > 0 ? (\n          <span\n            className=\"inline-flex h-6 w-6 items-center justify-center rounded-full border border-background bg-muted text-[10px] font-semibold text-foreground\"\n            title={`+${overflow}`}\n          >\n            +{overflow}\n          </span>\n        ) : null}\n      </div>\n      <span className=\"text-xs text-muted-foreground\">{peopleCountLabel}</span>\n    </div>\n  )\n}\n"],
+  "mappings": ";AA6CW,cAgBD,YAhBC;AA3BX,MAAM,iBAAiB;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,SAAS,YAAY,IAAoB;AACvC,MAAI,OAAO;AACX,WAAS,IAAI,GAAG,IAAI,GAAG,QAAQ,KAAK;AAClC,WAAQ,OAAO,KAAK,GAAG,WAAW,CAAC,IAAK;AAAA,EAC1C;AACA,SAAO,eAAe,KAAK,IAAI,IAAI,IAAI,eAAe,MAAM;AAC9D;AAEO,SAAS,0BAA0B;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAmC;AACjC,QAAM,UAAU,QAAQ,MAAM,GAAG,CAAC;AAClC,QAAM,WAAW,KAAK,IAAI,GAAG,QAAQ,QAAQ,MAAM;AAEnD,MAAI,UAAU,GAAG;AACf,WAAO,oBAAC,UAAK,WAAW,iCAAiC,aAAa,EAAE,IAAI,oBAAC;AAAA,EAC/E;AAEA,SACE,qBAAC,SAAI,WAAW,2BAA2B,aAAa,EAAE,IACxD;AAAA,yBAAC,SAAI,WAAU,qBACZ;AAAA,cAAQ,IAAI,CAAC,WACZ;AAAA,QAAC;AAAA;AAAA,UAEC,OAAO,OAAO;AAAA,UACd,WAAW,mHAAmH,YAAY,OAAO,EAAE,CAAC;AAAA,UAEnJ,iBAAO;AAAA;AAAA,QAJH,OAAO;AAAA,MAKd,CACD;AAAA,MACA,WAAW,IACV;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,OAAO,IAAI,QAAQ;AAAA,UACpB;AAAA;AAAA,YACG;AAAA;AAAA;AAAA,MACJ,IACE;AAAA,OACN;AAAA,IACA,oBAAC,UAAK,WAAU,iCAAiC,4BAAiB;AAAA,KACpE;AAEJ;",
+  "names": []
+}

package/dist/modules/staff/lib/timesheets-projects-ui/ProjectsKpiStrip.js

@@ -0,0 +1,152 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ArrowDownRight, ArrowUpRight, Minus } from "lucide-react";
+function DeltaBadge({ pct, labels }) {
+  if (pct === null) {
+    return /* @__PURE__ */ jsx("span", { className: "text-[11px] text-muted-foreground/70", children: labels.noPrevious });
+  }
+  if (pct > 0) {
+    return /* @__PURE__ */ jsxs(
+      "span",
+      {
+        className: "inline-flex items-center gap-0.5 text-[11px] font-medium text-emerald-600 tabular-nums",
+        "aria-label": labels.deltaUp(pct),
+        children: [
+          /* @__PURE__ */ jsx(ArrowUpRight, { className: "h-3 w-3", "aria-hidden": "true" }),
+          pct,
+          "%"
+        ]
+      }
+    );
+  }
+  if (pct < 0) {
+    return /* @__PURE__ */ jsxs(
+      "span",
+      {
+        className: "inline-flex items-center gap-0.5 text-[11px] font-medium text-rose-600 tabular-nums",
+        "aria-label": labels.deltaDown(Math.abs(pct)),
+        children: [
+          /* @__PURE__ */ jsx(ArrowDownRight, { className: "h-3 w-3", "aria-hidden": "true" }),
+          Math.abs(pct),
+          "%"
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: "inline-flex items-center gap-0.5 text-[11px] text-muted-foreground/70",
+      "aria-label": labels.deltaFlat,
+      children: [
+        /* @__PURE__ */ jsx(Minus, { className: "h-3 w-3", "aria-hidden": "true" }),
+        "0%"
+      ]
+    }
+  );
+}
+function KpiCard({
+  label,
+  value,
+  subtext,
+  delta,
+  labels
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 rounded-lg border border-border bg-card p-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-[11px] uppercase tracking-wide text-muted-foreground", children: label }),
+      delta ? /* @__PURE__ */ jsx(DeltaBadge, { pct: delta.deltaPct, labels }) : null
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "text-2xl font-semibold tabular-nums text-foreground", children: value }),
+    subtext ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: subtext }) : null
+  ] });
+}
+function ProjectsKpiStrip({ kpis, labels, isLoading }) {
+  if (isLoading || !kpis) {
+    return /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-5", children: Array.from({ length: 5 }).map((_, idx) => /* @__PURE__ */ jsx("div", { className: "h-[88px] animate-pulse rounded-lg border border-border bg-muted/40" }, idx)) });
+  }
+  if (kpis.role === "pm") {
+    return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-5", children: [
+      /* @__PURE__ */ jsx(
+        KpiCard,
+        {
+          label: labels.totalProjects,
+          value: kpis.totals.total,
+          subtext: labels.totalProjectsSub({ active: kpis.totals.active, onHold: kpis.totals.onHold }),
+          labels
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        KpiCard,
+        {
+          label: labels.hoursWeek,
+          value: `${kpis.hoursWeek.current}h`,
+          subtext: labels.hoursWeekSub,
+          delta: kpis.hoursWeek,
+          labels
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        KpiCard,
+        {
+          label: labels.hoursMonth,
+          value: `${kpis.hoursMonth.current}h`,
+          subtext: labels.hoursMonthSub,
+          delta: kpis.hoursMonth,
+          labels
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        KpiCard,
+        {
+          label: labels.assignedToMe,
+          value: kpis.assignedToMe.total,
+          subtext: labels.assignedToMeSub(kpis.assignedToMe.active),
+          labels
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        KpiCard,
+        {
+          label: labels.teamActive,
+          value: kpis.teamActive.count,
+          subtext: labels.teamActiveSub,
+          labels
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-3", children: [
+    /* @__PURE__ */ jsx(
+      KpiCard,
+      {
+        label: labels.myProjects,
+        value: kpis.myProjects.total,
+        subtext: labels.myProjectsSub(kpis.myProjects.active),
+        labels
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      KpiCard,
+      {
+        label: labels.myHoursWeek,
+        value: `${kpis.myHoursWeek.current}h`,
+        delta: kpis.myHoursWeek,
+        labels
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      KpiCard,
+      {
+        label: labels.myHoursMonth,
+        value: `${kpis.myHoursMonth.current}h`,
+        delta: kpis.myHoursMonth,
+        labels
+      }
+    )
+  ] });
+}
+export {
+  ProjectsKpiStrip
+};
+//# sourceMappingURL=ProjectsKpiStrip.js.map

package/dist/modules/staff/lib/timesheets-projects-ui/ProjectsKpiStrip.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/staff/lib/timesheets-projects-ui/ProjectsKpiStrip.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { ArrowDownRight, ArrowUpRight, Minus } from 'lucide-react'\n\ntype Delta = { current: number; previous: number; deltaPct: number | null }\n\nexport type PmKpis = {\n  role: 'pm'\n  totals: { total: number; active: number; onHold: number; completed: number }\n  hoursWeek: Delta\n  hoursMonth: Delta\n  teamActive: { count: number }\n  assignedToMe: { total: number; active: number }\n}\n\nexport type CollabKpis = {\n  role: 'collab'\n  myProjects: { total: number; active: number }\n  myHoursWeek: Delta\n  myHoursMonth: Delta\n}\n\ntype KpiLabels = {\n  totalProjects: string\n  totalProjectsSub: (args: { active: number; onHold: number }) => string\n  hoursWeek: string\n  hoursWeekSub: string\n  assignedToMe: string\n  assignedToMeSub: (active: number) => string\n  hoursMonth: string\n  hoursMonthSub: string\n  teamActive: string\n  teamActiveSub: string\n  myProjects: string\n  myProjectsSub: (active: number) => string\n  myHoursWeek: string\n  myHoursMonth: string\n  deltaUp: (pct: number) => string\n  deltaDown: (pct: number) => string\n  deltaFlat: string\n  noPrevious: string\n}\n\nfunction DeltaBadge({ pct, labels }: { pct: number | null; labels: KpiLabels }) {\n  if (pct === null) {\n    return <span className=\"text-[11px] text-muted-foreground/70\">{labels.noPrevious}</span>\n  }\n  if (pct > 0) {\n    return (\n      <span\n        className=\"inline-flex items-center gap-0.5 text-[11px] font-medium text-emerald-600 tabular-nums\"\n        aria-label={labels.deltaUp(pct)}\n      >\n        <ArrowUpRight className=\"h-3 w-3\" aria-hidden=\"true\" />\n        {pct}%\n      </span>\n    )\n  }\n  if (pct < 0) {\n    return (\n      <span\n        className=\"inline-flex items-center gap-0.5 text-[11px] font-medium text-rose-600 tabular-nums\"\n        aria-label={labels.deltaDown(Math.abs(pct))}\n      >\n        <ArrowDownRight className=\"h-3 w-3\" aria-hidden=\"true\" />\n        {Math.abs(pct)}%\n      </span>\n    )\n  }\n  return (\n    <span\n      className=\"inline-flex items-center gap-0.5 text-[11px] text-muted-foreground/70\"\n      aria-label={labels.deltaFlat}\n    >\n      <Minus className=\"h-3 w-3\" aria-hidden=\"true\" />\n      0%\n    </span>\n  )\n}\n\nfunction KpiCard({\n  label,\n  value,\n  subtext,\n  delta,\n  labels,\n}: {\n  label: string\n  value: React.ReactNode\n  subtext?: string\n  delta?: Delta\n  labels: KpiLabels\n}) {\n  return (\n    <div className=\"flex flex-col gap-1 rounded-lg border border-border bg-card p-4\">\n      <div className=\"flex items-center justify-between gap-2\">\n        <p className=\"text-[11px] uppercase tracking-wide text-muted-foreground\">{label}</p>\n        {delta ? <DeltaBadge pct={delta.deltaPct} labels={labels} /> : null}\n      </div>\n      <p className=\"text-2xl font-semibold tabular-nums text-foreground\">{value}</p>\n      {subtext ? <p className=\"text-xs text-muted-foreground\">{subtext}</p> : null}\n    </div>\n  )\n}\n\nexport type ProjectsKpiStripProps = {\n  kpis: PmKpis | CollabKpis | null\n  labels: KpiLabels\n  isLoading?: boolean\n}\n\nexport function ProjectsKpiStrip({ kpis, labels, isLoading }: ProjectsKpiStripProps) {\n  if (isLoading || !kpis) {\n    return (\n      <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-5\">\n        {Array.from({ length: 5 }).map((_, idx) => (\n          <div key={idx} className=\"h-[88px] animate-pulse rounded-lg border border-border bg-muted/40\" />\n        ))}\n      </div>\n    )\n  }\n\n  if (kpis.role === 'pm') {\n    return (\n      <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-5\">\n        <KpiCard\n          label={labels.totalProjects}\n          value={kpis.totals.total}\n          subtext={labels.totalProjectsSub({ active: kpis.totals.active, onHold: kpis.totals.onHold })}\n          labels={labels}\n        />\n        <KpiCard\n          label={labels.hoursWeek}\n          value={`${kpis.hoursWeek.current}h`}\n          subtext={labels.hoursWeekSub}\n          delta={kpis.hoursWeek}\n          labels={labels}\n        />\n        <KpiCard\n          label={labels.hoursMonth}\n          value={`${kpis.hoursMonth.current}h`}\n          subtext={labels.hoursMonthSub}\n          delta={kpis.hoursMonth}\n          labels={labels}\n        />\n        <KpiCard\n          label={labels.assignedToMe}\n          value={kpis.assignedToMe.total}\n          subtext={labels.assignedToMeSub(kpis.assignedToMe.active)}\n          labels={labels}\n        />\n        <KpiCard\n          label={labels.teamActive}\n          value={kpis.teamActive.count}\n          subtext={labels.teamActiveSub}\n          labels={labels}\n        />\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-3\">\n      <KpiCard\n        label={labels.myProjects}\n        value={kpis.myProjects.total}\n        subtext={labels.myProjectsSub(kpis.myProjects.active)}\n        labels={labels}\n      />\n      <KpiCard\n        label={labels.myHoursWeek}\n        value={`${kpis.myHoursWeek.current}h`}\n        delta={kpis.myHoursWeek}\n        labels={labels}\n      />\n      <KpiCard\n        label={labels.myHoursMonth}\n        value={`${kpis.myHoursMonth.current}h`}\n        delta={kpis.myHoursMonth}\n        labels={labels}\n      />\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/staff/lib/timesheets-projects-ui/SavedViewTabs.js

@@ -0,0 +1,37 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@open-mercato/ui/primitives/button";
+function SavedViewTabs({ tabs, activeId, onSelect, className, ariaLabel }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "tablist",
+      "aria-label": ariaLabel ?? "Saved views",
+      className: `flex items-center gap-1 border-b border-border ${className ?? ""}`,
+      children: tabs.map((tab) => {
+        const isActive = tab.id === activeId;
+        return /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "sm",
+            role: "tab",
+            "aria-selected": isActive,
+            className: `h-auto rounded-none px-3 py-2 text-sm hover:bg-transparent ${isActive ? "border-b-2 border-foreground font-medium text-foreground" : "border-b-2 border-transparent text-muted-foreground hover:text-foreground"}`,
+            onClick: () => onSelect(tab.id),
+            children: [
+              tab.label,
+              typeof tab.count === "number" ? /* @__PURE__ */ jsx("span", { className: "ml-1.5 text-xs text-muted-foreground/70 tabular-nums", children: tab.count }) : null
+            ]
+          },
+          tab.id
+        );
+      })
+    }
+  );
+}
+export {
+  SavedViewTabs
+};
+//# sourceMappingURL=SavedViewTabs.js.map

package/dist/modules/staff/lib/timesheets-projects-ui/SavedViewTabs.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/staff/lib/timesheets-projects-ui/SavedViewTabs.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\n\nexport type SavedViewTab = {\n  id: string\n  label: string\n  count?: number\n}\n\nexport type SavedViewTabsProps = {\n  tabs: SavedViewTab[]\n  activeId: string\n  onSelect: (id: string) => void\n  className?: string\n  ariaLabel?: string\n}\n\nexport function SavedViewTabs({ tabs, activeId, onSelect, className, ariaLabel }: SavedViewTabsProps) {\n  return (\n    <div\n      role=\"tablist\"\n      aria-label={ariaLabel ?? 'Saved views'}\n      className={`flex items-center gap-1 border-b border-border ${className ?? ''}`}\n    >\n      {tabs.map((tab) => {\n        const isActive = tab.id === activeId\n        return (\n          <Button\n            key={tab.id}\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"sm\"\n            role=\"tab\"\n            aria-selected={isActive}\n            className={`h-auto rounded-none px-3 py-2 text-sm hover:bg-transparent ${\n              isActive\n                ? 'border-b-2 border-foreground font-medium text-foreground'\n                : 'border-b-2 border-transparent text-muted-foreground hover:text-foreground'\n            }`}\n            onClick={() => onSelect(tab.id)}\n          >\n            {tab.label}\n            {typeof tab.count === 'number' ? (\n              <span className=\"ml-1.5 text-xs text-muted-foreground/70 tabular-nums\">{tab.count}</span>\n            ) : null}\n          </Button>\n        )\n      })}\n    </div>\n  )\n}\n"],
+  "mappings": ";AA6BU,SAgBI,KAhBJ;AA1BV,SAAS,cAAc;AAgBhB,SAAS,cAAc,EAAE,MAAM,UAAU,UAAU,WAAW,UAAU,GAAuB;AACpG,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY,aAAa;AAAA,MACzB,WAAW,kDAAkD,aAAa,EAAE;AAAA,MAE3E,eAAK,IAAI,CAAC,QAAQ;AACjB,cAAM,WAAW,IAAI,OAAO;AAC5B,eACE;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,MAAK;AAAA,YACL,iBAAe;AAAA,YACf,WAAW,8DACT,WACI,6DACA,2EACN;AAAA,YACA,SAAS,MAAM,SAAS,IAAI,EAAE;AAAA,YAE7B;AAAA,kBAAI;AAAA,cACJ,OAAO,IAAI,UAAU,WACpB,oBAAC,UAAK,WAAU,wDAAwD,cAAI,OAAM,IAChF;AAAA;AAAA;AAAA,UAhBC,IAAI;AAAA,QAiBX;AAAA,MAEJ,CAAC;AAAA;AAAA,EACH;AAEJ;",
+  "names": []
+}

package/dist/modules/staff/lib/timesheets-projects-ui/ViewModeToggle.js

@@ -0,0 +1,57 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { LayoutGrid, List } from "lucide-react";
+import { Button } from "@open-mercato/ui/primitives/button";
+function ViewModeToggle({
+  mode,
+  onChange,
+  tableLabel,
+  cardsLabel,
+  className,
+  ariaLabel
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "group",
+      "aria-label": ariaLabel ?? "View mode",
+      className: `inline-flex items-center rounded-md border border-border p-0.5 ${className ?? ""}`,
+      children: [
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "sm",
+            "aria-pressed": mode === "table",
+            className: `h-auto gap-1.5 px-2.5 py-1 text-xs ${mode === "table" ? "bg-foreground text-background hover:bg-foreground" : "text-muted-foreground hover:bg-muted"}`,
+            onClick: () => onChange("table"),
+            children: [
+              /* @__PURE__ */ jsx(List, { className: "h-3.5 w-3.5", "aria-hidden": "true" }),
+              tableLabel
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "sm",
+            "aria-pressed": mode === "cards",
+            className: `h-auto gap-1.5 px-2.5 py-1 text-xs ${mode === "cards" ? "bg-foreground text-background hover:bg-foreground" : "text-muted-foreground hover:bg-muted"}`,
+            onClick: () => onChange("cards"),
+            children: [
+              /* @__PURE__ */ jsx(LayoutGrid, { className: "h-3.5 w-3.5", "aria-hidden": "true" }),
+              cardsLabel
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  ViewModeToggle
+};
+//# sourceMappingURL=ViewModeToggle.js.map

package/dist/modules/staff/lib/timesheets-projects-ui/ViewModeToggle.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/staff/lib/timesheets-projects-ui/ViewModeToggle.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { LayoutGrid, List } from 'lucide-react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport type { ProjectsViewMode } from './useProjectsViewMode'\n\nexport type ViewModeToggleProps = {\n  mode: ProjectsViewMode\n  onChange: (mode: ProjectsViewMode) => void\n  tableLabel: string\n  cardsLabel: string\n  className?: string\n  ariaLabel?: string\n}\n\nexport function ViewModeToggle({\n  mode,\n  onChange,\n  tableLabel,\n  cardsLabel,\n  className,\n  ariaLabel,\n}: ViewModeToggleProps) {\n  return (\n    <div\n      role=\"group\"\n      aria-label={ariaLabel ?? 'View mode'}\n      className={`inline-flex items-center rounded-md border border-border p-0.5 ${className ?? ''}`}\n    >\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"sm\"\n        aria-pressed={mode === 'table'}\n        className={`h-auto gap-1.5 px-2.5 py-1 text-xs ${\n          mode === 'table'\n            ? 'bg-foreground text-background hover:bg-foreground'\n            : 'text-muted-foreground hover:bg-muted'\n        }`}\n        onClick={() => onChange('table')}\n      >\n        <List className=\"h-3.5 w-3.5\" aria-hidden=\"true\" />\n        {tableLabel}\n      </Button>\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"sm\"\n        aria-pressed={mode === 'cards'}\n        className={`h-auto gap-1.5 px-2.5 py-1 text-xs ${\n          mode === 'cards'\n            ? 'bg-foreground text-background hover:bg-foreground'\n            : 'text-muted-foreground hover:bg-muted'\n        }`}\n        onClick={() => onChange('cards')}\n      >\n        <LayoutGrid className=\"h-3.5 w-3.5\" aria-hidden=\"true\" />\n        {cardsLabel}\n      </Button>\n    </div>\n  )\n}\n"],
+  "mappings": ";AA8BM,SAYE,KAZF;AA3BN,SAAS,YAAY,YAAY;AACjC,SAAS,cAAc;AAYhB,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAwB;AACtB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY,aAAa;AAAA,MACzB,WAAW,kEAAkE,aAAa,EAAE;AAAA,MAE5F;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,gBAAc,SAAS;AAAA,YACvB,WAAW,sCACT,SAAS,UACL,sDACA,sCACN;AAAA,YACA,SAAS,MAAM,SAAS,OAAO;AAAA,YAE/B;AAAA,kCAAC,QAAK,WAAU,eAAc,eAAY,QAAO;AAAA,cAChD;AAAA;AAAA;AAAA,QACH;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,gBAAc,SAAS;AAAA,YACvB,WAAW,sCACT,SAAS,UACL,sDACA,sCACN;AAAA,YACA,SAAS,MAAM,SAAS,OAAO;AAAA,YAE/B;AAAA,kCAAC,cAAW,WAAU,eAAc,eAAY,QAAO;AAAA,cACtD;AAAA;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "names": []
+}

package/dist/modules/staff/lib/timesheets-projects-ui/useProjectsViewMode.js

@@ -0,0 +1,50 @@
+"use client";
+import * as React from "react";
+const STORAGE_KEY_PREFIX = "staff.timesheets.projects.viewMode";
+function storageKey(userKey) {
+  return userKey ? `${STORAGE_KEY_PREFIX}:${userKey}` : STORAGE_KEY_PREFIX;
+}
+function readStoredMode(userKey) {
+  if (typeof window === "undefined") return null;
+  try {
+    const raw = window.localStorage.getItem(storageKey(userKey));
+    return raw === "cards" || raw === "table" ? raw : null;
+  } catch {
+    return null;
+  }
+}
+function writeStoredMode(userKey, mode) {
+  if (typeof window === "undefined") return;
+  try {
+    window.localStorage.setItem(storageKey(userKey), mode);
+  } catch {
+  }
+}
+function useProjectsViewMode({
+  userKey,
+  urlOverride,
+  fallback = "table"
+}) {
+  const initial = React.useMemo(() => {
+    if (urlOverride === "cards" || urlOverride === "table") return urlOverride;
+    return readStoredMode(userKey) ?? fallback;
+  }, [urlOverride, userKey, fallback]);
+  const [mode, setMode] = React.useState(initial);
+  React.useEffect(() => {
+    if (urlOverride === "cards" || urlOverride === "table") {
+      setMode(urlOverride);
+    }
+  }, [urlOverride]);
+  const update = React.useCallback(
+    (next) => {
+      setMode(next);
+      writeStoredMode(userKey, next);
+    },
+    [userKey]
+  );
+  return [mode, update];
+}
+export {
+  useProjectsViewMode
+};
+//# sourceMappingURL=useProjectsViewMode.js.map

package/dist/modules/staff/lib/timesheets-projects-ui/useProjectsViewMode.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/staff/lib/timesheets-projects-ui/useProjectsViewMode.ts"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\n\nexport type ProjectsViewMode = 'table' | 'cards'\n\nconst STORAGE_KEY_PREFIX = 'staff.timesheets.projects.viewMode'\n\nfunction storageKey(userKey: string | null | undefined): string {\n  return userKey ? `${STORAGE_KEY_PREFIX}:${userKey}` : STORAGE_KEY_PREFIX\n}\n\nfunction readStoredMode(userKey: string | null | undefined): ProjectsViewMode | null {\n  if (typeof window === 'undefined') return null\n  try {\n    const raw = window.localStorage.getItem(storageKey(userKey))\n    return raw === 'cards' || raw === 'table' ? raw : null\n  } catch {\n    return null\n  }\n}\n\nfunction writeStoredMode(userKey: string | null | undefined, mode: ProjectsViewMode): void {\n  if (typeof window === 'undefined') return\n  try {\n    window.localStorage.setItem(storageKey(userKey), mode)\n  } catch {\n    // ignore \u2014 quota errors etc. are non-critical\n  }\n}\n\nexport function useProjectsViewMode({\n  userKey,\n  urlOverride,\n  fallback = 'table',\n}: {\n  userKey: string | null | undefined\n  urlOverride?: string | null\n  fallback?: ProjectsViewMode\n}): [ProjectsViewMode, (next: ProjectsViewMode) => void] {\n  const initial = React.useMemo<ProjectsViewMode>(() => {\n    if (urlOverride === 'cards' || urlOverride === 'table') return urlOverride\n    return readStoredMode(userKey) ?? fallback\n  }, [urlOverride, userKey, fallback])\n\n  const [mode, setMode] = React.useState<ProjectsViewMode>(initial)\n\n  React.useEffect(() => {\n    if (urlOverride === 'cards' || urlOverride === 'table') {\n      setMode(urlOverride)\n    }\n  }, [urlOverride])\n\n  const update = React.useCallback(\n    (next: ProjectsViewMode) => {\n      setMode(next)\n      writeStoredMode(userKey, next)\n    },\n    [userKey],\n  )\n\n  return [mode, update]\n}\n"],
+  "mappings": ";AAEA,YAAY,WAAW;AAIvB,MAAM,qBAAqB;AAE3B,SAAS,WAAW,SAA4C;AAC9D,SAAO,UAAU,GAAG,kBAAkB,IAAI,OAAO,KAAK;AACxD;AAEA,SAAS,eAAe,SAA6D;AACnF,MAAI,OAAO,WAAW,YAAa,QAAO;AAC1C,MAAI;AACF,UAAM,MAAM,OAAO,aAAa,QAAQ,WAAW,OAAO,CAAC;AAC3D,WAAO,QAAQ,WAAW,QAAQ,UAAU,MAAM;AAAA,EACpD,QAAQ;AACN,WAAO;AAAA,EACT;AACF;AAEA,SAAS,gBAAgB,SAAoC,MAA8B;AACzF,MAAI,OAAO,WAAW,YAAa;AACnC,MAAI;AACF,WAAO,aAAa,QAAQ,WAAW,OAAO,GAAG,IAAI;AAAA,EACvD,QAAQ;AAAA,EAER;AACF;AAEO,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA,WAAW;AACb,GAIyD;AACvD,QAAM,UAAU,MAAM,QAA0B,MAAM;AACpD,QAAI,gBAAgB,WAAW,gBAAgB,QAAS,QAAO;AAC/D,WAAO,eAAe,OAAO,KAAK;AAAA,EACpC,GAAG,CAAC,aAAa,SAAS,QAAQ,CAAC;AAEnC,QAAM,CAAC,MAAM,OAAO,IAAI,MAAM,SAA2B,OAAO;AAEhE,QAAM,UAAU,MAAM;AACpB,QAAI,gBAAgB,WAAW,gBAAgB,SAAS;AACtD,cAAQ,WAAW;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,WAAW,CAAC;AAEhB,QAAM,SAAS,MAAM;AAAA,IACnB,CAAC,SAA2B;AAC1B,cAAQ,IAAI;AACZ,sBAAgB,SAAS,IAAI;AAAA,IAC/B;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,SAAO,CAAC,MAAM,MAAM;AACtB;",
+  "names": []
+}

package/dist/modules/staff/lib/timesheets-ui/AddRowDropdown.js

@@ -0,0 +1,163 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { createPortal } from "react-dom";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { Plus, Search } from "lucide-react";
+import { ProjectColorDot } from "./ProjectColorDot.js";
+const DROPDOWN_WIDTH = 280;
+const DROPDOWN_OFFSET = 4;
+function AddRowDropdown({
+  assignedProjects,
+  visibleProjectIds,
+  canCreateProject,
+  onAddProject,
+  onCreateProject
+}) {
+  const t = useT();
+  const [open, setOpen] = React.useState(false);
+  const [search, setSearch] = React.useState("");
+  const [position, setPosition] = React.useState(null);
+  const triggerRef = React.useRef(null);
+  const dropdownRef = React.useRef(null);
+  const searchInputRef = React.useRef(null);
+  const availableProjects = assignedProjects.filter(
+    (project) => !visibleProjectIds.has(project.id)
+  );
+  const filteredProjects = availableProjects.filter(
+    (project) => project.name.toLowerCase().includes(search.toLowerCase())
+  );
+  React.useLayoutEffect(() => {
+    if (!open) return;
+    const updatePosition = () => {
+      const node = triggerRef.current;
+      if (!node) return;
+      const rect = node.getBoundingClientRect();
+      const left = Math.max(8, Math.min(rect.left, window.innerWidth - DROPDOWN_WIDTH - 8));
+      setPosition({ top: rect.bottom + DROPDOWN_OFFSET, left });
+    };
+    updatePosition();
+    window.addEventListener("scroll", updatePosition, true);
+    window.addEventListener("resize", updatePosition);
+    return () => {
+      window.removeEventListener("scroll", updatePosition, true);
+      window.removeEventListener("resize", updatePosition);
+    };
+  }, [open]);
+  React.useEffect(() => {
+    if (!open) return;
+    function handleClickOutside(event) {
+      const target = event.target;
+      if (triggerRef.current && !triggerRef.current.contains(target) && dropdownRef.current && !dropdownRef.current.contains(target)) {
+        setOpen(false);
+        setSearch("");
+      }
+    }
+    function handleKeyDown(event) {
+      if (event.key === "Escape") {
+        setOpen(false);
+        setSearch("");
+      }
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [open]);
+  React.useEffect(() => {
+    if (open && searchInputRef.current) {
+      searchInputRef.current.focus();
+    }
+  }, [open]);
+  function handleToggle() {
+    setOpen((prev) => !prev);
+    setSearch("");
+  }
+  function handleSelectProject(project) {
+    onAddProject(project);
+    setOpen(false);
+    setSearch("");
+  }
+  function handleCreateProject() {
+    onCreateProject();
+    setOpen(false);
+    setSearch("");
+  }
+  const dropdown = open && position && typeof document !== "undefined" ? createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: dropdownRef,
+        className: "fixed z-50 rounded-lg border bg-popover shadow-lg",
+        style: { top: position.top, left: position.left, width: DROPDOWN_WIDTH },
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center border-b px-3", children: [
+            /* @__PURE__ */ jsx(Search, { className: "h-4 w-4 text-muted-foreground shrink-0" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                ref: searchInputRef,
+                type: "text",
+                className: "w-full px-3 py-2 text-sm bg-transparent outline-none placeholder:text-muted-foreground",
+                placeholder: t("staff.timesheets.my.addRow.searchPlaceholder", "Search by project"),
+                value: search,
+                onChange: (event) => setSearch(event.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "max-h-[200px] overflow-y-auto", children: filteredProjects.length === 0 ? /* @__PURE__ */ jsx("div", { className: "px-3 py-4 text-sm text-muted-foreground text-center", children: t("staff.timesheets.my.addRow.noProjects", "No projects assigned") }) : filteredProjects.map((project) => /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              className: "w-full justify-start rounded-none px-3 py-2 text-sm cursor-pointer hover:bg-muted transition-colors",
+              onClick: () => handleSelectProject(project),
+              children: [
+                /* @__PURE__ */ jsx(ProjectColorDot, { colorKey: project.color, projectName: project.name, size: "sm" }),
+                /* @__PURE__ */ jsx("span", { className: "ml-1.5", children: project.name })
+              ]
+            },
+            project.id
+          )) }),
+          canCreateProject && /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              className: "w-full justify-start rounded-none px-3 py-2 text-sm text-primary cursor-pointer hover:bg-muted border-t",
+              onClick: handleCreateProject,
+              children: [
+                /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
+                t("staff.timesheets.my.addRow.createProject", "Create a new project")
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    document.body
+  ) : null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { ref: triggerRef, className: "inline-block", children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        type: "button",
+        variant: "ghost",
+        className: "flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground cursor-pointer px-3 py-2",
+        onClick: handleToggle,
+        children: [
+          /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" }),
+          t("staff.timesheets.my.addRow.trigger", "Add row")
+        ]
+      }
+    ) }),
+    dropdown
+  ] });
+}
+export {
+  AddRowDropdown
+};
+//# sourceMappingURL=AddRowDropdown.js.map

package/dist/modules/staff/lib/timesheets-ui/AddRowDropdown.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/staff/lib/timesheets-ui/AddRowDropdown.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { Plus, Search } from 'lucide-react'\nimport { ProjectColorDot } from './ProjectColorDot'\n\ntype ProjectOption = {\n  id: string\n  name: string\n  code: string | null\n  color?: string | null\n}\n\ntype AddRowDropdownProps = {\n  assignedProjects: ProjectOption[]\n  visibleProjectIds: Set<string>\n  canCreateProject: boolean\n  onAddProject: (project: ProjectOption) => void\n  onCreateProject: () => void\n}\n\nconst DROPDOWN_WIDTH = 280\nconst DROPDOWN_OFFSET = 4\n\nexport function AddRowDropdown({\n  assignedProjects,\n  visibleProjectIds,\n  canCreateProject,\n  onAddProject,\n  onCreateProject,\n}: AddRowDropdownProps) {\n  const t = useT()\n  const [open, setOpen] = React.useState(false)\n  const [search, setSearch] = React.useState('')\n  const [position, setPosition] = React.useState<{ top: number; left: number } | null>(null)\n  const triggerRef = React.useRef<HTMLDivElement>(null)\n  const dropdownRef = React.useRef<HTMLDivElement>(null)\n  const searchInputRef = React.useRef<HTMLInputElement>(null)\n\n  const availableProjects = assignedProjects.filter(\n    (project) => !visibleProjectIds.has(project.id),\n  )\n\n  const filteredProjects = availableProjects.filter((project) =>\n    project.name.toLowerCase().includes(search.toLowerCase()),\n  )\n\n  React.useLayoutEffect(() => {\n    if (!open) return\n    const updatePosition = () => {\n      const node = triggerRef.current\n      if (!node) return\n      const rect = node.getBoundingClientRect()\n      const left = Math.max(8, Math.min(rect.left, window.innerWidth - DROPDOWN_WIDTH - 8))\n      setPosition({ top: rect.bottom + DROPDOWN_OFFSET, left })\n    }\n    updatePosition()\n    window.addEventListener('scroll', updatePosition, true)\n    window.addEventListener('resize', updatePosition)\n    return () => {\n      window.removeEventListener('scroll', updatePosition, true)\n      window.removeEventListener('resize', updatePosition)\n    }\n  }, [open])\n\n  React.useEffect(() => {\n    if (!open) return\n    function handleClickOutside(event: MouseEvent) {\n      const target = event.target as Node\n      if (\n        triggerRef.current && !triggerRef.current.contains(target) &&\n        dropdownRef.current && !dropdownRef.current.contains(target)\n      ) {\n        setOpen(false)\n        setSearch('')\n      }\n    }\n    function handleKeyDown(event: KeyboardEvent) {\n      if (event.key === 'Escape') {\n        setOpen(false)\n        setSearch('')\n      }\n    }\n    document.addEventListener('mousedown', handleClickOutside)\n    document.addEventListener('keydown', handleKeyDown)\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n      document.removeEventListener('keydown', handleKeyDown)\n    }\n  }, [open])\n\n  React.useEffect(() => {\n    if (open && searchInputRef.current) {\n      searchInputRef.current.focus()\n    }\n  }, [open])\n\n  function handleToggle() {\n    setOpen((prev) => !prev)\n    setSearch('')\n  }\n\n  function handleSelectProject(project: ProjectOption) {\n    onAddProject(project)\n    setOpen(false)\n    setSearch('')\n  }\n\n  function handleCreateProject() {\n    onCreateProject()\n    setOpen(false)\n    setSearch('')\n  }\n\n  const dropdown = open && position && typeof document !== 'undefined' ? createPortal(\n    <div\n      ref={dropdownRef}\n      className=\"fixed z-50 rounded-lg border bg-popover shadow-lg\"\n      style={{ top: position.top, left: position.left, width: DROPDOWN_WIDTH }}\n    >\n      <div className=\"flex items-center border-b px-3\">\n        <Search className=\"h-4 w-4 text-muted-foreground shrink-0\" />\n        <input\n          ref={searchInputRef}\n          type=\"text\"\n          className=\"w-full px-3 py-2 text-sm bg-transparent outline-none placeholder:text-muted-foreground\"\n          placeholder={t('staff.timesheets.my.addRow.searchPlaceholder', 'Search by project')}\n          value={search}\n          onChange={(event) => setSearch(event.target.value)}\n        />\n      </div>\n\n      <div className=\"max-h-[200px] overflow-y-auto\">\n        {filteredProjects.length === 0 ? (\n          <div className=\"px-3 py-4 text-sm text-muted-foreground text-center\">\n            {t('staff.timesheets.my.addRow.noProjects', 'No projects assigned')}\n          </div>\n        ) : (\n          filteredProjects.map((project) => (\n            <Button\n              key={project.id}\n              type=\"button\"\n              variant=\"ghost\"\n              className=\"w-full justify-start rounded-none px-3 py-2 text-sm cursor-pointer hover:bg-muted transition-colors\"\n              onClick={() => handleSelectProject(project)}\n            >\n              <ProjectColorDot colorKey={project.color} projectName={project.name} size=\"sm\" />\n              <span className=\"ml-1.5\">{project.name}</span>\n            </Button>\n          ))\n        )}\n      </div>\n\n      {canCreateProject && (\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          className=\"w-full justify-start rounded-none px-3 py-2 text-sm text-primary cursor-pointer hover:bg-muted border-t\"\n          onClick={handleCreateProject}\n        >\n          <Plus className=\"h-4 w-4 mr-1\" />\n          {t('staff.timesheets.my.addRow.createProject', 'Create a new project')}\n        </Button>\n      )}\n    </div>,\n    document.body,\n  ) : null\n\n  return (\n    <>\n      <div ref={triggerRef} className=\"inline-block\">\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          className=\"flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground cursor-pointer px-3 py-2\"\n          onClick={handleToggle}\n        >\n          <Plus className=\"h-4 w-4\" />\n          {t('staff.timesheets.my.addRow.trigger', 'Add row')}\n        </Button>\n      </div>\n      {dropdown}\n    </>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}